Switch add to project to a dropdown menu

openshift · Jun 8, 2017 · 5636c08 · 5636c08
1 parent 513fa44
commit 5636c08
Show file tree

Hide file tree

Showing 18 changed files with 728 additions and 346 deletions.
diff --git a/app/index.html b/app/index.html
@@ -338,6 +338,8 @@ <h1>JavaScript Required</h1>
         <script src="scripts/directives/bindService.js"></script>
         <script src="scripts/directives/processTemplate.js"></script>
         <script src="scripts/directives/processTemplateDialog.js"></script>
+        <script src="scripts/directives/deployImageDialog.js"></script>
+        <script src="scripts/directives/fromFileDialog.js"></script>
         <script src="scripts/directives/create/nextSteps.js"></script>
         <script src="scripts/directives/imageNames.js"></script>
 

diff --git a/app/scripts/directives/create/nextSteps.js b/app/scripts/directives/create/nextSteps.js
@@ -1,22 +1,24 @@
 'use strict';
 
-(function() {  
+(function() {
   angular.module('openshiftConsole').component('nextSteps', {
     controller: [
       'ProcessedTemplateService',
+      'Navigate',
       NextSteps
     ],
     bindings: {
       project: '<',
       projectName: '<',
       loginBaseUrl: '<',
       fromSampleRepo: '<',
-      createdBuildConfig: '<'
+      createdBuildConfig: '<',
+      onContinue: '<'
     },
     templateUrl: 'views/directives/next-steps.html'
   });
 
-  function NextSteps(ProcessedTemplateService) {
+  function NextSteps(ProcessedTemplateService, Navigate) {
     var ctrl = this;
     ctrl.showParamsTable = false;
 
@@ -65,8 +67,11 @@
     ctrl.erroredTasks = erroredTasks;
     ctrl.pendingTasks = pendingTasks;
 
-    ctrl.toggleParamsTable = function() {
-      ctrl.showParamsTable = true;
+    ctrl.goToOverview = function() {
+      if (_.isFunction(ctrl.onContinue)) {
+        ctrl.onContinue();
+      }
+      Navigate.toProjectOverview(ctrl.projectName);
     };
   }
 })();
diff --git a/app/scripts/directives/deployImage.js b/app/scripts/directives/deployImage.js
@@ -19,7 +19,8 @@ angular.module("openshiftConsole")
       scope: {
         project: '=',
         context: '=',
-        alerts: '='
+        alerts: '=',
+        isDialog: '='
       },
       templateUrl: 'views/directives/deploy-image.html',
       link: function($scope) {
@@ -51,7 +52,7 @@ angular.module("openshiftConsole")
 
         var configMapDataOrdered = [];
         var secretDataOrdered = [];
-        var context = {namespace: $scope.project};
+        var context = {namespace: $scope.project.metadata.name};
         $scope.valueFromObjects = [];
 
         DataService.list("configmaps", context, null, { errorNotification: false }).then(function(configMapData) {
@@ -138,6 +139,8 @@ angular.module("openshiftConsole")
                   return;
                 }
 
+                $scope.forms.imageSelection.imageName.$setValidity("imageLoaded", true);
+
                 var image = $scope.import.image;
                 if (image) {
                   $scope.app.name = getName();
@@ -169,6 +172,14 @@ angular.module("openshiftConsole")
 
             delete $scope.import;
             $scope.istag = {};
+
+            if (newMode === 'dockerImage') {
+              $scope.forms.imageSelection.imageName.$setValidity("imageLoaded", false);
+            }
+            else {
+              // reset this to true so it doesn't block form submission
+              $scope.forms.imageSelection.imageName.$setValidity("imageLoaded", true);
+            }
           });
 
           $scope.$watch('istag', function(istag, old) {
@@ -209,15 +220,16 @@ angular.module("openshiftConsole")
             });
           }, true);
 
+          var displayName = $filter('displayName');
           var generatedResources;
           var createResources = function() {
             var titles = {
-              started: "Deploying image " + $scope.app.name + " to project " + $scope.project + ".",
-              success: "Deployed image " + $scope.app.name + " to project " + $scope.project + ".",
-              failure: "Failed to deploy image " + $scope.app.name + " to project " + $scope.project + "."
+              started: "Deploying image " + $scope.app.name + " to project " + displayName($scope.project),
+              success: "Deployed image " + $scope.app.name + " to project " + displayName($scope.project),
+              failure: "Failed to deploy image " + $scope.app.name + " to project " + displayName($scope.project)
             };
             TaskList.clear();
-            TaskList.add(titles, {}, $scope.project, function() {
+            TaskList.add(titles, {}, $scope.project.metadata.name, function() {
               var d = $q.defer();
               DataService.batch(generatedResources, $scope.context).then(function(result) {
                 var alerts, hasErrors = !_.isEmpty(result.failure);
@@ -251,7 +263,14 @@ angular.module("openshiftConsole")
             });
 
             _.set($scope, 'confirm.doneEditing', true);
-            Navigate.toNextSteps($scope.app.name, $scope.project);
+            if ($scope.isDialog) {
+              $scope.$emit('deployImageNewAppCreated', {
+                project: $scope.project,
+                appName: $scope.app.name
+              });
+            } else {
+              Navigate.toNextSteps($scope.app.name, $scope.project.metadata.name);
+            }
           };
 
           var launchConfirmationDialog = function(alerts) {
@@ -297,7 +316,7 @@ angular.module("openshiftConsole")
             $scope.alerts = {};
             generatedResources = getResources();
 
-            var nameTakenPromise = ApplicationGenerator.ifResourcesDontExist(generatedResources, $scope.project);
+            var nameTakenPromise = ApplicationGenerator.ifResourcesDontExist(generatedResources, $scope.project.metadata.name);
             var checkQuotaPromise = QuotaService.getLatestQuotaAlerts(generatedResources, $scope.context);
             // Don't want to wait for the name checks to finish before making the calls to quota
             // so kick off the requests above and then chain the promises here
@@ -307,6 +326,11 @@ angular.module("openshiftConsole")
             };
             nameTakenPromise.then(setNameTaken, setNameTaken).then(showWarningsOrCreate, showWarningsOrCreate);
           };
+
+          // When the deploy-image component is displayed in a dialog, the create
+          // button is outside the component since it is in the wizard footer. Listen
+          // for an event for when the button is clicked.
+          $scope.$on('newAppFromDeployImage', $scope.create);
       }
     };
   });
diff --git a/app/scripts/directives/deployImageDialog.js b/app/scripts/directives/deployImageDialog.js
@@ -0,0 +1,67 @@
+'use strict';
+
+(function() {
+  angular.module('openshiftConsole').component('deployImageDialog', {
+    controller: [
+      '$scope',
+      'DataService',
+      DeployImageDialog
+    ],
+    controllerAs: '$ctrl',
+    bindings: {
+      visible: '<',
+      project: '<', //handle create project optionally
+      context: '<',
+      onDialogClosed: '&'
+    },
+    templateUrl: 'views/directives/deploy-image-dialog.html'
+  });
+
+  function DeployImageDialog($scope, DataService) {
+    var ctrl = this;
+
+    ctrl.$onInit = function() {
+      ctrl.alerts = {};
+      ctrl.loginBaseUrl = DataService.openshiftAPIBaseUrl();
+      ctrl.currentStep = "Image";
+    };
+
+    ctrl.deployImage = function() {
+      $scope.$broadcast('newAppFromDeployImage');
+    };
+
+    $scope.$on('deployImageNewAppCreated', function(event, message) {
+      ctrl.selectedProject = message.project;
+      ctrl.currentStep = "Results";
+    });
+
+    ctrl.close = function() {
+      var cb = ctrl.onDialogClosed();
+      if (_.isFunction(cb)) {
+        cb();
+      }
+      ctrl.wizardDone = false;
+      return true;
+    };
+
+    $scope.$on("wizard:stepChanged", function (e, parameters) {
+      if (parameters.step.stepId === 'results') {
+        ctrl.nextButtonTitle = "Close";
+        ctrl.wizardDone = true;
+      } else {
+        ctrl.nextButtonTitle = "Deploy";
+      }
+    });
+
+    ctrl.nextCallback = function (step) {
+      if (step.stepId === 'image') {
+        ctrl.deployImage();
+        return false;  // don't actually navigate yet
+      }
+      else if (step.stepId === 'results') {
+        ctrl.close();
+      }
+      return true;
+    };
+  }
+})();
diff --git a/app/scripts/directives/fromFile.js b/app/scripts/directives/fromFile.js
@@ -15,7 +15,11 @@ angular.module("openshiftConsole")
                                   SecurityCheckService) {
     return {
       restrict: "E",
-      scope: false,
+      scope: {
+        context: '=',
+        project: '=',
+        isDialog: '='
+      },
       templateUrl: "views/directives/from-file.html",
       controller: function($scope) {
         var aceEditorSession;
@@ -76,7 +80,7 @@ angular.module("openshiftConsole")
         };
 
         var showWarningsOrCreate = function(result){
-          var alerts = SecurityCheckService.getSecurityAlerts($scope.createResources, $scope.projectName);
+          var alerts = SecurityCheckService.getSecurityAlerts($scope.createResources, $scope.project.metadata.name);
 
           // Now that all checks are completed, show any Alerts if we need to
           var quotaAlerts = result.quotaAlerts || [];
@@ -204,7 +208,7 @@ angular.module("openshiftConsole")
             };
             return false;
           }
-          if (item.metadata.namespace && item.metadata.namespace !== $scope.projectName) {
+          if (item.metadata.namespace && item.metadata.namespace !== $scope.project.metadata.name) {
             $scope.error = {
               message: item.kind + " " + item.metadata.name + " can't be created in project " + item.metadata.namespace + ". Can't create resource in different projects."
             };
@@ -268,12 +272,27 @@ angular.module("openshiftConsole")
 
           var path;
           if ($scope.resourceKind === "Template" && $scope.templateOptions.process && !$scope.errorOccured) {
-            var namespace = ($scope.templateOptions.add || $scope.updateResources.length > 0) ? $scope.projectName : "";
-            path = Navigate.createFromTemplateURL(resource, $scope.projectName, {namespace: namespace});
-          } else {
-            path = Navigate.projectOverviewURL($scope.projectName);
+            if ($scope.isDialog) {
+              $scope.$emit('fileImportedFromYAMLOrJSON', {
+                project: $scope.project,
+                template: resource
+              });
+            }
+            else {
+              var namespace = ($scope.templateOptions.add || $scope.updateResources.length > 0) ? $scope.project.metadata.name : "";
+              path = Navigate.createFromTemplateURL(resource, $scope.project.metadata.name, {namespace: namespace});
+              $location.url(path);
+            }
+          }
+          else if ($scope.isDialog) {
+            $scope.$emit('fileImportedFromYAMLOrJSON', {
+              project: $scope.project
+            });
+          }
+          else {
+            path = Navigate.projectOverviewURL($scope.project.metadata.name);
+            $location.url(path);
           }
-          $location.url(path);
         }
 
         function checkIfExists(item) {
@@ -318,7 +337,7 @@ angular.module("openshiftConsole")
           var resource;
           if (!_.isEmpty($scope.createResources)) {
             resource = _.head($scope.createResources);
-            DataService.create(APIService.kindToResource(resource.kind), null, resource, {namespace: $scope.projectName}).then(
+            DataService.create(APIService.kindToResource(resource.kind), null, resource, {namespace: $scope.project.metadata.name}).then(
               // create resource success
               function() {
                 AlertMessageService.addAlert({
@@ -340,7 +359,7 @@ angular.module("openshiftConsole")
               });
           } else {
             resource = _.head($scope.updateResources);
-            DataService.update(APIService.kindToResource(resource.kind), resource.metadata.name, resource, {namespace: $scope.projectName}).then(
+            DataService.update(APIService.kindToResource(resource.kind), resource.metadata.name, resource, {namespace: $scope.project.metadata.name}).then(
               // update resource success
               function() {
                 AlertMessageService.addAlert({
@@ -364,14 +383,15 @@ angular.module("openshiftConsole")
 
         }
 
+        var displayName = $filter('displayName');
         function createResourceList(){
           var titles = {
-            started: "Creating resources in project " + $scope.projectName,
-            success: "Creating resources in project " + $scope.projectName,
-            failure: "Failed to create some resources in project " + $scope.projectName
+            started: "Creating resources in project " + displayName($scope.project),
+            success: "Creating resources in project " + displayName($scope.project),
+            failure: "Failed to create some resources in project " + displayName($scope.project)
           };
           var helpLinks = {};
-          TaskList.add(titles, helpLinks, $scope.projectName, function() {
+          TaskList.add(titles, helpLinks, $scope.project.metadata.name, function() {
             var d = $q.defer();
 
             DataService.batch($scope.createResources, $scope.context, "create").then(
@@ -417,12 +437,12 @@ angular.module("openshiftConsole")
 
         function updateResourceList(){
           var titles = {
-            started: "Updating resources in project " + $scope.projectName,
-            success: "Updated resources in project " + $scope.projectName,
-            failure: "Failed to update some resources in project " + $scope.projectName
+            started: "Updating resources in project " + displayName($scope.project),
+            success: "Updated resources in project " + displayName($scope.project),
+            failure: "Failed to update some resources in project " + displayName($scope.project)
           };
           var helpLinks = {};
-          TaskList.add(titles, helpLinks, $scope.projectName, function() {
+          TaskList.add(titles, helpLinks, $scope.project.metadata.name, function() {
             var d = $q.defer();
 
             DataService.batch($scope.updateResources, $scope.context, "update").then(
@@ -473,6 +493,11 @@ angular.module("openshiftConsole")
             return d.promise;
           });
         }
+
+        // When the from-file component is displayed in a dialog, the create
+        // button is outside the component since it is in the wizard footer. Listen
+        // for an event for when the button is clicked.
+        $scope.$on('importFileFromYAMLOrJSON', $scope.create);
       }
     };
   });