closes #368. ability to add in metacode colors

app/assets/stylesheets/application.css

@@ -2151,6 +2151,9 @@ float: left;
 .blackBox td.iconURL {
     max-width: 415px;
     word-wrap: break-word;
+}
+.blackBox td.iconColor {
+    
 }
 .blackBox .field {
     margin: 15px 0 5px;

app/assets/stylesheets/base.css

@@ -292,7 +292,7 @@ cursor: pointer;
   display: none;
   width: 90%;
   padding: 13px 0 9px 10%;
-  background-color: #64BC61;
+  background-color: #E0E0E0;
   color: #424242;
 }
 .permission.canEdit .metacodeTitle {

app/views/layouts/application.html.erb

@@ -77,6 +77,7 @@
 <%= render :partial => 'layouts/lightboxes' %>
 <%= render :partial => 'layouts/templates' %>
 
+<%= render :partial => 'shared/metacodeBgColors' %>
 <style type='text/css'>@import url('http://getbarometer.s3.amazonaws.com/assets/barometer/css/barometer.css');</style>
 <script src='http://getbarometer.s3.amazonaws.com/assets/barometer/javascripts/barometer.js' 
         type='text/javascript'></script>

app/views/metacodes/_form.html.erb

@@ -21,6 +21,11 @@
     <%= f.text_field :icon %>
     <div class="clearfloat"></div>
   </div>
+  <div class="field">
+    <%= f.label :color, "Color (hex with # sign)" %>
+    <%= f.text_field :color %>
+    <div class="clearfloat"></div>
+  </div>
   <div class="actions">
     <%= link_to 'Cancel', metacodes_path, { :class => 'button', 'data-bypass' => 'true' } %>
     <%= f.submit :class => 'add' %>

app/views/metacodes/index.html.erb

@@ -6,6 +6,7 @@
     <tr>
       <th>Name</th>
       <th>Icon</th>
+      <th>Color</th>
       <th></th>
       <th></th>
     </tr>
@@ -14,6 +15,13 @@
     <tr>
       <td><%= metacode.name %></td>
       <td class="iconURL"><%= metacode.icon %></td>
+      <% if metacode.color %>
+        <td class="iconColor" style="background-color: <%= metacode.color %>">
+          <%= metacode.color %>
+        </td>
+      <% else %>
+        <td></td>
+      <% end %>
       <td><img width='40' src='<%= metacode.icon %>' /></td>
       <td><%= link_to 'Edit', edit_metacode_path(metacode), :data => { :bypass => 'true'} %></td>
     </tr>

app/views/shared/_metacodeBgColors.html.erb

@@ -0,0 +1,9 @@
+<style>
+<% Metacode.all.each do |m| %>
+	<% if m.color %>
+		<%= ".mbg" + m.name.gsub(/\s+/, "") + "{" %>
+		<%= "background-color:" + m.color + " !important;" %>
+		<%= "}" %>
+	<% end %>
+<% end %>
+</style>

db/migrate/20140930013020_add_color_to_metacodes.rb

@@ -0,0 +1,5 @@
+class AddColorToMetacodes < ActiveRecord::Migration
+  def change
+    add_column :metacodes, :color, :string
+  end
+end

db/migrate/20140930013020_add_color_to_metacodes.rb~

@@ -0,0 +1,5 @@
+class AddColorToMetacodes < ActiveRecord::Migration
+  def change
+    add_column :metacodes, :color, :string
+  end
+end

db/schema.rb

@@ -11,7 +11,7 @@
 #
 # It's strongly recommended to check this file into your version control system.
 
-ActiveRecord::Schema.define(:version => 20140815162253) do
+ActiveRecord::Schema.define(:version => 20140930013020) do
 
   create_table "in_metacode_sets", :force => true do |t|
     t.integer  "metacode_id"
@@ -66,6 +66,7 @@ ActiveRecord::Schema.define(:version => 20140815162253) do
     t.string   "icon"
     t.datetime "created_at", :null => false
     t.datetime "updated_at", :null => false
+    t.string   "color"
   end
 
   create_table "synapses", :force => true do |t|

metacode_backgrounds.css

@@ -0,0 +1,120 @@
+.mbgAction {
+    background-color: #bd6c85 !important;
+}
+.mbgActivity {
+    background-color: #6ebf65 !important;    
+}
+.mbgArgument {
+    background-color: #7FAEFD !important;    
+}
+.mbgBizarre {
+    background-color: #bdb25e !important;    
+}
+.mbgCatalyst {
+    background-color: #EF8964 !important;    
+}
+.mbgClosed {
+    background-color: #ABB49F !important;    
+}
+.mbgCon {
+    background-color: #CF7C74 !important;    
+}
+.mbgDecision {
+    background-color: #cca866 !important;    
+}
+.mbgExample {
+    background-color: #598559 !important;    
+}
+.mbgExperience {
+    background-color: #BE995F !important;    
+}
+.mbgForesight {
+    background-color: #b0b0b0 !important;    
+}
+.mbgFutureDev {
+    background-color: #25A17F !important;    
+}
+.mbgGoodPractice {
+    background-color: #BD9E86 !important;    
+}
+.mbgGroup {
+    background-color: #7076BC !important;    
+}
+.mbgIdea {
+    background-color: #c4bc5e !important;    
+}
+.mbgImplication {
+    background-color: #83DECA !important;    
+}
+.mbgInsight {
+    background-color: #B074AD !important;    
+}
+.mbgIntention {
+    background-color: #baeaff !important;    
+}
+.mbgKnowledge {
+    background-color: #60acf7 !important;    
+}
+.mbgList {
+    background-color: #B7A499 !important;    
+}
+.mbgLocation {
+    background-color: #abd9a7 !important;    
+}
+.mbgMovieMap {
+    background-color: #a5a0de !important;    
+}
+.mbgNote {
+    background-color: #a389a1 !important;    
+}
+.mbgOpenIssue {
+    background-color: #9bbf71 !important;    
+}
+.mbgOpinion {
+    background-color: #54a19d !important;    
+}
+.mbgOpportunity {
+    background-color: #889F64 !important;    
+}
+.mbgPerson {
+    background-color: #de925f !important;    
+}
+.mbgPlatform {
+    background-color: #21C8FE !important;    
+}
+.mbgPro {
+    background-color: #89b879 !important;    
+}
+.mbgProblem {
+    background-color: #99cfc4 !important;    
+}
+.mbgQuestion {
+    background-color: #709899 !important;    
+}
+.mbgReference {
+    background-color: #A7A7A7 !important;    
+}
+.mbgRequirement {
+    background-color: #d2a7d4 !important;    
+}
+.mbgResearch {
+    background-color: #CD8E89 !important;    
+}
+.mbgResource {
+    background-color: #c98c63 !important;    
+}
+.mbgRole {
+    background-color: #a8595d !important;    
+}
+.mbgTask {
+    background-color: #2f89ba !important;    
+}
+.mbgTool {
+    background-color: #828282 !important;    
+}
+.mbgTrajectory {
+    background-color: #b3953d !important;    
+}
+.mbgWildcard {
+    background-color: #73c7de !important;    
+}