From 209b99055ffb68f71502c52e5ef7b69cf067e319 Mon Sep 17 00:00:00 2001 From: griffin-stewie Date: Sun, 18 Feb 2018 17:27:00 +0900 Subject: [PATCH] Add Sketch Measure JSON import JSON support. MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This export supports JSON for Sketch Measure’s import format. --- .../Contents/Sketch/build/ColorFormatter.js | 1 + .../Contents/Sketch/build/Formats.js | 58 ++++++++++++++++++- .../Contents/Sketch/build/FormatterBase.js | 6 +- .../Contents/Sketch/src/ColorFormatter.coffee | 1 + .../src/formats/SketchMeasureFormatter.coffee | 35 +++++++++++ 5 files changed, 99 insertions(+), 2 deletions(-) create mode 100644 Prism.sketchplugin/Contents/Sketch/src/formats/SketchMeasureFormatter.coffee diff --git a/Prism.sketchplugin/Contents/Sketch/build/ColorFormatter.js b/Prism.sketchplugin/Contents/Sketch/build/ColorFormatter.js index c65b13e..19e5ad4 100644 --- a/Prism.sketchplugin/Contents/Sketch/build/ColorFormatter.js +++ b/Prism.sketchplugin/Contents/Sketch/build/ColorFormatter.js @@ -31,6 +31,7 @@ ColorFormatter = (function() { this.FORMATS.push(new UIColorObjCFormatter()); this.FORMATS.push(new AndroidJavaFormatter()); this.FORMATS.push(new AndroidXMLFormatter()); + this.FORMATS.push(new SketchMeasureFormatter()); ref = this.FORMATS; for (i = 0, len = ref.length; i < len; i++) { format = ref[i]; diff --git a/Prism.sketchplugin/Contents/Sketch/build/Formats.js b/Prism.sketchplugin/Contents/Sketch/build/Formats.js index be353e0..099929f 100644 --- a/Prism.sketchplugin/Contents/Sketch/build/Formats.js +++ b/Prism.sketchplugin/Contents/Sketch/build/Formats.js @@ -1,5 +1,5 @@ // Generated by CoffeeScript 1.12.7 -var AndroidJavaFormatter, AndroidXMLFormatter, CLRFormatter, ColorSetFormatter, HexFormatter, RGBACSSFormatter, SASSFormatter, UIColorObjCFormatter, UIColorSwiftFormatter, +var AndroidJavaFormatter, AndroidXMLFormatter, CLRFormatter, ColorSetFormatter, HexFormatter, RGBACSSFormatter, SASSFormatter, SketchMeasureFormatter, UIColorObjCFormatter, UIColorSwiftFormatter, extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }, hasProp = {}.hasOwnProperty; @@ -284,6 +284,62 @@ SASSFormatter = (function(superClass) { })(FormatterBase); +SketchMeasureFormatter = (function(superClass) { + extend(SketchMeasureFormatter, superClass); + + function SketchMeasureFormatter() { + return SketchMeasureFormatter.__super__.constructor.apply(this, arguments); + } + + SketchMeasureFormatter.prototype.id = function() { + return "SKETCHMESURE_JSON"; + }; + + SketchMeasureFormatter.prototype.name = function() { + return "Sketch Measure (JSON)"; + }; + + SketchMeasureFormatter.prototype.format = function() { + return "colors.json"; + }; + + SketchMeasureFormatter.prototype.supportClipboard = function() { + return true; + }; + + SketchMeasureFormatter.prototype.exportAsString = function(colorDictionaries) { + var colorDictionary, i, len, obj, root; + root = []; + for (i = 0, len = colorDictionaries.length; i < len; i++) { + colorDictionary = colorDictionaries[i]; + log(colorDictionary); + obj = { + "name": "" + (colorDictionary.name.trim()), + "color": this.colorToDictionaryToJSON(colorDictionary) + }; + root.push(obj); + } + return JSON.stringify(root, void 0, 4); + }; + + SketchMeasureFormatter.prototype.colorToDictionaryToJSON = function(colorDictionary) { + var json; + return json = { + r: Math.round(colorDictionary.red * 255), + g: Math.round(colorDictionary.green * 255), + b: Math.round(colorDictionary.blue * 255), + a: Math.round(colorDictionary.alpha * 100) / 100, + "color-hex": ("\#" + colorDictionary.hex + " ") + ((Math.round(colorDictionary.alpha * 100)) + "%"), + "argb-hex": "\#" + (helperHex(colorDictionary.alpha * 255) + colorDictionary.hex), + "css-rgba": "rgba(" + (Math.round(colorDictionary.red * 255)) + "," + (Math.round(colorDictionary.green * 255)) + "," + (Math.round(colorDictionary.blue * 255)) + "," + (Math.round(colorDictionary.alpha * 100) / 100) + ")", + "ui-color": "(r:" + (parseFloat(colorDictionary.red).toFixed(3)) + " g:" + (parseFloat(colorDictionary.green).toFixed(3)) + " b:" + (parseFloat(colorDictionary.blue).toFixed(3)) + " a:" + (parseFloat(colorDictionary.alpha).toFixed(3)) + ")" + }; + }; + + return SketchMeasureFormatter; + +})(FormatterBase); + UIColorObjCFormatter = (function(superClass) { extend(UIColorObjCFormatter, superClass); diff --git a/Prism.sketchplugin/Contents/Sketch/build/FormatterBase.js b/Prism.sketchplugin/Contents/Sketch/build/FormatterBase.js index fdc9a3f..40e4d48 100644 --- a/Prism.sketchplugin/Contents/Sketch/build/FormatterBase.js +++ b/Prism.sketchplugin/Contents/Sketch/build/FormatterBase.js @@ -38,6 +38,7 @@ FormatterBase = (function() { format Uses default file name when its saved. Override this at Subclass. + This method will be called only `type` returns `EXPORT_TYPE_FILE`. */ FormatterBase.prototype.format = function() {}; @@ -47,6 +48,8 @@ FormatterBase = (function() { type `EXPORT_TYPE_FILE` or `EXPORT_TYPE_FILES`. Override this at Subclass. + `EXPORT_TYPE_FILE` means 1 file will be exported. and Prism shows Save dialog. + `EXPORT_TYPE_FILES` means several files will be exported. Prism shows dialog to get export directory. */ FormatterBase.prototype.type = function() { @@ -57,7 +60,8 @@ FormatterBase = (function() { /* supportClipboard - If format supports clipboard then returns `true`. + If format supports clipboard then returns `true`. Text format should better support this basically. + If your format is binary then should return `false`. */ FormatterBase.prototype.supportClipboard = function() { diff --git a/Prism.sketchplugin/Contents/Sketch/src/ColorFormatter.coffee b/Prism.sketchplugin/Contents/Sketch/src/ColorFormatter.coffee index 230ba1d..0081558 100644 --- a/Prism.sketchplugin/Contents/Sketch/src/ColorFormatter.coffee +++ b/Prism.sketchplugin/Contents/Sketch/src/ColorFormatter.coffee @@ -27,6 +27,7 @@ class ColorFormatter @FORMATS.push new UIColorObjCFormatter() @FORMATS.push new AndroidJavaFormatter() @FORMATS.push new AndroidXMLFormatter() + @FORMATS.push new SketchMeasureFormatter() for format in @FORMATS @FORMATS_BY_ID[format.id()] = format diff --git a/Prism.sketchplugin/Contents/Sketch/src/formats/SketchMeasureFormatter.coffee b/Prism.sketchplugin/Contents/Sketch/src/formats/SketchMeasureFormatter.coffee new file mode 100644 index 0000000..b3689cb --- /dev/null +++ b/Prism.sketchplugin/Contents/Sketch/src/formats/SketchMeasureFormatter.coffee @@ -0,0 +1,35 @@ + +class SketchMeasureFormatter extends FormatterBase + # Sketch Measure - Make it a fun to create spec for developers and teammates http://utom.design/measure/ + id: -> + "SKETCHMESURE_JSON" + name: -> + "Sketch Measure (JSON)" + format: -> + "colors.json" + + supportClipboard: -> + true + + exportAsString: (colorDictionaries) -> + root = [] + for colorDictionary in colorDictionaries + log colorDictionary + obj = + "name": "#{colorDictionary.name.trim()}" + "color": @colorToDictionaryToJSON(colorDictionary) + root.push obj + + JSON.stringify(root, undefined, 4) + + colorToDictionaryToJSON: (colorDictionary) -> + json = + r: Math.round(colorDictionary.red * 255) + g: Math.round(colorDictionary.green * 255) + b: Math.round(colorDictionary.blue * 255) + a: (Math.round(colorDictionary.alpha * 100) / 100) + "color-hex": "\##{colorDictionary.hex} " + "#{Math.round(colorDictionary.alpha * 100)}%", + "argb-hex": "\##{helperHex(colorDictionary.alpha * 255) + colorDictionary.hex}", + "css-rgba": "rgba(#{Math.round(colorDictionary.red * 255)},#{Math.round(colorDictionary.green * 255)},#{Math.round(colorDictionary.blue * 255)},#{Math.round(colorDictionary.alpha * 100) / 100})" + "ui-color": "(r:#{parseFloat(colorDictionary.red).toFixed(3)} g:#{parseFloat(colorDictionary.green).toFixed(3)} b:#{parseFloat(colorDictionary.blue).toFixed(3)} a:#{parseFloat(colorDictionary.alpha).toFixed(3)})" +