From: Aleksander Ɓukasz Date: Sun, 14 Jul 2013 16:57:43 +0000 (+0200) Subject: integration wip: marking element as current X-Git-Url: https://git.mdrn.pl/fnpeditor.git/commitdiff_plain/6839815113720ebc32eba7254471a46a9388c6da integration wip: marking element as current --- diff --git a/modules/documentCanvas/canvas/canvas.js b/modules/documentCanvas/canvas/canvas.js index 45c7fe2..ba86a32 100644 --- a/modules/documentCanvas/canvas/canvas.js +++ b/modules/documentCanvas/canvas/canvas.js @@ -6,8 +6,9 @@ define([ 'use strict'; -var Canvas = function(wlxml) { +var Canvas = function(wlxml, publisher) { this.loadWlxml(wlxml); + this.publisher = publisher ? publisher : function() {}; }; $.extend(Canvas.prototype, { @@ -66,6 +67,29 @@ $.extend(Canvas.prototype, { }); this.d = this.wrapper.children(0); + + var canvas = this; + this.wrapper.on('keydown', function(e) { + if(e.which === 13) { + e.preventDefault(); + var cursor = canvas.getCursor(); + if(!cursor.isSelecting()) { + var position = cursor.getPosition(); + position.element.split({offset: position.offset}); + } + } + }); + + this.wrapper.on('keyup', function(e) { + if(e.which >= 37 && e.which <= 40) + canvas.markAsCurrent(canvas.getCursor().getPosition().element) + }); + + this.wrapper.on('click', '[wlxml-tag], [wlxml-text]', function(e) { + e.stopPropagation(); + canvas.markAsCurrent(canvas.getCursor().getPosition().element) + }); + } else { this.d = null; } @@ -131,7 +155,19 @@ $.extend(Canvas.prototype, { }, list: {}, - + + markAsCurrent: function(element) { + if(element instanceof documentElement.DocumentTextElement) { + this.wrapper.find('.current-text-element').removeClass('current-text-element'); + element.dom().addClass('current-text-element'); + this.markAsCurrent(element.parent()); + this.publisher('currentTextElementChanged', element); + } else { + this.wrapper.find('.current-node-element').removeClass('current-node-element') + element.dom().addClass('current-node-element'); + } + + } }); $.extend(Canvas.prototype.list, { @@ -348,8 +384,8 @@ $.extend(Cursor.prototype, { }) return { - fromXML: function(xml) { - return new Canvas(xml); + fromXML: function(xml, publisher) { + return new Canvas(xml, publisher); } }; diff --git a/modules/documentCanvas/canvas/documentElement.js b/modules/documentCanvas/canvas/documentElement.js index f6137ef..5ac22fd 100644 --- a/modules/documentCanvas/canvas/documentElement.js +++ b/modules/documentCanvas/canvas/documentElement.js @@ -66,6 +66,10 @@ $.extend(DocumentElement.prototype, { detach: function() { this.dom().detach(); this.canvas = null; + }, + + markAsCurrent: function() { + this.canvas.markAsCurrent(this); } }); @@ -306,7 +310,7 @@ $.extend(DocumentTextElement.prototype, { succeedingChildren.forEach(function(child) { newElement.append(child); }); - } + }, }); return { diff --git a/modules/documentCanvas/documentCanvas.js b/modules/documentCanvas/documentCanvas.js index 4a49783..341f245 100644 --- a/modules/documentCanvas/documentCanvas.js +++ b/modules/documentCanvas/documentCanvas.js @@ -12,7 +12,7 @@ define([ return function(sandbox) { - var canvas = canvas3.fromXML(''); //canvasCanvas.create(); + var canvas = canvas3.fromXML('', sandbox.publish); //canvasCanvas.create(); var manager; var canvasWrapper = $(template); diff --git a/modules/documentCanvas/documentCanvas.less b/modules/documentCanvas/documentCanvas.less index 4d04285..9fc33fd 100644 --- a/modules/documentCanvas/documentCanvas.less +++ b/modules/documentCanvas/documentCanvas.less @@ -32,9 +32,19 @@ .rng-mixin-scrollbar-thumb-window-inactive; } - #rng-module-documentCanvas-content { + .canvas-wrapper { outline: 0px solid transparent; } + + .current-text-element { + outline: 1px dashed black; + } + + .current-node-element { + border-color: lighten(#000, 15%); + border-style: solid; + border-width: 1px; + } } .rng-module-documentCanvas-currentNode { diff --git a/modules/documentCanvas/nodes.less b/modules/documentCanvas/nodes.less index 3b7f053..bd80c00 100644 --- a/modules/documentCanvas/nodes.less +++ b/modules/documentCanvas/nodes.less @@ -1,5 +1,6 @@ [wlxml-text] { display: inline; + margin: 0 1px; } [wlxml-tag] { @@ -10,6 +11,7 @@ min-height:20px; position:relative; text-indent: 0; + padding: 1px 1px; } [wlxml-tag=span] {