Merge branch 'release/v0.2'

package.json

@@ -1,7 +1,7 @@
 {
   "name": "color-name-guru",
-  "version": "0.1.2",
-  "description": "Color Name Guru gives color name suggestions for your iOS, OSX, Web and Android projects.",
+  "version": "0.2",
+  "description": "Color name suggestions for your iOS, OSX, Web and Android projects.",
   "author": {
     "name": "M.Gökay Borulday"
   },
@@ -18,7 +18,13 @@
       "ios",
       "osx",
       "android"
-    ]
+    ],
+    "options": [{
+      "name": "Display resources from linked and parent styleguides",
+      "type": "switch",
+      "id": "useLinkedStyleguides",
+      "default": true
+    }]
   },
   "dependencies": {
     "change-case": "^3.0.2",

src/constants.js

@@ -0,0 +1,3 @@
+export var OPTION_NAMES = {
+    USE_LINKED_STYLEGUIDES: "useLinkedStyleguides"
+}; 

src/index.js

@@ -10,88 +10,51 @@
   */
 
 const SPACE = 2;
-const messageKingdom = [
-    "🕺 Holly dance!", 
-    "💃 Holly dance!", 
-    "🤩 What a name!", 
-    "🎸 You rock!", 
-    "🤘 You rock!", 
-    "🎳 Strike!", 
-    "🙌 Perfect name!", 
-    "🥇 Golden medal!", 
-    "🎯 Hit the Bull's eye",
-    "👆 That works!",
-    "🧠 Brilliant choice!"
-];
 
-import namedColors from 'color-name-list';
-import nearestColor from 'nearest-color';
-import changeCase from 'change-case';
+import { OPTION_NAMES } from "./constants";
+import { alternateColor, getResourceContainer, getResources } from "./utils";
 
-function styleguideColors(context, colors) {
-    const alternateColors = colors.map(function(color) {
-        return alternateColor(context.project.type, color);
-    });
+function colors(context) {
+    var useLinkedStyleguides = context.getOption(OPTION_NAMES.USE_LINKED_STYLEGUIDES);
+    var { container, type } = getResourceContainer(context);
+    var allColors = getResources(container, type, useLinkedStyleguides, "colors");
 
+    const output = JSON.stringify({
+        source: type,
+        content: allColors.map(function(color) {
+            return alternateColor(container.type, color);
+        })
+    }, null, SPACE);
+
     return {
-        code: JSON.stringify(alternateColors, null, SPACE),
+        code: output,
         language: "json"
     };
 }
 
-function comment(context, text) {
-    return '// Color Name Suggestions\n' +
-           '// No need to change if name suggestion starts with an emoji';
-}
-
 /**
- * Suggest an alternate color
- * @param {String} projectType project type on Zeplin
- * @param {Object} color current color information
- * @returns {Object} 
+ * 
+ * Deprecated Methods
  */
-function alternateColor(projectType, color) {
-    const colors = {};
 
-    namedColors.forEach(namedColor => {
-        colors[namedColor.name] = namedColor.hex;
+function styleguideColors(context, colors) {
+    const alternateColors = colors.map(function(color) {
+        return alternateColor(context.project.type, color);
     });
 
-    const nearestColorInformation = nearestColor.from(colors);
-
-    const alternateColor = nearestColorInformation({ r: color.r, g: color.g, b: color.b });
-    const alternateColorName = alternateColor.name + (color.a == 1 ? "" : parseInt(color.a * 100));
-
-    let suggestion = "";
-    switch (projectType) {
-        case "ios":
-        case "osx":
-            suggestion = changeCase.camelCase(alternateColorName);
-            break;
-
-        case "web":
-            suggestion = changeCase.paramCase(alternateColorName);
-            break;
-
-        case "android":
-            suggestion = changeCase.snakeCase(alternateColorName);
-            break;
-
-        default:
-            suggestion = "";
-    }
-
-    if (suggestion.toLowerCase() == color.name.toLowerCase()) { 
-        suggestion = messageKingdom[Math.floor(Math.random() * messageKingdom.length)];
-    }
-
     return {
-        current: color.name,
-        suggestion: suggestion
+        code: JSON.stringify(alternateColors, null, SPACE),
+        language: "json"
     };
 }
 
+function comment(context, text) {
+    return '// Color Name Suggestions\n' +
+           '// No need to change if the name suggestion starts with an emoji';
+}
+
 export default {
+    colors,
     styleguideColors,
     comment
 };

src/utils.js

@@ -0,0 +1,104 @@
+import namedColors from 'color-name-list';
+import nearestColor from 'nearest-color';
+import changeCase from 'change-case';
+
+const messageKingdom = [
+    "🕺 Holly dance!", 
+    "💃 Holly dance!", 
+    "🤩 What a name!", 
+    "🎸 You rock!", 
+    "🤘 You rock!", 
+    "🎳 Strike!", 
+    "🙌 Perfect name!", 
+    "🥇 Golden medal!", 
+    "🎯 Hit the Bull's eye",
+    "👆 That works!",
+    "🧠 Brilliant choice!"
+];
+
+/**
+ * Suggest an alternate color
+ * @param {String} containerType project/styleguide type on Zeplin
+ * @param {Object} color current color information
+ * @returns {Object} 
+ */
+function alternateColor(containerType, color) {
+    const colors = {};
+
+    namedColors.forEach(namedColor => {
+        colors[namedColor.name] = namedColor.hex;
+    });
+
+    const nearestColorInformation = nearestColor.from(colors);
+
+    const alternateColor = nearestColorInformation({ r: color.r, g: color.g, b: color.b });
+    const alternateColorName = alternateColor.name + (color.a == 1 ? "" : parseInt(color.a * 100));
+
+    let suggestion = "";
+    switch (containerType) {
+        case "ios":
+        case "osx":
+            suggestion = changeCase.camelCase(alternateColorName);
+            break;
+
+        case "web":
+            suggestion = changeCase.paramCase(alternateColorName);
+            break;
+
+        case "android":
+            suggestion = changeCase.snakeCase(alternateColorName);
+            break;
+
+        default:
+            suggestion = "";
+    }
+
+    if (suggestion.toLowerCase() == color.name.toLowerCase()) { 
+        suggestion = messageKingdom[Math.floor(Math.random() * messageKingdom.length)];
+    }
+
+    return {
+        current: color.name,
+        suggestion: suggestion
+    };
+}
+
+function getLinkedResources(container, type, resource) {
+    const isProject = type === "project";
+    let resources = [...container[resource]];
+    let itContainer = isProject ? container.linkedStyleguide : container.parent;
+    while (itContainer) {
+        resources = [...resources, ...itContainer[resource]];
+        itContainer = itContainer.parent;
+    }
+
+    return resources;
+}
+
+function getResources(container, type, useLinkedStyleguides, resourceKey) {
+    if (useLinkedStyleguides) {
+        return getLinkedResources(container, type, resourceKey);
+    }
+
+    return container[resourceKey];
+}
+
+function getResourceContainer(context) {
+    if (context.styleguide) {
+        return {
+            container: context.styleguide,
+            type: "styleguide"
+        };
+    }
+
+    return {
+        container: context.project,
+        type: "project"
+    };
+}
+
+export {
+    alternateColor,
+    getResources,
+    getResourceContainer
+};