Fix resize issue. Need to work on centering the node.

mindplot/pom.xml

@@ -170,7 +170,7 @@
 
                                     <filelist dir="${basedir}/src/main/javascript/widget/" files="ToolbarItem.js"/>
 
-                                    <filelist dir="${basedir}/src/main/javascript/widget/" files="EditNoteDialog.js"/>
+                                    <filelist dir="${basedir}/src/main/javascript/widget/" files="NoteEditor.js"/>
 
                                     <filelist dir="${basedir}/src/main/javascript/"
                                               files="widget/ColorPickerPanel.js"/>

mindplot/src/main/javascript/MindmapDesigner.js

@@ -33,8 +33,8 @@ mindplot.MindmapDesigner = new Class({
             this._model = new mindplot.DesignerModel(profile);
 
             // Init Screen manager..
-            var screenManager = new mindplot.ScreenManager(profile.width, profile.height, divElement);
+            var screenManager = new mindplot.ScreenManager(divElement);
-            this._workspace = new mindplot.Workspace(profile, screenManager, this._model.getZoom());
+            this._workspace = new mindplot.Workspace(screenManager, this._model.getZoom());
             this._readOnly = profile.readOnly ? true : false;
 
             // Init layout managers ...
@@ -77,7 +77,8 @@ mindplot.MindmapDesigner = new Class({
                 });
 
                 // Clean some selected nodes on event ..
-                this._cleanScreen();
+                if (this._cleanScreen)
+                    this._cleanScreen();
 
             }.bind(this));
 
@@ -129,6 +130,9 @@ mindplot.MindmapDesigner = new Class({
             }
         },
 
