From 74635b9e0dd3069953072eab9de946b77d1b313e Mon Sep 17 00:00:00 2001 From: =?utf8?q?Aleksander=20=C5=81ukasz?= Date: Thu, 3 Apr 2014 12:48:31 +0200 Subject: [PATCH] refactoring: DocumentElement.dom --- .../modules/documentCanvas/canvas/canvas.js | 10 ++-- .../documentCanvas/canvas/canvas.test.js | 10 ++-- .../documentCanvas/canvas/documentElement.js | 53 +++++++++---------- .../documentCanvas/canvas/genericElement.js | 4 +- .../modules/documentCanvas/canvas/keyboard.js | 2 +- .../documentCanvas/canvas/wlxmlListener.js | 2 +- 6 files changed, 39 insertions(+), 42 deletions(-) diff --git a/src/editor/modules/documentCanvas/canvas/canvas.js b/src/editor/modules/documentCanvas/canvas/canvas.js index a43799c..bcfc954 100644 --- a/src/editor/modules/documentCanvas/canvas/canvas.js +++ b/src/editor/modules/documentCanvas/canvas/canvas.js @@ -124,7 +124,7 @@ $.extend(Canvas.prototype, Backbone.Events, { reloadRoot: function() { this.rootElement = this.createElement(this.wlxmlDocument.root); this.wrapper.empty(); - this.wrapper.append(this.rootElement.dom()); + this.wrapper.append(this.rootElement.dom); }, setupEventHandling: function() { @@ -281,11 +281,11 @@ $.extend(Canvas.prototype, Backbone.Events, { getNearestTextElement: function(direction, relativeToElement, includeInvisible) { includeInvisible = includeInvisible !== undefined ? includeInvisible : false; var selector = '[document-text-element]' + (includeInvisible ? '' : ':visible'); - return this.getDocumentElement(utils.nearestInDocumentOrder(selector, direction, relativeToElement.dom()[0])); + return this.getDocumentElement(utils.nearestInDocumentOrder(selector, direction, relativeToElement.dom[0])); }, contains: function(element) { - return element.dom().parents().index(this.wrapper) !== -1; + return element.dom.parents().index(this.wrapper) !== -1; }, triggerSelectionChanged: function() { @@ -328,7 +328,7 @@ $.extend(Canvas.prototype, Backbone.Events, { var _markAsCurrent = function(element) { if(element instanceof documentElement.DocumentTextElement) { this.wrapper.find('.current-text-element').removeClass('current-text-element'); - element.dom().addClass('current-text-element'); + element.dom.addClass('current-text-element'); } else { this.wrapper.find('.current-node-element').removeClass('current-node-element'); element._container().addClass('current-node-element'); @@ -363,7 +363,7 @@ $.extend(Canvas.prototype, Backbone.Events, { _moveCaretToTextElement: function(element, where) { var range = document.createRange(), - node = element.dom().contents()[0]; + node = element.dom.contents()[0]; if(typeof where !== 'number') { range.selectNodeContents(node); diff --git a/src/editor/modules/documentCanvas/canvas/canvas.test.js b/src/editor/modules/documentCanvas/canvas/canvas.test.js index 9059e3f..4f954f1 100644 --- a/src/editor/modules/documentCanvas/canvas/canvas.test.js +++ b/src/editor/modules/documentCanvas/canvas/canvas.test.js @@ -260,7 +260,7 @@ describe('Custom elements based on wlxml class attribute', function() { var node = c.wlxmlDocument.root.contents()[0], element = node.getData('canvasElement'); - var header = element.dom().find('h1'); + var header = element.dom.find('h1'); expect(header.text()).to.equal('1', 'just '); node.append({tagName: 'div'}); @@ -301,7 +301,7 @@ describe('Cursor', function() { it('returns position when browser selection collapsed', function() { var c = getCanvasFromXML('
Alice has a cat
'), - dom = c.doc().dom(), + dom = c.doc().dom, text = findTextNode(dom, 'Alice has a cat'); expect(text.nodeType).to.equal(Node.TEXT_NODE, 'correct node selected'); @@ -335,7 +335,7 @@ describe('Cursor', function() { it('recognizes selection start and end on document order', function() { var c = getCanvasFromXML('
Alicehas a cat
abc...cde
'), - dom = c.doc().dom(), + dom = c.doc().dom, textFirst = findTextNode(dom, 'Alice'), textSecond = findTextNode(dom, 'has a cat'), textAbc = findTextNode(dom, 'abc'), @@ -436,7 +436,7 @@ describe('Cursor', function() { it('returns boundries of selection when browser selection not collapsed', function() { var c = getCanvasFromXML('
Alice has a big cat
'), - dom = c.doc().dom(), + dom = c.doc().dom, text = { alice: findTextNode(dom, 'Alice '), has: findTextNode(dom, 'has'), @@ -468,7 +468,7 @@ describe('Cursor', function() { it('recognizes when browser selection boundries lies in sibling DocumentTextElements', function() { var c = getCanvasFromXML('
Alice has a big cat
'), - dom = c.doc().dom(), + dom = c.doc().dom, text = { alice: findTextNode(dom, 'Alice '), has: findTextNode(dom, 'has'), diff --git a/src/editor/modules/documentCanvas/canvas/documentElement.js b/src/editor/modules/documentCanvas/canvas/documentElement.js index b2e25ed..277d70a 100644 --- a/src/editor/modules/documentCanvas/canvas/documentElement.js +++ b/src/editor/modules/documentCanvas/canvas/documentElement.js @@ -12,8 +12,8 @@ var DocumentElement = function(wlxmlNode, canvas) { this.wlxmlNode = wlxmlNode; this.canvas = canvas; - this.$element = this.createDOM(); - this.$element.data('canvas-element', this); + this.dom = this.createDOM(); + this.dom.data('canvas-element', this); }; $.extend(DocumentElement.prototype, { @@ -26,11 +26,8 @@ $.extend(DocumentElement.prototype, { refresh: function() { // noop }, - dom: function() { - return this.$element; - }, parent: function() { - var parents = this.$element.parents('[document-node-element]'); + var parents = this.dom.parents('[document-node-element]'); if(parents.length) { return this.canvas.getDocumentElement(parents[0]); } @@ -48,7 +45,7 @@ $.extend(DocumentElement.prototype, { }, sameNode: function(other) { - return other && (typeof other === typeof this) && other.dom()[0] === this.dom()[0]; + return other && (typeof other === typeof this) && other.dom[0] === this.dom[0]; }, trigger: function() { @@ -63,7 +60,7 @@ $.extend(DocumentElement.prototype, { var DocumentNodeElement = function(wlxmlNode, canvas) { DocumentElement.call(this, wlxmlNode, canvas); wlxmlNode.setData('canvasElement', this); - this.init(this.$element); + this.init(this.dom); }; @@ -74,7 +71,7 @@ var manipulate = function(e, params, action) { } else { element = e.canvas.createElement(params); } - e.dom()[action](element.dom()); + e.dom[action](element.dom); e.refreshPath(); return element; }; @@ -85,10 +82,10 @@ DocumentNodeElement.prototype = Object.create(DocumentElement.prototype); $.extend(DocumentNodeElement.prototype, { defaultDisplayStyle: 'block', addWidget: function(widget) { - this.$element.children('.canvas-widgets').append(widget.DOM ? widget.DOM : widget); + this.dom.children('.canvas-widgets').append(widget.DOM ? widget.DOM : widget); }, clearWidgets: function() { - this.$element.children('.canvas-widgets').empty(); + this.dom.children('.canvas-widgets').empty(); }, handle: function(event) { var method = 'on' + event.type[0].toUpperCase() + event.type.substr(1); @@ -109,11 +106,11 @@ $.extend(DocumentNodeElement.prototype, { return wrapper; }, _container: function() { - return this.dom().children('[document-element-content]'); + return this.dom.children('[document-element-content]'); }, detach: function() { var parents = this.parents(); - this.dom().detach(); + this.dom.detach(); this.canvas = null; if(parents[0]) { parents[0].refreshPath(); @@ -130,7 +127,7 @@ $.extend(DocumentNodeElement.prototype, { toggleLabel: function(toggle) { var displayCss = toggle ? 'inline-block' : 'none'; - var label = this.dom().children('.canvas-widgets').find('.canvas-widget-label'); + var label = this.dom.children('.canvas-widgets').find('.canvas-widget-label'); label.css('display', displayCss); this.toggleHighlight(toggle); }, @@ -140,15 +137,15 @@ $.extend(DocumentNodeElement.prototype, { }, isBlock: function() { - return this.dom().css('display') === 'block'; + return this.dom.css('display') === 'block'; }, displayAsBlock: function() { - this.dom().css('display', 'block'); + this.dom.css('display', 'block'); this._container().css('display', 'block'); }, displayInline: function() { - this.dom().css('display', 'inline'); + this.dom.css('display', 'inline'); this._container().css('display', 'inline'); }, displayAs: function(what) { @@ -160,7 +157,7 @@ $.extend(DocumentNodeElement.prototype, { // e.css('display') // } // }) - this.dom().css('display', what); + this.dom.css('display', what); this._container().css('display', what); } }); @@ -187,16 +184,16 @@ $.extend(DocumentTextElement.prototype, { return dom; }, detach: function() { - this.dom().detach(); + this.dom.detach(); this.canvas = null; return this; }, setText: function(text) { - this.dom().contents()[0].data = text; + this.dom.contents()[0].data = text; }, getText: function(options) { options = _.extend({raw: false}, options || {}); - var toret = this.dom().text(); + var toret = this.dom.text(); if(!options.raw) { toret = toret.replace(utils.unicode.ZWS, ''); } @@ -204,7 +201,7 @@ $.extend(DocumentTextElement.prototype, { }, isEmpty: function() { // Having at least Zero Width Space is guaranteed be Content Observer - return this.dom().contents()[0].data === utils.unicode.ZWS; + return this.dom.contents()[0].data === utils.unicode.ZWS; }, after: function(params) { if(params instanceof DocumentTextElement || params.text) { @@ -216,9 +213,9 @@ $.extend(DocumentTextElement.prototype, { } else { element = this.canvas.createElement(params); } - this.dom().wrap('
'); - this.dom().parent().after(element.dom()); - this.dom().unwrap(); + this.dom.wrap('
'); + this.dom.parent().after(element.dom); + this.dom.unwrap(); this.refreshPath(); return element; }, @@ -232,9 +229,9 @@ $.extend(DocumentTextElement.prototype, { } else { element = this.canvas.createElement(params); } - this.dom().wrap('
'); - this.dom().parent().before(element.dom()); - this.dom().unwrap(); + this.dom.wrap('
'); + this.dom.parent().before(element.dom); + this.dom.unwrap(); this.refreshPath(); return element; }, diff --git a/src/editor/modules/documentCanvas/canvas/genericElement.js b/src/editor/modules/documentCanvas/canvas/genericElement.js index 8b7d2fb..e23aa9b 100644 --- a/src/editor/modules/documentCanvas/canvas/genericElement.js +++ b/src/editor/modules/documentCanvas/canvas/genericElement.js @@ -78,7 +78,7 @@ var generic = { } else { element = this.canvas.createElement(param); } - this._container().prepend(element.dom()); + this._container().prepend(element.dom); this.refreshPath(); return element; }, @@ -142,7 +142,7 @@ var generic = { .attr('wlxml-tag', this.wlxmlNode.getTagName()); this.setWlxmlClass(this.wlxmlNode.getClass()); this.wlxmlNode.contents().forEach(function(node) { - this._container().append(this.canvas.createElement(node).dom()); + this._container().append(this.canvas.createElement(node).dom); }.bind(this)); this.refresh(); diff --git a/src/editor/modules/documentCanvas/canvas/keyboard.js b/src/editor/modules/documentCanvas/canvas/keyboard.js index f0439d6..69dd060 100644 --- a/src/editor/modules/documentCanvas/canvas/keyboard.js +++ b/src/editor/modules/documentCanvas/canvas/keyboard.js @@ -152,7 +152,7 @@ handlers.push({keys: [KEYS.ARROW_UP, KEYS.ARROW_DOWN, KEYS.ARROW_LEFT, KEYS.ARRO direction = 'below'; caretTo = 'start'; } - var el = canvas.getDocumentElement(utils.nearestInDocumentOrder('[document-text-element]', direction, element.dom()[0])); + var el = canvas.getDocumentElement(utils.nearestInDocumentOrder('[document-text-element]', direction, element.dom[0])); if(el) { canvas.setCurrentElement(el, {caretTo: caretTo}); } diff --git a/src/editor/modules/documentCanvas/canvas/wlxmlListener.js b/src/editor/modules/documentCanvas/canvas/wlxmlListener.js index e521c97..8667560 100644 --- a/src/editor/modules/documentCanvas/canvas/wlxmlListener.js +++ b/src/editor/modules/documentCanvas/canvas/wlxmlListener.js @@ -50,7 +50,7 @@ var handlers = { this.canvas.reloadRoot(); } else { newElement = this.canvas.createElement(event.meta.node); - element.dom().replaceWith(newElement.dom()); + element.dom.replaceWith(newElement.dom); } } -- 2.20.1