From 22f0641c54e0d9ec87f7e68933b1e5625ce56ebd Mon Sep 17 00:00:00 2001
From: Mads Rasmussen <mads@umbraco.com>
Date: Wed, 22 Mar 2017 11:58:11 +0100
Subject: [PATCH] implement mini list view for url picker

---
 .../linkpicker/linkpicker.controller.js       | 98 +++++++++----------
 .../overlays/linkpicker/linkpicker.html       | 57 ++++++-----
 2 files changed, 78 insertions(+), 77 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/linkpicker/linkpicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/overlays/linkpicker/linkpicker.controller.js
index e2f95b0478..fde3e4cab3 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/linkpicker/linkpicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/linkpicker/linkpicker.controller.js
@@ -47,69 +47,44 @@ angular.module("umbraco").controller("Umbraco.Overlays.LinkPickerController",
 	    }
 
 	    function nodeSelectHandler(ev, args) {
-	        args.event.preventDefault();
-	        args.event.stopPropagation();
 
-	        if (args.node.metaData.listViewNode) {
-	            //check if list view 'search' node was selected
+			if(args && args.event) {
+				args.event.preventDefault();
+				args.event.stopPropagation();
+			}
 
-	            $scope.searchInfo.showSearch = true;
-	            $scope.searchInfo.searchFromId = args.node.metaData.listViewNode.id;
-	            $scope.searchInfo.searchFromName = args.node.metaData.listViewNode.name;
-	        }
-	        else {
-	            eventsService.emit("dialogs.linkPicker.select", args);
+			eventsService.emit("dialogs.linkPicker.select", args);
 
-	            if ($scope.currentNode) {
-	                //un-select if there's a current one selected
-	                $scope.currentNode.selected = false;
-	            }
+			if ($scope.currentNode) {
+				//un-select if there's a current one selected
+				$scope.currentNode.selected = false;
+			}
 
-	            $scope.currentNode = args.node;
-	            $scope.currentNode.selected = true;
-                $scope.model.target.id = args.node.id;
-                $scope.model.target.udi = args.node.udi;
-	            $scope.model.target.name = args.node.name;
+			$scope.currentNode = args.node;
+			$scope.currentNode.selected = true;
+			$scope.model.target.id = args.node.id;
+			$scope.model.target.udi = args.node.udi;
+			$scope.model.target.name = args.node.name;
 
-	            if (args.node.id < 0) {
-	                $scope.model.target.url = "/";
-	            }
-	            else {
-	                contentResource.getNiceUrl(args.node.id).then(function (url) {
-	                    $scope.model.target.url = url;
-	                });
-	            }
+			if (args.node.id < 0) {
+				$scope.model.target.url = "/";
+			}
+			else {
+				contentResource.getNiceUrl(args.node.id).then(function (url) {
+					$scope.model.target.url = url;
+				});
+			}
 
-	            if (!angular.isUndefined($scope.model.target.isMedia)) {
-	                delete $scope.model.target.isMedia;
-	            }
-	        }
+			if (!angular.isUndefined($scope.model.target.isMedia)) {
+				delete $scope.model.target.isMedia;
+			}
 	    }
 
 	    function nodeExpandedHandler(ev, args) {
-	        if (angular.isArray(args.children)) {
-
-	            //iterate children
-	            _.each(args.children, function (child) {
-	                //check if any of the items are list views, if so we need to add a custom
-	                // child: A node to activate the search
-	                if (child.metaData.isContainer) {
-	                    child.hasChildren = true;
-	                    child.children = [
-	                        {
-	                            level: child.level + 1,
-	                            hasChildren: false,
-	                            name: searchText,
-	                            metaData: {
-	                                listViewNode: child,
-	                            },
-	                            cssClass: "icon umb-tree-icon sprTree icon-search",
-	                            cssClasses: ["not-published"]
-	                        }
-	                    ];
-	                }
-	            });
-	        }
+			// open mini list view for list views
+			if (args.node.metaData.isContainer) {
+				openMiniListView(args.node);
+			}
 	    }
 
 	    $scope.switchToMediaPicker = function () {
@@ -160,4 +135,19 @@ angular.module("umbraco").controller("Umbraco.Overlays.LinkPickerController",
 	        $scope.dialogTreeEventHandler.unbind("treeNodeSelect", nodeSelectHandler);
 	        $scope.dialogTreeEventHandler.unbind("treeNodeExpanded", nodeExpandedHandler);
 	    });
+
+		// Mini list view
+		$scope.selectListViewNode = function (node) {
+			node.selected = node.selected === true ? false : true;
+			nodeSelectHandler({}, { node: node });
+		};
+
+		$scope.closeMiniListView = function () {
+			$scope.miniListView = undefined;
+		};
+
+		function openMiniListView(node) {
+			$scope.miniListView = node;
+		}
+
 	});
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/linkpicker/linkpicker.html b/src/Umbraco.Web.UI.Client/src/views/common/overlays/linkpicker/linkpicker.html
index e063b7bab3..3e40c79b7d 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/linkpicker/linkpicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/linkpicker/linkpicker.html
@@ -28,34 +28,45 @@
             <localize key="defaultdialogs_linkToPage">Link to page</localize>
         </h5>
 
-        <umb-tree-search-box
-            hide-search-callback="hideSearch"
-            search-callback="onSearchResults"
-            search-from-id="{{searchInfo.searchFromId}}"
-            search-from-name="{{searchInfo.searchFromName}}"
-            show-search="{{searchInfo.showSearch}}"
-            section="{{section}}">
-        </umb-tree-search-box>
+        <div ng-hide="miniListView">
+            <umb-tree-search-box
+                hide-search-callback="hideSearch"
+                search-callback="onSearchResults"
+                search-from-id="{{searchInfo.searchFromId}}"
+                search-from-name="{{searchInfo.searchFromName}}"
+                show-search="{{searchInfo.showSearch}}"
+                section="{{section}}">
+            </umb-tree-search-box>
 
-        <br/>
+            <br/>
 
-        <umb-tree-search-results
-            ng-if="searchInfo.showSearch"
-            results="searchInfo.results"
-            select-result-callback="selectResult">
-        </umb-tree-search-results>
+            <umb-tree-search-results
+                ng-if="searchInfo.showSearch"
+                results="searchInfo.results"
+                select-result-callback="selectResult">
+            </umb-tree-search-results>
 
-        <div ng-hide="searchInfo.showSearch">
-            <umb-tree
-                section="content"
-                hideheader="true"
-                hideoptions="true"
-                eventhandler="dialogTreeEventHandler"
-                isdialog="true"
-                enablecheckboxes="true">
-            </umb-tree>
+            <div ng-hide="searchInfo.showSearch">
+                <umb-tree
+                    section="content"
+                    hideheader="true"
+                    hideoptions="true"
+                    eventhandler="dialogTreeEventHandler"
+                    enablelistviewexpand="true"
+                    isdialog="true"
+                    enablecheckboxes="true">
+                </umb-tree>
+            </div>
         </div>
 
+        <umb-mini-list-view
+            ng-if="miniListView"
+            node="miniListView"
+            entity-type="Document"
+            on-select="selectListViewNode(node)"
+            on-close="closeMiniListView()">
+        </umb-mini-list-view>
+
     </div>
 
     <div class="umb-control-group">