From 717e7b634733cdcb88e3e23a579a0d134d94f07a Mon Sep 17 00:00:00 2001 From: rikkertkoppes Date: Wed, 20 Mar 2013 12:56:51 +0100 Subject: [PATCH 1/9] removed trailing slashes --- angular.tree.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/angular.tree.js b/angular.tree.js index cf66834..47470be 100644 --- a/angular.tree.js +++ b/angular.tree.js @@ -54,7 +54,7 @@ childNode.appendChild(wrapperEl); } - + var ulEl = document.createElement('UL'); ulEl.className = treeElem.className; childNode.appendChild(ulEl); @@ -241,7 +241,7 @@ if (removeElem.scope().$selected) { tree.selected(removeElem.scope(), false); } - + removeElem.remove(); } }, true); From a8a7ebb5d8060108525bd5de63e077c9e423da4d Mon Sep 17 00:00:00 2001 From: rikkertkoppes Date: Wed, 20 Mar 2013 12:59:59 +0100 Subject: [PATCH 2/9] added `direct` attribute as an addition to `multiple` to prevent the need for pressing a modifier key for multiple select --- angular.tree.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/angular.tree.js b/angular.tree.js index 47470be..fb78084 100644 --- a/angular.tree.js +++ b/angular.tree.js @@ -111,6 +111,7 @@ var tree = { multiple: 'multiple' in attributes, + direct: 'direct' in attributes, rootElem: treeElem, treeModelExpr: treeModelExpr, itemTemplate: $compile(itemTemplate), @@ -146,7 +147,7 @@ var selectedItemElem = findParentListItem(evt.target); var selectedItemScope = selectedItemElem ? selectedItemElem.scope() : null; - if (evt[multiSelectKey] && tree.multiple) { + if ((evt[multiSelectKey] || tree.direct) && tree.multiple) { if (selectedItemScope) { selectedItemScope.$apply(function () { tree.selected(selectedItemScope, ! selectedItemScope.$selected); From 4fc633ed28fbfda19a06bbfc94e7c4eb69172952 Mon Sep 17 00:00:00 2001 From: rikkertkoppes Date: Wed, 20 Mar 2013 13:24:17 +0100 Subject: [PATCH 3/9] use parse to call the event handler, $scope is passed as a local variable that can be used as an argument use selected($scope) to be able to pass scope as argument. It is still available as the function scope (this) --- angular.tree.js | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/angular.tree.js b/angular.tree.js index fb78084..48424ac 100644 --- a/angular.tree.js +++ b/angular.tree.js @@ -87,7 +87,7 @@ }); } - function initTree (treeElem, attributes, $compile, $document) { + function initTree (treeElem, attributes, $compile, $document, $parse) { var itemTemplate = getItemTemplate($document[0], treeElem[0]); var treeModelExpr = attributes.src || attributes.ngTree; var eachIter = itemTemplate[0].getAttribute('each'); @@ -136,7 +136,10 @@ scope.$selected = value; if (selectExpr) { - scope.$eval(selectExpr); + var f = $parse(selectExpr); + f(scope, { + '$scope': scope + }); } } } @@ -249,10 +252,10 @@ } angular.module('angularTree', []). - directive('ngTree', ['$compile', '$document', function ($compile, $document) { + directive('ngTree', ['$compile', '$document', '$parse', function ($compile, $document, $parse) { return { compile: function (elem, attrs) { - var tree = initTree(elem, attrs, $compile, $document); + var tree = initTree(elem, attrs, $compile, $document, $parse); return function (scope, elem, attrs) { loadTree(scope, tree, elem, tree.treeModelWatch); From e2edd7314267a3e849f80d5c5a671eedb6673609 Mon Sep 17 00:00:00 2001 From: rikkertkoppes Date: Wed, 20 Mar 2013 13:41:34 +0100 Subject: [PATCH 4/9] send event along as local variable to the selected handler --- angular.tree.js | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/angular.tree.js b/angular.tree.js index 48424ac..93a03db 100644 --- a/angular.tree.js +++ b/angular.tree.js @@ -131,14 +131,15 @@ trackSelection: !!selectExpr, - selected: function (scope, value) { + selected: function (scope, value, evt) { if (this.trackSelection) { scope.$selected = value; if (selectExpr) { var f = $parse(selectExpr); f(scope, { - '$scope': scope + '$scope': scope, + '$event': evt }); } } @@ -153,7 +154,7 @@ if ((evt[multiSelectKey] || tree.direct) && tree.multiple) { if (selectedItemScope) { selectedItemScope.$apply(function () { - tree.selected(selectedItemScope, ! selectedItemScope.$selected); + tree.selected(selectedItemScope, ! selectedItemScope.$selected, evt); }); } } else { @@ -163,7 +164,7 @@ if (itemScope.$selected) { itemScope.$apply(function () { - tree.selected(itemScope, false); + tree.selected(itemScope, false, evt); }); } } @@ -171,7 +172,7 @@ if (selectedItemScope && ! selectedItemScope.$selected) { selectedItemScope.$apply(function () { - tree.selected(selectedItemScope, true); + tree.selected(selectedItemScope, true, evt); }); } } From a95b96c9576f34f20146c04a3e90c83dc2e22358 Mon Sep 17 00:00:00 2001 From: rikkertkoppes Date: Wed, 20 Mar 2013 13:54:41 +0100 Subject: [PATCH 5/9] do not allow $scope as local variable to the listener, only $event, to mimic ng-cklick and friends --- angular.tree.js | 1 - 1 file changed, 1 deletion(-) diff --git a/angular.tree.js b/angular.tree.js index 93a03db..52933f0 100644 --- a/angular.tree.js +++ b/angular.tree.js @@ -138,7 +138,6 @@ if (selectExpr) { var f = $parse(selectExpr); f(scope, { - '$scope': scope, '$event': evt }); } From d5a9e9c4ce645eb91438a1c62a5252938178c1d8 Mon Sep 17 00:00:00 2001 From: rikkertkoppes Date: Wed, 20 Mar 2013 15:34:32 +0100 Subject: [PATCH 6/9] refactored getting and setting $selected property of a scope --- angular.tree.js | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/angular.tree.js b/angular.tree.js index 52933f0..1af5c38 100644 --- a/angular.tree.js +++ b/angular.tree.js @@ -87,6 +87,14 @@ }); } + function selectedProperty(scope,sel) { + if (arguments.length > 1) { + scope.$selected = sel; + } else { + return scope.$selected; + } + } + function initTree (treeElem, attributes, $compile, $document, $parse) { var itemTemplate = getItemTemplate($document[0], treeElem[0]); var treeModelExpr = attributes.src || attributes.ngTree; @@ -133,7 +141,7 @@ selected: function (scope, value, evt) { if (this.trackSelection) { - scope.$selected = value; + selectedProperty(scope,value); if (selectExpr) { var f = $parse(selectExpr); @@ -153,7 +161,7 @@ if ((evt[multiSelectKey] || tree.direct) && tree.multiple) { if (selectedItemScope) { selectedItemScope.$apply(function () { - tree.selected(selectedItemScope, ! selectedItemScope.$selected, evt); + tree.selected(selectedItemScope, ! selectedProperty(selectedItemScope), evt); }); } } else { @@ -161,7 +169,7 @@ if (! selectedItemElem || itemElem[0] !== selectedItemElem[0]) { var itemScope = itemElem.scope(); - if (itemScope.$selected) { + if (selectedProperty(itemScope)) { itemScope.$apply(function () { tree.selected(itemScope, false, evt); }); @@ -169,7 +177,7 @@ } }); - if (selectedItemScope && ! selectedItemScope.$selected) { + if (selectedItemScope && ! selectedProperty(selectedItemScope)) { selectedItemScope.$apply(function () { tree.selected(selectedItemScope, true, evt); }); @@ -188,7 +196,7 @@ var itemElem = tree.itemTemplate(itemScope, angular.noop); if (tree.trackSelection) { - itemScope.$selected = false; + selectedProperty(itemScope,false); } insertListItem(listElem, itemElem, index); @@ -242,7 +250,7 @@ while (listElem.children().length > newList.length) { var removeElem = listElem.children().eq(newList.length); - if (removeElem.scope().$selected) { + if (selectedProperty(removeElem.scope())) { tree.selected(removeElem.scope(), false); } From 2b2c51ade9318d20bb1fb59c2f66c1e60e491091 Mon Sep 17 00:00:00 2001 From: rikkertkoppes Date: Wed, 20 Mar 2013 15:52:04 +0100 Subject: [PATCH 7/9] moved selectProperty method to tree --- angular.tree.js | 28 ++++++++++++++-------------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/angular.tree.js b/angular.tree.js index 1af5c38..df95523 100644 --- a/angular.tree.js +++ b/angular.tree.js @@ -87,14 +87,6 @@ }); } - function selectedProperty(scope,sel) { - if (arguments.length > 1) { - scope.$selected = sel; - } else { - return scope.$selected; - } - } - function initTree (treeElem, attributes, $compile, $document, $parse) { var itemTemplate = getItemTemplate($document[0], treeElem[0]); var treeModelExpr = attributes.src || attributes.ngTree; @@ -141,7 +133,7 @@ selected: function (scope, value, evt) { if (this.trackSelection) { - selectedProperty(scope,value); + this.selectedProperty(scope,value); if (selectExpr) { var f = $parse(selectExpr); @@ -150,6 +142,14 @@ }); } } + }, + + selectedProperty: function(scope,value) { + if (arguments.length > 1) { + scope.$selected = value; + } else { + return scope.$selected; + } } }; @@ -161,7 +161,7 @@ if ((evt[multiSelectKey] || tree.direct) && tree.multiple) { if (selectedItemScope) { selectedItemScope.$apply(function () { - tree.selected(selectedItemScope, ! selectedProperty(selectedItemScope), evt); + tree.selected(selectedItemScope, ! tree.selectedProperty(selectedItemScope), evt); }); } } else { @@ -169,7 +169,7 @@ if (! selectedItemElem || itemElem[0] !== selectedItemElem[0]) { var itemScope = itemElem.scope(); - if (selectedProperty(itemScope)) { + if (tree.selectedProperty(itemScope)) { itemScope.$apply(function () { tree.selected(itemScope, false, evt); }); @@ -177,7 +177,7 @@ } }); - if (selectedItemScope && ! selectedProperty(selectedItemScope)) { + if (selectedItemScope && ! tree.selectedProperty(selectedItemScope)) { selectedItemScope.$apply(function () { tree.selected(selectedItemScope, true, evt); }); @@ -196,7 +196,7 @@ var itemElem = tree.itemTemplate(itemScope, angular.noop); if (tree.trackSelection) { - selectedProperty(itemScope,false); + tree.selectedProperty(itemScope,false); } insertListItem(listElem, itemElem, index); @@ -250,7 +250,7 @@ while (listElem.children().length > newList.length) { var removeElem = listElem.children().eq(newList.length); - if (selectedProperty(removeElem.scope())) { + if (tree.selectedProperty(removeElem.scope())) { tree.selected(removeElem.scope(), false); } From 1928c80923a66ba75f29939e0b961b699f390a64 Mon Sep 17 00:00:00 2001 From: rikkertkoppes Date: Wed, 20 Mar 2013 16:07:14 +0100 Subject: [PATCH 8/9] use $parse to get and set the $selection property on the scope --- angular.tree.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/angular.tree.js b/angular.tree.js index df95523..3f9cb66 100644 --- a/angular.tree.js +++ b/angular.tree.js @@ -145,10 +145,11 @@ }, selectedProperty: function(scope,value) { + var expr = '$selected'; if (arguments.length > 1) { - scope.$selected = value; + $parse(expr).assign(scope,value); } else { - return scope.$selected; + return $parse(expr)(scope); } } }; From 4c7b722d8124c12b1b60a3f360da233c8e204cb5 Mon Sep 17 00:00:00 2001 From: rikkertkoppes Date: Wed, 20 Mar 2013 16:22:12 +0100 Subject: [PATCH 9/9] use the expression on the `selected` attribute of the list item template, or `$selected` as default property --- angular.tree.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/angular.tree.js b/angular.tree.js index 3f9cb66..9a842a5 100644 --- a/angular.tree.js +++ b/angular.tree.js @@ -94,7 +94,7 @@ var contextName = 'item'; var collectionExpr = 'item.children'; var selectExpr = itemTemplate.attr('select'); - var selectedName = itemTemplate.attr('selected'); + var selectedExpr = itemTemplate[0].getAttribute('selected')||'$selected'; if (eachIter) { var match = /^\s*(\w+)\s+in\s+(.*?)\s*$/.exec(eachIter); @@ -145,11 +145,10 @@ }, selectedProperty: function(scope,value) { - var expr = '$selected'; if (arguments.length > 1) { - $parse(expr).assign(scope,value); + $parse(selectedExpr).assign(scope,value); } else { - return $parse(expr)(scope); + return $parse(selectedExpr)(scope); } } };