add client side logic for scripts folder creation

src/Umbraco.Web.UI.Client/src/common/resources/codefile.resource.js

@@ -205,6 +205,38 @@ function codefileResource($q, $http, umbDataFormatter, umbRequestHelper) {
                          "codeFileApiBaseUrl",
                          "GetScaffold?type=" + type + "&id=" + id + "&snippetName=" + snippetName)),
                 "Failed to get scaffold for" + type);
+        },
+
+        /**
+         * @ngdoc method
+         * @name umbraco.resources.codefileResource#createContainer
+         * @methodOf umbraco.resources.codefileResource
+         *
+         * @description
+         * Creates a container/folder
+         * 
+         * ##usage
+         * <pre>
+         * codefileResource.createContainer("partialViews", "folder%2ffolder", "folder")
+         *    .then(function(data) {
+         *        alert('its here!');
+         *    });
+         * </pre>
+         *
+         * @param {string} File type: (scripts, partialViews, partialViewMacros).
+         * @param {string} Parent Id: url encoded path
+         * @param {string} Container name
+         * @returns {Promise} resourcePromise object.
+         *
+         */
+
+        createContainer: function(type, parentId, name) {
+            return umbRequestHelper.resourcePromise(
+                $http.post(umbRequestHelper.getApiUrl(
+                    "codeFileApiBaseUrl", 
+                    "PostCreateContainer", 
+                    { type: type, parentId: parentId, name: name })),
+                'Failed to create a folder under parent id ' + parentId);
         }
 
     };

src/Umbraco.Web.UI.Client/src/views/scripts/create.controller.js

@@ -1,13 +1,15 @@
 (function () {
     "use strict";
 
-    function ScriptsCreateController($scope, $location, navigationService) {
+    function ScriptsCreateController($scope, $location, navigationService, formHelper, codefileResource, localizationService) {
 
         var vm = this;
         var node = $scope.dialogOptions.currentNode;
+        var localizeCreateFolder = localizationService.localize("defaultdialog_createFolder");
 
         vm.creatingFolder = false;
         vm.folderName = "";
+        vm.createFolderError = "";
         vm.fileExtension = "";
 
         vm.createFile = createFile;
@@ -23,8 +25,40 @@
             vm.creatingFolder = true;
         }
 
-        function createFolder() {
-            
+        function createFolder(form) {
+
+            if (formHelper.submitForm({scope: $scope, formCtrl: form, statusMessage: localizeCreateFolder})) {
+
+                codefileResource.createContainer("scripts", node.id, vm.folderName).then(function(path) {
+
+                    navigationService.hideMenu();
+
+                    navigationService.syncTree({
+                        tree: "scripts",
+                        path: path,
+                        forceReload: true,
+                        activate: true
+                    });
+
+                    formHelper.resetForm({
+                        scope: $scope
+                    });
+
+                    var section = appState.getSectionState("currentSection");
+
+                }, function(err) {
+
+                    vm.createFolderError = err;
+
+                    //show any notifications
+                    if (angular.isArray(err.data.notifications)) {
+                        for (var i = 0; i < err.data.notifications.length; i++) {
+                            notificationsService.showNotification(err.data.notifications[i]);
+                        }
+                    }
+                });
+            }
+
         }
 
     }

src/Umbraco.Web.UI.Client/src/views/scripts/create.html

@@ -22,12 +22,12 @@
 
     <div class="umb-pane" ng-if="vm.creatingFolder">
         <form novalidate name="createFolderForm"
-              ng-submit="vm.createFolder()"
+              ng-submit="vm.createFolder(createFolderForm)"
               val-form-manager>
             
-            <div ng-show="error">
-                <h5 class="text-error">{{error.errorMsg}}</h5>
-                <p class="text-error">{{error.data.message}}</p>
+            <div ng-show="vm.createFolderError">
+                <h5 class="text-error">{{vm.createFolderError.errorMsg}}</h5>
+                <p class="text-error">{{vm.createFolderError.data.message}}</p>
             </div>
 
             <umb-control-group label="Enter a folder name" hide-label="false">