Management console create from template

assets/app/index.html

@@ -63,7 +63,7 @@
 
     </nav>
 
-    <div ng-view></div>
+    <div ng-view id="content-wrap"></div>
 
     <script src="config.js"></script>
 
@@ -114,6 +114,7 @@
         <script src="scripts/services/login.js"></script>
         <script src="scripts/services/logout.js"></script>
         <script src="scripts/services/labelFilter.js"></script>
+        <script src="scripts/services/tasks.js"></script>
         <script src="scripts/controllers/projects.js"></script>
         <script src="scripts/controllers/project.js"></script>
         <script src="scripts/controllers/pods.js"></script>
@@ -123,15 +124,23 @@
         <script src="scripts/controllers/images.js"></script>        
         <script src="scripts/controllers/deployments.js"></script>
         <script src="scripts/controllers/services.js"></script>
+        <script src="scripts/controllers/newfromtemplate.js"></script>
+        <script src="scripts/controllers/labels.js"></script>
+        <script src="scripts/controllers/tasks.js"></script>
         <script src="scripts/controllers/util/oauth.js"></script>
         <script src="scripts/controllers/util/error.js"></script>
         <script src="scripts/controllers/util/logout.js"></script>
+        <script src="scripts/controllers/catalog.js"></script>
         <script src="scripts/directives/date.js"></script>
         <script src="scripts/directives/resources.js"></script>
         <script src="scripts/directives/nav.js"></script>
         <script src="scripts/directives/alerts.js"></script>
         <script src="scripts/directives/popups.js"></script>
         <script src="scripts/directives/util.js"></script>
+        <script src="scripts/directives/labels.js"></script>
+        <script src="scripts/directives/templateopt.js"></script>
+        <script src="scripts/directives/tasks.js"></script>
+        <script src="scripts/directives/catalog.js"></script>
         <script src="scripts/filters/date.js"></script>
         <script src="scripts/filters/resources.js"></script>
         <script src="scripts/filters/util.js"></script>

assets/app/scripts/app.js

@@ -22,8 +22,8 @@ angular
   // configure our tabs and routing
   .config(['mainNavTabs','$routeProvider', 'HawtioNavBuilderProvider', function(tabs, $routeProvider, builder) {
     var template = function() {
-      // TODO - Don't love triggering the show/hide drawer here, would prefer if 
-      // we could listen for an event that the nav was being redrawn and 
+      // TODO - Don't love triggering the show/hide drawer here, would prefer if
+      // we could listen for an event that the nav was being redrawn and
       // check HawtioNav.selected()
       if (this.isSelected()) {
         if (this.tabs && this.tabs.length > 0) {
@@ -33,7 +33,7 @@ angular
           $("body").removeClass("show-drawer");
         }
       }
-      return "<sidebar-nav-item></sidebar-nav-item>";        
+      return "<sidebar-nav-item></sidebar-nav-item>";
     };
 
     var projectHref = function(path) {
@@ -45,7 +45,7 @@ angular
             return "/project/" + encodeURIComponent(routeParams.project) + "/" + path;
           }
         }
-        return "/project/:project/" + path; 
+        return "/project/:project/" + path;
       }
     };
 
@@ -56,7 +56,7 @@ angular
      .title(function () { return "Overview"; })
      .template(template)
      .href(projectHref("overview"))
-     .page(function () { return builder.join(templatePath, 'project.html'); })                     
+     .page(function () { return builder.join(templatePath, 'project.html'); })
      .build();
     tab.icon = "dashboard";
     tabs.push(tab);
@@ -81,7 +81,7 @@ angular
      .title(function () { return "Settings"; })
      .template(template)
      .href(projectHref("settings"))
-     .page(function () { return builder.join(templatePath, 'settings.html'); })                     
+     .page(function () { return builder.join(templatePath, 'settings.html'); })
      .build();
     tab.icon = "sliders";
     tabs.push(tab);
@@ -97,34 +97,39 @@ angular
         redirectTo: function(params) {
           return '/project/' + encodeURIComponent(params.project) + "/overview";
         }
