X-Git-Url: https://git.mdrn.pl/fnpeditor.git/blobdiff_plain/e4b744be960a63b19461cf2062927d681df5b74a..55da6d6c73cdb1627cf71e7419eb3cc2f5e53c08:/src/editor/modules/documentCanvas/canvas/canvas.js diff --git a/src/editor/modules/documentCanvas/canvas/canvas.js b/src/editor/modules/documentCanvas/canvas/canvas.js index a589a20..a4785ad 100644 --- a/src/editor/modules/documentCanvas/canvas/canvas.js +++ b/src/editor/modules/documentCanvas/canvas/canvas.js @@ -4,14 +4,16 @@ define([ 'libs/backbone', 'modules/documentCanvas/canvas/documentElement', 'modules/documentCanvas/canvas/keyboard', -'modules/documentCanvas/canvas/utils' -], function($, _, Backbone, documentElement, keyboard, utils) { +'modules/documentCanvas/canvas/utils', +'modules/documentCanvas/canvas/wlxmlListener' +], function($, _, Backbone, documentElement, keyboard, utils, wlxmlListener) { 'use strict'; var Canvas = function(wlxmlDocument, publisher) { this.eventBus = _.extend({}, Backbone.Events); this.wrapper = $('
').addClass('canvas-wrapper').attr('contenteditable', true); + this.wlxmlListener = wlxmlListener.create(this); this.loadWlxmlDocument(wlxmlDocument); this.publisher = publisher ? publisher : function() {}; }; @@ -19,10 +21,10 @@ var Canvas = function(wlxmlDocument, publisher) { $.extend(Canvas.prototype, { loadWlxmlDocument: function(wlxmlDocument) { - wlxmlDocument = wlxmlDocument || this.wlxmlDocument; if(!wlxmlDocument) { return false; } + var canvasDOM = this.generateCanvasDOM(wlxmlDocument.root); this.wrapper.empty(); @@ -30,35 +32,7 @@ $.extend(Canvas.prototype, { this.d = this.wrapper.children(0); this.setupEventHandling(); - var canvas = this; - - var findCanvasElement = function(node) { - if(node.nodeType === Node.ELEMENT_NODE) { - return node.getData('canvasElement'); - } - if(node.nodeType === Node.TEXT_NODE) { - var parent = node.parent(), - toret; - - parent.children().forEach(function(child) { - if(child.data('wlxmlNode').sameNode(node)) - toret = child; - }); - if(toret) - return toret; - } - } - - if(this.wlxmlDocument !== wlxmlDocument) { - wlxmlDocument.on('change', function(event) { - var canvasNode = findCanvasElement(event.meta.node); - if(event.type === 'nodeAttrChange' && event.meta.attr === 'class') { - canvasNode.setWlxmlClass(event.meta.newVal); - } - - }); - } - this.wlxmlDocument = wlxmlDocument; + this.wlxmlListener.listenTo(wlxmlDocument); }, generateCanvasDOM: function(wlxmlNode) { @@ -89,6 +63,9 @@ $.extend(Canvas.prototype, { } observer.observe(canvas.d[0], config); canvas.publisher('contentChanged'); + + var textElement = canvas.getDocumentElement(mutation.target); + textElement.data('wlxmlNode').setText(mutation.target.data); } }); }); @@ -290,7 +267,7 @@ $.extend(Canvas.prototype, { if(params.caretTo || !textElementToLand.sameNode(this.getCursor().getPosition().element)) this._moveCaretToTextElement(textElementToLand, params.caretTo); // as method on element? if(!(textElementToLand.sameNode(currentTextElement))) - this.publisher('currentTextElementSet', textElementToLand); + this.publisher('currentTextElementSet', textElementToLand.data('wlxmlNode')); } else { document.getSelection().removeAllRanges(); } @@ -298,7 +275,7 @@ $.extend(Canvas.prototype, { if(!(currentNodeElement && currentNodeElement.sameNode(nodeElementToLand))) { _markAsCurrent(nodeElementToLand); - this.publisher('currentNodeElementSet', nodeElementToLand); + this.publisher('currentNodeElementSet', nodeElementToLand.data('wlxmlNode')); } },