From b2afd91d9ec91ebcf2779b6cbd36f62eba871d69 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Aleksander=20=C5=81ukasz?= Date: Wed, 20 Nov 2013 12:57:40 +0100 Subject: [PATCH] integration wip: highlight/dim/select node via breadcrumbs + syncing with family tree --- .../modules/nodeBreadCrumbs/template.html | 4 +- .../modules/nodeFamilyTree/nodeFamilyTree.js | 40 +++++++++++++++---- .../modules/nodeFamilyTree/template.html | 4 +- src/editor/modules/rng/rng.js | 6 +-- 4 files changed, 40 insertions(+), 14 deletions(-) diff --git a/src/editor/modules/nodeBreadCrumbs/template.html b/src/editor/modules/nodeBreadCrumbs/template.html index afe44de..781ef5c 100644 --- a/src/editor/modules/nodeBreadCrumbs/template.html +++ b/src/editor/modules/nodeBreadCrumbs/template.html @@ -2,9 +2,9 @@ \ No newline at end of file diff --git a/src/editor/modules/nodeFamilyTree/nodeFamilyTree.js b/src/editor/modules/nodeFamilyTree/nodeFamilyTree.js index 610901a..cb7b57a 100644 --- a/src/editor/modules/nodeFamilyTree/nodeFamilyTree.js +++ b/src/editor/modules/nodeFamilyTree/nodeFamilyTree.js @@ -10,7 +10,20 @@ define([ return function(sandbox) { var template = _.template(templateSrc), - listens = false; + listens = false, + items = []; + + var getItemId = function(item) { + var idx = -1; + var found = _.find(items, function(i) { + idx += 1; + return item.sameNode(i); + }); + if(found) { + return idx; + } + return -1; + } var startListening = function(document) { listens = true; @@ -48,11 +61,15 @@ return function(sandbox) { parent; this.currentNodeElement = nodeElement; + items = []; if(nodeElementParent) { + items.push(nodeElementParent); parent = { + id: items.length - 1, repr: wlxmlUtils.wlxmlTagNames[nodeElementParent.getTagName()] + (nodeElementParent.getClass() ? ' / ' + wlxmlUtils.wlxmlClassNames[nodeElementParent.getClass()] : '') }; + } var nodeContents = nodeElement.contents(), @@ -68,10 +85,17 @@ return function(sandbox) { } text = '"' + text + '"'; } - contents.push({repr: _.escape(text), bold: child.sameNode(textElement)}); + contents.push({ + id: items.length, + repr: _.escape(text), bold: child.sameNode(textElement) + }); } else { - contents.push({repr: wlxmlUtils.wlxmlTagNames[child.getTagName()] + (child.getClass() ? ' / ' + wlxmlUtils.wlxmlClassNames[child.getClass()] : '')}); + contents.push({ + id: items.length, + repr: wlxmlUtils.wlxmlTagNames[child.getTagName()] + (child.getClass() ? ' / ' + wlxmlUtils.wlxmlClassNames[child.getClass()] : '') + }); } + items.push(child); }); this.dom.empty(); this.dom.append($(template({parent: parent, contents: contents}))); @@ -84,10 +108,12 @@ return function(sandbox) { }); }, highlightNode: function(canvasNode) { - this.dom.find('a[data-id="'+canvasNode.getId()+'"]').addClass('rng-common-hoveredNode'); + var id = getItemId(canvasNode); + this.dom.find('a[rng-module-nodeFamilyTree-item-id="'+id+'"]').addClass('rng-common-hoveredNode'); }, dimNode: function(canvasNode) { - this.dom.find('a[data-id="'+canvasNode.getId()+'"]').removeClass('rng-common-hoveredNode'); + var id = getItemId(canvasNode); + this.dom.find('a[rng-module-nodeFamilyTree-item-id="'+id+'"]').removeClass('rng-common-hoveredNode'); } }; @@ -107,10 +133,10 @@ return function(sandbox) { getView: function() { return view.dom; }, - highlightNode: function(canvasNode) { + highlightElement: function(canvasNode) { view.highlightNode(canvasNode); }, - dimNode: function(canvasNode) { + dimElement: function(canvasNode) { view.dimNode(canvasNode); } }; diff --git a/src/editor/modules/nodeFamilyTree/template.html b/src/editor/modules/nodeFamilyTree/template.html index 886df06..77e5366 100644 --- a/src/editor/modules/nodeFamilyTree/template.html +++ b/src/editor/modules/nodeFamilyTree/template.html @@ -2,7 +2,7 @@ - + @@ -10,7 +10,7 @@ diff --git a/src/editor/modules/rng/rng.js b/src/editor/modules/rng/rng.js index 58f4dee..52aaa51 100644 --- a/src/editor/modules/rng/rng.js +++ b/src/editor/modules/rng/rng.js @@ -18,14 +18,14 @@ return function(sandbox) { var commands = { highlightDocumentElement: function(element, origin) { ///'nodeBreadCrumbs', 'nodeFamilyTree' - ['documentCanvas', ].forEach(function(moduleName) { + ['documentCanvas', 'nodeFamilyTree'].forEach(function(moduleName) { if(!origin || moduleName != origin) sandbox.getModule(moduleName).highlightElement(element); }); }, dimDocumentElement: function(element, origin) { //'nodeBreadCrumbs', 'nodeFamilyTree' - ['documentCanvas'].forEach(function(moduleName) { + ['documentCanvas', 'nodeFamilyTree'].forEach(function(moduleName) { if(!origin || moduleName != origin) sandbox.getModule(moduleName).dimElement(element); }); @@ -36,7 +36,7 @@ return function(sandbox) { updateCurrentNodeElement: function(nodeElement) { sandbox.getModule('nodePane').setNodeElement(nodeElement); sandbox.getModule('nodeFamilyTree').setElement(nodeElement); - //sandbox.getModule('nodeBreadCrumbs').setNodeElement(nodeElement); + sandbox.getModule('nodeBreadCrumbs').setNodeElement(nodeElement); }, updateCurrentTextElement: function(textElement) { sandbox.getModule('nodeFamilyTree').setElement(textElement); -- 2.20.1
powyżej<% if(parent) { %><%= parent.repr %><% } else { %>-<% } %><% if(parent) { %><%= parent.repr %><% } else { %>-<% } %>
poniżej