Merge pull request #92 from vincent99/registry

Private Registry support

Author: vincent99

app/pods/authenticated/route.js

@@ -215,6 +215,17 @@ export default Ember.Route.extend(AuthenticatedRouteMixin, {
           mounts.pushObject(mount);
         }
       }
+    },
+
+    registryCredentialChanged: function(change) {
+      // @TODO Change to registryId when the backend changes
+      var key = 'registryId';
+      if ( Object.keys(change.data.resource).indexOf(key) === -1 )
+      {
+        key = 'storagePoolId';
+      }
+
+      this._includeChanged('registry', 'credentials', key, change.data.resource);
     }
   },
 
@@ -335,10 +346,22 @@ export default Ember.Route.extend(AuthenticatedRouteMixin, {
     // IDs the resource should be on
     var expectedIds = [];
     var expected = changed.get(expectedProperty)||[];
+    if ( !Ember.isArray(expected) )
+    {
+      expected = [expected];
+    }
+
     if ( changed.get('state') !== 'purged' )
     {
       expectedIds = expected.map(function(item) {
-        return item.get('id');
+        if ( typeof item === 'object' )
+        {
+          return item.get('id');
+        }
+        else
+        {
+          return item;
+        }
       });
     }
 

app/pods/components/page-nav/template.hbs

@@ -15,6 +15,11 @@
   <label>Volumes</label>
 {{/link-to}}
 
+{{#link-to "registries" title="API" classNames="nav-api"}}
+  <i class="ss-bookmark fa-lg"></i>
+  <label>Registries</label>
+{{/link-to}}
+
 {{#link-to "apikeys" title="API" classNames="nav-api"}}
   <i class="fa fa-code fa-lg"></i>
   <label>API</label>

app/pods/container/model.js

@@ -10,6 +10,7 @@ var Container = Cattle.TransitioningResource.extend({
   // Container-specific
   type: 'container',
   imageUuid: null,
+  registryCredentialId: null,
   command: null,
   commandArgs: null,
   environment: null,

app/pods/container/template.hbs

@@ -17,7 +17,7 @@
         {{transitioningMessage}}
       </div>
       <div class="instance-actions">
-        {{resource-actions model=this isDetail=true choices=availableActions colors=false}}
+        {{resource-actions model=this choices=availableActions}}
       </div>
     </div>
   </div>

app/pods/containers/new/controller.js

@@ -78,6 +78,35 @@ export default Ember.ObjectController.extend(NewOrEditContainer, {
     removeDevice: function(obj) {
       this.get('devicesArray').removeObject(obj);
     },
+
+    chooseRegistry: function(registry) {
+      var found = false;
+      this.get('registryChoices').forEach((choice) => {
+        var prefix = choice.get('serverAddress')+':';
+
+        if ( registry && choice.get('id') === registry.get('id') )
+        {
+          found = true;
+          choice.set('active', true);
+          this.set('displayPrefix', prefix);
+          this.set('selectedRegistry', choice);
+          this.set('credentialChoices', choice.get('credentials'));
+        }
+        else
+        {
+          choice.set('active', false);
+        }
+      });
+
+      if (!found)
+      {
+        this.set('displayPrefix', 'docker:');
+        this.set('selectedRegistry', null);
+        this.set('credentialChoices', null);
+      }
+
+      this.set('registryCredentialId', this.get('credentialChoices.firstObject.id'));
+    },
   },
 
   validate: function() {
@@ -213,21 +242,70 @@ export default Ember.ObjectController.extend(NewOrEditContainer, {
   }.observes('linksArray.@each.{linkName,targetInstanceId}'),
 
   // Image
+  registryChoices: null,
+  displayPrefix: 'docker:',
   userImageUuid: 'ubuntu:14.04.1',
+  credentialChoices: null,
+  showCredentials: Ember.computed.gt('credentialChoices.length',1),
   userImageUuidDidChange: function() {
-    var image = this.get('userImageUuid');
-    if ( image.indexOf('docker:') === 0 )
+    var input = this.get('userImageUuid');
+    var choices = this.get('registryChoices')||[];
+
+    // Look for a private registry with the matching prefix
+    var prefix, choice, found=false;
+    for ( var i = 0 ; i < choices.get('length') ; i++ )
     {
-      this.set('userImageUuid', image.replace(/^docker:/,''));
+      choice = choices.objectAt(i);
+      prefix = choice.get('serverAddress')+':';
+      choice.set('selected', false);
+      if ( input.indexOf(prefix) === 0 )
+      {
+        this.set('userImageUuid', input.substr(prefix.length));
+        this.send('chooseRegistry', choice);
+      }
     }
-    else
+
+    if ( found )
     {
-      image = 'docker:' + image;
+      return;
     }
 
-    this.set('imageUuid', image);
+    prefix = 'docker:';
+    if ( input.indexOf(prefix) === 0 )
+    {
+      this.set('userImageUuid', input.substr(prefix.length));
+      this.send('chooseRegistry', null);
+    }
   }.observes('userImageUuid'),
 
+  updateImageUuid: function() {
+    var uuid = 'docker:';
+    var registry = this.get('selectedRegistry.serverAddress');
+    if ( registry )
+    {
+      uuid += registry + '/';
+    }
+    uuid += this.get('userImageUuid');
+
+    this.set('imageUuid', uuid);
+  }.observes('selectedRegistry.serverAddress','userImageUuid'),
+
+  credentialChoicesChanged: function() {
+    var found = false;
+    var id = this.get('registryCredentialId');
+    (this.get('credentialChoices')||[]).forEach((choice) => {
+      if ( choice.get('id') === id )
+      {
+        found = true;
+      }
+    });
+
+    if ( !found )
+    {
+      this.set('registryCredentialId',null);
+    }
+  }.observes('credentialChoices.@each.id','registryCredentialId'),
+
   // Volumes
   volumesArray: null,
   initVolumes: function() {

app/pods/containers/new/route.js

@@ -1,6 +1,9 @@
 import Ember from 'ember';
 
 export default Ember.Route.extend({
+  networkChoices: null,
+  registryChoices: null,
+
   activate: function() {
     this.send('setPageLayout', {label: 'Back', backPrevious: true});
   },
@@ -16,13 +19,21 @@ export default Ember.Route.extend({
 
     var dependencies = [
       this.get('store').find('network'),
-      this.get('store').find('host')
+      this.get('store').find('host'),
+      this.get('store').find('registry'),
     ];
 
     return Ember.RSVP.all(dependencies, 'Load container dependencies').then(function(results) {
-      var networks = results[0].sortBy('name','id');
+      var networks = results[0].sortBy('name','id').filter((network) => {
+        return network.get('state') === 'active';
+      });
+
+      var registries = results[2].sortBy('serverAddress').filter((registry) => {
+        return registry.get('state') === 'active';
+      });
 
       self.set('networkChoices', networks);
+      self.set('registryChoices', registries);
 
       var networkId = self.get('lastNetworkId');
       if ( !networkId )
@@ -52,6 +63,7 @@ export default Ember.Route.extend({
   setupController: function(controller, model) {
     model.set('requestedHostId', controller.get('hostId'));
     controller.set('networkChoices', this.get('networkChoices'));
+    controller.set('registryChoices', this.get('registryChoices'));
     controller.set('originalModel', null);
     controller.set('model', model);
     controller.initFields();

app/pods/containers/new/template.hbs

@@ -51,13 +51,47 @@
 
         <div class="form-group">
           <div class="input-group">
-            <span class="input-group-addon">docker:</span>
+            <div class="input-group-btn">
+              <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><span class="caret"></span> {{displayPrefix}}</button>
+              <ul class="dropdown-menu" role="menu">
+                <li {{action "chooseRegistry" null}}><a>Docker</a></li>
+                {{#if registryChoices}}
+                  <li class="divider"></li>
+                  {{#each choice in registryChoices itemController="registry"}}
+                    <li {{action "chooseRegistry" choice}} {{bind-attr class="choice.active:active"}}>
+                      <a>{{choice.displayName}}</a>
+                    </li>
+                  {{/each}}
+                {{/if}}
+              </ul>
+            </div>
             {{input id="userImageUuid" disabled=isRancher type="text" class="form-control" value=userImageUuid placeholder="e.g. stackbrew/ubuntu:14.04"}}
           </div>
         </div>
       </div>
     </div>
 
+    {{#if showCredentials}}
+      <div class="row">
+        <div class="col-sm-12 col-md-2 form-label">
+          <label for="registryCredentialId" class="form-control-static">Credential</label>
+        </div>
+        <div class="col-sm-12 col-md-8">
+          <div class="form-group">
+            {{view "select"
+              class="form-control"
+              id="registryCredentialId"
+              content=credentialChoices
+              optionLabelPath="content.publicValue"
+              optionValuePath="content.id"
+              value=registryCredentialId
+              prompt="None"
+            }}
+          </div>
+        </div>
+      </div>
+    {{/if}}
+
     <div class="row">
       <div class="col-xs-10 col-xs-offset-1">
         <hr/>

app/pods/containers/new/view.js

@@ -11,7 +11,7 @@ function addAction(action, selector) {
 
 export default Ember.View.extend({
   actions: {
-    addEnvironment: addAction('addEnvironment', '.environment-nam'),
+    addEnvironment: addAction('addEnvironment', '.environment-name'),
     addPort:        addAction('addPort',        '.port-public'),
     addLink:        addAction('addLink',        '.link-container'),
     addVolume:      addAction('addVolume',      '.volume-path'),

app/pods/hosts/setup/route.js

@@ -6,6 +6,12 @@ export default OverlayRoute.extend({
     return this.get('store').find('setting', C.SETTING_API_HOST);
   },
 
+  setupController: function(controller, model) {
+    controller.set('model', model);
+    var value = model.get('value');
+    controller.set('customValue', value);
+  },
+
   renderTemplate: function() {
     this.render({into: 'application', outlet: 'overlay'});
   },

app/pods/hosts/setup/template.hbs

@@ -14,9 +14,9 @@
   <code class="form-control-static">{{thisPage}}</code>
 </div>
 
-<div>
+<div style="margin-top: 10px;">
   <label>{{radio-button selection=customRadio value="yes"}} Something else:</label>
-  {{input type="text" class="form-control" value=customValue placeholder="e.g. rancher.mydomain.com"}}
+  {{input type="text" class="form-control" value=customValue placeholder="e.g. rancher.mydomain.com" style="max-width: 300px; display: inline-block;"}}
 </div>
 
 {{#unless looksPublic}}