--- /dev/null
+define(function(require) {
+
+'use strict';
+
+var $ = require('libs/jquery'),
+ _ = require('libs/underscore'),
+ utils = require('./utils');
+
+
+var Container = function(nodes, params, element) {
+ _.extend(this, params);
+ this.dom = this.dom || $('<div>');
+ this.dom.addClass('canvas-container');
+ this.element = element;
+
+ nodes.forEach(function(node) {
+ var el = this.element.canvas.createElement(node);
+ if(el.dom) {
+ this.dom.append(el.dom);
+ }
+ }.bind(this));
+};
+
+_.extend(Container.prototype, {
+ remove: function() {
+ this.element.removeContainer(this);
+ },
+
+ onNodeAdded: function(event) {
+ if(event.meta.node.isRoot()) {
+ this.element.canvas.reloadRoot();//
+ return;
+ }
+
+ var ptr = event.meta.node.prev(),
+ referenceElement, referenceAction, actionArg;
+
+ while(ptr && !(referenceElement = utils.getElementForElementRootNode(ptr))) {
+ ptr = ptr.prev();
+ }
+
+ if(referenceElement) {
+ referenceAction = 'after';
+ } else {
+ referenceElement = this;
+ referenceAction = '_prepend';
+ }
+
+ 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 = event.meta.node;
+ }
+
+ referenceElement[referenceAction](actionArg);
+ },
+ onNodeDetached: function(event) {
+ var container = this;
+ this.dom.contents().each(function() {
+ var childElement = container.element.canvas.getDocumentElement(this);
+ if(childElement && childElement.wlxmlNode.sameNode(event.meta.node)) {
+ childElement.detach();
+ return false;
+ }
+ });
+ },
+ getVerticallyFirstTextElement: function(params) {
+ var documentElement = require('./documentElement'),
+ toret;
+
+ params = _.extend({
+ considerChildren: true
+ }, params);
+
+ this.children().some(function(child) {
+ if(child instanceof documentElement.DocumentTextElement) {
+ toret = child;
+ return true; // break
+ } else if(params.considerChildren) {
+ toret = child.getVerticallyFirstTextElement();
+ if(toret) {
+ return true; // break
+ }
+ }
+ });
+ 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;
+ },
+
+ _prepend: function(param) {
+ var documentElement = require('./documentElement'),
+ element;
+ if(param instanceof documentElement.DocumentElement) {
+ element = param;
+ } else {
+ element = this.element.canvas.createElement(param);//
+ }
+ if(element.dom) {
+ this.dom.prepend(element.dom);
+ }
+ return element;
+ },
+ _childIndex: function(child) {
+ var children = this.children(),
+ toret = null;
+ children.forEach(function(c, idx) {
+ if(c.sameNode(child)) {
+ toret = idx;
+ return false;
+ }
+ });
+ return toret;
+ },
+ containsBlock: function() {
+ var documentElement = require('./documentElement');
+ return this.children()
+ .filter(function(child) {
+ return child instanceof documentElement.DocumentNodeElement;
+ })
+ .some(function(child) {
+ if(child.isBlock()) {
+ return true;
+ } else {
+ return child.containsBlock();
+ }
+ });
+ },
+ children: function() {
+ var element = this.element.canvas,
+ toret = [];
+ this.dom.contents().each(function() {
+ var childElement = element.getDocumentElement(this);
+ if(childElement === undefined) {
+ return true;
+ }
+
+ toret.push(childElement);
+ });
+ return toret;
+ },
+});
+
+return {
+ create: function(nodes, params, element) {
+ return new Container(nodes, params, element);
+ }
+};
+
+});
\ No newline at end of file
define([
'libs/jquery',
'libs/underscore',
-'modules/documentCanvas/canvas/utils'
-], function($, _, utils) {
+'modules/documentCanvas/canvas/utils',
+'modules/documentCanvas/canvas/container'
+], function($, _, utils, container) {
'use strict';
/* global Node:false */
// DocumentNodeElement represents an element node from WLXML document rendered inside Canvas
var DocumentNodeElement = function(wlxmlNode, canvas) {
DocumentElement.call(this, wlxmlNode, canvas);
+ this.containers = [];
this.init(this.dom);
};
}
this.gutterGroup.addView(view);
},
+ createContainer: function(nodes, params) {
+ var toret = container.create(nodes, params, this);
+ this.containers.push(toret);
+ return toret;
+ },
+ removeContainer: function(container) {
+ var idx;
+ if((idx = this.containers.indexOf(container)) !== -1) {
+ this.containers.splice(idx, 1);
+ }
+ },
handle: function(event) {
- var method = 'on' + event.type[0].toUpperCase() + event.type.substr(1);
- if(this[method]) {
- this[method](event);
+ var method = 'on' + event.type[0].toUpperCase() + event.type.substr(1),
+ target;
+ if(event.type === 'nodeAdded' || event.type === 'nodeDetached') {
+ this.containers.some(function(container) {
+ if(container.manages(event.meta.node, event.meta.parent)) {
+ target = container;
+ return true;
+ }
+ });
+ }
+
+ if(!target && this[method]) {
+ target = this;
+ }
+
+ if(target) {
+ target[method](event);
}
},
createDOM: function() {
var $ = require('libs/jquery'),
_ = require('libs/underscore'),
documentElement = require('./documentElement'),
- utils = require('./utils'),
CommentsView = require('./comments/comments');
.attr('wlxml-tag', this.wlxmlNode.getTagName())
.attr('wlxml-class', this.wlxmlNode.getClass().replace(/\./g, '-'));
- this.wlxmlNode.contents().forEach(function(node) {
- var el = this.canvas.createElement(node);
- if(el.dom) {
- this._container().append(el.dom);
- }
- }.bind(this));
+ this.container = this.createContainer(this.wlxmlNode.contents(), {
+ manages: function(node) { return !node.isInside('comment'); },
+ dom: this._container()
+ });
this.commentsView = new CommentsView(this.wlxmlNode, this.canvas.metadata.user);
this.addToGutter(this.commentsView);
},
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;
+ return this.container.getFirst(e1, e2);
},
- children: function() {
- var element = this,
- toret = [];
- this._container().contents().each(function() {
- var childElement = element.canvas.getDocumentElement(this);
- if(childElement === undefined) {
- return true;
- }
+ containsBlock: function() {
+ return this.container.containsBlock();
+ },
- toret.push(childElement);
- });
- return toret;
+ children: function() {
+ return this.container.children();
},
getVerticallyFirstTextElement: function(params) {
- var toret;
-
- params = _.extend({
- considerChildren: true
- }, params);
-
- this.children().some(function(child) {
- if(child instanceof documentElement.DocumentTextElement) {
- toret = child;
- return true; // break
- } else if(params.considerChildren) {
- toret = child.getVerticallyFirstTextElement();
- if(toret) {
- return true; // break
- }
- }
- });
- return toret;
+ return this.container.getVerticallyFirstTextElement(params);
},
onNodeAdded: function(event) {
- if(event.meta.node.isRoot()) {
- this.canvas.reloadRoot();
- return;
- }
-
- var ptr = event.meta.node.prev(),
- referenceElement, referenceAction, actionArg;
-
- while(ptr && !(referenceElement = utils.getElementForElementRootNode(ptr))) {
- ptr = ptr.prev();
- }
-
- if(referenceElement) {
- referenceAction = 'after';
- } else {
- referenceElement = this;
- referenceAction = 'prepend';
- }
-
- 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 = event.meta.node;
- }
-
- referenceElement[referenceAction](actionArg);
-
if(event.meta.node.is('comment')) {
this.commentTip.show();
this.commentsView.render();
}
},
+
onNodeDetached: function(event) {
var isComment = event.meta.node.is('comment');
if(event.meta.node.sameNode(this)) {
+ // defacto jestesmy rootem?
this.detach();
} else {
- this.children().some(function(child) {
- if(child.wlxmlNode.sameNode(event.meta.node)) {
- child.detach();
- return true;
- }
- });
if(isComment && !this.wlxmlNode.hasChild({klass: 'comment'})) {
this.commentTip.hide();
}
this.commentsView.render();
}
},
+
onNodeTextChange: function(event) {
var node = event.meta.node;
},
onStateChange: function(changes) {
- if(_.isBoolean(changes.exposed) && !this.isSpan()) {
+ var isSpan = this.wlxmlNode.getTagName() === 'span';
+ if(_.isBoolean(changes.exposed) && !isSpan) {
this._container().toggleClass('highlighted-element', changes.exposed);
}
- if(_.isBoolean(changes.active) && !this.isSpan()) {
+ if(_.isBoolean(changes.active) && !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) {
- element = param;
- } else {
- element = this.canvas.createElement(param);
- }
- if(element.dom) {
- this._container().prepend(element.dom);
- this.refreshPath();
- }
- return element;
- },
-
- childIndex: function(child) {
- var children = this.children(),
- toret = null;
- children.forEach(function(c, idx) {
- if(c.sameNode(child)) {
- toret = idx;
- return false;
- }
- });
- return toret;
- }
});
fnp / fnpeditor.git / commitdiff