X-Git-Url: https://git.mdrn.pl/fnpeditor.git/blobdiff_plain/1dcf69f7caa40430482c79f46c5478f84f6afc0a..66aae866400efc99684f51486f8ce1ebb7f59404:/modules/visualEditor.js

diff --git a/modules/visualEditor.js b/modules/visualEditor.js
index a607d86..1c61ef0 100644
--- a/modules/visualEditor.js
+++ b/modules/visualEditor.js
@@ -98,6 +98,7 @@ rng.modules.visualEditor = function(sandbox) {
         insertNewNode: function(wlxmlTag, wlxmlClass) {
             //TODO: Insert inline
             var anchor = $(window.getSelection().anchorNode);
+            var anchorOffset = window.getSelection().anchorOffset;
             if(anchor[0].nodeType === Node.TEXT_NODE)
                 anchor = anchor.parent();
             if(anchor.text() === '') {
@@ -105,13 +106,21 @@ rng.modules.visualEditor = function(sandbox) {
                 anchor = anchor.parent();
                 todel.remove();
             }
+            if(anchorOffset > 0 && anchorOffset < anchor.text().length) {
+                if(wlxmlTag === null && wlxmlClass === null) {
+                    return this.splitWithNewNode(anchor);
+                }
+                return this.wrapSelectionWithNewNode(wlxmlTag, wlxmlClass);
+            }
             var newNode = this._createNode(wlxmlTag || anchor.attr('wlxml-tag'), wlxmlClass || anchor.attr('wlxml-class'));
-            anchor.after(newNode);
+            if(anchorOffset === 0)
+                anchor.before(newNode)
+            else
+                anchor.after(newNode);
             mediator.nodeCreated(newNode);
             isDirty = true;
         },
         wrapSelectionWithNewNode: function(wlxmlTag, wlxmlClass) {
-            
             var selection = window.getSelection();
             if(selection.anchorNode === selection.focusNode && selection.anchorNode.nodeType === Node.TEXT_NODE) {
                 var startOffset = selection.anchorOffset;
@@ -126,7 +135,7 @@ rng.modules.visualEditor = function(sandbox) {
                 var suffix = node.data.substr(endOffset);
                 var core = node.data.substr(startOffset, endOffset - startOffset);
                 var newNode = this._createNode(wlxmlTag, wlxmlClass);
-                newNode.text(core);
+                newNode.text(core || 'test');
                 $(node).replaceWith(newNode);
                 newNode.before(prefix);
                 newNode.after(suffix);
@@ -134,6 +143,31 @@ rng.modules.visualEditor = function(sandbox) {
                 isDirty = true;
             }
         },
+        splitWithNewNode: function(node) {
+            var selection = window.getSelection();
+            if(selection.anchorNode === selection.focusNode && selection.anchorNode.nodeType === Node.TEXT_NODE) {
+                var startOffset = selection.anchorOffset;
+                var endOffset = selection.focusOffset;
+                if(startOffset > endOffset) {
+                    var tmp = startOffset;
+                    startOffset = endOffset;
+                    endOffset = tmp;
+                }
+                var anchor = selection.anchorNode;
+                var prefix = anchor.data.substr(0, startOffset);
+                var suffix = anchor.data.substr(endOffset);
+                var prefixNode = this._createNode(node.attr('wlxml-tag'), node.attr('wlxml-class'));
+                var newNode = this._createNode(node.attr('wlxml-tag'), node.attr('wlxml-class'));
+                var suffixNode = this._createNode(node.attr('wlxml-tag'), node.attr('wlxml-class'));
+                prefixNode.text(prefix);
+                suffixNode.text(suffix);
+                node.replaceWith(newNode);
+                newNode.before(prefixNode);
+                newNode.after(suffixNode);
+                mediator.nodeCreated(newNode);
+                isDirty = true;
+            }
+        },
         getMetaData: function() {
             var toret = {};
             this.metaTable.find('tr').each(function() {
@@ -326,9 +360,42 @@ rng.modules.visualEditor = function(sandbox) {
         }
     }
     
+    var statusBarView = {
+        node: view.node.find('#rng-visualEditor-statusbar'),
+        setup: function() {
+            var view = this;
+            view.node.on('mouseenter', 'a', function(e) {
+                var target = $(e.target);
+                mediator.nodeHighlightedById(target.attr('data-id')); 
+            });
+            view.node.on('mouseleave', 'a', function(e) {
+                var target = $(e.target);
+                mediator.nodeDimmedById(target.attr('data-id')); 
+            });
+            view.node.on('click', 'a', function(e) {
+                e.preventDefault();
+                mediator.nodeSelectedById($(e.target).attr('data-id'));
+            });
+        },
+        
+        showNode: function(node) {
+            this.node.empty();
+            this.node.html(sandbox.getTemplate('statusBarNodeDisplay')({node: node, parents: node.parents('[wlxml-tag]')}));
+            //node.parents('[wlxml-tag]')
+        },
+        
+        highlightNode: function(id) {
+            this.node.find('a[data-id="'+id+'"]').addClass('rng-hover');
+        },
+        dimNode: function(id) {
+            this.node.find('a[data-id="' +id+'"]').removeClass('rng-hover');
+        }
+    }
+    
     view.setup();
     sideBarView.setup();
     toolbarView.setup();
+    statusBarView.setup();
     
     var mediator = {
         getCurrentNode: function() {
@@ -339,6 +406,7 @@ rng.modules.visualEditor = function(sandbox) {
         },
         nodeSelected: function(node) {
             sideBarView.updateEditPane(node);
+            statusBarView.showNode(node);
         },
         nodeSelectedById: function(id) {
             view.selectNodeById(id);
@@ -369,10 +437,12 @@ rng.modules.visualEditor = function(sandbox) {
         nodeHovered: function(node) {
             view.highlightNode(node);
             sideBarView.highlightNode(node.attr('id'));
+            statusBarView.highlightNode(node.attr('id'));
         },
         nodeBlured: function(node) {
             view.dimNode(node);
             sideBarView.dimNode(node.attr('id'));
+            statusBarView.dimNode(node.attr('id'));
         },
         wrapWithNodeRequest: function(wlxmlTag, wlxmlClass) {
             view.wrapSelectionWithNewNode(wlxmlTag, wlxmlClass);