Split out Color from Style.

Also refactor a small section

src/General/css/theme.css

@@ -383,7 +383,7 @@ a .name {
 }
 .fourchan-banner-at-sidebar-top.icon-orientation-vertical.fourchan-ss-sidebar body::after,
 .fourchan-banner-at-sidebar-top.fourchan-ss-sidebar body::before {
-  background: rgba(#{if background = new Style.color theme["Reply Background"] then background.shiftRGB -18}, 0.8);
+  background: rgba(#{if background = new Color theme["Reply Background"] then background.shiftRGB -18}, 0.8);
 }
 .fourchan-ss-sidebar.sidebar-location-right body::before {
   border-left: 2px solid #{backgroundC};

src/Theming/Mascots.coffee

@@ -50,7 +50,7 @@ MascotTools =
       height: 100
     ctx = el.getContext('2d')
     ctx.font         = "50px #{Conf['Font']}"
-    ctx.fillStyle    = (new Style.color (Themes[Conf['theme']] or Themes['Yotsuba B'])['Text']).hex()
+    ctx.fillStyle    = (new Color (Themes[Conf['theme']] or Themes['Yotsuba B'])['Text']).hex()
     ctx.textAlign    = 'center'
     ctx.textBaseline = 'middle'
     ctx.fillText "Mascot 404", 124, 50

src/Theming/Style.coffee

@@ -110,7 +110,7 @@ Style =
     colors = []
     rgb    = ['r', 'g', 'b']
     for arg in arguments
-      hex = (new Style.color arg).raw
+      hex = (new Color arg).raw
       color = {}
       i     = 0
       while val = rgb[i]
@@ -149,8 +149,8 @@ Style =
     """<%= grunt.file.read('src/General/css/dynamic.css').replace(/\s+/g, ' ').trim() %>"""
 
   theme: (theme) ->
-    bgColor  = new Style.color backgroundC = theme["Background Color"]
+    bgColor  = new Color backgroundC = theme["Background Color"]
-    replybg  = new Style.color theme["Reply Background"]
+    replybg  = new Color theme["Reply Background"]
     replyRGB = "rgb(#{replybg.shiftRGB parseInt(Conf['Silhouette Contrast'], 10), true})"
 
     Style.lightTheme = bgColor.isLight()
@@ -205,61 +205,4 @@ Style =
     Style.sheets.padding.textContent  = """<%= grunt.file.read('src/General/css/padding.nav.css').replace(/\s+/g, ' ').trim() %> """ +
       if pageHeight
         """<%= grunt.file.read('src/General/css/padding.pages.css').replace(/\s+/g, ' ').trim() %>"""
-      else ''
+      else ''
-
-  color: class
-    minmax = (base) -> if base < 0 then 0 else if base > 255 then 255 else base
-
-    calcRGB = (value) ->
-      hex = parseInt value, 16
-      return [ # 0xRRGGBB to [R, G, B]
-        (hex >> 16) & 0xFF
-        (hex >> 8) & 0xFF
-        hex & 0xFF
-      ]
-
-    colorToHex = (color) ->
-      if color.substr(0, 1) is '#'
-        if color.length isnt 4
-          return color[1..]
-        else 
-          r = color.substr(1, 1)
-          g = color.substr(2, 1)
-          b = color.substr(3, 1)
-          return [r,r,g,g,b,b].join ""
-
-      if /[0-9a-f]{3}/i.test color
-        return color if /[0-9a-f]{6}/i.test color
-
-        r = color.substr(0, 1)
-        g = color.substr(1, 1)
-        b = color.substr(2, 1)
-        return [r,r,g,g,b,b].join ""
-
-      if digits = color.match /(.*?)rgba?\((\d+), ?(\d+), ?(\d+)(.*?)\)/
-        # [R, G, B] to 0xRRGGBB
-        hex = (
-          (parseInt(digits[2], 10) << 16) |
-          (parseInt(digits[3], 10) << 8)  |
-          (parseInt(digits[4], 10))
-        ).toString 16
-
-        while hex.length < 6
-          hex = "0#{hex}"
-        return hex
-
-      else
-        "000000"
-
-    constructor: (value) ->
-      @raw         = colorToHex value
-
-    hex:        -> "#" + @raw
-    privateRGB: -> calc_rgb @raw
-    rgb:        -> @privateRGB().join ""
-    hover:      -> @shiftRGB 16, true
-    isLight:    -> (@privateRGB[0] * 0.299 + @privateRGB[1] * 0.587 + @privateRGB[2] * 0.114) > 125
-
-    shiftRGB: (shift, smart) ->
-      shift = (if @isLight then -1 else 1) * Math.abs shift if smart
-      return (minmax color + shift for color in @privateRGB).join ","

src/Theming/Themes.coffee

@@ -1,5 +1,5 @@
 ###
-  Style.color adapted from 4chan Style Script
+  Color adapted from 4chan Style Script
 ###
 
 ThemeTools =
@@ -140,7 +140,7 @@ ThemeTools =
 
           colorInput = $.el 'input',
             className: 'color'
-            value: "##{(new Style.color input.value).hex()}"
+            value: "##{(new Color input.value).hex()}"
 
           JSColor.bind colorInput
 
@@ -190,7 +190,7 @@ ThemeTools =
       return alert "Syntax error on #{@name}."
 
     if @className is "colorfield"
-      @nextSibling.value = (new Style.color @value).hex()
+      @nextSibling.value = (new Color @value).hex()
       @nextSibling.color.importColor()
 
     editTheme[@name] = @value

src/Theming/color.coffee

@@ -0,0 +1,56 @@
+class Color
+  minmax = (base) -> if base < 0 then 0 else if base > 255 then 255 else base
+
+  calcRGB = (value) ->
+    hex = parseInt value, 16
+    return [ # 0xRRGGBB to [R, G, B]
+      (hex >> 16) & 0xFF
+      (hex >> 8) & 0xFF
+      hex & 0xFF
+    ]
+
+  shortToLong = (hex) ->
+    longHex = []
+    i = 0
+    while i < 3
+      longHex.push hex.substr i, 1
+      i = Math.floor longHex.length / 2
+    return longHex.join ""
+
+  colorToHex = (color) ->
+    if color.substr(0, 1) is '#'
+      if color.length isnt 4
+        return color[1..]
+      else
+        return shortToLong color.substr(1, 3)
+
+    if /[0-9a-f]{3}/i.test color
+      return if color.length is 6 then color else shortToLong color
+
+    if digits = color.match /(.*?)rgba?\((\d+), ?(\d+), ?(\d+)(.*?)\)/
+      # [R, G, B] to 0xRRGGBB
+      hex = (
+        (parseInt(digits[2], 10) << 16) |
+        (parseInt(digits[3], 10) << 8)  |
+        (parseInt(digits[4], 10))
+      ).toString 16
+
+      while hex.length < 6
+        hex = "0#{hex}"
+      return hex
+
+    else
+      "000000"
+
+  constructor: (value) ->
+    @raw         = colorToHex value
+
+  hex:        -> "#" + @raw
+  privateRGB: -> calc_rgb @raw
+  rgb:        -> @privateRGB().join ""
+  hover:      -> @shiftRGB 16, true
+  isLight:    -> (@privateRGB[0] * 0.299 + @privateRGB[1] * 0.587 + @privateRGB[2] * 0.114) > 125
+
+  shiftRGB: (shift, smart) ->
+    shift = (if @isLight then -1 else 1) * Math.abs shift if smart
+    return (minmax color + shift for color in @privateRGB).join ","