From abd8692003a505de041558bd43f0ce1e884e8bbd Mon Sep 17 00:00:00 2001 From: =?utf8?q?Aleksander=20=C5=81ukasz?= Date: Thu, 6 Mar 2014 15:30:34 +0100 Subject: [PATCH] refactoring: common things in constructor, dom construction in a separate function --- .../documentCanvas/canvas/canvas.test.js | 1 + .../documentCanvas/canvas/documentElement.js | 60 +++++++++---------- .../documentCanvas/canvas/wlxmlManagers.js | 3 +- 3 files changed, 31 insertions(+), 33 deletions(-) diff --git a/src/editor/modules/documentCanvas/canvas/canvas.test.js b/src/editor/modules/documentCanvas/canvas/canvas.test.js index 67f59b6..902cb34 100644 --- a/src/editor/modules/documentCanvas/canvas/canvas.test.js +++ b/src/editor/modules/documentCanvas/canvas/canvas.test.js @@ -33,6 +33,7 @@ describe('new Canvas', function() { expect(c.doc().children()).to.have.length(3); expect(c.doc().children()[0].canvas).to.equal(c); + expect(c.doc().children()[0].data('wlxmlNode').sameNode(doc.root)); }); }); diff --git a/src/editor/modules/documentCanvas/canvas/documentElement.js b/src/editor/modules/documentCanvas/canvas/documentElement.js index 02c6e19..2c146bb 100644 --- a/src/editor/modules/documentCanvas/canvas/documentElement.js +++ b/src/editor/modules/documentCanvas/canvas/documentElement.js @@ -16,13 +16,13 @@ var DocumentElement = function(wlxmlNode, canvas) { } this.wlxmlNode = wlxmlNode; this.canvas = canvas; + + this.$element = this.createDOM(); + this.$element.data('canvas-element', this); + this.data('wlxmlNode', wlxmlNode); }; $.extend(DocumentElement.prototype, { - _setupDOMHandler: function(htmlElement) { - this.$element = $(htmlElement); - this.$element.data('canvas-element', this); - }, bound: function() { return $.contains(document.documentElement, this.dom()[0]); }, @@ -118,29 +118,7 @@ $.extend(DocumentElement.prototype, { // DocumentNodeElement represents an element node from WLXML document rendered inside Canvas var DocumentNodeElement = function(wlxmlNode, canvas) { DocumentElement.call(this, wlxmlNode, canvas); - - var dom = $('
') - .attr('document-node-element', ''), - widgetsContainer = $('
') - .addClass('canvas-widgets') - .attr('contenteditable', false), - container = $('
') - .attr('document-element-content', ''); - - dom.append(widgetsContainer, container); - // Make sure widgets aren't navigable with arrow keys - widgetsContainer.find('*').add(widgetsContainer).attr('tabindex', -1); - this._setupDOMHandler(dom); - - - this.data('wlxmlNode', wlxmlNode); wlxmlNode.setData('canvasElement', this); - - this.setWlxml({tag: wlxmlNode.getTagName(), klass: wlxmlNode.getClass()}); - - wlxmlNode.contents().forEach(function(node) { - container.append(canvas.createElement(node).dom()); - }.bind(this)); }; @@ -160,6 +138,26 @@ DocumentNodeElement.prototype = new DocumentElement(); $.extend(DocumentNodeElement.prototype, { + createDOM: function() { + var dom = $('
') + .attr('document-node-element', ''), + widgetsContainer = $('
') + .addClass('canvas-widgets') + .attr('contenteditable', false), + container = $('
') + .attr('document-element-content', ''); + + dom.append(widgetsContainer, container); + // Make sure widgets aren't navigable with arrow keys + widgetsContainer.find('*').add(widgetsContainer).attr('tabindex', -1); + this.$element = dom; //@!!! + this.setWlxml({tag: this.wlxmlNode.getTagName(), klass: this.wlxmlNode.getClass()}); + + this.wlxmlNode.contents().forEach(function(node) { + container.append(this.canvas.createElement(node).dom()); + }.bind(this)); + return dom; + }, _container: function() { return this.dom().children('[document-element-content]'); }, @@ -289,11 +287,6 @@ $.extend(DocumentNodeElement.prototype, { // DocumentNodeElement represents a text node from WLXML document rendered inside Canvas var DocumentTextElement = function(wlxmlTextNode, canvas) { DocumentElement.call(this, wlxmlTextNode, canvas); - var dom = $('
') - .attr('document-text-element', '') - .text(wlxmlTextNode.getText() || utils.unicode.ZWS); - this._setupDOMHandler(dom); - this.data('wlxmlNode', wlxmlTextNode); }; $.extend(DocumentTextElement, { @@ -305,6 +298,11 @@ $.extend(DocumentTextElement, { DocumentTextElement.prototype = new DocumentElement(); $.extend(DocumentTextElement.prototype, { + createDOM: function() { + return $('
') + .attr('document-text-element', '') + .text(this.wlxmlNode.getText() || utils.unicode.ZWS); + }, detach: function() { this.dom().detach(); this.canvas = null; diff --git a/src/editor/modules/documentCanvas/canvas/wlxmlManagers.js b/src/editor/modules/documentCanvas/canvas/wlxmlManagers.js index a35c079..66b2ea0 100644 --- a/src/editor/modules/documentCanvas/canvas/wlxmlManagers.js +++ b/src/editor/modules/documentCanvas/canvas/wlxmlManagers.js @@ -41,8 +41,7 @@ var DocumentElementWrapper = function(documentElement) { eventBus.trigger.apply(eventBus, arguments); }; - this.node = documentElement.data('wlxmlNode'); - + this.node = documentElement.wlxmlNode; }; var getDisplayStyle = function(tag, klass) { -- 2.20.1