SVG code hints cleanup

Added color names support.

SVG code hint refactor

Added transparent, currentColor

SVG code hints refactoring

Author: sprintr

src/extensions/default/SVGCodeHints/SVGAttributes.json

@@ -11,6 +11,15 @@
     "animate/fill": {
         "attribOptions": ["freeze", "remove"]
     },
+    "animateColor/fill": {
+        "attribOptions": ["freeze", "remove"]
+    },
+    "animateMotion/fill": {
+        "attribOptions": ["freeze", "remove"]
+    },
+    "animateTransform/fill": {
+        "attribOptions": ["freeze", "remove"]
+    },
     "animateTransform/type": {
         "attribOptions": ["rotate", "scale", "skewX", "skewY", "translate"]
     },
@@ -38,6 +47,9 @@
     "clipPathUnits": {
         "attribOptions": ["objectBoundingBox", "userSpaceOnUse"]
     },
+    "color": {
+        "type": "color"
+    },
     "color-interpolation": {
         "attribOptions": ["auto", "inherit", "linearRGB", "sRGB"]
     },
@@ -104,6 +116,9 @@
     "feTurbulence/type": {
         "attribOptions": ["fractalNoise", "turbulence"]
     },
+    "fill": {
+        "type": "color"
+    },
     "fill-opacity": {
         "attribOptions": ["inherit"]
     },
@@ -116,6 +131,9 @@
     "filterUnits": {
         "attribOptions": ["objectBoundingBox", "userSpaceOnUse"]
     },
+    "flood-color": {
+        "type": "color"
+    },
     "flood-opacity": {
         "attribOptions": ["inherit"]
     },
@@ -170,6 +188,9 @@
     "letter-spacing": {
         "attribOptions": ["inherit", "normal"]
     },
+    "lighting-color": {
+        "type": "color"
+    },
     "marker-end": {
         "attribOptions": ["inherit", "none"]
     },
@@ -262,6 +283,9 @@
     "script/type": {
         "attribOptions": ["application/ecmascript", "application/javascript", "application/x-ecmascript", "application/x-javascript", "text/ecmascript", "text/javascript", "text/jscript", "text/livescript", "text/tcl", "text/x-ecmascript", "text/x-javascript"]
     },
+    "set/fill": {
+        "attribOptions": ["freeze", "remove"]
+    },
     "shape-rendering": {
         "attribOptions": ["auto", "crispEdges", "geometricPrecision", "inherit", "optimizeSpeed"]
     },
@@ -274,9 +298,15 @@
     "stitchTiles": {
         "attribOptions": ["noStitch", "stitch"]
     },
+    "stop-color": {
+        "type": "color"
+    },
     "stop-opacity": {
         "attribOptions": ["inherit"]
     },
+    "stroke": {
+        "type": "color"
+    },
     "stroke-dasharray": {
         "attribOptions": ["inherit", "none"]
     },

src/extensions/default/SVGCodeHints/main.js

@@ -34,6 +34,8 @@ define(function (require, exports, module) {
         XMLUtils            = brackets.getModule("language/XMLUtils"),
         StringMatch         = brackets.getModule("utils/StringMatch"),
         ExtensionUtils      = brackets.getModule("utils/ExtensionUtils"),
+        ColorUtils          = brackets.getModule("utils/ColorUtils"),
+        _                   = brackets.getModule("thirdparty/lodash"),
         SVGTags             = require("text!SVGTags.json"),
         SVGAttributes       = require("text!SVGAttributes.json"),
         cachedAttributes    = {},
@@ -85,7 +87,7 @@ define(function (require, exports, module) {
                     cachedAttributes[tagName] = cachedAttributes[tagName].concat(tagData.attributeGroups[group]);
                 }
             });
-            cachedAttributes[tagName].sort();
+            cachedAttributes[tagName] = _.uniq(cachedAttributes[tagName].sort(), true);
         }
         return cachedAttributes[tagName];
     }
@@ -96,7 +98,7 @@ define(function (require, exports, module) {
      * 
      * @param {Array.<Object>} hints - the list of hints to format
      * @param {string} query - querystring used for highlighting matched
-     *      poritions of each hint
+     *      portions of each hint
      * @return {Array.jQuery} sorted Array of jQuery DOM elements to insert
      */
     function formatHints(hints, query) {
@@ -206,6 +208,11 @@ define(function (require, exports, module) {
                 } else if (attributeData[tagInfo.attrName]) {
                     options = attributeData[tagInfo.attrName].attribOptions;
                     isMultiple = attributeData[tagInfo.attrName].multiple;
+
+                    if (attributeData[tagInfo.attrName].type === "color") {
+                        options = ColorUtils.COLOR_NAMES;
+                        options = options.concat(["currentColor", "transparent"]);
+                    }
                 }
 
                 // Stop if the attribute doesn't support multiple options.

src/extensions/default/SVGCodeHints/styles/brackets-svg-hints.css

@@ -23,7 +23,6 @@
 
 .brackets-svg-hints .matched-hint {
     font-weight: 500;
-    color: #000;
 }
 .dark .brackets-svg-hints .matched-hint {
     color: #ccc;