X-Git-Url: https://git.mdrn.pl/fnpeditor.git/blobdiff_plain/25436cdfcd36e309bfdf99f858b66d15e3af3864..412e60ded1457ec0f408e2234c9dd60122929bac:/modules/documentCanvas/canvas/documentElement.js diff --git a/modules/documentCanvas/canvas/documentElement.js b/modules/documentCanvas/canvas/documentElement.js index 2b42a22..0627bc1 100644 --- a/modules/documentCanvas/canvas/documentElement.js +++ b/modules/documentCanvas/canvas/documentElement.js @@ -1,10 +1,11 @@ define([ -'libs/jquery-1.9.1.min', -'libs/underscore-min', +'libs/jquery', +'libs/underscore', 'modules/documentCanvas/classAttributes', 'modules/documentCanvas/canvas/utils', -'modules/documentCanvas/canvas/widgets' -], function($, _, classAttributes, utils, widgets) { +'modules/documentCanvas/canvas/widgets', +'modules/documentCanvas/canvas/wlxmlManagers' +], function($, _, classAttributes, utils, widgets, wlxmlManagers) { 'use strict'; @@ -45,6 +46,9 @@ $.extend(DocumentElement.prototype, { _setupDOMHandler: function(htmlElement) { this.$element = $(htmlElement); }, + bound: function() { + return $.contains(document.documentElement, this.dom()[0]); + }, dom: function() { return this.$element; }, @@ -70,17 +74,12 @@ $.extend(DocumentElement.prototype, { }, wrapWithNodeElement: function(wlxmlNode) { - var wrapper = DocumentNodeElement.create({tag: wlxmlNode.tag, klass: wlxmlNode.klass}); + var wrapper = DocumentNodeElement.create({tag: wlxmlNode.tag, klass: wlxmlNode.klass}, this); this.dom().replaceWith(wrapper.dom()); wrapper.append(this); return wrapper; }, - detach: function() { - this.dom().detach(); - this.canvas = null; - }, - markAsCurrent: function() { this.canvas.markAsCurrent(this); }, @@ -102,8 +101,34 @@ $.extend(DocumentElement.prototype, { return toret; }, + getPreviousTextElement: function(includeInvisible) { + return this.getNearestTextElement('above', includeInvisible); + }, + + getNextTextElement: function(includeInvisible) { + return this.getNearestTextElement('below', includeInvisible); + }, + + getNearestTextElement: function(direction, includeInvisible) { + includeInvisible = includeInvisible !== undefined ? includeInvisible : false; + var selector = '[document-text-element]' + (includeInvisible ? '' : ':visible'); + return this.canvas.getDocumentElement(utils.nearestInDocumentOrder(selector, direction, this.dom()[0])); + }, + isVisible: function() { return this instanceof DocumentTextElement || this.getWlxmlTag() !== 'metadata'; + }, + + isInsideList: function() { + return this.parents().some(function(parent) { + return parent.is('list'); + }); + }, + + exec: function(method) { + var manager = this.data('_wlxmlManager'); + if(manager[method]) + return manager[method].apply(manager, Array.prototype.slice.call(arguments, 1)); } }); @@ -113,16 +138,8 @@ var DocumentNodeElement = function(htmlElement, canvas) { DocumentElement.call(this, htmlElement, canvas); }; -var getDisplayStyle = function(tag, klass) { - if(tag === 'metadata') - return 'none'; - if(tag === 'span') - return 'inline'; - return 'block'; -} - $.extend(DocumentNodeElement, { - createDOM: function(params) { + createDOM: function(params, canvas) { var dom = $('
') .attr('document-node-element', ''), widgetsContainer = $('
') @@ -135,26 +152,26 @@ $.extend(DocumentNodeElement, { // Make sure widgets aren't navigable with arrow keys widgetsContainer.find('*').add(widgetsContainer).attr('tabindex', -1); - var element = this.fromHTMLElement(dom[0]); + var element = this.fromHTMLElement(dom[0], canvas); - element.setWlxmlTag(params.tag); - if(params.klass) - element.setWlxmlClass(params.klass); + element.setWlxml({tag: params.tag, klass: params.klass}); if(params.meta) { _.keys(params.meta).forEach(function(key) { element.setWlxmlMetaAttr(key, params.meta[key]); }); } element.data('other-attrs', params.others); - widgetsContainer.append(widgets.labelWidget(params.tag, params.klass)); - if(params.rawChildren) { + + if(params.rawChildren && params.rawChildren.length) { container.append(params.rawChildren); + } else if(params.prepopulateOnEmpty) { + element.append(DocumentTextElement.create({text: ''})); } return dom; }, create: function(params, canvas) { - return this.fromHTMLElement(this.createDOM(params)[0]); + return this.fromHTMLElement(this.createDOM(params, canvas)[0], canvas); }, fromHTMLElement: function(htmlElement, canvas) { @@ -169,7 +186,7 @@ var manipulate = function(e, params, action) { } else { element = DocumentElement.create(params); } - var target = action === 'append' ? e._container() : e.dom(); + var target = (action === 'append' || action === 'prepend') ? e._container() : e.dom(); target[action](element.dom()); return element; }; @@ -181,6 +198,67 @@ $.extend(DocumentNodeElement.prototype, { _container: function() { return this.dom().children('[document-element-content]'); }, + detach: function() { + var parent = this.parent(); + if(!parent) + return; + + var parentChildren = parent.children(), + myIdx = parent.childIndex(this); + + if(myIdx > 0 && myIdx < parentChildren.length) { + if((parentChildren[myIdx-1] instanceof DocumentTextElement) && (parentChildren[myIdx+1] instanceof DocumentTextElement)) { + parentChildren[myIdx-1].appendText(parentChildren[myIdx+1].getText()); + parentChildren[myIdx+1].detach(); + } + } + this.dom().detach(); + this.canvas = null; + return this; + }, + unwrapContents: function() { + var parent = this.parent(); + if(!parent) + return; + + var parentChildren = parent.children(), + myChildren = this.children(), + myIdx = parent.childIndex(this); + + if(myChildren.length === 0) + return this.detach(); + + var moveLeftRange, moveRightRange, leftMerged; + + if(myIdx > 0 && (parentChildren[myIdx-1] instanceof DocumentTextElement) && (myChildren[0] instanceof DocumentTextElement)) { + parentChildren[myIdx-1].appendText(myChildren[0].getText()); + myChildren[0].detach(); + moveLeftRange = true; + leftMerged = true; + } else { + leftMerged = false; + } + + if(!(leftMerged && myChildren.length === 1)) { + if(myIdx < parentChildren.length - 1 && (parentChildren[myIdx+1] instanceof DocumentTextElement) && (myChildren[myChildren.length-1] instanceof DocumentTextElement)) { + parentChildren[myIdx+1].prependText(myChildren[myChildren.length-1].getText()); + myChildren[myChildren.length-1].detach(); + moveRightRange = true; + } + } + + var childrenLength = this.children().length; + this.children().forEach(function(child) { + this.before(child); + }.bind(this)); + + this.detach(); + + return { + element1: parent.children()[myIdx + (moveLeftRange ? -1 : 0)], + element2: parent.children()[myIdx + childrenLength-1 + (moveRightRange ? 1 : 0)] + }; + }, data: function() { var dom = this.dom(), args = Array.prototype.slice.call(arguments, 0); @@ -261,6 +339,9 @@ $.extend(DocumentNodeElement.prototype, { this.data('orig-end', undefined); return manipulate(this, params, 'append'); }, + prepend: function(params) { + return manipulate(this, params, 'prepend'); + }, before: function(params) { return manipulate(this, params, 'before'); @@ -305,8 +386,12 @@ $.extend(DocumentNodeElement.prototype, { return this._container().attr('wlxml-tag'); }, setWlxmlTag: function(tag) { + if(tag === this.getWlxmlTag()) + return; + this._container().attr('wlxml-tag', tag); - this._updateDisplayStyle(); + if(!this.__updatingWlxml) + this._updateWlxmlManager(); }, getWlxmlClass: function() { var klass = this._container().attr('wlxml-class'); @@ -315,6 +400,9 @@ $.extend(DocumentNodeElement.prototype, { return undefined; }, setWlxmlClass: function(klass) { + if(klass === this.getWlxmlClass()) + return; + this.getWlxmlMetaAttrs().forEach(function(attr) { if(!classAttributes.hasMetaAttr(klass, attr.name)) this.dom().removeAttr('wlxml-meta-' + attr.name); @@ -324,12 +412,22 @@ $.extend(DocumentNodeElement.prototype, { this._container().attr('wlxml-class', klass.replace(/\./g, '-')); else this._container().removeAttr('wlxml-class'); - this._updateDisplayStyle(); - }, - _updateDisplayStyle: function() { - var displayStyle = getDisplayStyle(this.getWlxmlTag(), this.getWlxmlClass()); - this.dom().css('display', displayStyle); - this._container().css('display', displayStyle); + if(!this.__updatingWlxml) + this._updateWlxmlManager(); + }, + setWlxml: function(params) { + this.__updatingWlxml = true; + if(params.tag !== undefined) + this.setWlxmlTag(params.tag); + if(params.klass !== undefined) + this.setWlxmlClass(params.klass); + this._updateWlxmlManager(); + this.__updatingWlxml = false; + }, + _updateWlxmlManager: function() { + var manager = wlxmlManagers.getFor(this); + this.data('_wlxmlManager', manager); + manager.setup(); }, is: function(what) { if(what === 'list' && _.contains(['list.items', 'list.items.enum'], this.getWlxmlClass())) @@ -361,8 +459,15 @@ $.extend(DocumentNodeElement.prototype, { this.toggleHighlight(toggle); }, - toggleHighlight: function(toogle) { - this._container().toggleClass('highlighted-element'); + toggleHighlight: function(toggle) { + this._container().toggleClass('highlighted-element', toggle); + }, + + toggle: function(toggle) { + var mng = this.data('_wlxmlManager'); + if(mng) { + mng.toggle(toggle); + } } }); @@ -404,9 +509,20 @@ $.extend(DocumentTextElement.prototype, { else this.$element = $element; }, + detach: function() { + this.dom().detach(); + this.canvas = null; + return this; + }, setText: function(text) { this.dom().contents()[0].data = text; }, + appendText: function(text) { + this.dom().contents()[0].data += text; + }, + prependText: function(text) { + this.dom().contents()[0].data = text + this.dom().contents()[0].data; + }, getText: function() { return this.dom().text().replace(utils.unicode.ZWS, ''); }, @@ -421,7 +537,7 @@ $.extend(DocumentTextElement.prototype, { if(params instanceof DocumentNodeElement) { element = params; } else { - element = DocumentNodeElement.create(params); + element = DocumentNodeElement.create(params, this.canvas); } this.dom().wrap('
'); this.dom().parent().after(element.dom()); @@ -435,7 +551,7 @@ $.extend(DocumentTextElement.prototype, { if(params instanceof DocumentNodeElement) { element = params; } else { - element = DocumentNodeElement.create(params); + element = DocumentNodeElement.create(params, this.canvas); } this.dom().wrap('
'); this.dom().parent().before(element.dom()); @@ -466,12 +582,17 @@ $.extend(DocumentTextElement.prototype, { idx = grandParent.childIndex(parent), prev = idx - 1 > -1 ? grandParentChildren[idx-1] : null, next = idx + 1 < grandParentChildren.length ? grandParentChildren[idx+1] : null; + + prev = (prev instanceof DocumentTextElement) ? prev : null; + next = (next instanceof DocumentTextElement) ? next : null; + if(prev && next) { prev.setText(prev.getText() + this.getText() + next.getText()); next.detach(); } else if (prev || next) { - var target = prev ? prev : next; - target.setText(target.getText() + this.getText()); + var target = prev ? prev : next, + newText = prev ? target.getText() + this.getText() : this.getText() + target.getText(); + target.setText(newText); } else { parent.after(this); }