+        setViewPort : function(size) {
+            this._workspace.setViewPort(size);
+        },
 
         _buildNodeGraph : function(model) {
             var workspace = this._workspace;
@@ -761,8 +765,8 @@ mindplot.MindmapDesigner = new Class({
         addNote : function() {
             var model = this.getModel();
             var topic = model.selectedTopic();
-            if (topic!=null) {
+            if (topic != null) {
-               topic.showNoteEditor();
+                topic.showNoteEditor();
             } else {
                 core.Monitor.getInstance().logMessage('At least one topic must be selected to execute this operation.');
             }

mindplot/src/main/javascript/ScreenManager.js

@@ -17,14 +17,16 @@
  */
 
 mindplot.ScreenManager = new Class({
-    initialize:function(width, height, divElement) {
+    initialize:function(divElement) {
         $assert(divElement, "can not be null");
         this._divContainer = divElement;
         this._offset = {x:0,y:0};
 
         // Ignore default click event propagation. Prevent 'click' event on drad.
         this._clickEvents = [];
-        this._divContainer.addEvent('click',function(event){event.stopPropagation()});
+        this._divContainer.addEvent('click', function(event) {
+            event.stopPropagation()
+        });
 
         // @Todo: This must be resolved in other way ...
         mindplot.util.Converter.setScreenManager(this);
@@ -51,9 +53,8 @@ mindplot.ScreenManager = new Class({
 
     fireEvent : function(type, event) {
         if (type == 'click') {
-            this._clickEvents.forEach(function(listener)
+            this._clickEvents.forEach(function(listener) {
-            {
+                listener(type, event);
-               listener(type,event);
             });
         }
         else {
@@ -150,4 +151,5 @@ mindplot.ScreenManager = new Class({
     setOffset : function(x, y) {
         this._offset.x = x;
         this._offset.y = y;
-    }});
+    }
+});

mindplot/src/main/javascript/Topic.js

@@ -780,7 +780,7 @@ mindplot.Topic = new Class({
             }
         };
 
-        var editor = new mindplot.widget.EditNoteDialog(editorModel);
+        var editor = new mindplot.widget.NoteEditor(editorModel);
         editor.show();
     },
 

mindplot/src/main/javascript/Workspace.js

@@ -17,41 +17,32 @@
  */
 
 mindplot.Workspace = new Class({
-    initialize: function(profile, screenManager, zoom) {
+    initialize: function(screenManager, zoom) {
         // Create a suitable container ...
         $assert(screenManager, 'Div container can not be null');
+        $assert(zoom, 'zoom container can not be null');
+
         this._zoom = zoom;
         this._screenManager = screenManager;
-        this._screenWidth = profile.width;
-        this._screenHeight = profile.height;
 
-        // Initalize web2d workspace.
+        var divContainer = screenManager.getContainer();
-        var workspace = this._createWorkspace(profile);
+        this._screenWidth = parseInt(divContainer.getStyle('width'));
+        this._screenHeight = parseInt(divContainer.getStyle('height'));
+
+        // Initialize web2d workspace.
+        var workspace = this._createWorkspace();
         this._workspace = workspace;
 
-        var screenContainer = screenManager.getContainer();
-        // Fix the height of the container ....
-        screenContainer.style.height = this._screenHeight + "px";
-
         // Append to the workspace...
-        workspace.addItAsChildTo(screenContainer);
+        workspace.addItAsChildTo(divContainer);
         this.setZoom(zoom, true);
 
         // Register drag events ...
         this._registerDragEvents();
-       this._eventsEnabled = true;
+        this._eventsEnabled = true;
     },
 
-    _updateScreenManager: function() {
+    _createWorkspace: function() {
-        var zoom = this._zoom;
-        this._screenManager.setScale(zoom);
-
-        var coordOriginX = -((this._screenWidth * this._zoom) / 2);
-        var coordOriginY = -((this._screenHeight * this._zoom) / 2);
-        this._screenManager.setOffset(coordOriginX, coordOriginY);
-    },
-
-    _createWorkspace: function(profile) {
         // Initialize workspace ...
         var coordOriginX = -(this._screenWidth / 2);
         var coordOriginY = -(this._screenHeight / 2);
@@ -111,7 +102,11 @@ mindplot.Workspace = new Class({
         // Center topic....
         var coordOriginX;
         var coordOriginY;
-        if (center) {
+
+        if (center && this._viewPort) {
+            coordOriginX = -(this._viewPort.width / 2);
+            coordOriginY = -(this._viewPort.height / 2);
+        } else if (center) {
             coordOriginX = -(coordWidth / 2);
             coordOriginY = -(coordHeight / 2);
         } else {
@@ -212,6 +207,11 @@ mindplot.Workspace = new Class({
             }
         };
         screenManager.addEvent('mousedown', mouseDownListener);
+    },
+
+    setViewPort : function(size) {
+        this._viewPort = size;
+        this.setZoom(this._zoom, true);
     }
 });
 

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

@@ -189,50 +189,56 @@ mindplot.widget.Menu = new Class({
 
 
         // Register Events ...
-        $('zoomIn').addEvent('click', function(event) {
+        $('zoomIn').addEvent('click', function() {
+            this.clear();
             designer.zoomIn();
-        });
+        }.bind(this));
 
-        $('zoomOut').addEvent('click', function(event) {
+        $('zoomOut').addEvent('click', function() {
+            this.clear();
             designer.zoomOut();
-        });
+        }.bind(this));
 
-        $('undoEdition').addEvent('click', function(event) {
+        $('undoEdition').addEvent('click', function() {
+            this.clear();
             designer.undo();
-        });
+        }.bind(this));
 
-        $('redoEdition').addEvent('click', function(event) {
+        $('redoEdition').addEvent('click', function() {
+            this.clear();
             designer.redo();
-        });
+        }.bind(this));
 
-        $('addTopic').addEvent('click', function(event) {
+        $('addTopic').addEvent('click', function() {
+            this.clear();
             designer.createSiblingForSelectedNode();
-        });
+        }.bind(this));
 
-        $('deleteTopic').addEvent('click', function(event) {
+        $('deleteTopic').addEvent('click', function() {
+            this.clear();
             designer.deleteCurrentNode();
-        });
+        }.bind(this));
 
 
-        $('topicLink').addEvent('click', function(event) {
+        $('topicLink').addEvent('click', function() {
+            this.clear();
             designer.addLink();
-
+        }.bind(this));
-        });
 
         $('topicRelation').addEvent('click', function(event) {
             designer.addRelationShip(event);
         });
 
-        $('topicNote').addEvent('click', function(event) {
+        $('topicNote').addEvent('click', function() {
+            this.clear();
             designer.addNote();
+        }.bind(this));
 
-        });
+        $('fontBold').addEvent('click', function() {
-
-        $('fontBold').addEvent('click', function(event) {
             designer.changeFontWeight();
         });
 
-        $('fontItalic').addEvent('click', function(event) {
+        $('fontItalic').addEvent('click', function() {
             designer.changeFontStyle();
         });
 

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

@@ -16,7 +16,7 @@
  *   limitations under the License.
  */
 
-mindplot.widget.EditNoteDialog = new Class({
+mindplot.widget.NoteEditor = new Class({
     Extends:MooDialog,
     initialize : function(model) {
         $assert(model, "model can not be null");

web2d/src/main/javascript/Workspace.js

@@ -29,40 +29,10 @@ web2d.Workspace = function(attributes)
     }
     web2d.Element.call(this, peer, defaultAttributes);
     this._htmlContainer.appendChild(this._peer._native);
-
-    this._disableTextSelection();
 };
 
 objects.extend(web2d.Workspace, web2d.Element);
 
-/**
- * Avoid element selection. This remove some odd effect in IE when a element is draged.
- */
-web2d.Workspace.prototype._disableTextSelection = function()
-{
-    var contaier = this._htmlContainer;
-
-    function disabletext(e) {
-        return false;
-    }
-    ;
-
-    function reEnable() {
-        return true;
-    }
-    ;
-
-    //if the browser is IE4+
-    contaier.onselectstart = new Function("return false");
-
-    //if the browser is NS6
-    if ($defined(window.sidebar))
-    {
-        contaier.onmousedown = disabletext;
-        contaier.onclick = reEnable;
-    }
-    ;
-};
 
 web2d.Workspace.prototype.getType = function()
 {
@@ -104,7 +74,7 @@ web2d.Workspace.prototype.addItAsChildTo = function(element)
 };
 
 /**
- * Create a new div element that will be resposible for containing the workspace elements.
+ * Create a new div element that will be responsible for containing the workspace elements.
  */
 web2d.Workspace.prototype._createDivContainer = function(domElement)
 {

wise-doc/src/main/webapp/html/editor.html

@@ -106,7 +106,7 @@
                 </div>
             </fieldset>
         </div>
-        <div id="zoom" class="buttonContainer" title="Zoom In">
+        <div id="zoom" class="buttonContainer" title="Zoom">
             <fieldset>
                 <div id="zoomIn" class="button" title="Zoom In">
                     <div class="toolbarLabel">

wise-doc/src/main/webapp/js/editor.js

@@ -196,18 +196,18 @@ function buildMindmapDesigner() {
 //    core.Monitor.setInstance(monitor);
 
     var container = $('mindplot');
+//    container.setStyles();
 
-    // Initialize Editor ...
+    container.setStyles({
-    var screenWidth = window.getWidth();
+        height: parseInt(screen.height),
-    var screenHeight = window.getHeight();
+        width:  parseInt(screen.width)
+    });
 
-    // header - footer
-    screenHeight = screenHeight - 115;
-
-    // body margin ...
-    editorProperties.width = screenWidth;
-    editorProperties.height = screenHeight;
     designer = new mindplot.MindmapDesigner(editorProperties, container);
+    designer.setViewPort({
+        height: parseInt(window.innerHeight - 150),
+        width:  parseInt(window.innerWidth - 200)
+    });
 
     if (mindplot.collaboration.CollaborationManager.getInstance().isCollaborationFrameworkAvailable()) {
         buildCollaborativeMindmapDesigner();

wise-webapp/src/main/webapp/js/editor.js

@@ -302,20 +302,17 @@ function buildMindmapDesigner() {
     var monitor = new core.Monitor($('msgLoggerContainer'), $('msgLogger'));
     core.Monitor.setInstance(monitor);
 
-    var container = $('mindplot');
-
     // Initialize Editor ...
+    var container = $('mindplot');
+//    container.setStyles({
+//        height: screen.height - 151,
+//        width:  screen.width
+//    });
 
-    var screenWidth = window.getWidth();
+    container.setStyles({
-    var screenHeight = window.getHeight();
+        height: window.getHeight() - 151,
-
+        width:  window.getWidth()
-    // Position node ...
+    });
-    // header - footer
-    screenHeight = screenHeight - 90 - 61;
-
-    // body margin ...
-    editorProperties.width = screenWidth;
-    editorProperties.height = screenHeight;
 
     designer = new mindplot.MindmapDesigner(editorProperties, container);
     designer.loadFromXML(mapId, mapXml);