From 801e2dea7b378fbd2576887a9c4bf87ff795616c Mon Sep 17 00:00:00 2001 From: Shannon Date: Tue, 6 Aug 2013 13:24:49 +1000 Subject: [PATCH] Removes tree icon filters and just ensures the data is formatted on retrieval, this is much better for performance and just makes a lot more sense. --- .../directives/umbtreeitem.directive.js | 2 +- .../common/filters/treeiconclass.filter.js | 15 --------- .../common/filters/treeiconstyle.filter.js | 19 ------------ .../src/common/services/tree.service.js | 31 +++++++++++++++---- 4 files changed, 26 insertions(+), 41 deletions(-) delete mode 100644 src/Umbraco.Web.UI.Client/src/common/filters/treeiconclass.filter.js delete mode 100644 src/Umbraco.Web.UI.Client/src/common/filters/treeiconstyle.filter.js diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js index 82966ace97..68d26dd316 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js @@ -33,7 +33,7 @@ angular.module("umbraco.directives") template: '
  • ' + '' + '' + - '' + + '' + '{{node.name}}' + '' + '
    ' + diff --git a/src/Umbraco.Web.UI.Client/src/common/filters/treeiconclass.filter.js b/src/Umbraco.Web.UI.Client/src/common/filters/treeiconclass.filter.js deleted file mode 100644 index 9fb1437b64..0000000000 --- a/src/Umbraco.Web.UI.Client/src/common/filters/treeiconclass.filter.js +++ /dev/null @@ -1,15 +0,0 @@ -/** -* @ngdoc filter -* @name umbraco.filters.filter:umbTreeIconClass -* @description This will properly render the tree icon class based on the tree icon set on the server -**/ -function treeIconClassFilter(iconHelper) { - return function (treeNode, standardClasses) { - if (treeNode.iconIsClass !== false) { - return standardClasses + " " + iconHelper.convertFromLegacyTreeNodeIcon(treeNode); - } - //we need an 'icon-' class in there for certain styles to work so if it is image based we'll add this - return standardClasses + " icon-custom-file"; - }; -} -angular.module('umbraco.filters').filter("umbTreeIconClass", treeIconClassFilter); diff --git a/src/Umbraco.Web.UI.Client/src/common/filters/treeiconstyle.filter.js b/src/Umbraco.Web.UI.Client/src/common/filters/treeiconstyle.filter.js deleted file mode 100644 index 568fc02f4c..0000000000 --- a/src/Umbraco.Web.UI.Client/src/common/filters/treeiconstyle.filter.js +++ /dev/null @@ -1,19 +0,0 @@ -/** -* @ngdoc filter -* @name umbraco.filters.filter:umbTreeIconImage -* @description This will properly render the tree icon image based on the tree icon set on the server -**/ -function treeIconStyleFilter(iconHelper) { - return function (treeNode) { - if (treeNode.iconIsClass) { - var converted = iconHelper.convertFromLegacyTreeNodeIcon(treeNode); - if (converted.startsWith('.')) { - //its legacy so add some width/height - return "height:16px;width:16px;"; - } - return ""; - } - return "background-image: url('" + treeNode.iconFilePath + "');height:16px; background-position:2px 0px; background-repeat: no-repeat"; - }; -} -angular.module('umbraco.filters').filter("umbTreeIconStyle", treeIconStyleFilter); \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/common/services/tree.service.js b/src/Umbraco.Web.UI.Client/src/common/services/tree.service.js index 5e2286536b..4365bc017a 100644 --- a/src/Umbraco.Web.UI.Client/src/common/services/tree.service.js +++ b/src/Umbraco.Web.UI.Client/src/common/services/tree.service.js @@ -10,10 +10,11 @@ function treeService($q, treeResource, iconHelper, notificationsService, $rootScope) { //implement this in local storage var treeArray = []; - var currentSection = "content"; + var standardCssClass = 'icon umb-tree-icon sprTree'; - /** ensures there's a routePath, parent and level property on each tree node */ - function ensureParentLevelAndView(parentNode, treeNodes, section, level) { + /** ensures there's a routePath, parent and level property on each tree node and + adds some icon specific properties so that the nodes display properly */ + function formatNodeDataForUseInUI(parentNode, treeNodes, section, level) { //if no level is set, then we make it 1 var childLevel = (level ? level : 1); for (var i = 0; i < treeNodes.length; i++) { @@ -23,6 +24,24 @@ function treeService($q, treeResource, iconHelper, notificationsService, $rootSc treeNodes[i].routePath = section + "/edit/" + treeNodes[i].id; } treeNodes[i].parent = parentNode; + + //now, format the icon data + if (treeNodes[i].iconIsClass) { + var converted = iconHelper.convertFromLegacyTreeNodeIcon(treeNodes[i]); + treeNodes[i].cssClass = standardCssClass + " " + converted; + if (converted.startsWith('.')) { + //its legacy so add some width/height + treeNodes[i].style = "height:16px;width:16px;"; + } + else { + treeNodes[i].style = ""; + } + } + else { + treeNodes[i].style = "background-image: url('" + treeNodes[i].iconFilePath + "');height:16px; background-position:2px 0px; background-repeat: no-repeat"; + //we need an 'icon-' class in there for certain styles to work so if it is image based we'll add this + treeNodes[i].cssClass = standardCssClass + " icon-custom-file"; + } } } @@ -166,8 +185,8 @@ function treeService($q, treeResource, iconHelper, notificationsService, $rootSc alias: section, root: data }; - //ensure the view is added to each tree node - ensureParentLevelAndView(result.root, result.root.children, section); + //we need to format/modify some of the node data to be used in our app. + formatNodeDataForUseInUI(result.root, result.root.children, section); //cache this result //TODO: We'll need to un-cache this in many circumstances treeArray[cacheKey] = result; @@ -251,7 +270,7 @@ function treeService($q, treeResource, iconHelper, notificationsService, $rootSc return treeResource.loadNodes({ section: section, node: treeItem }) .then(function(data) { //now that we have the data, we need to add the level property to each item and the view - ensureParentLevelAndView(treeItem, data, section, treeItem.level + 1); + formatNodeDataForUseInUI(treeItem, data, section, treeItem.level + 1); return data; }); }