-      })      
+      })
       .when('/project/:project/overview', {
         templateUrl: 'views/project.html'
       })
       .when('/project/:project/settings', {
         templateUrl: 'views/settings.html'
-      })      
+      })
       .when('/project/:project/browse', {
         redirectTo: function(params) {
           return '/project/' + encodeURIComponent(params.project) + "/browse/pods";  // TODO decide what subtab to default to here
         }
-      })      
+      })
       .when('/project/:project/browse/builds', {
         templateUrl: 'views/builds.html'
-      })      
+      })
       .when('/project/:project/browse/deployments', {
         templateUrl: 'views/deployments.html'
-      })            
+      })
       .when('/project/:project/browse/images', {
         templateUrl: 'views/images.html'
-      })      
+      })
       .when('/project/:project/browse/pods', {
         templateUrl: 'views/pods.html'
-      }) 
+      })
       .when('/project/:project/browse/services', {
         templateUrl: 'views/services.html'
       })
-
+      .when('/project/:project/catalog', {
+        templateUrl: 'views/catalog.html'
+      })
+      .when('/project/:project/create/fromtemplate', {
+        templateUrl: 'views/newfromtemplate.html'
+      })
       .when('/oauth', {
         templateUrl: 'views/util/oauth.html',
         controller: 'OAuthController'
@@ -172,4 +177,4 @@ angular
     }, 30000);
   });
 
-hawtioPluginLoader.addModule('openshiftConsole');
+hawtioPluginLoader.addModule('openshiftConsole');

assets/app/scripts/controllers/catalog.js

@@ -0,0 +1,60 @@
+'use strict';
+
+/**
+ * @ngdoc function
+ * @name openshiftConsole.controller:PodsController
+ * @description
+ * # ProjectController
+ * Controller of the openshiftConsole
+ */
+angular.module('openshiftConsole')
+  .controller('CatalogController', function ($scope, DataService, $filter, LabelFilter) {
+    $scope.projectTemplates = {};
+    $scope.openshiftTemplates = {};
+
+    $scope.templatesByTag = {};
+    $scope.templates = [];
+
+    $scope.instantApps = [];
+
+    DataService.list("templates", $scope, function(templates) {
+      $scope.projectTemplates = templates.by("metadata.name");
+      allTemplates();
+      templatesByTag();
+      console.log("project templates", $scope.projectTemplates);
+    });
+
+    DataService.list("templates", {namespace: "openshift"}, function(templates) {
+      $scope.openshiftTemplates = templates.by("metadata.name");
+      allTemplates();
+      templatesByTag();
+      console.log("openshift templates", $scope.openshiftTemplates);
+    });
+
+    var allTemplates = function() {
+      $scope.templates = [];
+      angular.forEach($scope.projectTemplates, function(template) {
+        $scope.templates.push(template);
+      });
+      angular.forEach($scope.openshiftTemplates, function(template) {
+        $scope.templates.push(template);
+      });
+    };
+
+    var templatesByTag = function() {
+      $scope.templatesByTag = {};
+      angular.forEach($scope.templates, function(template) {
+        if (template.metadata.annotations && template.metadata.annotations.tags) {
+          var tags = template.metadata.annotations.tags.split(",");
+          angular.forEach(tags, function(tag){
+            tag = $.trim(tag);
+            // not doing this as a map since we are dealing with things across namespaces that could have collisions on name
+            $scope.templatesByTag[tag] = $scope.templatesByTag[tag] || [];
+            $scope.templatesByTag[tag].push(template);
+          });
+        }
+      });
+
+      console.log("templatesByTag", $scope.templatesByTag);
+    };
+  });

assets/app/scripts/controllers/labels.js

@@ -0,0 +1,30 @@
+'use strict';
+
+/**
+ * @ngdoc function
+ * @name openshiftConsole.controller:LabelsController
+ * @description
+ * # LabelsController
+ * Controller of the openshiftConsole
+ */
+angular.module('openshiftConsole')
+  .controller('LabelsController', function ($scope) {
+     $scope.expanded = true;
+     $scope.toggleExpanded = function() {
+       $scope.expanded = !$scope.expanded;
+     };
+     $scope.addLabel = function() {
+       if ($scope.labelKey && $scope.labelValue) {
+         $scope.labels[$scope.labelKey] = $scope.labelValue;
+         $scope.labelKey = "";
+         $scope.labelValue = "";
+         $scope.form.$setPristine();
+         $scope.form.$setUntouched();
+       }
+     };
+     $scope.deleteLabel = function(key) {
+       if ($scope.labels[key]) {
+         delete $scope.labels[key];
+       }
+     };
+  });