refactor note and link editors

mindplot/src/main/javascript/widget/LinkEditor.js

@@ -21,14 +21,15 @@ mindplot.widget.LinkEditor = new Class({
 
     initialize:function (model) {
         $assert(model, "model can not be null");
+        this._model = model;
         this.parent($msg("LINK"), {
             cancelButton: true,
             closeButton: true,
             acceptButton: true,
-            removeButton: true
+            removeButton: true,
+            onRemoveClickData: {model: this._model}
         });
-        this.setStyle("500px");
+        this.css({width:"600px"});
-        this._model = model;
         var panel = this._buildPanel(model);
         this.setContent(panel);
     },
@@ -36,23 +37,27 @@ mindplot.widget.LinkEditor = new Class({
     _buildPanel:function (model) {
         var result = $('<div></div>').css("padding-top", "5px");
         var form = $('<form></form>').attr({
-            'action':'none',
+            'action': 'none',
-            'id':'linkFormId'
+            'id': 'linkFormId'
         });
         var text = $('<p></p>').text("Paste your url here:");
-        text.css('margin','0px 0px 10px');
+        text.css('margin','0px 0px 20px');
 
         form.append(text);
 
-        // Add Input
+        var section = $('<div></div>').attr({
-
+            'class': 'input-group'
-        var input = $('<input>').attr({
-            'placeholder':'http://www.example.com/',
-            'type':'url', //FIXME: THIS not work on IE, see workaround below
-            'required':'true',
-            'autofocus':'autofocus'
         });
-        input.css('width','70%').css('margin','0px 20px');
+
+        // Add Input
+        var input = $('<input/>').attr({
+            'placeholder': 'http://www.example.com/',
+            'type': 'url', //FIXME: THIS not work on IE, see workaround below
+            'required': 'true',
+            'autofocus': 'autofocus',
+            'class': 'form-control'
+        });
+        //input.css('width','70%').css('margin','0px 30px');
 
         if (model.getValue() != null){
             input.val(model.getValue());
@@ -60,17 +65,21 @@ mindplot.widget.LinkEditor = new Class({
 //            type:Browser.ie ? 'text' : 'url', // IE workaround
 
         // Open Button
-        var open = $('<input/>').attr({
+        var openButton = $('<button></button>').attr({
-                'type':'button',
+                'type': 'button',
-                'value':$msg('OPEN_LINK')
+                'class': 'btn btn-default'
         });
 
-        open.click(function(){
+        openButton.html($msg('OPEN_LINK')).css('margin-left', '0px');
+        //FIXME: remove this!
+        openButton.click(function(){
             alert('clicked!');
         });
+        var spanControl = $('<span class="input-group-btn"></span>').append(openButton)
 
-        form.append(input);
+        section.append(input);
-        form.append(open);
+        section.append(spanControl);
+        form.append(section);
 
         $(document).ready(function () {
             var me = this;
@@ -96,18 +105,5 @@ mindplot.widget.LinkEditor = new Class({
 
     onAcceptClick: function() {
         $("#linkFormId").submit();
-    },
-
-    onRemoveClick: function() {
-        this._model.setValue(null);
-        this.close();
-    },
-
-    hideRemoveButton:function(){
-        this.parent();
-    },
-
-    close:function () {
-        this.parent();
     }
 });

mindplot/src/main/javascript/widget/NoteEditor.js

@@ -1,20 +1,37 @@
+/*
+ *    Copyright [2012] [wisemapping]
+ *
+ *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
+ *   It is basically the Apache License, Version 2.0 (the "License") plus the
+ *   "powered by wisemapping" text requirement on every single page;
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the license at
+ *
+ *       http://www.wisemapping.org/license
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ */
+
 mindplot.widget.NoteEditor = new Class({
     Extends:BootstrapDialog,
 
     initialize:function (model) {
         $assert(model, "model can not be null");
+        this._model = model;
         this.parent($msg("Note"), {
             cancelButton: true,
             closeButton: true,
             acceptButton: true,
-            removeButton: true
+            removeButton: true,
+            onRemoveClickData: {model: this._model}
         });
-        this.setStyle("500px");
+        this.css({width:"600px"});
-        this._model = model;
         var panel = this._buildPanel(model);
         this.setContent(panel);
-//        this.onRemoveClickData = {model: this._model};
-        onRemoveClickData = {data:'hola'};
         },
 
 
@@ -30,7 +47,8 @@ mindplot.widget.NoteEditor = new Class({
         var textArea = $('<textarea></textarea>').attr({
                 'placeholder':$msg('WRITE_YOUR_TEXT_HERE'),
                 'required':'true',
-                'autofocus':'autofocus'
+                'autofocus':'autofocus',
+                'class':'form-control'
         });
         textArea.css({
             'width':'100%',
@@ -64,35 +82,7 @@ mindplot.widget.NoteEditor = new Class({
 
     onAcceptClick: function() {
         $("#noteFormId").submit();
-    },
-
-    onRemoveClick: function(event) {
-        if(event.data.model){
-            window.alert('claudio se la come!!');
-        }
-        this._model.setValue(null);
-        this.close();
-    },
-
-    close:function () {
-        this.parent();
     }
 });
 
-/*
+
- *    Copyright [2012] [wisemapping]
- *
- *   Licensed under WiseMapping Public License, Version 1.0 (the "License").
- *   It is basically the Apache License, Version 2.0 (the "License") plus the
- *   "powered by wisemapping" text requirement on every single page;
- *   you may not use this file except in compliance with the License.
- *   You may obtain a copy of the license at
- *
- *       http://www.wisemapping.org/license
- *
- *   Unless required by applicable law or agreed to in writing, software
- *   distributed under the License is distributed on an "AS IS" BASIS,
- *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- *   See the License for the specific language governing permissions and
- *   limitations under the License.
- */