Refactoring strains

app/pods/components/display-errors/template.hbs

@@ -1,3 +0,0 @@
-{{#each a as |error|}}
-  <div class="flakes-message error">{{error.message}}</div>
-{{/each}}

app/pods/components/forms/species-form/component.js

@@ -5,6 +5,7 @@ export default Ember.Component.extend({
     save: function() {
       this.sendAction('save');
     },
+
     cancel: function() {
       this.sendAction('cancel');
     },

app/pods/components/forms/strain-form/component.js

@@ -0,0 +1,17 @@
+import Ember from 'ember';
+
+export default Ember.Component.extend({
+  actions: {
+    save: function() {
+      // Need to override the string id for some reason
+      let strain = this.get('strain');
+      let id = strain.get('species.id');
+      strain.set('species.id', +id);
+      this.sendAction('save');
+    },
+
+    cancel: function() {
+      this.sendAction('cancel');
+    },
+  }
+});

app/pods/components/forms/strain-form/template.hbs

@@ -0,0 +1,61 @@
+<form class="grid-form">
+  <fieldset>
+    <legend><em>{{strain.strainName}}</em></legend>
+    <div data-row-span="2">
+      <div data-field-span="1">
+        <label>Strain Name</label>
+        {{input value=strain.strainName}}
+      </div>
+      <div data-field-span="1">
+        <label>Type Strain?</label>
+        {{input type="checkbox" checked=strain.typeStrain}} {{if strain.typeStrain 'Yes' 'No'}}
+      </div>
+    </div>
+    <div data-row-span="2">
+      <div data-field-span="2">
+        <label>Species</label>
+          {{
+            select-2
+            content=species
+            optionLabelPath="speciesName"
+            value=strain.species
+          }}
+      </div>
+    </div>
+    <div data-row-span="2">
+      <div data-field-span="2">
+        <label>Isolated From</label>
+        {{textarea value=strain.isolatedFrom cols="70" rows="5"}}
+      </div>
+    </div>
+    <div data-row-span="3">
+      <div data-field-span="1">
+        <label>Accession Numbers</label>
+        {{input value=strain.accessionNumbers}}
+      </div>
+      <div data-field-span="1">
+        <label>GenBank</label>
+        {{input value=strain.genbank}}
+      </div>
+      <div data-field-span="1">
+        <label>Whole Genome Sequence</label>
+        {{input value=strain.wholeGenomeSequence}}
+      </div>
+    </div>
+    <div data-row-span="2">
+      <div data-field-span="2">
+        <label>Notes</label>
+        {{textarea value=strain.notes cols="70" rows="5"}}
+      </div>
+    </div>
+  </fieldset>
+</form>
+<br>
+<a class="button-red smaller" {{action 'cancel'}}>
+  Cancel
+</a>
+{{#if strain.isDirty}}
+  <a class="button-green smaller" {{action 'save'}}>
+    Save
+  </a>
+{{/if}}

app/pods/components/strain-details/component.js

@@ -1,20 +0,0 @@
-import Ember from 'ember';
-import userCanEdit from '../../../utils/user-can-edit';
-
-export default Ember.Component.extend({
-  classNames: ['grid-1'],
-  isEditing: false,
-
-  canEdit: function() {
-    return userCanEdit(this.get('session.currentUser'), this.get('strain.createdBy'));
-  }.property('session.currentUser', 'strain.createdBy').readOnly(),
-
-  actions: {
-    save: function() {
-      this.sendAction('save');
-    },
-    cancel: function() {
-      this.sendAction('cancel');
-    },
-  }
-});

app/pods/components/strain-details/template.hbs

@@ -1,145 +0,0 @@
-<div class="span-1">
-  <fieldset class="flakes-information-box {{if isEditing 'is-editing'}}">
-    <legend>
-      Strain
-        {{#if isEditing}}
-          {{input value=strain.strainName}}
-        {{else}}
-          {{strain.strainNameMU}}
-        {{/if}}
-        {{display-errors a=strain.errors.strainName}}
-    </legend>
-
-    {{! ROW 1 }}
-    <div class="grid-4 gutter-50">
-      <dl class="span-2">
-        <dt>Species</dt>
-        <dd>
-          {{#if isEditing}}
-            {{
-              select-2
-              content=species
-              optionLabelPath="speciesName"
-              value=strain.species
-            }}
-          {{else}}
-            {{#link-to 'species.show' strain.species}}
-              <em>{{strain.species.speciesName}}</em>
-            {{/link-to}}
-          {{/if}}
-        </dd>
-      </dl>
-      <dl class="span-2">
-        <dt>Type Strain?</dt>
-        <dd>
-          {{#if isEditing}}
-            {{input type="checkbox" checked=strain.typeStrain}}
-          {{/if}}
-          {{if strain.typeStrain 'Yes' 'No'}}
-          {{display-errors a=strain.errors.typeStrain}}
-        </dd>
-      </dl>
-    </div>
-
-    {{! ROW 2 }}
-    <div class="grid-6">
-      <dl class="span-2">
-        <dt>Accession Numbers</dt>
-        <dd>
-          {{#if isEditing}}
-            {{input value=strain.accessionNumbers}}
-          {{else}}
-            {{strain.accessionNumbers}}
-          {{/if}}
-          {{display-errors a=strain.errors.accessionNumbers}}
-        </dd>
-      </dl>
-      <dl class="span-2">
-        <dt>Genbank</dt>
-        <dd>
-          {{#if isEditing}}
-            {{input value=strain.genbank}}
-          {{else}}
-            {{genbank-url genbank=strain.genbank}}
-          {{/if}}
-          {{display-errors a=strain.errors.genbank}}
-        </dd>
-      </dl>
-      <dl class="span-2">
-        <dt>Whole Genome Sequence</dt>
-        <dd>
-          {{#if isEditing}}
-            {{input value=strain.wholeGenomeSequence}}
-          {{else}}
-            {{strain.wholeGenomeSequence}}
-          {{/if}}
-          {{display-errors a=strain.errors.wholeGenomeSequence}}
-        </dd>
-      </dl>
-    </div>
-
-    {{! ROW 3 }}
-    <div class="grid-4">
-      <dl class="span-4">
-        <dt>Isolated From</dt>
-        <dd>
-          {{#if isEditing}}
-            {{textarea value=strain.isolatedFrom cols="70" rows="3"}}
-          {{else}}
-            {{strain.isolatedFrom}}
-          {{/if}}
-          {{display-errors a=strain.errors.isolatedFrom}}
-        </dd>
-      </dl>
-    </div>
-
-    {{! ROW 4 }}
-    <div class="grid-4">
-      <dl class="span-4">
-        <dt>Notes</dt>
-        <dd>
-          {{#if isEditing}}
-            {{textarea value=strain.notes cols="70" rows="3"}}
-          {{else}}
-            {{strain.notes}}
-          {{/if}}
-          {{display-errors a=strain.errors.notes}}
-        </dd>
-      </dl>
-    </div>
-
-    {{! ROW 5 }}
-    <div class="grid-4">
-      <dl class="span-1">
-        <dt>Record Created</dt>
-        <dd>{{null-time strain.createdAt 'LL'}}</dd>
-      </dl>
-      <dl class="span-1">
-        <dt>Record Updated</dt>
-        <dd>{{null-time strain.updatedAt 'LL'}}</dd>
-      </dl>
-      <dl class="span-1">
-        <dt>Record Deleted</dt>
-        <dd>{{null-time strain.deletedAt 'LL'}}</dd>
-      </dl>
-      <dl class="span-1"></dl>
-    </div>
-
-    {{! ROW 6 }}
-    {{#if canEdit}}
-      <div class="grid-4">
-        <div class="span-1">
-          {{! Does nothing ATM }}
-          <a class="smaller {{if isEditing 'button-red' 'button-gray'}}" {{action 'cancel'}}>
-            {{#if isEditing}}Cancel{{else}}Edit{{/if}}
-          </a>
-          {{#if isEditing}}
-            <a class="button-green smaller" {{action 'save'}}>
-              Save
-            </a>
-          {{/if}}
-        </div>
-      </div>
-    {{/if}}
-  </fieldset>
-</div>

app/pods/species/edit/controller.js

@@ -7,12 +7,12 @@ export default Ember.Controller.extend({
 
       if (species.get('isDirty')) {
         species.save().then((species) => {
-          this.transitionToRoute('species.show', species.get('id'));
+          this.transitionToRoute('species.show', species);
         }, (err) => {
           this.get('flashMessages').error(err.responseJSON.error);
         });
       } else {
-        this.transitionToRoute('species.show', species.get('id'));
+        this.transitionToRoute('species.show', species);
       }
     },
 
@@ -22,7 +22,7 @@ export default Ember.Controller.extend({
       species.get('errors').clear();
       species.rollback();
 
-      this.transitionToRoute('species.show', species.get('id'));
+      this.transitionToRoute('species.show', species);
     },
 
   },

app/pods/species/new/controller.js

@@ -12,6 +12,7 @@ export default Ember.Controller.extend({
           this.get('flashMessages').error(err.responseJSON.error);
         });
       } else {
+        species.deleteRecord();
         this.transitionToRoute('species.index');
       }
     },

app/pods/species/show/controller.js

@@ -6,7 +6,7 @@ export default Ember.Controller.extend({
     let id = this.get('model.id');
 
     if (meta.canEdit.indexOf( +id ) === -1) {
-      return false
+      return false;
     }
     return true;
   }.property('model.isLoaded').readOnly(),

app/pods/species/show/route.js

@@ -1,4 +1,8 @@
 import Ember from 'ember';
 import AuthenticatedRouteMixin from 'simple-auth/mixins/authenticated-route-mixin';
 
-export default Ember.Route.extend(AuthenticatedRouteMixin, {});
+export default Ember.Route.extend(AuthenticatedRouteMixin, {
+  model: function(params) {
+    return this.store.find('species', params.species_id);
+  }
+});

app/pods/strains/edit/controller.js

@@ -0,0 +1,30 @@
+import Ember from 'ember';
+
+export default Ember.Controller.extend({
+  actions: {
+    save: function() {
+      let strain = this.get('strain');
+
+      if (strain.get('isDirty')) {
+        strain.save().then((strain) => {
+          this.transitionToRoute('strains.show', strain);
+        }, (err) => {
+          this.get('flashMessages').error(err.responseJSON.error);
+        });
+      } else {
+        strain.deleteRecord();
+        this.transitionToRoute('strains.show', strain);
+      }
+    },
+
+    cancel: function() {
+      let strain = this.get('strain');
+
+      strain.get('errors').clear();
+      strain.rollback();
+
+      this.transitionToRoute('strains.show', strain);
+    },
+
+  },
+});

app/pods/strains/edit/route.js

@@ -0,0 +1,16 @@
+import Ember from 'ember';
+import AuthenticatedRouteMixin from 'simple-auth/mixins/authenticated-route-mixin';
+
+export default Ember.Route.extend(AuthenticatedRouteMixin, {
+  model: function(params) {
+    return Ember.RSVP.hash({
+      strain: this.store.find('strain', params.strain_id),
+      species: this.store.findAll('species'),
+    });
+  },
+
+  setupController: function(controller, models) {
+    controller.setProperties(models);
+  },
+
+});

app/pods/strains/edit/template.hbs

@@ -0,0 +1,7 @@
+{{
+  forms/strain-form
+  strain=strain
+  species=species
+  save="save"
+  cancel="cancel"
+}}

app/pods/strains/index/controller.js

@@ -2,5 +2,10 @@ import Ember from 'ember';
 
 export default Ember.Controller.extend({
   sortParams: ['fullNameMU', 'totalMeasurements'],
-  sortedStrains: Ember.computed.sort('strains', 'sortParams'),
+  sortedStrains: Ember.computed.sort('model', 'sortParams'),
+
+  metaData: function() {
+    return this.store.metadataFor('strain');
+  }.property('model.isLoaded').readOnly(),
+
 });

app/pods/strains/index/route.js

@@ -3,12 +3,6 @@ import AuthenticatedRouteMixin from 'simple-auth/mixins/authenticated-route-mixi
 
 export default Ember.Route.extend(AuthenticatedRouteMixin, {
   model: function() {
-    return Ember.RSVP.hash({
-      strains: this.store.findAll('strain'),
-    });
-  },
-
-  setupController: function(controller, model) {
-    controller.setProperties(model);
+    return this.store.findAll('strain');
   },
 });

app/pods/strains/index/template.hbs

@@ -1,7 +1,7 @@
 <h2>{{genus-name}} Strains</h2>
-<h3>Total strains: {{strains.length}}</h3>
+<h3>Total strains: {{model.length}}</h3>
 
-{{add-button label="Add Strain" link="strains.new"}}
+{{add-button label="Add Strain" link="strains.new" canAdd=metaData.canAdd}}
 
 <table class="flakes-table">
   <thead>

app/pods/strains/new/controller.js

@@ -1,21 +1,30 @@
 import Ember from 'ember';
 
 export default Ember.Controller.extend({
-  isEditing: true,
   actions: {
     save: function() {
-      var strain = this.get('strain');
+      let strain = this.get('strain');
+
       if (strain.get('isDirty')) {
-        strain.save();
+        strain.save().then((strain) => {
+          this.transitionToRoute('strains.show', strain);
+        }, (err) => {
+          this.get('flashMessages').error(err.responseJSON.error);
+        });
+      } else {
+        this.transitionToRoute('strains.index');
       }
-      this.transitionToRoute('strains.index');
     },
+
     cancel: function() {
-      var strain = this.get('strain');
+      let strain = this.get('strain');
+
       if (strain.get('isNew')) {
         strain.deleteRecord();
       }
+
       this.transitionToRoute('strains.index');
-    }
-  }
+    },
+
+  },
 });

app/pods/strains/new/route.js

@@ -5,10 +5,12 @@ export default Ember.Route.extend(AuthenticatedRouteMixin, {
   model: function() {
     return Ember.RSVP.hash({
       strain: this.store.createRecord('strain'),
-      species: this.store.findAll('species')
+      species: this.store.findAll('species'),
     });
   },
+
   setupController: function(controller, models) {
     controller.setProperties(models);
   },
+
 });

app/pods/strains/new/template.hbs

@@ -1,8 +1,7 @@
 {{
-  strain-details
+  forms/strain-form
   strain=strain
   species=species
-  isEditing=true
   save="save"
   cancel="cancel"
 }}

app/pods/strains/show/controller.js

@@ -1,19 +1,14 @@
 import Ember from 'ember';
 
 export default Ember.Controller.extend({
-  isEditing: false,
-  actions: {
-    save: function() {
-      var strain = this.get('strain');
-      if (strain.get('isDirty')) {
-        strain.save();
-      }
-      this.toggleProperty('isEditing');
-    },
-    cancel: function() {
-      this.get('strain').get('errors').clear();
-      this.get('strain').rollback();
-      this.toggleProperty('isEditing');
+  userCanEdit: function() {
+    let meta = this.store.metadataFor('strain');
+    let id = this.get('model.id');
+
+    if (meta.canEdit.indexOf( +id ) === -1) {
+      return false;
     }
-  }
+    return true;
+  }.property('model.isLoaded').readOnly(),
+
 });

app/pods/strains/show/route.js

@@ -3,12 +3,6 @@ import AuthenticatedRouteMixin from 'simple-auth/mixins/authenticated-route-mixi
 
 export default Ember.Route.extend(AuthenticatedRouteMixin, {
   model: function(params) {
-    return Ember.RSVP.hash({
-      strain: this.store.find('strain', params.strain_id),
-      species: this.store.findAll('species')
-    });
-  },
-  setupController: function(controller, models) {
-    controller.setProperties(models);
-  },
+    return this.store.find('strain', params.strain_id);
+  }
 });

app/pods/strains/show/template.hbs

@@ -1,8 +1,90 @@
-{{
-  strain-details
-  strain=strain
-  species=species
-  isEditing=isEditing
-  save="save"
-  cancel="cancel"
-}}
+<div class="span-1">
+  <fieldset class="flakes-information-box {{if isEditing 'is-editing'}}">
+    <legend>
+      Strain {{model.strainNameMU}}
+    </legend>
+
+    {{! ROW 1 }}
+    <div class="grid-4 gutter-50">
+      <dl class="span-2">
+        <dt>Species</dt>
+        <dd>
+          {{#link-to 'species.show' model.species.id}}
+            <em>{{model.species.speciesNameMU}}</em>
+          {{/link-to}}
+        </dd>
+      </dl>
+      <dl class="span-2">
+        <dt>Type Strain?</dt>
+        <dd>
+          {{if model.typeStrain 'Yes' 'No'}}
+        </dd>
+      </dl>
+    </div>
+
+    {{! ROW 2 }}
+    <div class="grid-6">
+      <dl class="span-2">
+        <dt>Accession Numbers</dt>
+        <dd>
+          {{model.accessionNumbers}}
+        </dd>
+      </dl>
+      <dl class="span-2">
+        <dt>Genbank</dt>
+        <dd>
+          {{genbank-url genbank=model.genbank}}
+        </dd>
+      </dl>
+      <dl class="span-2">
+        <dt>Whole Genome Sequence</dt>
+        <dd>
+          {{model.wholeGenomeSequence}}
+        </dd>
+      </dl>
+    </div>
+
+    {{! ROW 3 }}
+    <div class="grid-4">
+      <dl class="span-4">
+        <dt>Isolated From</dt>
+        <dd>
+          {{model.isolatedFrom}}
+        </dd>
+      </dl>
+    </div>
+
+    {{! ROW 4 }}
+    <div class="grid-4">
+      <dl class="span-4">
+        <dt>Notes</dt>
+        <dd>
+          {{model.notes}}
+        </dd>
+      </dl>
+    </div>
+
+    {{! ROW 5 }}
+    <div class="grid-4">
+      <dl class="span-1">
+        <dt>Record Created</dt>
+        <dd>{{null-time model.createdAt 'LL'}}</dd>
+      </dl>
+      <dl class="span-1">
+        <dt>Record Updated</dt>
+        <dd>{{null-time model.updatedAt 'LL'}}</dd>
+      </dl>
+      <dl class="span-1">
+        <dt>Record Deleted</dt>
+        <dd>{{null-time model.deletedAt 'LL'}}</dd>
+      </dl>
+      <dl class="span-1"></dl>
+    </div>
+  </fieldset>
+</div>
+{{#if userCanEdit}}
+  <br>
+  {{#link-to 'species.edit' model class="button-gray smaller"}}
+    Edit
+  {{/link-to}}
+{{/if}}

app/router.js

@@ -17,10 +17,13 @@ Router.map(function() {
     this.route('show', { path: ':species_id' });
     this.route('edit', { path: ':species_id/edit' });
   });
+
   this.route('strains', function() {
     this.route('new');
     this.route('show', { path: ':strain_id' });
+    this.route('edit', { path: ':strain_id/edit' });
   });
+
   this.route('users', function() {
     this.route('new', function() {
       this.route('fail');