')
.attr('document-node-element', ''),
widgetsContainer = $('
')
@@ -128,11 +152,9 @@ $.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]);
@@ -140,14 +162,16 @@ $.extend(DocumentNodeElement, {
}
element.data('other-attrs', params.others);
- 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) {
@@ -162,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;
};
@@ -174,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);
@@ -254,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');
@@ -302,7 +390,8 @@ $.extend(DocumentNodeElement.prototype, {
return;
this._container().attr('wlxml-tag', tag);
- this._updateWlxmlManager();
+ if(!this.__updatingWlxml)
+ this._updateWlxmlManager();
},
getWlxmlClass: function() {
var klass = this._container().attr('wlxml-class');
@@ -323,7 +412,17 @@ $.extend(DocumentNodeElement.prototype, {
this._container().attr('wlxml-class', klass.replace(/\./g, '-'));
else
this._container().removeAttr('wlxml-class');
+ 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);
@@ -360,8 +459,8 @@ $.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) {
@@ -410,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, '');
},
@@ -427,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());
@@ -441,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());
@@ -472,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);
}