-$.extend(DocumentNodeElement, {
- create: function(wlxmlNode, canvas) {
- return this.fromHTMLElement(this.createDOM(wlxmlNode, canvas)[0], canvas);
- },
-
- fromHTMLElement: function(htmlElement, canvas) {
- return new this(htmlElement, canvas);
- },
-
- createDOM: function(wlxmlNode, canvas) {
- var dom = $('<div>')
- .attr('document-node-element', ''),
- widgetsContainer = $('<div>')
- .addClass('canvas-widgets')
- .attr('contenteditable', false),
- container = $('<div>')
- .attr('document-element-content', '');
-
- dom.append(widgetsContainer, container);
- // Make sure widgets aren't navigable with arrow keys
- widgetsContainer.find('*').add(widgetsContainer).attr('tabindex', -1);
-
- var element = this.fromHTMLElement(dom[0], canvas);
-
- element.data('wlxmlNode', wlxmlNode);
- wlxmlNode.setData('canvasElement', element);
-
- element.setWlxml({tag: wlxmlNode.getTagName(), klass: wlxmlNode.getClass()});
-
- wlxmlNode.contents().forEach(function(node) {
- container.append(DocumentElement.create(node, canvas).dom());
- }.bind(this));
-
- return dom;
- }
-
-});