X-Git-Url: https://git.mdrn.pl/fnpeditor.git/blobdiff_plain/f21a91b10cced1d0fd3be6b183bc64303e7f4f94..ca7d9f0db18dff8083e5f06e52efec85ca522900:/modules/documentCanvas/canvasManager.js diff --git a/modules/documentCanvas/canvasManager.js b/modules/documentCanvas/canvasManager.js index 5d17ec0..201394e 100644 --- a/modules/documentCanvas/canvasManager.js +++ b/modules/documentCanvas/canvasManager.js @@ -1,7 +1,7 @@ define([ 'libs/jquery-1.9.1.min', -'./wlxmlNode' -], function($, wlxmlNode) { +'./canvasNode' +], function($, canvasNode) { 'use strict'; @@ -34,16 +34,16 @@ var Manager = function(canvas, sandbox) { canvas.dom.on('mouseover', '[wlxml-tag]', function(e) { e.stopPropagation(); - manager.sandbox.publish('nodeHovered', new wlxmlNode.Node($(e.target))); + manager.sandbox.publish('nodeHovered', canvasNode.create($(e.target))); }); canvas.dom.on('mouseout', '[wlxml-tag]', function(e) { e.stopPropagation(); - manager.sandbox.publish('nodeBlured', new wlxmlNode.Node($(e.target))); + manager.sandbox.publish('nodeBlured', canvasNode.create($(e.target))); }); canvas.dom.on('click', '[wlxml-tag]', function(e) { e.stopPropagation(); console.log('clicked node type: '+e.target.nodeType); - manager.selectNode(new wlxmlNode.Node($(e.target))); + manager.selectNode(canvasNode.create($(e.target))); }); canvas.dom.on('keyup', '#rng-module-documentCanvas-contentWrapper', function(e) { @@ -53,7 +53,7 @@ var Manager = function(canvas, sandbox) { anchor = anchor.parent(); if(!anchor.is('[wlxml-tag]')) return; - manager.selectNode(new wlxmlNode.Node(anchor)); + manager.selectNode(canvasNode.create(anchor)); }); canvas.dom.on('keydown', '#rng-module-documentCanvas-contentWrapper', function(e) { @@ -79,11 +79,11 @@ var Manager = function(canvas, sandbox) { } }; -Manager.prototype.selectNode = function(wlxmlNode, options) { +Manager.prototype.selectNode = function(cnode, options) { options = options || {}; - var nodeElement = this.getNodeElement(wlxmlNode) + var nodeElement = this.getNodeElement(cnode) - this.dimNode(wlxmlNode); + this.dimNode(cnode); this.canvas.dom.find('.rng-module-documentCanvas-currentNode').removeClass('rng-module-documentCanvas-currentNode'); nodeElement.addClass('rng-module-documentCanvas-currentNode'); @@ -92,37 +92,57 @@ Manager.prototype.selectNode = function(wlxmlNode, options) { this.movecaretToNode(nodeElement, options.movecaret); } - this.currentNode = wlxmlNode; - this.sandbox.publish('nodeSelected', wlxmlNode); + this.currentNode = cnode; + this.sandbox.publish('nodeSelected', cnode); }; Manager.prototype.insertNewNode = function(wlxmlTag, wlxmlClass) { - var selection = window.getSelection(); - - if(selection.getRangeAt(0).collapsed) { - - } else { - var offsetStart = selection.anchorOffset; - var offsetEnd = selection.focusOffset; - if(offsetStart > offsetEnd) { - var tmp = offsetStart; - offsetStart = offsetEnd; - offsetEnd = tmp; + var selection = window.getSelection(), + $anchorNode = $(selection.anchorNode), + $focusNode = $(selection.focusNode); + + + if(!selection.isCollapsed && $anchorNode.parent()[0] === $focusNode.parent()[0]) { + var textNodeIdx, + parent = $anchorNode.parent(), + parentContents = parent.contents(), + offsetStart = selection.anchorOffset, + offsetEnd = selection.focusOffset; + + if(selection.anchorNode === selection.focusNode) { + if(offsetStart > offsetEnd) { + var tmp = offsetStart; + offsetStart = offsetEnd; + offsetEnd = tmp; + } + textNodeIdx = parentContents.index($anchorNode); + } else { + if(parentContents.index($anchorNode) > parentContents.index($focusNode)) { + offsetStart = selection.focusOffset; + offsetEnd = selection.anchorOffset; + } + textNodeIdx = [parentContents.index($anchorNode), parentContents.index($focusNode)]; } - var node = new wlxmlNode.Node($(selection.anchorNode).parent()); - var newNode = this.canvas.insertNode({place: 'wrapText', context: node, tag: wlxmlTag, klass: wlxmlClass, offsetStart: offsetStart, offsetEnd: offsetEnd}); - this.selectNode(new wlxmlNode.Node(newNode), {movecaret: 'end'}); + + var wrapper = canvasNode.create({tag: wlxmlTag, klass: wlxmlClass}); + this.canvas.nodeWrap({inside: canvasNode.create(parent), + _with: wrapper, + offsetStart: offsetStart, + offsetEnd: offsetEnd, + textNodeIdx: textNodeIdx + }); + this.selectNode(wrapper, {movecaret: 'end'}); } } -Manager.prototype.getNodeElement = function(wlxmlNode) { - return this.canvas.dom.find('#'+wlxmlNode.id); +Manager.prototype.getNodeElement = function(cnode) { + return this.canvas.dom.find('#'+cnode.getId()); }; -Manager.prototype.highlightNode = function(wlxmlNode) { - var nodeElement = this.getNodeElement(wlxmlNode); +Manager.prototype.highlightNode = function(cnode) { + var nodeElement = this.getNodeElement(cnode); if(!this.gridToggled) { nodeElement.addClass('rng-common-hoveredNode'); var label = nodeElement.attr('wlxml-tag'); @@ -133,8 +153,8 @@ Manager.prototype.highlightNode = function(wlxmlNode) { } }; -Manager.prototype.dimNode = function(wlxmlNode) { - var nodeElement = this.getNodeElement(wlxmlNode); +Manager.prototype.dimNode = function(cnode) { + var nodeElement = this.getNodeElement(cnode); if(!this.gridToggled) { nodeElement.removeClass('rng-common-hoveredNode'); nodeElement.find('.rng-module-documentCanvas-hoveredNodeTag').remove(); @@ -151,10 +171,12 @@ Manager.prototype.selectFirstNode = function() { else { node = this.canvas.dom.find('[wlxml-class|="p"]') } - this.selectNode(new wlxmlNode.Node(node), {movecaret: true}); + this.selectNode(canvasNode.create(node), {movecaret: true}); }; Manager.prototype.movecaretToNode = function(nodeElement, where) { + if(!nodeElement.length) + return; var range = document.createRange(); range.selectNodeContents(nodeElement[0]); @@ -175,14 +197,17 @@ Manager.prototype.toggleGrid = function(toggle) { Manager.prototype.onEnterKey = function(e) { e.preventDefault(); var pos = getCursorPosition(); - var insertedNode; + var contextNode = this.canvas.getNodeById(pos.parentNode.attr('id')); + var newNode; + if(pos.isAtEnd) { - insertedNode = this.canvas.insertNode({place: 'after', context: {id: pos.parentNode.attr('id')}, tag: pos.parentNode.attr('wlxml-tag'), klass: pos.parentNode.attr('wlxml-class')}); + newNode = canvasNode.create({tag: pos.parentNode.attr('wlxml-tag'), klass: pos.parentNode.attr('wlxml-class')}); + this.canvas.nodeInsertAfter({node: newNode, after: this.canvas.getNodeById(pos.parentNode.attr('id'))}); } else { - insertedNode = this.canvas.splitNode({node: {id: pos.parentNode.attr('id')}, textNodeIdx: pos.textNodeIndex, offset: pos.textNodeOffset}); + newNode = this.canvas.nodeSplit({node: contextNode, textNodeIdx: pos.textNodeIndex, offset: pos.textNodeOffset}); } - if(insertedNode.length) - this.selectNode(new wlxmlNode.Node(insertedNode), {movecaret: true}); + if(newNode) + this.selectNode(newNode, {movecaret: true}); this.sandbox.publish('contentChanged'); }; @@ -196,9 +221,9 @@ Manager.prototype.onBackspaceKey = function(e) { } if(len === 0) { e.preventDefault(); - var toRemove = new wlxmlNode.Node(pos.textNode); - var prevNode = this.canvas.getPreviousNode({node:toRemove}); - this.canvas.removeNode({node: toRemove}); // jesli nie ma tekstu, to anchor nie jest tex nodem + var toRemove = canvasNode.create(pos.textNode); + var prevNode = this.canvas.getPrecedingNode({node:toRemove}); + this.canvas.nodeRemove({node: toRemove}); // jesli nie ma tekstu, to anchor nie jest tex nodem this.selectNode(prevNode, {movecaret: 'end'}); } } @@ -207,18 +232,18 @@ Manager.prototype.command = function(command, meta) { var pos = getCursorPosition(); if(command === 'createList') { - var node = new wlxmlNode.Node(pos.parentNode); - if(window.getSelection().getRangeAt().collapsed && this.canvas.insideList({pointer: node})) { - this.canvas.removeList({pointer: node}); + var node = canvasNode.create(pos.parentNode); + if(window.getSelection().getRangeAt(0).collapsed && this.canvas.nodeInsideList({node: node})) { + this.canvas.listRemove({pointer: node}); this.selectNode(node, {movecaret: 'end'}); this.sandbox.publish('contentChanged'); } else { - if(!this.canvas.insideList({pointer: node})) { - this.canvas.createList({start: new wlxmlNode.Node(pos.parentNode), end: new wlxmlNode.Node(pos.focusNode)}); - this.selectNode(new wlxmlNode.Node(pos.parentNode), {movecaret: 'end'}); + //if(!this.canvas.nodeInsideList({node: node})) { + this.canvas.listCreate({start: node, end: canvasNode.create(pos.focusNode), type: meta}); + this.selectNode(node, {movecaret: 'end'}); this.sandbox.publish('contentChanged'); - } + //} } }