Integrating new canvas api into rest of the modules

diff --git a/modules/documentCanvas/canvas.js b/modules/documentCanvas/canvas.js
index c2f6c85..9ae3a53 100644 (file)
--- a/modules/documentCanvas/canvas.js
+++ b/modules/documentCanvas/canvas.js
@@ -11,6 +11,10 @@ define([
 var Canvas = function(html) {\r
     this.dom = $(template);\r
     this.content = this.dom.find('#rng-module-documentCanvas-content');\r
+    this.setHTML(html);\r
+};\r
+\r
+Canvas.prototype.setHTML = function(html) {\r
     if(html) {\r
         this.content.html(html);\r
     }\r
@@ -38,6 +42,10 @@ Canvas.prototype.findNodes = function(desc) {
     return toret;\r
 };\r
 \r
+Canvas.prototype.getNodeById = function(id) {\r
+    return canvasNode.create($(this.content.find('#' +id)));\r
+}\r
+\r
 Canvas.prototype.nodeAppend = function(options) {\r
     var element; // = $(this.content.find('#' + options.context.id).get(0));\r
     if(options.to === 'root') {\r
@@ -181,10 +189,10 @@ Canvas.prototype.getPrecedingNode = function(options) {
 };\r
 \r
 Canvas.prototype.nodeInsideList = function(options) {\r
-    if(options.pointer) {\r
-        if(options.pointer.getClass() === 'list-items' || options.pointer.getClass() === 'item')\r
+    if(options.node) {\r
+        if(options.node.getClass() === 'list-items' || options.node.getClass() === 'item')\r
             return true;\r
-        var pointerElement = $(this.content.find('#' + options.pointer.getId()));\r
+        var pointerElement = $(this.content.find('#' + options.node.getId()));\r
         return pointerElement.parents('list-items, item').length > 0;\r
     }\r
     return false;\r

diff --git a/modules/documentCanvas/canvasManager.js b/modules/documentCanvas/canvasManager.js
index 5d17ec0..71c9342 100644 (file)
--- a/modules/documentCanvas/canvasManager.js
+++ b/modules/documentCanvas/canvasManager.js
@@ -1,7 +1,7 @@
 define([\r
 'libs/jquery-1.9.1.min',\r
-'./wlxmlNode'\r
-], function($, wlxmlNode) {\r
+'./canvasNode'\r
+], function($, canvasNode) {\r
 \r
 'use strict';\r
 \r
@@ -34,16 +34,16 @@ var Manager = function(canvas, sandbox) {
 \r
     canvas.dom.on('mouseover', '[wlxml-tag]', function(e) {\r
         e.stopPropagation();\r
-        manager.sandbox.publish('nodeHovered', new wlxmlNode.Node($(e.target)));\r
+        manager.sandbox.publish('nodeHovered', canvasNode.create($(e.target)));\r
     });\r
     canvas.dom.on('mouseout', '[wlxml-tag]', function(e) {\r
         e.stopPropagation();\r
-        manager.sandbox.publish('nodeBlured', new wlxmlNode.Node($(e.target)));\r
+        manager.sandbox.publish('nodeBlured', canvasNode.create($(e.target)));\r
     });\r
     canvas.dom.on('click', '[wlxml-tag]', function(e) {\r
         e.stopPropagation();\r
         console.log('clicked node type: '+e.target.nodeType);\r
-        manager.selectNode(new wlxmlNode.Node($(e.target)));\r
+        manager.selectNode(canvasNode.create($(e.target)));\r
     });\r
 \r
     canvas.dom.on('keyup', '#rng-module-documentCanvas-contentWrapper', function(e) {\r
@@ -53,7 +53,7 @@ var Manager = function(canvas, sandbox) {
             anchor = anchor.parent();\r
         if(!anchor.is('[wlxml-tag]'))\r
             return;\r
-        manager.selectNode(new wlxmlNode.Node(anchor));\r
+        manager.selectNode(canvasNode.create(anchor));\r
     });\r
     \r
     canvas.dom.on('keydown', '#rng-module-documentCanvas-contentWrapper', function(e) {\r
@@ -79,11 +79,11 @@ var Manager = function(canvas, sandbox) {
     }\r
 };\r
     \r
-Manager.prototype.selectNode = function(wlxmlNode, options) {\r
+Manager.prototype.selectNode = function(cnode, options) {\r
     options = options || {};\r
-    var nodeElement = this.getNodeElement(wlxmlNode)\r
+    var nodeElement = this.getNodeElement(cnode)\r
     \r
-    this.dimNode(wlxmlNode);\r
+    this.dimNode(cnode);\r
     \r
     this.canvas.dom.find('.rng-module-documentCanvas-currentNode').removeClass('rng-module-documentCanvas-currentNode');\r
     nodeElement.addClass('rng-module-documentCanvas-currentNode');\r
@@ -92,8 +92,8 @@ Manager.prototype.selectNode = function(wlxmlNode, options) {
         this.movecaretToNode(nodeElement, options.movecaret);\r
     }\r
     \r
-    this.currentNode = wlxmlNode;\r
-    this.sandbox.publish('nodeSelected', wlxmlNode);\r
+    this.currentNode = cnode;\r
+    this.sandbox.publish('nodeSelected', cnode);\r
 };\r
 \r
 Manager.prototype.insertNewNode = function(wlxmlTag, wlxmlClass) {\r
@@ -109,20 +109,24 @@ Manager.prototype.insertNewNode = function(wlxmlTag, wlxmlClass) {
             offsetStart = offsetEnd;\r
             offsetEnd = tmp;\r
         }\r
-        var node = new wlxmlNode.Node($(selection.anchorNode).parent());\r
-        var newNode = this.canvas.insertNode({place: 'wrapText', context: node, tag: wlxmlTag, klass: wlxmlClass, offsetStart: offsetStart, offsetEnd: offsetEnd});\r
-        this.selectNode(new wlxmlNode.Node(newNode), {movecaret: 'end'});\r
+        var wrapper = canvasNode.create({tag: wlxmlTag, klass: wlxmlClass});\r
+        this.canvas.nodeWrap({inside: canvasNode.create($(selection.anchorNode).parent()),\r
+                              _with: wrapper,\r
+                              offsetStart: offsetStart,\r
+                              offsetEnd: offsetEnd\r
+                            });\r
+        this.selectNode(wrapper, {movecaret: 'end'});\r
     }\r
     \r
     \r
 }\r
 \r
-Manager.prototype.getNodeElement = function(wlxmlNode) {\r
-    return this.canvas.dom.find('#'+wlxmlNode.id);\r
+Manager.prototype.getNodeElement = function(cnode) {\r
+    return this.canvas.dom.find('#'+cnode.getId());\r
 };\r
 \r
-Manager.prototype.highlightNode = function(wlxmlNode) {\r
-    var nodeElement = this.getNodeElement(wlxmlNode);\r
+Manager.prototype.highlightNode = function(cnode) {\r
+    var nodeElement = this.getNodeElement(cnode);\r
     if(!this.gridToggled) {\r
         nodeElement.addClass('rng-common-hoveredNode');\r
         var label = nodeElement.attr('wlxml-tag');\r
@@ -133,8 +137,8 @@ Manager.prototype.highlightNode = function(wlxmlNode) {
     }\r
 };\r
 \r
-Manager.prototype.dimNode = function(wlxmlNode) {\r
-    var nodeElement = this.getNodeElement(wlxmlNode);\r
+Manager.prototype.dimNode = function(cnode) {\r
+    var nodeElement = this.getNodeElement(cnode);\r
     if(!this.gridToggled) {\r
         nodeElement.removeClass('rng-common-hoveredNode');\r
         nodeElement.find('.rng-module-documentCanvas-hoveredNodeTag').remove();\r
@@ -151,7 +155,7 @@ Manager.prototype.selectFirstNode = function() {
     else {\r
         node = this.canvas.dom.find('[wlxml-class|="p"]')\r
     }\r
-    this.selectNode(new wlxmlNode.Node(node), {movecaret: true});\r
+    this.selectNode(canvasNode.create(node), {movecaret: true});\r
 };\r
 \r
 Manager.prototype.movecaretToNode = function(nodeElement, where) {\r
@@ -175,14 +179,17 @@ Manager.prototype.toggleGrid =  function(toggle) {
 Manager.prototype.onEnterKey = function(e) {\r
     e.preventDefault();\r
     var pos = getCursorPosition();\r
-    var insertedNode;\r
+    var contextNode = this.canvas.getNodeById(pos.parentNode.attr('id'));\r
+    var newNode;\r
+\r
     if(pos.isAtEnd) {\r
-        insertedNode = this.canvas.insertNode({place: 'after', context: {id: pos.parentNode.attr('id')}, tag: pos.parentNode.attr('wlxml-tag'), klass: pos.parentNode.attr('wlxml-class')});\r
+        newNode = canvasNode.create({tag: pos.parentNode.attr('wlxml-tag'), klass: pos.parentNode.attr('wlxml-class')});\r
+        this.canvas.nodeInsertAfter({node: newNode, after: canvas.getNodeById(pos.parentNode.attr('id'))});\r
     } else {\r
-        insertedNode = this.canvas.splitNode({node: {id: pos.parentNode.attr('id')}, textNodeIdx: pos.textNodeIndex, offset: pos.textNodeOffset});\r
+        newNode = this.canvas.nodeSplit({node: contextNode, textNodeIdx: pos.textNodeIndex, offset: pos.textNodeOffset});\r
     }\r
-    if(insertedNode.length)\r
-        this.selectNode(new wlxmlNode.Node(insertedNode), {movecaret: true});\r
+    if(newNode)\r
+        this.selectNode(newNode, {movecaret: true});\r
     this.sandbox.publish('contentChanged');\r
 };\r
 \r
@@ -196,9 +203,9 @@ Manager.prototype.onBackspaceKey = function(e) {
     }\r
     if(len === 0) {\r
         e.preventDefault();\r
-        var toRemove = new wlxmlNode.Node(pos.textNode);\r
-        var prevNode = this.canvas.getPreviousNode({node:toRemove});\r
-        this.canvas.removeNode({node: toRemove}); // jesli nie ma tekstu, to anchor nie jest tex nodem\r
+        var toRemove = canvasNode.create(pos.textNode);\r
+        var prevNode = this.canvas.getPrecedingNode({node:toRemove});\r
+        this.canvas.nodeRemove({node: toRemove}); // jesli nie ma tekstu, to anchor nie jest tex nodem\r
         this.selectNode(prevNode, {movecaret: 'end'});\r
     }\r
 }\r
@@ -207,16 +214,16 @@ Manager.prototype.command = function(command, meta) {
     var pos = getCursorPosition();\r
     \r
     if(command === 'createList') {\r
-        var node = new wlxmlNode.Node(pos.parentNode);\r
-        if(window.getSelection().getRangeAt().collapsed && this.canvas.insideList({pointer: node})) {\r
-            this.canvas.removeList({pointer: node});\r
+        var node = canvasNode.create(pos.parentNode);\r
+        if(window.getSelection().getRangeAt().collapsed && this.canvas.nodeInsideList({node: node})) {\r
+            this.canvas.listRemove({pointer: node});\r
             this.selectNode(node, {movecaret: 'end'});\r
             this.sandbox.publish('contentChanged');\r
         }\r
         else {\r
-            if(!this.canvas.insideList({pointer: node})) {\r
-                this.canvas.createList({start: new wlxmlNode.Node(pos.parentNode), end: new wlxmlNode.Node(pos.focusNode)});\r
-                this.selectNode(new wlxmlNode.Node(pos.parentNode), {movecaret: 'end'});\r
+            if(!this.canvas.nodeInsideList({node: node})) {\r
+                this.canvas.listCreate({start: node, end: canvasNode.create(pos.focusNode)});\r
+                this.selectNode(node, {movecaret: 'end'});\r
                 this.sandbox.publish('contentChanged');\r
             }\r
         }\r

diff --git a/modules/documentCanvas/canvasNode.js b/modules/documentCanvas/canvasNode.js
index 0bfd358..2b108a1 100644 (file)
--- a/modules/documentCanvas/canvasNode.js
+++ b/modules/documentCanvas/canvasNode.js
@@ -2,6 +2,9 @@ define(['libs/jquery-1.9.1.min'], function($) {
 \r
 'use strict';\r
 \r
+\r
+var tagSelector = '[wlxml-tag]';\r
+\r
 var CanvasNode = function(desc) {\r
     if(desc instanceof $) {\r
         this.dom = desc;\r
@@ -42,9 +45,34 @@ CanvasNode.prototype.setContent = function(content) {
 }\r
 \r
 CanvasNode.prototype.isSame = function(other) {\r
-    return this.dom.get(0).isSameNode(other.dom.get(0));\r
+    return (other instanceof CanvasNode) && this.dom.get(0).isSameNode(other.dom.get(0));\r
 }\r
 \r
+CanvasNode.prototype.children = function() {\r
+    var list = [];\r
+    this.dom.children(tagSelector).each(function() {\r
+        list.push(new CanvasNode($(this)));\r
+    });\r
+    return $(list);\r
+};\r
+\r
+\r
+CanvasNode.prototype.parent = function() {\r
+    var node = this.dom.parent(tagSelector);\r
+    if(node.length)\r
+        return new CanvasNode(node);\r
+    return null;\r
+};\r
+\r
+CanvasNode.prototype.parents = function() {\r
+    var list = [];\r
+    this.dom.parents(tagSelector).each(function() {\r
+        list.push(new CanvasNode($(this)));\r
+    });\r
+    return $(list);\r
+};\r
+\r
+\r
 return {\r
     create: function(desc) {\r
         return new CanvasNode(desc);\r

diff --git a/modules/documentCanvas/documentCanvas.js b/modules/documentCanvas/documentCanvas.js
index bec74fc..a4dcf37 100644 (file)
--- a/modules/documentCanvas/documentCanvas.js
+++ b/modules/documentCanvas/documentCanvas.js
@@ -3,16 +3,15 @@
 define([\r
 'libs/underscore-min',\r
 './transformations', \r
-'./wlxmlNode',\r
 './canvas',\r
 './canvasManager',\r
-'libs/text!./template.html'], function(_, transformations, wlxmlNode, Canvas, CanvasManager, template) {\r
+'libs/text!./template.html'], function(_, transformations, Canvas, CanvasManager, template) {\r
 \r
 'use strict';\r
 \r
 return function(sandbox) {\r
 \r
-    var canvas = new Canvas.Canvas();\r
+    var canvas = Canvas.create();\r
     var manager = new CanvasManager(canvas, sandbox);\r
 \r
     /* public api */\r
@@ -22,7 +21,7 @@ return function(sandbox) {
             return canvas.dom;\r
         },\r
         setDocument: function(xml) {\r
-            canvas.setXML(xml);\r
+            canvas.setHTML(transformations.fromXML.getHTMLTree(xml));\r
             sandbox.publish('documentSet');\r
         },\r
         getDocument: function() {\r
@@ -34,15 +33,15 @@ return function(sandbox) {
                 sandbox.publish('contentChanged');\r
             }\r
         },\r
-        highlightNode: function(wlxmlNode) {\r
-            manager.highlightNode(wlxmlNode);\r
+        highlightNode: function(canvasNode) {\r
+            manager.highlightNode(canvasNode);\r
         },\r
-        dimNode: function(wlxmlNode) {\r
-            manager.dimNode(wlxmlNode);\r
+        dimNode: function(canvasNode) {\r
+            manager.dimNode(canvasNode);\r
         },\r
-        selectNode: function(wlxmlNode) {\r
-            if(!wlxmlNode.is(manager.currentNode))\r
-                manager.selectNode(wlxmlNode, {movecaret: true});\r
+        selectNode: function(canvasNode) {\r
+            if(!canvasNode.isSame(manager.currentNode))\r
+                manager.selectNode(canvasNode, {movecaret: true});\r
         },\r
         toggleGrid: function(toggle) {\r
             manager.toggleGrid(toggle);\r

diff --git a/modules/documentCanvas/documentCanvas.less b/modules/documentCanvas/documentCanvas.less
index acfc4c1..94a8b6e 100644 (file)
--- a/modules/documentCanvas/documentCanvas.less
+++ b/modules/documentCanvas/documentCanvas.less
@@ -1,4 +1,4 @@
-@import 'wlxml.less';\r
+@import 'nodes.less';\r
 \r
 #rng-module-documentCanvas {\r
    height: 100%;\r

diff --git a/modules/documentCanvas/nodes.less b/modules/documentCanvas/nodes.less
new file mode 100644 (file)
index 0000000..215d36b
--- /dev/null
+++ b/modules/documentCanvas/nodes.less
@@ -0,0 +1,101 @@
+[wlxml-tag] {\r
+    float: none !important; /* temporaty workaround for Bootstrap's influence via [class*="span"] { float: left; } */\r
+    border-color: white;\r
+    border-style:solid;\r
+    border-width:1px;\r
+    min-height:20px;\r
+    position:relative;\r
+    text-indent: 0;\r
+}\r
+\r
+span[wlxml-tag] {\r
+    display:inline-block;\r
+    min-width: 10px;\r
+}\r
+\r
+[wlxml-tag=header] {\r
+    font-size: 13px;\r
+    font-weight: bold;\r
+    margin: 10px 0;\r
+}\r
+\r
+[wlxml-tag=section] {\r
+    margin-top: 10px;\r
+    margin-bottom: 10px;\r
+}\r
+\r
+[wlxml-tag=section] [wlxml-tag=section] {\r
+    margin-left:10px;\r
+}\r
+\r
+[wlxml-class|="cite"] {\r
+    font-style: italic;\r
+}\r
+\r
+[wlxml-class|="cite-code"] {\r
+    font-family: monospace;\r
+}\r
+\r
+[wlxml-class|="cite-code-xml"] {\r
+    color: blue;\r
+}\r
+\r
+[wlxml-tag=header] > [wlxml-class=author] {\r
+    font-size: 14px;\r
+}\r
+\r
+[wlxml-tag=header] > [wlxml-class=title] {\r
+    font-size:18px;\r
+}\r
+\r
+[wlxml-class|="uri"] {\r
+    color: blue;\r
+    text-decoration: underline;\r
+}\r
+\r
+[wlxml-class|="p"] {\r
+    text-indent: 1.5em;\r
+}\r
+\r
+[wlxml-class|="emph-tech"] {\r
+    font-style: italic;\r
+}\r
+\r
+[wlxml-tag]  metadata {\r
+    display:none;\r
+}\r
+\r
+[wlxml-class="list-items"] {\r
+\r
+    counter-reset: myitem;\r
+\r
+    > [wlxml-class="item"] {\r
+        counter-increment: myitem;\r
+        display: list-item;\r
+        margin-left: 10px;\r
+        padding-left: 5px;\r
+        \r
+        &:before {\r
+            content: counter(myitem) '. ';\r
+            margin-right:10px;\r
+            padding-right:10px;\r
+        }\r
+    }\r
+}\r
+\r
+[wlxml-class="table"] {\r
+\r
+    display: table;\r
+    border: 1px solid black;\r
+\r
+    [wlxml-class="row"] {\r
+        display: table-row;\r
+        border: 1px solid black;\r
+    }\r
+    [wlxml-class="cell"] {\r
+        display: table-cell;\r
+        border: 1px solid black;\r
+        padding: 5px;\r
+    }\r
+\r
+}
\ No newline at end of file

diff --git a/modules/documentCanvas/wlxml.less b/modules/documentCanvas/wlxml.less
deleted file mode 100644 (file)
index 215d36b..0000000
--- a/modules/documentCanvas/wlxml.less
+++ /dev/null
@@ -1,101 +0,0 @@
-[wlxml-tag] {\r
-    float: none !important; /* temporaty workaround for Bootstrap's influence via [class*="span"] { float: left; } */\r
-    border-color: white;\r
-    border-style:solid;\r
-    border-width:1px;\r
-    min-height:20px;\r
-    position:relative;\r
-    text-indent: 0;\r
-}\r
-\r
-span[wlxml-tag] {\r
-    display:inline-block;\r
-    min-width: 10px;\r
-}\r
-\r
-[wlxml-tag=header] {\r
-    font-size: 13px;\r
-    font-weight: bold;\r
-    margin: 10px 0;\r
-}\r
-\r
-[wlxml-tag=section] {\r
-    margin-top: 10px;\r
-    margin-bottom: 10px;\r
-}\r
-\r
-[wlxml-tag=section] [wlxml-tag=section] {\r
-    margin-left:10px;\r
-}\r
-\r
-[wlxml-class|="cite"] {\r
-    font-style: italic;\r
-}\r
-\r
-[wlxml-class|="cite-code"] {\r
-    font-family: monospace;\r
-}\r
-\r
-[wlxml-class|="cite-code-xml"] {\r
-    color: blue;\r
-}\r
-\r
-[wlxml-tag=header] > [wlxml-class=author] {\r
-    font-size: 14px;\r
-}\r
-\r
-[wlxml-tag=header] > [wlxml-class=title] {\r
-    font-size:18px;\r
-}\r
-\r
-[wlxml-class|="uri"] {\r
-    color: blue;\r
-    text-decoration: underline;\r
-}\r
-\r
-[wlxml-class|="p"] {\r
-    text-indent: 1.5em;\r
-}\r
-\r
-[wlxml-class|="emph-tech"] {\r
-    font-style: italic;\r
-}\r
-\r
-[wlxml-tag]  metadata {\r
-    display:none;\r
-}\r
-\r
-[wlxml-class="list-items"] {\r
-\r
-    counter-reset: myitem;\r
-\r
-    > [wlxml-class="item"] {\r
-        counter-increment: myitem;\r
-        display: list-item;\r
-        margin-left: 10px;\r
-        padding-left: 5px;\r
-        \r
-        &:before {\r
-            content: counter(myitem) '. ';\r
-            margin-right:10px;\r
-            padding-right:10px;\r
-        }\r
-    }\r
-}\r
-\r
-[wlxml-class="table"] {\r
-\r
-    display: table;\r
-    border: 1px solid black;\r
-\r
-    [wlxml-class="row"] {\r
-        display: table-row;\r
-        border: 1px solid black;\r
-    }\r
-    [wlxml-class="cell"] {\r
-        display: table-cell;\r
-        border: 1px solid black;\r
-        padding: 5px;\r
-    }\r
-\r
-}
\ No newline at end of file

diff --git a/modules/documentCanvas/wlxmlNode.js b/modules/documentCanvas/wlxmlNode.js
deleted file mode 100644 (file)
index 6bd0c35..0000000
--- a/modules/documentCanvas/wlxmlNode.js
+++ /dev/null
@@ -1,42 +0,0 @@
-define(['libs/jquery-1.9.1.min'], function($) {\r
-    \r
-'use strict';\r
-\r
-var tagSelector = '[wlxml-tag]';\r
-\r
-var Node = function(domNode) {\r
-       \r
-    return {\r
-        id: domNode.attr('id'),\r
-        tag: domNode.attr('wlxml-tag'),\r
-        klass: domNode.attr('wlxml-class'),\r
-        parent: function() {\r
-            var node = domNode.parent(tagSelector);\r
-            if(node.length)\r
-                return new Node(node);\r
-            return null;\r
-        },\r
-        children: function() {\r
-            var list = [];\r
-            domNode.children(tagSelector).each(function() {\r
-                list.push(new Node($(this)));\r
-            });\r
-            return $(list);\r
-        },\r
-        parents: function() {\r
-            var list = [];\r
-            domNode.parents(tagSelector).each(function() {\r
-                list.push(new Node($(this)));\r
-            });\r
-            return $(list);\r
-        },\r
-        is: function(wlxmlNode) {\r
-            return wlxmlNode && (wlxmlNode.id === this.id);\r
-        }\r
-    }\r
-\r
-};\r
-\r
-return { Node: Node}\r
-\r
-});
\ No newline at end of file

diff --git a/modules/nodeBreadCrumbs/nodeBreadCrumbs.js b/modules/nodeBreadCrumbs/nodeBreadCrumbs.js
index 517f45b..c147c09 100644 (file)
--- a/modules/nodeBreadCrumbs/nodeBreadCrumbs.js
+++ b/modules/nodeBreadCrumbs/nodeBreadCrumbs.js
@@ -32,11 +32,11 @@ return function(sandbox) {
             this.dom.empty();\r
             var nodes = this.nodes = {};\r
             this.currentNode = node;\r
-            this.nodes[node.id] = node;\r
+            this.nodes[node.getId()] = node;\r
             var parents = node.parents();\r
             parents.each(function() {\r
                 var parent = this;\r
-                nodes[parent.id] = parent;\r
+                nodes[parent.getId()] = parent;\r
             });\r
             this.dom.html(template({node: node, parents: parents}));\r
         },\r
@@ -54,9 +54,9 @@ return function(sandbox) {
     return {\r
         start: function() { sandbox.publish('ready'); },\r
         getView: function() { return view.dom; },\r
-        setNode: function(wlxmlNode) {\r
-            if(!wlxmlNode.is(view.currentNode)) {\r
-                view.setNode(wlxmlNode);\r
+        setNode: function(canvasNode) {\r
+            if(!canvasNode.isSame(view.currentNode)) {\r
+                view.setNode(canvasNode);\r
             }\r
         },\r
         highlightNode: function(id) { view.highlightNode(id); },\r

diff --git a/modules/nodeBreadCrumbs/template.html b/modules/nodeBreadCrumbs/template.html
index e1e9042..2d980c3 100644 (file)
--- a/modules/nodeBreadCrumbs/template.html
+++ b/modules/nodeBreadCrumbs/template.html
@@ -2,9 +2,9 @@
     <ul class="breadcrumb">
     <% if(node && parents) { %>
         <% for(var i = parents.length - 1; i >= 0; i--) { %>
-            <li><a href="#" data-id="<%= parents[i].id %>"> <%= parents[i].tag %><% if(parents[i].klass) { %>.<%= parents[i].klass %> <% } %></a><span class="divider">/</span></li>
+            <li><a href="#" data-id="<%= parents[i].getId() %>"> <%= parents[i].getTag() %><% if(parents[i].getClass()) { %>.<%= parents[i].getClass() %> <% } %></a><span class="divider">/</span></li>
         <% } %>
-            <li class="active"><span data-id="<%= node.id %>"><%= node.tag %><% if(node.klass) { %>.<%= node.klass %> <% } %></span></li>
+            <li class="active"><span data-id="<%= node.getId() %>"><%= node.getTag() %><% if(node.getClass()) { %>.<%= node.getClass() %> <% } %></span></li>
     <% } %>
     </ul>
 </div>
\ No newline at end of file

diff --git a/modules/nodeFamilyTree/nodeFamilyTree.js b/modules/nodeFamilyTree/nodeFamilyTree.js
index 7415b2d..b5cb56e 100644 (file)
--- a/modules/nodeFamilyTree/nodeFamilyTree.js
+++ b/modules/nodeFamilyTree/nodeFamilyTree.js
@@ -37,26 +37,26 @@ return function(sandbox) {
             \r
             if(parentNode) {\r
                 parent = {\r
-                    repr: parentNode.tag + (parentNode.klass ? ' / ' + parentNode.klass : ''),\r
-                    id: parentNode.id\r
+                    repr: parentNode.getTag() + (parentNode.getClass() ? ' / ' + parentNode.getClass() : ''),\r
+                    id: parentNode.getId()\r
                 };\r
-                this.nodes[parentNode.id] = parentNode;\r
+                this.nodes[parentNode.getId()] = parentNode;\r
             }\r
         \r
             var children = [];\r
             node.children().each(function() {\r
                 var child = this;\r
-                children.push({repr: child.tag + (child.klass ? ' / ' + child.klass : ''), id: child.id});\r
-                nodes[child.id] = child;\r
+                children.push({repr: child.getTag() + (child.getClass() ? ' / ' + child.getClass() : ''), id: child.getId()});\r
+                nodes[child.getId()] = child;\r
             });\r
             this.dom.empty();\r
             this.dom.append($(template({parent: parent, children: children})));\r
         },\r
-        highlightNode: function(wlxmlNode) {\r
-            this.dom.find('a[data-id="'+wlxmlNode.id+'"]').addClass('rng-common-hoveredNode');\r
+        highlightNode: function(canvasNode) {\r
+            this.dom.find('a[data-id="'+canvasNode.getId()+'"]').addClass('rng-common-hoveredNode');\r
         },\r
-        dimNode: function(wlxmlNode) {\r
-            this.dom.find('a[data-id="'+wlxmlNode.id+'"]').removeClass('rng-common-hoveredNode');\r
+        dimNode: function(canvasNode) {\r
+            this.dom.find('a[data-id="'+canvasNode.getId()+'"]').removeClass('rng-common-hoveredNode');\r
         }\r
     }\r
     \r
@@ -66,18 +66,18 @@ return function(sandbox) {
         start: function() {\r
             sandbox.publish('ready');\r
         },\r
-        setNode: function(wlxmlNode) {\r
-            if(!wlxmlNode.is(view.currentNode))\r
-                view.setNode(wlxmlNode);\r
+        setNode: function(canvasNode) {\r
+            if(!canvasNode.isSame(view.currentNode))\r
+                view.setNode(canvasNode);\r
         },\r
         getView: function() {\r
             return view.dom;\r
         },\r
-        highlightNode: function(wlxmlNode) {\r
-            view.highlightNode(wlxmlNode);\r
+        highlightNode: function(canvasNode) {\r
+            view.highlightNode(canvasNode);\r
         },\r
-        dimNode: function(wlxmlNode) {\r
-            view.dimNode(wlxmlNode);\r
+        dimNode: function(canvasNode) {\r
+            view.dimNode(canvasNode);\r
         }\r
     };\r
 };\r

diff --git a/modules/nodePane/nodePane.js b/modules/nodePane/nodePane.js
index a9ef9e4..b825b1b 100644 (file)
--- a/modules/nodePane/nodePane.js
+++ b/modules/nodePane/nodePane.js
@@ -24,9 +24,9 @@ return function(sandbox) {
         getView: function() {\r
             return view;\r
         },\r
-        setNode: function(node) {\r
-            view.find('.rng-module-nodePane-tagSelect').val(node.tag);\r
-            view.find('.rng-module-nodePane-classSelect').val(node.klass);\r
+        setNode: function(canvasNode) {\r
+            view.find('.rng-module-nodePane-tagSelect').val(canvasNode.getTag());\r
+            view.find('.rng-module-nodePane-classSelect').val(canvasNode.getClass());\r
         }\r
     }\r
     \r

diff --git a/modules/rng/rng.js b/modules/rng/rng.js
index a1fe65e..4189902 100644 (file)
--- a/modules/rng/rng.js
+++ b/modules/rng/rng.js
@@ -50,23 +50,23 @@ return function(sandbox) {
     }\r
     \r
     var commands = {\r
-        highlightDocumentNode: function(wlxmlNode, origin) {\r
+        highlightDocumentNode: function(canvasNode, origin) {\r
             ['documentCanvas', 'nodeBreadCrumbs', 'nodeFamilyTree'].forEach(function(moduleName) {\r
                 if(!origin || moduleName != origin)\r
-                    sandbox.getModule(moduleName).highlightNode(wlxmlNode)\r
+                    sandbox.getModule(moduleName).highlightNode(canvasNode)\r
             });\r
         },\r
-        dimDocumentNode: function(wlxmlNode, origin) {\r
+        dimDocumentNode: function(canvasNode, origin) {\r
             ['documentCanvas', 'nodeBreadCrumbs', 'nodeFamilyTree'].forEach(function(moduleName) {\r
                 if(!origin || moduleName != origin)\r
-                    sandbox.getModule(moduleName).dimNode(wlxmlNode)\r
+                    sandbox.getModule(moduleName).dimNode(canvasNode)\r
             });\r
         },\r
-        selectNode: function(wlxmlNode, origin) {\r
-            sandbox.getModule('documentCanvas').selectNode(wlxmlNode);\r
-            sandbox.getModule('nodePane').setNode(wlxmlNode);\r
-            sandbox.getModule('nodeFamilyTree').setNode(wlxmlNode);\r
-            sandbox.getModule('nodeBreadCrumbs').setNode(wlxmlNode);\r
+        selectNode: function(canvasNode, origin) {\r
+            sandbox.getModule('documentCanvas').selectNode(canvasNode);\r
+            sandbox.getModule('nodePane').setNode(canvasNode);\r
+            sandbox.getModule('nodeFamilyTree').setNode(canvasNode);\r
+            sandbox.getModule('nodeBreadCrumbs').setNode(canvasNode);\r
             \r
         },\r
         resetDocument: function(document, reason) {\r
@@ -191,20 +191,20 @@ return function(sandbox) {
             dirty.documentCanvas = false;\r
         },\r
         \r
-        nodeSelected: function(wlxmlNode) {\r
-            commands.selectNode(wlxmlNode);\r
+        nodeSelected: function(canvasNode) {\r
+            commands.selectNode(canvasNode);\r
         },\r
         \r
         contentChanged: function() {\r
             dirty.documentCanvas = true;\r
         },\r
         \r
-        nodeHovered: function(wlxmlNode) {\r
-            commands.highlightDocumentNode(wlxmlNode);\r
+        nodeHovered: function(canvasNode) {\r
+            commands.highlightDocumentNode(canvasNode);\r
         },\r
         \r
-        nodeBlured: function(wlxmlNode) {\r
-            commands.dimDocumentNode(wlxmlNode);\r
+        nodeBlured: function(canvasNode) {\r
+            commands.dimDocumentNode(canvasNode);\r
         }\r
     };\r
 \r
@@ -235,14 +235,14 @@ return function(sandbox) {
         ready: function() {\r
             views.currentNodePaneLayout.appendView(sandbox.getModule('nodeFamilyTree').getView());\r
         },\r
-        nodeEntered: function(wlxmlNode) {\r
-            commands.highlightDocumentNode(wlxmlNode, 'nodeFamilyTree');\r
+        nodeEntered: function(canvasNode) {\r
+            commands.highlightDocumentNode(canvasNode, 'nodeFamilyTree');\r
         },\r
-        nodeLeft: function(wlxmlNode) {\r
-            commands.dimDocumentNode(wlxmlNode, 'nodeFamilyTree');\r
+        nodeLeft: function(canvasNode) {\r
+            commands.dimDocumentNode(canvasNode, 'nodeFamilyTree');\r
         },\r
-        nodeSelected: function(wlxmlNode) {\r
-            commands.selectNode(wlxmlNode);\r
+        nodeSelected: function(canvasNode) {\r
+            commands.selectNode(canvasNode);\r
         }\r
     };\r
     \r
@@ -265,14 +265,14 @@ return function(sandbox) {
         ready: function() {\r
             views.visualEditing.setView('statusBar', sandbox.getModule('nodeBreadCrumbs').getView());\r
         },\r
-        nodeHighlighted: function(wlxmlNode) {\r
-            commands.highlightDocumentNode(wlxmlNode, 'nodeBreadCrumbs');\r
+        nodeHighlighted: function(canvasNode) {\r
+            commands.highlightDocumentNode(canvasNode, 'nodeBreadCrumbs');\r
         },\r
-        nodeDimmed: function(wlxmlNode) {\r
-            commands.dimDocumentNode(wlxmlNode, 'nodeBreadCrumbs');\r
+        nodeDimmed: function(canvasNode) {\r
+            commands.dimDocumentNode(canvasNode, 'nodeBreadCrumbs');\r
         },\r
-        nodeSelected: function(wlxmlNode) {\r
-            commands.selectNode(wlxmlNode);\r
+        nodeSelected: function(canvasNode) {\r
+            commands.selectNode(canvasNode);\r
         }        \r
     }\r
     \r