X-Git-Url: https://git.mdrn.pl/fnpeditor.git/blobdiff_plain/74635b9e0dd3069953072eab9de946b77d1b313e..51a333278c2989a5a0022c19404bd257bf55cb27:/src/editor/modules/documentCanvas/canvas/genericElement.js diff --git a/src/editor/modules/documentCanvas/canvas/genericElement.js b/src/editor/modules/documentCanvas/canvas/genericElement.js index e23aa9b..bbb4b07 100644 --- a/src/editor/modules/documentCanvas/canvas/genericElement.js +++ b/src/editor/modules/documentCanvas/canvas/genericElement.js @@ -3,6 +3,7 @@ define(function(require) { 'use strict'; var $ = require('libs/jquery'), + _ = require('libs/underscore'), documentElement = require('./documentElement'), utils = require('./utils'), wlxmlUtils = require('utils/wlxml'); @@ -14,8 +15,73 @@ var labelWidget = function(tag, klass) { }; void(labelWidget); // for linters; labelWidget is unused on purpose for now +var DocumentNodeElement = documentElement.DocumentNodeElement; + +var generic = Object.create(DocumentNodeElement.prototype); + +$.extend(generic, { + init: function() { + DocumentNodeElement.prototype.init.call(this); + this._container() + .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); + }.bind(this)); + this.refresh(); + }, + + refresh: function() { + if(this.wlxmlNode.getTagName() === 'span') { + if(this.containsBlock()) { + this.displayAsBlock(); + } else { + this.displayInline(); + } + } else { + this.displayAsBlock(); + } + }, + + getFirst: function(e1, e2) { + var idx1 = this.childIndex(e1), + idx2 = this.childIndex(e2); + if(e1 === null || e2 === null) { + return undefined; + } + return idx1 <= idx2 ? e1: e2; + }, + + children: function() { + var element = this, + toret = []; + this._container().contents().each(function() { + var childElement = element.canvas.getDocumentElement(this); + if(childElement === undefined) { + return true; + } + + toret.push(childElement); + }); + return toret; + }, + + getVerticallyFirstTextElement: function() { + var toret; + this.children().some(function(child) { + if(child instanceof documentElement.DocumentTextElement) { + toret = child; + return true; // break + } else { + toret = child.getVerticallyFirstTextElement(); + if(toret) { + return true; // break + } + } + }); + return toret; + }, -var generic = { onNodeAttrChange: function(event) { if(event.meta.attr === 'class') { this.setWlxmlClass(event.meta.newVal); // @@ -37,13 +103,20 @@ var generic = { referenceElement = this.children()[nodeIndex-1]; referenceAction = 'after'; } + + if(event.meta.move) { + /* Let's check if this node had its own canvas element and it's accessible. */ + actionArg = utils.getElementForElementRootNode(event.meta.node); + if(actionArg && actionArg.sameNode(referenceElement)) { + referenceElement = this.children()[nodeIndex]; + } + } + if(!actionArg) { + actionArg = event.meta.node; + } - actionArg = (event.type === 'nodeMoved' && utils.findCanvasElement(event.meta.node, event.meta.parent)) || event.meta.node; referenceElement[referenceAction](actionArg); }, - onNodeMoved: function(event) { - return this.onNodeAdded.call(this, event, true); - }, onNodeDetached: function(event) { if(event.meta.node.sameNode(this)) { this.detach(); @@ -71,6 +144,35 @@ var generic = { }); }, + onStateChange: function(changes) { + if(_.isBoolean(changes.exposed) && !this.isSpan()) { + this._container().toggleClass('highlighted-element', changes.exposed); + } + if(_.isBoolean(changes.active) && !this.isSpan()) { + this._container().toggleClass('current-node-element', changes.active); + } + }, + + /// + + isSpan: function() { + return this.wlxmlNode.getTagName() === 'span'; + }, + + containsBlock: function() { + return this.children() + .filter(function(child) { + return child instanceof documentElement.DocumentNodeElement; + }) + .some(function(child) { + if(child.isBlock()) { + return true; + } else { + return child.containsBlock(); + } + }); + }, + prepend: function(param) { var element; if(param instanceof documentElement.DocumentElement) { @@ -83,29 +185,6 @@ var generic = { return element; }, - children: function() { - var element = this, - toret = []; - this._container().contents().each(function() { - var childElement = element.canvas.getDocumentElement(this); - if(childElement === undefined) { - return true; - } - - toret.push(childElement); - }); - return toret; - }, - - getFirst: function(e1, e2) { - var idx1 = this.childIndex(e1), - idx2 = this.childIndex(e2); - if(e1 === null || e2 === null) { - return undefined; - } - return idx1 <= idx2 ? e1: e2; - }, - childIndex: function(child) { var children = this.children(), toret = null; @@ -136,57 +215,8 @@ var generic = { this._container().removeAttr('wlxml-class'); } this.refreshPath(); - }, - init: function() { - this._container() - .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); - }.bind(this)); - this.refresh(); - - }, - refresh: function() { - if(this.wlxmlNode.getTagName() === 'span') { - if(this.containsBlock()) { - this.displayAsBlock(); - } else { - this.displayInline(); - } - } else { - this.displayAsBlock(); - } - }, - containsBlock: function() { - return this.children() - .filter(function(child) { - return child instanceof documentElement.DocumentNodeElement; - }) - .some(function(child) { - if(child.isBlock()) { - return true; - } else { - return child.containsBlock(); - } - }); - }, - getVerticallyFirstTextElement: function() { - var toret; - this.children().some(function(child) { - if(child instanceof documentElement.DocumentTextElement) { - toret = child; - return true; // break - } else { - toret = child.getVerticallyFirstTextElement(); - if(toret) { - return true; // break - } - } - }); - return toret; - }, -}; + } +}); return generic;