implement mini list view for media copy

src/Umbraco.Web.UI.Client/src/views/media/media.move.controller.js

@@ -7,8 +7,11 @@ angular.module("umbraco").controller("Umbraco.Editors.Media.MoveController",
 	    var node = dialogOptions.currentNode;
 
 	    function nodeSelectHandler(ev, args) {
-	        args.event.preventDefault();
-	        args.event.stopPropagation();
+
+			if(args && args.event) {
+				args.event.preventDefault();
+				args.event.stopPropagation();
+			}
 
 	        eventsService.emit("editors.media.moveController.select", args);
 
@@ -21,8 +24,15 @@ angular.module("umbraco").controller("Umbraco.Editors.Media.MoveController",
 	        $scope.target.selected = true;
 	    }
 
-	    $scope.dialogTreeEventHandler.bind("treeNodeSelect", nodeSelectHandler);
+		function nodeExpandedHandler(ev, args) {
+			// open mini list view for list views
+        	if (args.node.metaData.isContainer) {
+				openMiniListView(args.node);
+			}
+	    }
 
+	    $scope.dialogTreeEventHandler.bind("treeNodeSelect", nodeSelectHandler);
+	    $scope.dialogTreeEventHandler.bind("treeNodeExpanded", nodeExpandedHandler);
 
 	    $scope.move = function () {
 	        mediaResource.move({ parentId: $scope.target.id, id: node.id })
@@ -55,5 +65,21 @@ angular.module("umbraco").controller("Umbraco.Editors.Media.MoveController",
 
 	    $scope.$on('$destroy', function () {
 	        $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;
+		}
+
 	});

src/Umbraco.Web.UI.Client/src/views/media/move.html

@@ -21,13 +21,27 @@
 		</div>
 
 		<div ng-hide="success">
-            <umb-tree section="media"
-                      hideheader="false"
-                      hideoptions="true"
-                      isdialog="true"
-                      eventhandler="dialogTreeEventHandler"
-                      enablecheckboxes="true">
-            </umb-tree>
+            
+			<div ng-hide="miniListView">
+				<umb-tree
+					section="media"
+					hideheader="false"
+					hideoptions="true"
+					isdialog="true"
+					eventhandler="dialogTreeEventHandler"
+					enablelistviewexpand="true"
+					enablecheckboxes="true">
+				</umb-tree>
+			</div>
+
+			<umb-mini-list-view
+				ng-if="miniListView"
+				node="miniListView"
+				entity-type="Media"
+				on-select="selectListViewNode(node)"
+				on-close="closeMiniListView()">
+			</umb-mini-list-view>
+
 		</div>
 	</div>
 </div>