Added color picking to library properties

app/imports/api/creature/CreatureProperties.js

@@ -2,6 +2,7 @@ import { Meteor } from 'meteor/meteor';
 import { Mongo } from 'meteor/mongo';
 import { ValidatedMethod } from 'meteor/mdg:validated-method';
 import SimpleSchema from 'simpl-schema';
+import ColorSchema from '/imports/api/properties/subSchemas/ColorSchema.js';
 import ChildSchema, { RefSchema } from '/imports/api/parenting/ChildSchema.js';
 import { recomputeCreature } from '/imports/api/creature/computation/recomputeCreature.js';
 import LibraryNodes from '/imports/api/library/LibraryNodes.js';
@@ -41,6 +42,7 @@ for (let key in propertySchemasIndex){
 	let schema = new SimpleSchema({});
 	schema.extend(propertySchemasIndex[key]);
 	schema.extend(CreaturePropertySchema);
+  schema.extend(ColorSchema);
 	schema.extend(ChildSchema);
 	schema.extend(SoftRemovableSchema);
 	CreatureProperties.attachSchema(schema, {

app/imports/api/library/LibraryNodes.js

@@ -2,6 +2,7 @@ import { Meteor } from 'meteor/meteor';
 import { Mongo } from 'meteor/mongo';
 import { ValidatedMethod } from 'meteor/mdg:validated-method';
 import SimpleSchema from 'simpl-schema';
+import ColorSchema from '/imports/api/properties/subSchemas/ColorSchema.js';
 import ChildSchema from '/imports/api/parenting/ChildSchema.js';
 import propertySchemasIndex from '/imports/api/properties/propertySchemasIndex.js';
 import Libraries from '/imports/api/library/Libraries.js';
@@ -28,6 +29,7 @@ let LibraryNodeSchema = new SimpleSchema({
 for (let key in propertySchemasIndex){
 	let schema = new SimpleSchema({});
 	schema.extend(LibraryNodeSchema);
+  schema.extend(ColorSchema);
 	schema.extend(propertySchemasIndex[key]);
 	schema.extend(ChildSchema);
 	schema.extend(SoftRemovableSchema);

app/imports/api/parenting/order.js

@@ -133,7 +133,7 @@ export function reorderDocs({collection, ancestorId}){
       });
     }
   });
-  if (Meteor.isServer){
+  if (Meteor.isServer && bulkWrite.length){
     collection.rawCollection().bulkWrite(
       bulkWrite,
       {ordered : false},

app/imports/ui/components/ColorPicker.vue

@@ -27,7 +27,7 @@
           >
             <v-scroll-y-transition>
               <v-icon
-                v-if="colorOption === color"
+                v-if="kebabColor === colorOption"
                 :class="{dark: isDark(colorOption, shade)}"
               >
                 check
@@ -49,13 +49,13 @@
             <div
               v-for="shadeOption in shades"
               :key="shadeOption"
-              :class="[color, shadeOption]"
+              :class="[kebabColor, shadeOption]"
               class="shade-swatch d-flex align-center"
               @click="shade = shadeOption"
             >
               <v-scroll-y-transition>
                 <v-icon
-                  v-if="shade === shadeOption"
+                  v-if="kebabShade === shadeOption"
                   :class="{dark: isDark(color, shade)}"
                 >
                   check
@@ -104,9 +104,9 @@
   // Create an index of hex colors and what color/shade combination makes them
   let colorIndex = {};
   for (let color in vuetifyColors){
-    color = camelToKebabCase(color);
+    color = kebabToCamelCase(color);
     for (let shade in vuetifyColors[color]){
-      shade = camelToKebabCase(shade);
+      shade = kebabToCamelCase(shade);
       colorIndex[vuetifyColors[color][shade]] = {color, shade};
     }
   }
@@ -167,7 +167,6 @@
           return this.combination && this.combination.color;
         },
         set(newColor){
-          console.log(newColor, colorToHex(newColor, this.shade));
           this.$emit('input', colorToHex(newColor, this.shade));
         },
       },
@@ -176,7 +175,6 @@
           return this.combination && this.combination.shade;
         },
         set(newShade){
-          console.log(newShade, colorToHex(this.color, newShade));
           this.$emit('input', colorToHex(this.color, newShade));
         },
       },

app/imports/ui/components/propertyToolbar.vue

@@ -21,7 +21,7 @@
       >
         <v-spacer />
         <color-picker
-          v-if="false"
+          v-if="$listeners && $listeners['color-changed']"
           :value="model.color"
           @input="colorChanged"
         />

app/imports/ui/properties/shared/PropertyIcon.vue

@@ -1,5 +1,7 @@
 <template lang="html">
-  <v-icon>{{icon}}</v-icon>
+  <v-icon :color="color">
+    {{ icon }}
+  </v-icon>
 </template>
 
 <script>
@@ -8,6 +10,7 @@ import { getPropertyIcon } from '/imports/constants/PROPERTIES.js';
 export default {
 	props: {
 		type: String,
+    color: String,
 	},
 	computed: {
 		icon(){

app/imports/ui/properties/treeNodeViews/AdjustmentTreeNode.vue

@@ -4,6 +4,7 @@
       class="mr-2"
       :type="model.type"
       :class="selected && 'primary--text'"
+      :color="model.color"
     />
     <div
       class="text-no-wrap text-truncate"

app/imports/ui/properties/treeNodeViews/DamageTreeNode.vue

@@ -4,6 +4,7 @@
       class="mr-2"
       :type="model.type"
       :class="selected && 'primary--text'"
+      :color="model.color"
     />
     <div
       class="text-no-wrap text-truncate"

app/imports/ui/properties/treeNodeViews/DefaultTreeNode.vue

@@ -3,6 +3,7 @@
     <property-icon
       class="mr-2"
       :type="model.type"
+      :color="model.color"
       :class="selected && 'primary--text'"
     />
     <div class="text-no-wrap text-truncate">

app/imports/ui/properties/treeNodeViews/EffectTreeNode.vue

@@ -3,6 +3,7 @@
     <v-icon
       class="mr-2"
       :class="selected && 'primary--text'"
+      :color="model.color"
     >
       {{ effectIcon }}
     </v-icon>

app/imports/ui/properties/treeNodeViews/ItemTreeNode.vue

@@ -3,6 +3,7 @@
     <v-icon
       class="mr-2"
       :class="selected && 'primary--text'"
+      :color="model.color"
     >
       {{ model.equipped ? 'check_box' : 'check_box_outline_blank' }}
     </v-icon>