From bade8e42ba45aae0c557259686ebf8547ab9d4a5 Mon Sep 17 00:00:00 2001
From: Claus <claus@umbraco.com>
Date: Thu, 12 Nov 2015 15:12:59 +0100
Subject: [PATCH] Fixes to media picker when creating new folders.

Changed to ngShow to ensure input field hides when blur event is hit.
Clearing and switching visibility of input field on successful submit.
Fixed up focus directive to use $timeout. The focus event can trigger before the element is rendered by angular so its safer to have a timeout ensure it is done at the end of the digest cycle - using $timeout instead of setTimeout ensures it is handled by angular at the right time.
---
 .../src/common/directives/util.directive.js                | 2 +-
 .../src/common/directives/util/focuswhen.directive.js      | 4 +++-
 .../src/views/common/dialogs/mediapicker.controller.js     | 7 ++++---
 .../src/views/common/dialogs/mediapicker.html              | 2 +-
 4 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/util.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/util.directive.js
index ebc4bcea7e..b1842b852a 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/util.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/util.directive.js
@@ -1,5 +1,5 @@
 /**
-* @description Utillity directives for key and field events
+* @description Utility directives for key and field events
 **/
 angular.module('umbraco.directives')
 
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/util/focuswhen.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/util/focuswhen.directive.js
index 7422dcfc35..88a0c0cbc1 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/util/focuswhen.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/util/focuswhen.directive.js
@@ -4,7 +4,9 @@ angular.module("umbraco.directives").directive('focusWhen', function ($timeout)
         link: function (scope, elm, attrs, ctrl) {
             attrs.$observe("focusWhen", function (newValue) {
                 if (newValue === "true") {
-                    elm.focus();
+                    $timeout(function() {
+                        elm.focus();
+                    });
                 }
             });
         }
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.controller.js
index 6e44c0465d..3ab4679731 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.controller.js
@@ -34,11 +34,12 @@ angular.module("umbraco")
             $scope.submitFolder = function(e) {
                 if (e.keyCode === 13) {
                     e.preventDefault();
-                    $scope.showFolderInput = false;
-
+                    
                     mediaResource
                         .addFolder($scope.newFolderName, $scope.options.formData.currentFolder)
                         .then(function(data) {
+                            $scope.showFolderInput = false;
+                            $scope.newFolderName = "";
 
                             //we've added a new folder so lets clear the tree cache for that specific item
                             treeService.clearCache({
@@ -80,7 +81,7 @@ angular.module("umbraco")
                 $scope.options.formData.currentFolder = folder.id;
                 $scope.currentFolder = folder;      
             };
-
+            
             //This executes prior to the whole processing which we can use to get the UI going faster,
             //this also gives us the start callback to invoke to kick of the whole thing
             $scope.$on('fileuploadadd', function (e, data) {
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html
index 8ea8390154..480edc4181 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html
@@ -100,7 +100,7 @@
 
                         <input type="text"
                                class="input-foldername input-mini inline"
-                               ng-if="showFolderInput"
+                               ng-show="showFolderInput"
                                ng-model="newFolderName"
                                ng-keydown="submitFolder($event)"
                                on-blur="showFolderInput = false"