Finally viewmode.html render.

mindplot/src/main/javascript/ActionIcon.js

@@ -36,7 +36,7 @@ mindplot.ActionIcon = new Class({
     },
 
     addToGroup:function(group) {
-        group.appendChild(this.getImage());
+        group.append(this.getImage());
     },
 
     setVisibility:function(visible) {

mindplot/src/main/javascript/ConnectionLine.js

@@ -145,7 +145,7 @@ mindplot.ConnectionLine = new Class({
     },
 
     addToWorkspace:function (workspace) {
-        workspace.appendChild(this._line2d);
+        workspace.append(this._line2d);
         this._line2d.moveToBack();
     },
 

mindplot/src/main/javascript/ControlPoint.js

@@ -162,10 +162,10 @@ mindplot.ControlPoint = new Class({
 
     addToWorkspace  : function(workspace) {
         this._workspace = workspace;
-        workspace.appendChild(this._controlPointsController[0]);
+        workspace.append(this._controlPointsController[0]);
-        workspace.appendChild(this._controlPointsController[1]);
+        workspace.append(this._controlPointsController[1]);
-        workspace.appendChild(this._controlLines[0]);
+        workspace.append(this._controlLines[0]);
-        workspace.appendChild(this._controlLines[1]);
+        workspace.append(this._controlLines[1]);
     },
 
     removeFromWorkspace  : function(workspace) {

mindplot/src/main/javascript/Designer.js

@@ -686,7 +686,7 @@ mindplot.Designer = new Class({
             var nodeGraph = this._buildNodeGraph(nodeModel, this.isReadOnly());
             nodeGraph.setVisibility(false);
 
-            this._workspace.appendChild(nodeGraph);
+            this._workspace.append(nodeGraph);
             for (var i = 0; i < children.length; i++) {
                 var child = children[i];
                 if ($defined(child))
@@ -709,7 +709,7 @@ mindplot.Designer = new Class({
 
             result.setVisibility(sourceTopic.isVisible() && targetTopic.isVisible());
 
-            this._workspace.appendChild(result);
+            this._workspace.append(result);
             return result;
         },
 

mindplot/src/main/javascript/DragManager.js

@@ -79,7 +79,7 @@ mindplot.DragManager = new Class({
                 startDragListener(event, dragNode);
 
                 // Add shadow node to the workspace.
-                workspace.appendChild(dragNode);
+                workspace.append(dragNode);
 
                 this._isDragInProcess = true;
             }

mindplot/src/main/javascript/DragPivot.js

@@ -146,27 +146,27 @@ mindplot.DragPivot = new Class({
 
     addToWorkspace : function(workspace) {
         var pivotRect = this._getPivotRect();
-        workspace.appendChild(pivotRect);
+        workspace.append(pivotRect);
 
         var connectToRect = this._connectRect;
-        workspace.appendChild(connectToRect);
+        workspace.append(connectToRect);
 
         // Add a hidden straight line ...
         var straighLine = this._straightLine;
         straighLine.setVisibility(false);
-        workspace.appendChild(straighLine);
+        workspace.append(straighLine);
         straighLine.moveToBack();
 
         // Add a hidden curved line ...
         var curvedLine = this._curvedLine;
         curvedLine.setVisibility(false);
-        workspace.appendChild(curvedLine);
+        workspace.append(curvedLine);
         curvedLine.moveToBack();
 
         // Add a connect rect ...
         var connectRect = this._connectRect;
         connectRect.setVisibility(false);
-        workspace.appendChild(connectRect);
+        workspace.append(connectRect);
         connectRect.moveToBack();
     },
 

mindplot/src/main/javascript/DragTopic.js

@@ -133,7 +133,7 @@ mindplot.DragTopic = new Class({
 
     addToWorkspace:function (workspace) {
         if (!this._isInWorkspace) {
-            workspace.appendChild(this._elem2d);
+            workspace.append(this._elem2d);
             var dragPivot = this._getDragPivot();
             dragPivot.addToWorkspace(workspace);
             this._isInWorkspace = true;
@@ -201,7 +201,7 @@ mindplot.DragTopic.init = function (workspace) {
 
     $assert(workspace, "workspace can not be null");
     var pivot = mindplot.DragTopic.__getDragPivot();
-    workspace.appendChild(pivot);
+    workspace.append(pivot);
 };
 
 mindplot.DragTopic.__getDragPivot = function () {

mindplot/src/main/javascript/IconGroup.js

@@ -62,7 +62,7 @@ mindplot.IconGroup = new Class({
         this._positionIcon(icon, this._icons.length - 1);
 
         var imageShape = icon.getImage();
-        this._group.appendChild(imageShape);
+        this._group.append(imageShape);
 
         // Register event for the group ..
         if (remove) {
@@ -175,7 +175,7 @@ mindplot.IconGroup.RemoveTip = new Class({
             }.bind(this));
 
             widget.setPosition(pos.x + 80, pos.y - 50);
-            this._fadeElem.appendChild(widget);
+            this._fadeElem.append(widget);
 
             // Setup current element ...
             this._activeIcon = icon;
@@ -236,7 +236,7 @@ mindplot.IconGroup.RemoveTip = new Class({
             stroke:'0',
             fillColor:'black'
         });
-        result.appendChild(outerRect);
+        result.append(outerRect);
         outerRect.setCursor('pointer');
 
         var innerRect = new web2d.Rect(0, {
@@ -247,17 +247,17 @@ mindplot.IconGroup.RemoveTip = new Class({
             stroke:'1 solid white',
             fillColor:'gray'
         });
-        result.appendChild(innerRect);
+        result.append(innerRect);
 
         var line = new web2d.Line({stroke:'1 solid white'});
         line.setFrom(1, 1);
         line.setTo(9, 9);
-        result.appendChild(line);
+        result.append(line);
 
         var line2 = new web2d.Line({stroke:'1 solid white'});
         line2.setFrom(1, 9);
         line2.setTo(9, 1);
-        result.appendChild(line2);
+        result.append(line2);
 
         // Some events ...
         result.addEvent('mouseover', function () {

mindplot/src/main/javascript/MainTopic.js

@@ -42,7 +42,7 @@ mindplot.MainTopic = new Class({
         //  Create group ...
         var groupAttributes = {width:100, height:100, coordSizeWidth:100, coordSizeHeight:100};
         var group = new web2d.Group(groupAttributes);
-        group.appendChild(innerShape);
+        group.append(innerShape);
 
         // Add Text ...
         if (this.getShapeType() != mindplot.model.TopicShape.IMAGE) {
@@ -50,7 +50,7 @@ mindplot.MainTopic = new Class({
             var text = this.getText();
             textShape.setText(text);
             textShape.setOpacity(0.5);
-            group.appendChild(textShape);
+            group.append(textShape);
         }
         return group;
     },

mindplot/src/main/javascript/NoteIcon.js

@@ -41,7 +41,7 @@ mindplot.NoteIcon = new Class({
             }.bind(this));
         }
 
-        this._tip = new mindplot.widget.FloatingTip(this.getImage()._peer._native, {
+        this._tip = new mindplot.widget.FloatingTip($(this.getImage()._peer._native), {
             // Content can also be a function of the target element!
             content:function () {
                 var result = new Element('div');

mindplot/src/main/javascript/Relationship.js

@@ -160,16 +160,16 @@ mindplot.Relationship = new Class({
     },
 
     addToWorkspace:function (workspace) {
-        workspace.appendChild(this._focusShape);
+        workspace.append(this._focusShape);
-        workspace.appendChild(this._controlPointsController);
+        workspace.append(this._controlPointsController);
 
         this._controlPointControllerListener = this._initializeControlPointController.bind(this);
         this._line2d.addEvent('click', this._controlPointControllerListener);
         this._isInWorkspace = true;
 
-        workspace.appendChild(this._startArrow);
+        workspace.append(this._startArrow);
         if (this._endArrow)
-            workspace.appendChild(this._endArrow);
+            workspace.append(this._endArrow);
 
         this.parent(workspace);
         this._positionArrows();

mindplot/src/main/javascript/RelationshipPivot.js

@@ -56,8 +56,8 @@ mindplot.RelationshipPivot = new Class({
             this._startArrow.setStrokeWidth(2);
             this._startArrow.setFrom(sourcePos.x, sourcePos.y);
 
-            this._workspace.appendChild(this._pivot);
+            this._workspace.append(this._pivot);
-            this._workspace.appendChild(this._startArrow);
+            this._workspace.append(this._startArrow);
 
             this._workspace.addEvent('mousemove', this._mouseMoveEvent);
             this._workspace.addEvent('click', this._onClickEvent);

mindplot/src/main/javascript/ShrinkConnector.js

@@ -90,7 +90,7 @@ mindplot.ShirinkConnector = new Class({
     },
 
     addToWorkspace: function(group) {
-        group.appendChild(this._ellipse);
+        group.append(this._ellipse);
     },
 
     setPosition: function(x, y) {

mindplot/src/main/javascript/Topic.js

@@ -82,7 +82,7 @@ mindplot.Topic = new Class({
             this.setSize(size, true);
 
             var group = this.get2DElement();
-            group.appendChild(innerShape);
+            group.append(innerShape);
 
             // Move text to the front ...
             var text = this.getTextShape();
@@ -246,7 +246,7 @@ mindplot.Topic = new Class({
         if (!$defined(this._iconsGroup)) {
             this._iconsGroup = this._buildIconGroup();
             var group = this.get2DElement();
-            group.appendChild(this._iconsGroup.getNativeElement());
+            group.append(this._iconsGroup.getNativeElement());
             this._iconsGroup.moveToFront();
         }
         return this._iconsGroup;
@@ -542,9 +542,9 @@ mindplot.Topic = new Class({
         var textShape = this.getTextShape();
 
         // Add to the group ...
-        group.appendChild(outerShape);
+        group.append(outerShape);
-        group.appendChild(innerShape);
+        group.append(innerShape);
-        group.appendChild(textShape);
+        group.append(textShape);
 
         // Update figure size ...
         var model = this.getModel();
@@ -1043,7 +1043,7 @@ mindplot.Topic = new Class({
         $assert(workspace, 'Workspace can not be null');
 
         // Connect Graphical Nodes ...
-        targetTopic.appendChild(this);
+        targetTopic.append(this);
         this._parent = targetTopic;
 
         // Update model ...
@@ -1056,7 +1056,7 @@ mindplot.Topic = new Class({
         outgoingLine.setVisibility(false);
 
         this._outgoingLine = outgoingLine;
-        workspace.appendChild(outgoingLine);
+        workspace.append(outgoingLine);
 
         // Update figure is necessary.
         this.updateTopicShape(targetTopic);
@@ -1088,7 +1088,7 @@ mindplot.Topic = new Class({
         }
     },
 
-    appendChild:function (child) {
+    append:function (child) {
         var children = this.getChildren();
         children.push(child);
     },
@@ -1120,7 +1120,7 @@ mindplot.Topic = new Class({
 
     addToWorkspace:function (workspace) {
         var elem = this.get2DElement();
-        workspace.appendChild(elem);
+        workspace.append(elem);
         if (!this.isInWorkspace()) {
             if (!this.isCentralTopic()) {
                 mindplot.EventBus.instance.fireEvent(mindplot.EventBus.events.NodeAdded, this.getModel());

mindplot/src/main/javascript/Workspace.js

@@ -61,11 +61,11 @@ mindplot.Workspace = new Class({
         return  new web2d.Workspace(workspaceProfile);
     },
 
-    appendChild: function(shape) {
+    append: function(shape) {
         if ($defined(shape.addToWorkspace)) {
             shape.addToWorkspace(this);
         } else {
-            this._workspace.appendChild(shape);
+            this._workspace.append(shape);
         }
     },
 

mindplot/src/main/javascript/layout/Node.js

@@ -155,7 +155,7 @@ mindplot.layout.Node = new Class({
         }
 
         // Only update if the property has changed ...
-        if (JSON.encode(prop.value) != JSON.encode(value)) {
+        if (JSON.stringify(prop.value) != JSON.stringify(value)) {
             prop.oldValue = prop.value;
             prop.value = value;
             prop.hasChanged = true;

mindplot/src/main/javascript/libraries/less/less-1.1.3.min.js

@@ -57,13 +57,13 @@
 
     function q(a, b, c) {
         var d,e = b.href ? b.href.replace(/\?.*$/, "") : "",f = "less:" + (b.title || p(e));
-        (d = document.getElementById(f)) === null && (d = document.createElement("style"),d.type = "text/css",d.media = b.media || "screen",d.id = f,document.getElementsByTagName("head")[0].appendChild(d));
+        (d = document.getElementById(f)) === null && (d = document.createElement("style"),d.type = "text/css",d.media = b.media || "screen",d.id = f,document.getElementsByTagName("head")[0].append(d));
         if (d.styleSheet)try {
             d.styleSheet.cssText = a
         } catch(g) {
             throw new Error("Couldn't reassign styleSheet.cssText.")
         } else(function(a) {
-            d.childNodes.length > 0 ? d.firstChild.nodeValue !== a.nodeValue && d.replaceChild(a, d.firstChild) : d.appendChild(a)
+            d.childNodes.length > 0 ? d.firstChild.nodeValue !== a.nodeValue && d.replaceChild(a, d.firstChild) : d.append(a)
         })(document.createTextNode(a));
         c && h && (u("saving " + e + " to cache."),h.setItem(e, a),h.setItem(e + ":timestamp", c))
     }

mindplot/src/main/javascript/libraries/mootools/mootools-core-1.4.5-full-nocompat-yc.js

@@ -78,7 +78,7 @@
         return p;},function(){o();return o;},function(){e();return e;});})();n.Features.xhr=!!(n.Request);var i=(Function.attempt(function(){return navigator.plugins["Shockwave Flash"].description;
     },function(){return new ActiveXObject("ShockwaveFlash.ShockwaveFlash").GetVariable("$version");})||"0 r0").match(/\d+/g);n.Plugins.Flash={version:Number(i[0]||"0."+i[1])||0,build:Number(i[2])||0};
     n.exec=function(o){if(!o){return o;}if(g.execScript){g.execScript(o);}else{var e=j.createElement("script");e.setAttribute("type","text/javascript");e.text=o;
-        j.head.appendChild(e);j.head.removeChild(e);}return o;};String.implement("stripScripts",function(o){var e="";var p=this.replace(/<script[^>]*>([\s\S]*?)<\/script>/gi,function(q,r){e+=r+"\n";
+        j.head.append(e);j.head.removeChild(e);}return o;};String.implement("stripScripts",function(o){var e="";var p=this.replace(/<script[^>]*>([\s\S]*?)<\/script>/gi,function(q,r){e+=r+"\n";
         return"";});if(o===true){n.exec(e);}else{if(typeOf(o)=="function"){o(e,p);}}return p;});n.extend({Document:this.Document,Window:this.Window,Element:this.Element,Event:this.Event});
     this.Window=this.$constructor=new Type("Window",function(){});this.$family=Function.from("window").hide();Window.mirror(function(e,o){g[e]=o;});this.Document=j.$constructor=new Type("Document",function(){});
     j.$family=Function.from("document").hide();Document.mirror(function(e,o){j[e]=o;});j.html=j.documentElement;if(!j.head){j.head=j.getElementsByTagName("head")[0];

mindplot/src/main/javascript/model/IMindmap.js

@@ -69,7 +69,7 @@ mindplot.model.IMindmap = new Class({
         $assert(!child.getParent(), 'Child model seems to be already connected');
 
         //  Connect node...
-        parent.appendChild(child);
+        parent.append(child);
 
         // Remove from the branch ...
         this.removeBranch(child);

mindplot/src/main/javascript/model/INodeModel.js

@@ -199,7 +199,7 @@ mindplot.model.INodeModel = new Class({
         return this.getParent() != null;
     },
 
-    appendChild : function(node) {
+    append : function(node) {
         throw "Unsupported operation";
     },
 
@@ -225,7 +225,7 @@ mindplot.model.INodeModel = new Class({
         children.each(function(snode) {
             var tnode = tmindmap.createNode(snode.getType(), snode.getId());
             snode.copyTo(tnode);
-            target.appendChild(tnode);
+            target.append(tnode);
         });
 
         return target;

mindplot/src/main/javascript/model/NodeModel.js

@@ -124,7 +124,7 @@ mindplot.model.NodeModel = new Class({
         return result;
     },
 
-    appendChild:function (child) {
+    append:function (child) {
         $assert(child && child.isNodeModel(), 'Only NodeModel can be appended to Mindmap object');
         this._children.push(child);
         child._parent = this;

mindplot/src/main/javascript/persistence/XMLSerializer_Beta.js

@@ -27,14 +27,14 @@ mindplot.persistence.XMLSerializer_Beta = new Class({
         if ($defined(name)) {
             mapElem.setAttribute('name', name);
         }
-        document.appendChild(mapElem);
+        document.append(mapElem);
 
         // Create branches ...
         var topics = mindmap.getBranches();
         for (var i = 0; i < topics.length; i++) {
             var topic = topics[i];
             var topicDom = this._topicToXML(document, topic);
-            mapElem.appendChild(topicDom);
+            mapElem.append(topicDom);
         }
 
         return document;
@@ -110,7 +110,7 @@ mindplot.persistence.XMLSerializer_Beta = new Class({
         for (i = 0; i < icons.length; i++) {
             var icon = icons[i];
             var iconDom = this._iconToXML(document, icon);
-            parentTopic.appendChild(iconDom);
+            parentTopic.append(iconDom);
         }
 
         //LINKS
@@ -118,14 +118,14 @@ mindplot.persistence.XMLSerializer_Beta = new Class({
         for (i = 0; i < links.length; i++) {
             var link = links[i];
             var linkDom = this._linkToXML(document, link);
-            parentTopic.appendChild(linkDom);
+            parentTopic.append(linkDom);
         }
 
         var notes = topic.getNotes();
         for (i = 0; i < notes.length; i++) {
             var note = notes[i];
             var noteDom = this._noteToXML(document, note);
-            parentTopic.appendChild(noteDom);
+            parentTopic.append(noteDom);
         }
 
         //CHILDREN TOPICS
@@ -133,7 +133,7 @@ mindplot.persistence.XMLSerializer_Beta = new Class({
         for (i = 0; i < childTopics.length; i++) {
             var childTopic = childTopics[i];
             var childDom = this._topicToXML(document, childTopic);
-            parentTopic.appendChild(childDom);
+            parentTopic.append(childDom);
 
         }
 

mindplot/src/main/javascript/persistence/XMLSerializer_Pela.js

@@ -34,14 +34,14 @@ mindplot.persistence.XMLSerializer_Pela = new Class({
             mapElem.setAttribute('version', version);
         }
 
-        document.appendChild(mapElem);
+        document.append(mapElem);
 
         // Create branches ...
         var topics = mindmap.getBranches();
         for (var i = 0; i < topics.length; i++) {
             var topic = topics[i];
             var topicDom = this._topicToXML(document, topic);
-            mapElem.appendChild(topicDom);
+            mapElem.append(topicDom);
         }
 
         // Create Relationships
@@ -53,7 +53,7 @@ mindplot.persistence.XMLSerializer_Pela = new Class({
                 if (mindmap.findNodeById(relationship.getFromNode()) !== null && mindmap.findNodeById(relationship.getToNode()) !== null) {
                     // Isolated relationships are not persisted ....
                     var relationDom = this._relationshipToXML(document, relationship);
-                    mapElem.appendChild(relationDom);
+                    mapElem.append(relationDom);
                 }
             }
         }
@@ -150,12 +150,12 @@ mindplot.persistence.XMLSerializer_Pela = new Class({
                 var value = attributes[key];
                 if (key == 'text') {
                     var cdata = document.createCDATASection(this.rmXmlInv(value));
-                    featureDom.appendChild(cdata);
+                    featureDom.append(cdata);
                 } else {
                     featureDom.setAttribute(key, this.rmXmlInv(value));
                 }
             }
-            parentTopic.appendChild(featureDom);
+            parentTopic.append(featureDom);
         }
 
         //CHILDREN TOPICS
@@ -163,7 +163,7 @@ mindplot.persistence.XMLSerializer_Pela = new Class({
         for (var j = 0; j < childTopics.length; j++) {
             var childTopic = childTopics[j];
             var childDom = this._topicToXML(document, childTopic);
-            parentTopic.appendChild(childDom);
+            parentTopic.append(childDom);
 
         }
         return parentTopic;
@@ -175,8 +175,8 @@ mindplot.persistence.XMLSerializer_Pela = new Class({
         } else {
             var textDom = document.createElement("text");
             var cdata = document.createCDATASection(this.rmXmlInv(text));
-            textDom.appendChild(cdata);
+            textDom.append(cdata);
-            elem.appendChild(textDom);
+            elem.append(textDom);
         }
     },
 

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

@@ -21,8 +21,9 @@ mindplot.widget.ColorPalettePanel = new Class({
 
     initialize:function (buttonId, model, baseUrl) {
         this._baseUrl = baseUrl;
-        this.parent(buttonId, model);
+        console.error("mindplot.widget.ColorPalettePanel must be implemented...");
-        $assert($defined(baseUrl), "baseUrl can not be null");
+//        this.parent(buttonId, model);
+//        $assert($defined(baseUrl), "baseUrl can not be null");
     },
 
     _load:function () {

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

@@ -17,31 +17,31 @@
  */
 
 mindplot.widget.FloatingTip = new Class({
-    Implements:[Options, Events],
+    Implements: [Options, Events],
 
-    options:{
+    options: {
-        position:'top',
+        position: 'top',
-        center:true,
+        center: true,
-        content:'title',
+        content: 'title',
-        html:false,
+        html: false,
-        balloon:true,
+        balloon: true,
-        arrowSize:6,
+        arrowSize: 6,
-        arrowOffset:6,
+        arrowOffset: 6,
-        distance:7,
+        distance: 7,
-        motion:40,
+        motion: 40,
-        motionOnShow:true,
+        motionOnShow: true,
-        motionOnHide:true,
+        motionOnHide: true,
-        showOn:'mouseenter',
+        showOn: 'mouseenter',
-        hideOn:'mouseleave',
+        hideOn: 'mouseleave',
-        showDelay:500,
+        showDelay: 500,
-        hideDelay:250,
+        hideDelay: 250,
-        className:'floating-tip',
+        className: 'floating-tip',
-        offset:{x:0, y:0},
+        offset: {x: 0, y: 0},
-        preventHideOnOver:true,
+        preventHideOnOver: true,
-        fx:{ 'duration':'short' }
+        fx: { 'duration': 'short' }
     },
 
-    initialize:function (element, options) {
+    initialize: function (element, options) {
         this.setOptions(options);
         this.boundShow = function () {
             this.show(element);
@@ -56,18 +56,18 @@ mindplot.widget.FloatingTip = new Class({
         this.attach(element);
     },
 
-    attach:function (element) {
+    attach: function (element) {
-        if (element.retrieve('hasEvents') !== null) {
+        if (element.data('hasEvents') !== null) {
             return;
         }
-        element.addEvent(this.options.showOn, this.boundShow);
+        element.bind(this.options.showOn, this.boundShow);
-        element.addEvent(this.options.hideOn, this.boundHide);
+        element.bind(this.options.hideOn, this.boundHide);
-        element.store('hasEvents', true);
+        element.data('hasEvents', true);
     },
 
-    show:function (element) {
+    show: function (element) {
         var old = document.id(element).retrieve('floatingtip');
-        if (old){
+        if (old) {
             if (old.getStyle('opacity') == 1) {
                 clearTimeout(old.retrieve('timeout'));
                 return this;
@@ -89,7 +89,7 @@ mindplot.widget.FloatingTip = new Class({
         return this;
     },
 
-    hide:function (element) {
+    hide: function (element) {
         var tip = element.retrieve('floatingtip');
         if (!tip) {
             if (this.options.position == 'inside') {
@@ -109,7 +109,7 @@ mindplot.widget.FloatingTip = new Class({
         return this;
     },
 
-    _create:function (elem) {
+    _create: function (elem) {
 
         var o = this.options;
         var oc = o.content;
@@ -124,7 +124,7 @@ mindplot.widget.FloatingTip = new Class({
 
         var cnt = (typeof(oc) == 'string' ? elem.get(oc) : oc(elem));
         var cwr = new Element('div').addClass(o.className).setStyle('margin', 0);
-        var tip = new Element('div').addClass(o.className + '-wrapper').setStyles({ 'margin':0, 'padding':0, 'z-index':cwr.getStyle('z-index') }).adopt(cwr);
+        var tip = new Element('div').addClass(o.className + '-wrapper').setStyles({ 'margin': 0, 'padding': 0, 'z-index': cwr.getStyle('z-index') }).adopt(cwr);
 
         if (cnt) {
             if (o.html)
@@ -136,12 +136,12 @@ mindplot.widget.FloatingTip = new Class({
         }
 
         var body = document.id(document.body);
-        tip.setStyles({ 'position':'absolute', 'opacity':0, 'top':0, 'left':0 }).inject(body);
+        tip.setStyles({ 'position': 'absolute', 'opacity': 0, 'top': 0, 'left': 0 }).inject(body);
 
         if (o.balloon && !Browser.ie6) {
 
-            var trg = new Element('div').addClass(o.className + '-triangle').setStyles({ 'margin':0, 'padding':0 });
+            var trg = new Element('div').addClass(o.className + '-triangle').setStyles({ 'margin': 0, 'padding': 0 });
-            var trgSt = { 'border-color':cwr.getStyle('background-color'), 'border-width':o.arrowSize, 'border-style':'solid', 'width':0, 'height':0 };
+            var trgSt = { 'border-color': cwr.getStyle('background-color'), 'border-width': o.arrowSize, 'border-style': 'solid', 'width': 0, 'height': 0 };
 
             switch (opos) {
                 case 'inside':
@@ -195,12 +195,12 @@ mindplot.widget.FloatingTip = new Class({
         trgC.height = !$defined(trgC.height) ? 0 : trgC.height;
         trgC.width = !$defined(trgC.width) ? 0 : trgC.width;
 
-        var pos = { x:trgC.left + o.offset.x, y:trgC.top + o.offset.y };
+        var pos = { x: trgC.left + o.offset.x, y: trgC.top + o.offset.y };
 
         if (opos == 'inside') {
-            tip.setStyles({ 'width':tip.getStyle('width'), 'height':tip.getStyle('height') });
+            tip.setStyles({ 'width': tip.getStyle('width'), 'height': tip.getStyle('height') });
             elem.setStyle('position', 'relative').adopt(tip);
-            pos = { x:o.offset.x, y:o.offset.y };
+            pos = { x: o.offset.x, y: o.offset.y };
         } else {
             switch (opos) {
                 case 'top':
@@ -236,19 +236,19 @@ mindplot.widget.FloatingTip = new Class({
         }
 
         tip.set('morph', o.fx).store('position', pos);
-        tip.setStyles({ 'top':pos.y, 'left':pos.x });
+        tip.setStyles({ 'top': pos.y, 'left': pos.x });
 
         return tip;
 
     },
 
-    _animate:function (tip, d) {
+    _animate: function (tip, d) {
 
         clearTimeout(tip.retrieve('timeout'));
         tip.store('timeout', (function (t) {
 
             var o = this.options, din = (d == 'in');
-            var m = { 'opacity':din ? 1 : 0 };
+            var m = { 'opacity': din ? 1 : 0 };
 
             if ((o.motionOnShow && din) || (o.motionOnHide && !din)) {
                 var pos = t.retrieve('position');

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

@@ -24,8 +24,8 @@ mindplot.widget.FontSizePanel = new Class({
 
     buildPanel: function() {
 
-        var content = new Element("div", {'class':'toolbarPanel','id':'fontSizePanel'});
+        var content = $("<div class='toolbarPanel' id='fontSizePanel'></div>");
-        content.innerHTML = '' +
+        content[0].innerHTML = '' +
             '<div id="small" model="6" style="font-size:8px">Small</div>' +
             '<div id="normal" model="8" style="font-size:12px">Normal</div>' +
             '<div id="large" model="10" style="font-size:15px">Large</div>' +

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

@@ -19,7 +19,8 @@
 mindplot.widget.IconPanel = new Class({
     Extends:mindplot.widget.ToolbarPaneItem,
     initialize:function (buttonId, model) {
-        this.parent(buttonId, model);
+        console.error("mindplot.widget.IconPanel");
+//        this.parent(buttonId, model);
     },
 
     _updateSelectedItem:function () {

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

@@ -24,31 +24,32 @@ mindplot.widget.KeyboardShortcutTooltip = new Class({
         $assert(text, "text can not be null");
         this._text = text;
 
-        var children = buttonElem.getChildren();
+        console.error("mindplot.widget.KeyboardShortcutTooltip must be implemented ...");
-        var tipElemId = buttonElem.id + "Tip";
+//        var children = buttonElem.children();
-        var tipDiv = new Element('div', {id:tipElemId});
+//        var tipElemId = buttonElem.id + "Tip";
-        children[0].inject(tipDiv);
+//        var tipDiv = new Element('div', {id:tipElemId});
-        tipDiv.inject(buttonElem);
+//        children[0].inject(tipDiv);
-
+//        tipDiv.inject(buttonElem);
-        this.parent(tipDiv, {
+//
-            // Content can also be a function of the target element!
+//        this.parent(tipDiv, {
-            content: this._buildContent.pass(buttonElem, this),
+//            // Content can also be a function of the target element!
-            html: true,
+//            content: this._buildContent.pass(buttonElem, this),
-            position: 'bottom',
+//            html: true,
-            arrowOffset : 10,
+//            position: 'bottom',
-            center: true,
+//            arrowOffset : 10,
-            arrowSize: 3,
+//            center: true,
-            offset : {x:0,y:-2},
+//            arrowSize: 3,
-            className: 'keyboardShortcutTip',
+//            offset : {x:0,y:-2},
-            preventHideOnOver : false,
+//            className: 'keyboardShortcutTip',
-            motionOnShow:false,
+//            preventHideOnOver : false,
-            motionOnHide:false,
+//            motionOnShow:false,
-            fx: { 'duration': '100' }
+//            motionOnHide:false,
-        });
+//            fx: { 'duration': '100' }
-
+//        });
-        tipDiv.addEvent('click', function(e) {
+//
-            tipDiv.fireEvent('mouseleave', e);
+//        tipDiv.addEvent('click', function(e) {
-        });
+//            tipDiv.fireEvent('mouseleave', e);
+//        });
     },
 
     _buildContent : function() {

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

@@ -21,7 +21,7 @@ mindplot.widget.LinkIconTooltip = new Class({
 
     initialize:function (linkIcon) {
         $assert(linkIcon, "linkIcon can not be null");
-        this.parent(linkIcon.getImage()._peer._native, {
+        this.parent($(linkIcon.getImage()._peer._native), {
             // Content can also be a function of the target element!
             content:this._buildContent.pass(linkIcon, this),
             html:true,

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

@@ -18,32 +18,28 @@
 
 mindplot.widget.ListToolbarPanel = new Class({
     Extends: mindplot.widget.ToolbarPaneItem,
-    initialize : function(buttonId, model) {
+    initialize: function (buttonId, model) {
         this.parent(buttonId, model);
         this._initPanel();
     },
 
     _initPanel: function () {
         // Register on toolbar elements ...
-        var menuElems = this.getPanelElem().getElements('div');
+        this.getPanelElem().children('div').bind('click', function (event) {
-        menuElems.each(function(elem) {
+            event.stopPropagation();
-            elem.addEvent('click', function(event) {
+            this.hide();
-                event.stopPropagation();
+            var value = $defined(elem.getAttribute('model')) ? elem.getAttribute('model') : elem.id;
-                this.hide();
+            this.getModel().setValue(value);
-
+        });
-                var value = $defined(elem.getAttribute('model')) ? elem.getAttribute('model') : elem.id;
-                this.getModel().setValue(value);
-            }.bind(this));
-        }.bind(this));
     },
 
-    _updateSelectedItem : function() {
+    _updateSelectedItem: function () {
         var panelElem = this.getPanelElem();
         var menuElems = panelElem.getElements('div');
         var value = this.getModel().getValue();
-        menuElems.each(function(elem) {
+        menuElems.each(function (elem) {
             var elemValue = $defined(elem.getAttribute('model')) ? elem.getAttribute('model') : elem.id;
-            $assert(elemValue,"elemValue can not be null");
+            $assert(elemValue, "elemValue can not be null");
             if (elemValue == value)
                 elem.className = "toolbarPanelLinkSelectedLink";
             else

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

@@ -326,7 +326,7 @@ mindplot.widget.Menu = new Class({
 
             if (!readOnly) {
                 // To prevent the user from leaving the page with changes ...
-                Element.NativeEvents.unload = 1;
+//                Element.NativeEvents.unload = 1;
                 $(window).bind('unload', function () {
                     if (this.isSaveRequired()) {
                         this.save(saveElem, designer, false, true);

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

@@ -65,11 +65,11 @@ mindplot.widget.ToolbarPaneItem = new Class({
             offset: {x:-4,y:0}
         });
 
-        this._tip.bind('hide', function() {
+        this._tip.addEvent('hide', function() {
             this._visible = false
         }.bind(this));
 
-        this._tip.bind('show', function() {
+        this._tip.addEvent('show', function() {
             this._visible = true
         }.bind(this));
 

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

@@ -17,15 +17,15 @@
  */
 
 mindplot.widget.TopicShapePanel = new Class({
-    Extends : mindplot.widget.ListToolbarPanel,
+    Extends: mindplot.widget.ListToolbarPanel,
-    initialize : function(buttonId, model) {
+    initialize: function (buttonId, model) {
         this.parent(buttonId, model);
     },
 
-    buildPanel: function() {
+    buildPanel: function () {
 
-        var content = new Element("div", {'class':'toolbarPanel','id':'topicShapePanel'});
+        var content = $("<div class='toolbarPanel' id='topicShapePanel'></div>");
-        content.innerHTML = '' +
+        content[0].innerHTML = '' +
             '<div id="rectagle" model="rectagle"><img src="images/shape-rectangle.png" alt="Rectangle"></div>' +
             '<div id="rounded_rectagle" model="rounded rectagle" ><img src="images/shape-rectangle-round.png" alt="Rounded Rectangle"></div>' +
             '<div id="line" model="line"><img src="images/shape-line.png" alt="Line"></div>' +