[Tree] Change selection on click

This commit is contained in:
Victor Woeltjen
2016-03-11 17:32:57 -08:00
parent 217e697079
commit a3a9393d1b
3 changed files with 16 additions and 8 deletions

View File

@ -29,7 +29,8 @@ define([
function link(scope, element, attrs) { function link(scope, element, attrs) {
var treeView = new TreeView(), var treeView = new TreeView(),
expr = $parse(attrs.mctModel), expr = $parse(attrs.mctModel),
unobserve = treeView.observe(expr.assign.bind(expr, scope)); assign = expr.assign.bind(expr, scope.$parent),
unobserve = treeView.observe(assign);
element.append(angular.element(treeView.elements())); element.append(angular.element(treeView.elements()));

View File

@ -29,7 +29,7 @@ define([
], function ($, nodeTemplate, ToggleView, TreeLabelView) { ], function ($, nodeTemplate, ToggleView, TreeLabelView) {
'use strict'; 'use strict';
function TreeNodeView(subtreeFactory) { function TreeNodeView(subtreeFactory, selectFn) {
this.li = $('<li>'); this.li = $('<li>');
this.toggleView = new ToggleView(false); this.toggleView = new ToggleView(false);
@ -49,6 +49,10 @@ define([
this.labelView = new TreeLabelView(); this.labelView = new TreeLabelView();
$(this.labelView.elements()).on('click', function () {
selectFn(this.activeObject);
}.bind(this));
this.li.append($(nodeTemplate)); this.li.append($(nodeTemplate));
this.li.find('span').eq(0) this.li.find('span').eq(0)
.append($(this.toggleView.elements())) .append($(this.toggleView.elements()))
@ -80,7 +84,7 @@ define([
function getId(domainObject) { function getId(domainObject) {
return domainObject.getId(); return domainObject.getId();
} }
return domainObject ? return domainObject ?
domainObject.getCapability('context').getPath().map(getId) : domainObject.getCapability('context').getPath().map(getId) :
[]; [];

View File

@ -27,21 +27,25 @@ define([
], function ($, TreeNodeView) { ], function ($, TreeNodeView) {
'use strict'; 'use strict';
function TreeView() { function TreeView(selectFn) {
this.ul = $('<ul class="tree"></ul>'); this.ul = $('<ul class="tree"></ul>');
this.nodeViews = []; this.nodeViews = [];
this.callbacks = []; this.callbacks = [];
this.selectFn = selectFn || this.value.bind(this);
} }
function newTreeView() { TreeView.prototype.newTreeView = function () {
return new TreeView(); return new TreeView(this.selectFn);
} }
TreeView.prototype.setSize = function (sz) { TreeView.prototype.setSize = function (sz) {
var nodeView; var nodeView;
while (this.nodeViews.length < sz) { while (this.nodeViews.length < sz) {
nodeView = new TreeNodeView(newTreeView); nodeView = new TreeNodeView(
this.newTreeView.bind(this),
this.selectFn
);
this.nodeViews.push(nodeView); this.nodeViews.push(nodeView);
this.ul.append($(nodeView.elements())); this.ul.append($(nodeView.elements()));
} }
@ -104,7 +108,6 @@ define([
}; };
TreeView.prototype.observe = function (callback) { TreeView.prototype.observe = function (callback) {
callback(this.selectedObject);
this.callbacks.push(callback); this.callbacks.push(callback);
return function () { return function () {
this.callbacks = this.callbacks.filter(function (c) { this.callbacks = this.callbacks.filter(function (c) {