From f13427f5fb7350ea0fac72b60b490b57fda48216 Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Wed, 8 Feb 2017 22:49:16 +0100 Subject: [PATCH] fixes to breadcrumb --- .../components/umbminilistview.directive.js | 59 ++++++++++--------- .../less/components/umb-mini-list-view.less | 9 ++- .../treepicker/treepicker.controller.js | 4 ++ .../overlays/treepicker/treepicker.html | 3 +- .../views/components/umb-mini-list-view.html | 22 ++++--- 5 files changed, 59 insertions(+), 38 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbminilistview.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbminilistview.directive.js index 8e5fa8cee2..1ef7452848 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbminilistview.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbminilistview.directive.js @@ -1,7 +1,7 @@ (function () { 'use strict'; - function MiniListViewDirective(contentResource, memberResource, mediaResource, entityResource) { + function MiniListViewDirective(contentResource, memberResource, mediaResource) { function link(scope, el, attr, ctrl) { @@ -43,8 +43,7 @@ // get children getChildrenForMiniListView(miniListView); - // get ancestors - getAncestors(node); + makeBreadcrumb(); } @@ -102,12 +101,15 @@ goingForward = false; angular.forEach(miniListViewsHistory, function(historyItem, index){ - if(Number(historyItem.node.id) === Number(ancestor.id)) { + // We need to make sure we can compare the two id's. + // Some id's are numbers (1) and others are string numbers. + // Members have string ids like "all-members". + if(historyItem.node.id.toString() === ancestor.id.toString()) { // load the list view from history scope.miniListViews = []; scope.miniListViews.push(historyItem); - // get ancestors - getAncestors(historyItem.node); + // clean up history - remove all children after + miniListViewsHistory.splice(index + 1, miniListViewsHistory.length); found = true; } }); @@ -118,30 +120,32 @@ scope.miniListViews = []; } + makeBreadcrumb(); + }; - function getAncestors(node) { - entityResource.getAncestors(node.id, scope.entityType) - .then(function (ancestors) { + scope.showBackButton = function() { + // don't show the back button if the start node is a list view + if(scope.node.metaData && scope.node.metaData.IsContainer || scope.node.isContainer) { + return false; + } else { + return true; + } + }; - // if there is a start node remove all ancestors before that one - if(scope.startNodeId && scope.startNodeId !== -1) { - var found = false; - scope.breadcrumb = []; - angular.forEach(ancestors, function(ancestor){ - if(Number(ancestor.id) === Number(scope.startNodeId)) { - found = true; - } - if(found) { - scope.breadcrumb.push(ancestor); - } - }); + scope.exitMiniListView = function() { + miniListViewsHistory = []; + scope.miniListViews = []; + if(scope.onClose) { + scope.onClose(); + } + }; - } else { - scope.breadcrumb = ancestors; - } - - }); + function makeBreadcrumb() { + scope.breadcrumb = []; + angular.forEach(miniListViewsHistory, function(historyItem){ + scope.breadcrumb.push(historyItem.node); + }); } /* Search */ @@ -180,7 +184,8 @@ node: "=", entityType: "@", startNodeId: "=", - onSelect: "&" + onSelect: "&", + onClose: "&" }, link: link }; diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-list-view.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-list-view.less index 92871abd34..c32aee2de1 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-list-view.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-list-view.less @@ -14,10 +14,13 @@ } .umb-mini-list-view__back { - font-size: 12px; + font-size: 11px; margin-right: 5px; - color: @grayMed; - display: block; + color: @gray; +} + +.umb-mini-list-view__back-text { + text-decoration: underline; } .umb-mini-list-view__back:hover { diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.controller.js index baf775d4d9..1caff3ab31 100644 --- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.controller.js @@ -472,6 +472,10 @@ angular.module("umbraco").controller("Umbraco.Overlays.TreePickerController", node.selected = node.selected === true ? false : true; }; + $scope.closeMiniListView = function() { + $scope.miniListView = undefined; + }; + function openMiniListView(node) { $scope.miniListView = node; } diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.html b/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.html index f89ff9faf8..c9785ed9e1 100644 --- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.html +++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.html @@ -42,7 +42,8 @@ node="miniListView" entity-type="{{entityType}}" start-node-id="model.startNodeId" - on-select="selectListViewNode(node)"> + on-select="selectListViewNode(node)" + on-close="closeMiniListView()"> \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-mini-list-view.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-mini-list-view.html index b08bd13952..27c33ee9a3 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/umb-mini-list-view.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-mini-list-view.html @@ -7,13 +7,21 @@

{{ miniListView.node.name }}

- - +
+ + + + Back / + + + + + +