From 03ab3bddc47f0af16fca35ed3ce322eb00bd6328 Mon Sep 17 00:00:00 2001 From: Victor Woeltjen Date: Fri, 11 Mar 2016 17:00:55 -0800 Subject: [PATCH] [Tree] Begin handling selection state --- .../commonUI/general/src/ui/ToggleView.js | 4 +-- .../commonUI/general/src/ui/TreeNodeView.js | 32 ++++++++++++++++++- platform/commonUI/general/src/ui/TreeView.js | 18 ++++++++++- 3 files changed, 50 insertions(+), 4 deletions(-) diff --git a/platform/commonUI/general/src/ui/ToggleView.js b/platform/commonUI/general/src/ui/ToggleView.js index 4c8fed722d..c347ac3837 100644 --- a/platform/commonUI/general/src/ui/ToggleView.js +++ b/platform/commonUI/general/src/ui/ToggleView.js @@ -30,11 +30,11 @@ define([ this.callbacks = []; this.el = $(toggleTemplate); this.el.on('click', function () { - this.model(!this.expanded); + this.value(!this.expanded); }.bind(this)); } - ToggleView.prototype.model = function (state) { + ToggleView.prototype.value = function (state) { this.expanded = state; if (state) { diff --git a/platform/commonUI/general/src/ui/TreeNodeView.js b/platform/commonUI/general/src/ui/TreeNodeView.js index 3b54422668..d6637b6722 100644 --- a/platform/commonUI/general/src/ui/TreeNodeView.js +++ b/platform/commonUI/general/src/ui/TreeNodeView.js @@ -76,6 +76,36 @@ define([ } }; + TreeNodeView.prototype.value = function (domainObject) { + var activeIdPath = getIdPath(this.activeObject), + selectedIdPath = getIdPath(domainObject); + + if (this.onSelectionPath) { + this.li.find('.tree-item').eq(0).removeClass('selected'); + if (this.subtreeView) { + this.subtreeView.value(undefined); + } + } + + this.onSelectionPath = + !!domainObject && + !!this.activeObject && + (activeIdPath.length <= selectedIdPath.length) && + activeIdPath.every(function (id, index) { + return selectedIdPath[index] === id; + }); + + if (this.onSelectionPath) { + if (activeIdPath.length === selectedIdPath.length) { + this.li.find('.tree-item').eq(0).addClass('selected'); + } else { + // Expand to reveal the selection + this.toggleView.value(true); + this.subtreeView.value(domainObject); + } + } + }; + /** * * @returns {HTMLElement[]} @@ -86,4 +116,4 @@ define([ return TreeNodeView; -}); \ No newline at end of file +}); diff --git a/platform/commonUI/general/src/ui/TreeView.js b/platform/commonUI/general/src/ui/TreeView.js index 5777321a88..6a4d7618f4 100644 --- a/platform/commonUI/general/src/ui/TreeView.js +++ b/platform/commonUI/general/src/ui/TreeView.js @@ -30,6 +30,7 @@ define([ function TreeView() { this.ul = $(''); this.nodeViews = []; + this.callbacks = []; } function newTreeView() { @@ -62,6 +63,7 @@ define([ if (domainObject === self.activeObject) { self.setSize(domainObjects.length); domainObjects.forEach(addNode); + self.updateNodeViewSelection(); } } @@ -87,6 +89,20 @@ define([ } }; + TreeView.prototype.updateNodeViewSelection = function () { + this.nodeViews.forEach(function (nodeView) { + nodeView.value(this.selectedObject); + }); + }; + + TreeView.prototype.value = function (domainObject) { + this.selectedObject = domainObject; + this.updateNodeViewSelection(); + this.callbacks.forEach(function (callback) { + callback(domainObject); + }); + }; + /** * * @returns {HTMLElement[]} @@ -97,4 +113,4 @@ define([ return TreeView; -}); \ No newline at end of file +});