AMBARI-8394 Ambari View > Versions > Register Version (with mock data). (atkach)

ambari-admin/src/main/resources/ui/admin-web/app/index.html

@@ -136,6 +136,7 @@
     <script src="scripts/controllers/ambariViews/ViewsEditCtrl.js"></script>
     <script src="scripts/controllers/ambariViews/CreateViewInstanceCtrl.js"></script>
     <script src="scripts/controllers/clusters/ClustersManageAccessCtrl.js"></script>
+    <script src="scripts/controllers/stackVersions/StackVersionsCreateCtrl.js"></script>
     <script src="scripts/controllers/stackVersions/StackVersionsListCtrl.js"></script>
     <script src="scripts/directives/linkToDir.js"></script>
     <script src="scripts/directives/PasswordVerify.js"></script>

ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/stackVersions/StackVersionsCreateCtrl.js

@@ -0,0 +1,79 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+'use strict';
+
+angular.module('ambariAdminConsole')
+.controller('StackVersionsCreateCtrl', ['$scope', 'StackVersions', '$routeParams', function($scope, StackVersions, $routeParams) {
+  $scope.clusterName = $routeParams.clusterName;
+  $scope.upgradePack = {
+    value: null,
+    options: [
+      'Pack 1',
+      'Pack 2',
+      'Pack 3',
+      'Pack 4'
+    ]
+  };
+  $scope.upgradePack.value = $scope.upgradePack.options[0];
+
+  $scope.upgradeStack = {
+    value: null,
+    options: [
+      'HDP-2.2',
+      'HDP-2.3',
+      'HDP-2.4'
+    ]
+  };
+  $scope.upgradeStack.value = $scope.upgradeStack.options[0];
+
+  $scope.repositories = [
+    {
+      os: 'redhat5',
+      packages: [
+        {label:'HDP', value: null},
+        {label:'HDP-UTILS', value: null},
+      ],
+      selected: false
+    },
+    {
+      os: 'redhat6',
+      packages: [
+        {label:'HDP', value: null},
+        {label:'HDP-UTILS', value: null},
+      ],
+      selected: false
+    },
+    {
+      os: 'sles11',
+      packages: [
+        {label:'HDP', value: null},
+        {label:'HDP-UTILS', value: null},
+      ],
+      selected: false
+    },
+    {
+      os: 'ubuntu12',
+      packages: [
+        {label:'HDP', value: null},
+        {label:'HDP-UTILS', value: null},
+      ],
+      selected: false
+    }
+  ];
+  
+}]);

ambari-admin/src/main/resources/ui/admin-web/app/styles/main.css

@@ -338,6 +338,9 @@ a.gotoinstance{
   box-shadow: none;
   border-radius: 0;
 }
+.border-bottom {
+  border-bottom: 1px solid #ebebeb;
+}
 
 .views-list-table .panel-group .panel:nth-child(even) .panel-heading{
   background: #f9f9f9;
@@ -471,7 +474,7 @@ a.gotoinstance{
   margin-left: 10px;
 }
 
-.create-view-form{
+.create-view-form, .register-version-form{
   padding-bottom: 50px;
 }
 

ambari-admin/src/main/resources/ui/admin-web/app/views/leftNavbar.html

@@ -63,16 +63,17 @@
         <span class="cluster-installation-progress-label" ng-show="cluster.Clusters.provisioning_state == 'INIT'"><a href="/#/">Cluster creation in progress...</a></span>
       </div>
 
-      <ul class="nav nav-pills nav-stacked">
-        <li ng-class="{active: isActive('stackVersions.list')}">
-          <a href="#/stackVersions">Versions</a>
-        </li>
-      </ul>
+
       <div ng-hide="cluster">
         <ul class="nav nav-pills nav-stacked">
           <li><p class="noclusters">No clusters</p></li>
         </ul>
       </div>
+      <ul class="nav nav-pills nav-stacked">
+        <li ng-class="{active: isActive('stackVersions.list')}">
+          <a href="#/stackVersions">Versions</a>
+        </li>
+      </ul>
     </div>
   </div>
 

ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/create.html

@@ -0,0 +1,97 @@
+<!--
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License.  You may obtain a copy of the License at
+*
+*     http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+-->
+
+<ol class="breadcrumb">
+  <li><a href="#/clusters/{{clusterName}}/stackversions">Versions</a></li>
+  <li class="active">Register Version</li>
+</ol>
+<hr>
+<form class="form-horizontal register-version-form" role="form" name="form-registerVersionForm" novalidate>
+  <div class="panel panel-default">
+    <div class="panel-heading">
+      <h3 class="panel-title">Details</h3>
+    </div>
+    <div class="panel-body">
+      <div class="form-group">
+        <div class="col-sm-3"><label class="control-label">Stack</label></div>
+        <div class="col-sm-3">
+          <select class="form-control"
+                  ng-model="upgradeStack.value"
+                  ng-options="o as o for o in upgradeStack.options"
+            ></select>
+        </div>
+      </div>
+      <div class="form-group">
+        <div class="col-sm-3"><label class="control-label">Upgrade Pack</label></div>
+        <div class="col-sm-3">
+          <select class="form-control"
+            ng-model="upgradePack.value"
+            ng-options="o as o for o in upgradePack.options"
+          ></select>
+        </div>
+      </div>
+      <div class="form-group">
+        <div class="col-sm-3"><label for="" class="control-label">Version Name</label></div>
+        <div class="col-sm-3"><input type="text" class="form-control" placeholder="Version Name"></div>
+      </div>
+    </div>
+  </div>
+  <div class="panel panel-default">
+    <div class="panel-heading">
+      <h3 class="panel-title">Repositories</h3>
+    </div>
+    <div class="panel-body ">
+      <div class="alert alert-info" role="alert">
+        Provide Base URLs for the Operating Systems you are configuring. Uncheck all other Operating Systems.
+      </div>
+      <div class="border-bottom bottom-margin clearfix">
+        <div class="col-sm-3"><h5><label>OS</label></h5></div>
+        <div class="col-sm-3"><h5><label>Name</label></h5></div>
+        <div class="col-sm-6"><h5><label>Base URL</label></h5></div>
+      </div>
+      <div class="clearfix border-bottom bottom-margin" ng-repeat="repository in repositories">
+        <div class="col-sm-3">
+          <div class="checkbox">
+            <label>
+              <input type="checkbox" ng-model="repository.selected"> {{repository.os}}
+            </label>
+          </div>
+        </div>
+        <div class="col-sm-9">
+          <div class="form-group" ng-repeat="package in repository.packages">
+            <div class="col-sm-4"><label class="control-label">{{package.label}}</label></div>
+            <div class="col-sm-8"><input type="text" class="form-control" ng-model="package.value"></div>
+          </div>
+        </div>
+      </div>
+      <div class="clearfix">
+        <div class="col-sm-12">
+          <div class="checkbox">
+            <label>
+              <input type="checkbox" ng-model="repository.selected"> Skip Repository Base URL validation (Advanced) <span class="glyphicon glyphicon-question-sign" tooltip="Tooltip text"></span>
+            </label>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="col-sm-12">
+    <button class="btn btn-primary pull-right left-margin">Save</button>
+    <button class="btn btn-default pull-right">Cancel</button>
+  </div>
+</form>

ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html

@@ -22,7 +22,7 @@
       <li class="active">Versions</li>
     </ol>
     <div class="pull-right top-margin-4">
-      <a href class="btn btn-primary">
+      <a href="#/stackVersions/create" class="btn btn-primary">
         <span class="glyphicon glyphicon-plus"></span>
         Register Version
       </a>