Merge branch 'master' into clostridium

* master:
  Fix broken strain reference
  Rich text species and strains
  Add in quill WYSIWYG

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

@@ -26,7 +26,7 @@
     <div data-row-span="2">
       <div data-field-span="2">
         <label>Etymology</label>
-        {{textarea value=species.etymology cols="70" rows="5"}}
+        {{text-editor value=species.etymology}}
       </div>
     </div>
   </fieldset>

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

@@ -25,7 +25,7 @@
     <div data-row-span="2">
       <div data-field-span="2">
         <label>Isolated From</label>
-        {{textarea value=strain.isolatedFrom cols="70" rows="5"}}
+        {{text-editor value=strain.isolatedFrom}}
       </div>
     </div>
     <div data-row-span="3">
@@ -45,7 +45,7 @@
     <div data-row-span="2">
       <div data-field-span="2">
         <label>Notes</label>
-        {{textarea value=strain.notes cols="70" rows="5"}}
+        {{text-editor value=strain.notes}}
       </div>
     </div>
   </fieldset>

app/pods/components/text-editor/component.js

@@ -0,0 +1,32 @@
+import Ember from 'ember';
+/* global Quill */
+
+export default Ember.Component.extend({
+  quill: null,
+  value: null, // passed in
+
+  didInsertElement: function() {
+    let quill = new Quill(`#${this.get('elementId')} .editor`, {
+      formats: ['bold', 'italic', 'underline'],
+      modules: {
+        'toolbar': { container: `#${this.get('elementId')} .toolbar` }
+      },
+      theme: 'snow'
+    });
+
+    let val = this.get('value');
+    if (!val) {
+      val = '';
+    }
+    quill.setHTML(val);
+
+    quill.on('text-change', (delta, source) => {
+      if (source === 'user') {
+        this.set('value', Ember.$(quill.getHTML()).html());
+      }
+    });
+
+    this.set('quill', quill);
+  },
+
+});

app/pods/components/text-editor/template.hbs

@@ -0,0 +1,11 @@
+<div class="ql-toolbar toolbar">
+  <span class="ql-format-group">
+    <span title="Bold" class="ql-format-button ql-bold"></span>
+    <span class="ql-format-separator"></span>
+    <span title="Italic" class="ql-format-button ql-italic"></span>
+    <span class="ql-format-separator"></span>
+    <span title="Underline" class="ql-format-button ql-underline"></span>
+  </span>
+</div>
+
+<div class="ql-editor editor"></div>

app/pods/protected/species/show/template.hbs

@@ -34,7 +34,7 @@
         <dl class="span-1">
           <dt>Etymology</dt>
           <dd>
-            {{model.etymology}}
+            {{{model.etymology}}}
           </dd>
         </dl>
       </div>

app/pods/protected/strains/edit/controller.js

@@ -18,7 +18,7 @@ export default Ember.Controller.extend({
     },
 
     cancel: function() {
-      let strain = this.get('protected.strain');
+      let strain = this.get('strain');
 
       strain.get('errors').clear();
       strain.rollback();

app/pods/protected/strains/show/template.hbs

@@ -49,7 +49,7 @@
       <dl class="span-1">
         <dt>Isolated From</dt>
         <dd>
-          {{model.isolatedFrom}}
+          {{{model.isolatedFrom}}}
         </dd>
       </dl>
     </div>
@@ -59,7 +59,7 @@
       <dl class="span-1">
         <dt>Notes</dt>
         <dd>
-          {{model.notes}}
+          {{{model.notes}}}
         </dd>
       </dl>
     </div>

app/styles/app.css

@@ -1,3 +1,7 @@
+.ql-editor {
+  font-size: 18px;
+}
+
 .overflow-div {
   white-space: nowrap;
   overflow: auto;

bower.json

@@ -18,6 +18,7 @@
     "select2": "3.5.2",
     "antiscroll": "git://github.com/azirbel/antiscroll.git#90391fb371c7be769bc32e7287c5271981428356",
     "jquery-mousewheel": "~3.1.4",
-    "jquery-ui": "~1.11.4"
+    "jquery-ui": "~1.11.4",
+    "quill": "~0.19.14"
   }
 }

config/environment.js

@@ -32,7 +32,7 @@ module.exports = function(environment) {
       'default-src': "'none'",
       'script-src': "'self'",
       'font-src': "'self'",
-      'img-src': "'self'",
+      'img-src': "'self' data:",
       'style-src': "'self' 'unsafe-inline'",
       'media-src': "'self'"
     },

ember-cli-build.js

@@ -10,6 +10,9 @@ module.exports = function(defaults) {
   // flakes (and deps)
   app.import('bower_components/flakes/css/all.css');
   app.import('bower_components/gridforms/gridforms/gridforms.css');
+  // quill
+  app.import('bower_components/quill/dist/quill.base.css');
+  app.import('bower_components/quill/dist/quill.snow.css');
 
   // LIBS ////////////////////////////////////////////////////////////////////////
   // flakes (and deps)
@@ -19,6 +22,8 @@ module.exports = function(defaults) {
   app.import('bower_components/flakes/js/base.js');
   // moment
   app.import('bower_components/moment/moment.js');
+  // quill
+  app.import('bower_components/quill/dist/quill.min.js');
 
   return app.toTree();
 };