Release 0.1.4 (#16)

* Sketch built-in update implementation
* Text layer split compatibility update

Slinky.sketchplugin/Contents/Sketch/manifest.json

@@ -1,13 +1,14 @@
 {
    "name" : "Slinky",
    "identifier" : "com.sketchapp.slinky-plugin",
-   "version" : "0.1.3",
+   "version" : "0.1.4",
    "description" : "Export HTML email templates from Sketch",
    "authorEmail" : "[email protected]",
    "author" : "finchalyzer",
    "homepage" : "https://github.com/finchalyzer/slinky",
    "disableCocoaScriptPreprocessor": true,
    "icon" : "icons/slinky.png",
+   "appcast": "https://raw.githubusercontent.com/finchalyzer/slinky/master/appcast.xml",
    "commands" : [
       {
          "script" : "Slinky.js",

appcast.xml

@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<rss version="2.0" xmlns:sparkle="http://www.andymatuschak.org/xml-namespaces/sparkle" xmlns:dc="http://purl.org/dc/elements/1.1/">
+   <channel>
+      <title>Slinky</title>
+      <link>https://raw.githubusercontent.com/finchalyzer/slinky/master/appcast.xml</link>
+      <description>Export HTML email templates from Sketch artboards</description>
+      <language>en</language>
+      <item>
+         <title>Version 0.1.4</title>
+         <description>
+            <![CDATA[
+            <ul>
+               <li>Sketch 45 support</li>
+            </ul>
+            ]]>
+         </description>
+         <pubDate>Thu, 29 Jun 2017 12:00:00 +0000</pubDate>
+         <enclosure url="https://github.com/finchalyzer/slinky/releases/download/v0.1.4/Slinky.zip" sparkle:version="0.1.4" length="0" type="application/octet-stream"/>
+      </item>
+   </channel>
+</rss>

source/slinky/convert.ts

@@ -508,59 +508,52 @@ function sketchToLayers(layerGroup: MSLayer[], offset?: {x: number, y: number},
 
 function splitText(layer: MSLayer){
 
-   const textStorage = layer.createTextStorage()
-   const attributeRuns = textStorage.attributeRuns()
-   const attributeRunsCount = attributeRuns.count()
-
    const fontWeights = ["thin", "extralight", "light", "normal", "medium", "semibold", "bold", "extrabold", "black"]
    const fontStyles = ["italic", "oblique"]
 
-   const fillColor = (layer.style().fill()) ? layer.style().fill().color() : null
+   const hasFill = (layer.style().fills().firstObject()) ? true : null
 
    var textElements: {
       text: string,
       css: any
    }[] = []
 
-   for(var i = 0; i < attributeRunsCount; i++) {
-
-      var obj = attributeRuns.objectAtIndex(i)
-
-      var textAttributes = {
-         text: "",
-         css: {}
-      }
+   const attributes = layer.attributedStringValue().treeAsDictionary().attributes
 
-      textAttributes.text = unescape(obj.string())
+   attributes.forEach((attribute)=>{
 
-      var font = obj.font()
+      const font = attribute.NSFont
 
-      const fontFamily = unescape(font.familyName())
-      const fontName = unescape(font.displayName())
+      const fontFamily = unescape(font.family)
+      const fontName = unescape(font.name)
       const fontVariants = fontName.substr(fontFamily.length + 1).split(" ")
 
       const fontWeight = fontVariants.filter(variant => fontWeights.indexOf(variant.toLowerCase()) > -1)
-      if(fontWeight.length == 1) textAttributes.css["font-weight"] = (fontWeights.indexOf(fontWeight[0].toLowerCase()) + 1) * 100
-
       const fontStyle = fontVariants.filter(variant => fontStyles.indexOf(variant.toLowerCase()) > -1)
-      if(fontStyle.length == 1) textAttributes.css["font-style"] = fontStyle[0].toLowerCase()
 
-      if(obj.attribute_atIndex_effectiveRange_("NSUnderline", 0, null)){
-         textAttributes.css["text-decoration"] = "underline"
-      }
+      const fontColor = layer.attributedStringValue().attribute_atIndex_effectiveRange_("NSColor", attribute.location, null)
 
-      textAttributes.css["font-family"] = `'${fontFamily}'`
-      textAttributes.css["font-size"] = font.pointSize() + 'px'
+      let css = {
+         "font-weight": (fontWeight.length == 1) ? (fontWeights.indexOf(fontWeight[0].toLowerCase()) + 1) * 100 + "" : null,
+         "font-style": (fontStyle.length == 1) ? fontStyle[0].toLowerCase() : null,
+         "text-decoration": (layer.attributedStringValue().attribute_atIndex_effectiveRange_("NSUnderline", attribute.location, null)) ? "underline" : null,
+         "font-family": `'${fontFamily}'`,
+         "font-size": font.attributes.NSFontSizeAttribute + 'px',
+         "color": (!hasFill && fontColor) ? NSrgbaToHex(fontColor) : null,
+      }
 
-      if(!fillColor){
-         const color = obj.foregroundColor().colorUsingColorSpaceName(NSCalibratedRGBColorSpace)
-         textAttributes.css["color"] = NSrgbaToHex(color)
-         textAttributes.css["opacity"] = color.alphaComponent()
+      for (var propName in css) {
+         if (css[propName] === null || css[propName] === undefined) {
+            delete css[propName]
+         }
       }
 
-      textElements.push(textAttributes)
+      textElements.push({
+         text: unescape(attribute.text),
+         css: css
+      })
 
-   }
+   })
 
    return textElements
 
@@ -570,8 +563,8 @@ function getCSS(layer: MSLayer){
 
    var properties = parseCSSAttributes(layer.CSSAttributes().slice(1))
 
-   if(layer.style().fill()){
-      properties["color"] = rgbaToHex(layer.style().fill().color())
+   if(layer.style().fills().firstObject()){
+      properties["color"] = rgbaToHex(layer.style().fills().firstObject().color())
    }
 
    if(layer.class() === MSTextLayer){

source/typings/Sketch.d.ts

@@ -43,12 +43,23 @@ interface MSLayer{
       point(): {x: number, y: number}
    }
    style():{
-      fill():{
-         color(): any
-      }
+      fills(): MSStyleFill
    }
+   attributedStringValue(): any
 }
 
+interface MSStyleFill{
+   firstObject(): MSStyleFill
+   color(): {
+      red(): number,
+      green(): number,
+      blue(): number,
+      alpha(): number
+   }
+}
+
+
+declare var NSMakeRange: any
 declare var MSTextLayer: MSLayer
 declare var MSLayerGroup: MSLayer
 declare var MSShapeGroup: MSLayer