From 10b58fbd29817713a6db2ccc06bf67a7bcd3bf79 Mon Sep 17 00:00:00 2001
From: perploug <pph@umbraco.dk>
Date: Fri, 27 Sep 2013 11:22:26 +0200
Subject: [PATCH] Adds drag drop to media dashboard

---
 .../dashboard/dashboard.tabs.controller.js    | 57 ++++++++++++++++++-
 .../dashboard/media/mediafolderbrowser.html   | 21 ++++++-
 2 files changed, 73 insertions(+), 5 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/dashboard/dashboard.tabs.controller.js b/src/Umbraco.Web.UI.Client/src/views/dashboard/dashboard.tabs.controller.js
index 74149da018..3983777263 100644
--- a/src/Umbraco.Web.UI.Client/src/views/dashboard/dashboard.tabs.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/dashboard/dashboard.tabs.controller.js
@@ -21,8 +21,61 @@ function startupLatestEditsController($scope) {
 }
 angular.module("umbraco").controller("Umbraco.Dashboard.StartupLatestEditsController", startupLatestEditsController);
 
-function MediaFolderBrowserDashboardController($scope) {
-    
+function MediaFolderBrowserDashboardController($rootScope, $scope, assetsService, $routeParams, $timeout, $element, $location, umbRequestHelper, mediaResource, imageHelper) {
+        var dialogOptions = $scope.$parent.dialogOptions;
+
+        $scope.filesUploading = [];
+        $scope.options = {
+            url: umbRequestHelper.getApiUrl("mediaApiBaseUrl", "PostAddFile"),
+            autoUpload: true,
+            disableImageResize: /Android(?!.*Chrome)|Opera/
+            .test(window.navigator.userAgent),
+            previewMaxWidth: 200,
+            previewMaxHeight: 200,
+            previewCrop: true,
+            formData:{
+                currentFolder: -1
+            }
+        };
+
+
+        $scope.loadChildren = function(){
+            mediaResource.getChildren(-1)
+                .then(function(data) {
+                    $scope.images = data.items;
+                });    
+        };
+
+        $scope.$on('fileuploadstop', function(event, files){
+            $scope.loadChildren($scope.options.formData.currentFolder);
+            $scope.queue = [];
+            $scope.filesUploading = [];
+        });
+
+        $scope.$on('fileuploadprocessalways', function(e,data) {
+            var i;
+            $scope.$apply(function() {
+                $scope.filesUploading.push(data.files[data.index]);
+            });
+        });
+
+        // All these sit-ups are to add dropzone area and make sure it gets removed if dragging is aborted! 
+        $scope.$on('fileuploaddragover', function(event, files) {
+            if (!$scope.dragClearTimeout) {
+                $scope.$apply(function() {
+                    $scope.dropping = true;
+                });
+            } else {
+                $timeout.cancel($scope.dragClearTimeout);
+            }
+            $scope.dragClearTimeout = $timeout(function () {
+                $scope.dropping = null;
+                $scope.dragClearTimeout = null;
+            }, 300);
+        });
+        
+        //init load
+        $scope.loadChildren();
 }
 angular.module("umbraco").controller("Umbraco.Dashboard.MediaFolderBrowserDashboardController", MediaFolderBrowserDashboardController);
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/dashboard/media/mediafolderbrowser.html b/src/Umbraco.Web.UI.Client/src/views/dashboard/media/mediafolderbrowser.html
index c4664280b0..f4e4499ae9 100644
--- a/src/Umbraco.Web.UI.Client/src/views/dashboard/media/mediafolderbrowser.html
+++ b/src/Umbraco.Web.UI.Client/src/views/dashboard/media/mediafolderbrowser.html
@@ -1,3 +1,18 @@
-<div class="" ng-controller="Umbraco.Dashboard.MediaFolderBrowserDashboardController">
-	
-</div>
\ No newline at end of file
+<form ng-controller="Umbraco.Dashboard.MediaFolderBrowserDashboardController" id="fileupload" 
+style="width: 100%" 
+method="POST" enctype="multipart/form-data"
+class="umb-editor umb-folderbrowser" 
+data-file-upload="options" 
+data-file-upload-progress="" 
+data-ng-class="{'fileupload-processing': processing() || loadingFiles}">
+        
+        <umb-upload-dropzone dropping="dropping" files="filesUploading">
+        </umb-upload-dropzone>
+        
+        <umb-photo-folder 
+            min-height="220" 
+            min-width="220"
+            on-click="clickHandler"
+            ng-model="images"
+        />
+</form>
\ No newline at end of file