Merge pull request #61 from gabceb/added_rgb_and_hex_color_plugin

Added plugins to show hex and rgb colors on messages

app/assets/javascripts/backbone/kandan.js.coffee.erb

@@ -36,6 +36,8 @@ window.Kandan =
       ,"Attachments"
       ,"MeAnnounce"
       ,"Emoticons"
+      ,"RgbColorEmbed"
+      ,"HexColorEmbed"
     ]
 
     for plugin in plugins

app/assets/javascripts/backbone/plugins/hex_color_embed.js.coffee

@@ -0,0 +1,13 @@
+class Kandan.Plugins.HexColorEmbed
+  @options:
+    regex: /#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})/g
+
+    template: _.template '''<span class="color-preview" style="background-color:<%= hex %>;"/>'''
+
+  @init: ()->
+    Kandan.Modifiers.register @options.regex, (message, state) =>
+      for hex in message.content.match(@options.regex)
+        replacement = @options.template({hex: hex}) + hex
+        message.content = message.content.replace(hex, replacement)
+
+      return Kandan.Helpers.Activities.buildFromMessageTemplate(message)

app/assets/javascripts/backbone/plugins/rgb_color_embed.js.coffee

@@ -0,0 +1,14 @@
+class Kandan.Plugins.RgbColorEmbed
+  @options:
+    regex: /rgb\((\d{1,3}),\s?(\d{1,3}),\s?(\d{1,3})\)/g
+
+    template: _.template '''<span class="color-preview" style="background-color:<%= rgb %>;"/>'''
+
+  @init: ()->
+    Kandan.Modifiers.register @options.regex, (message, state) =>
+      for rgb in message.content.match(@options.regex)
+        replacement = @options.template({rgb: rgb}) + rgb
+        message.content = message.content.replace(rgb, replacement)
+
+      return Kandan.Helpers.Activities.buildFromMessageTemplate(message)
+

app/assets/stylesheets/_activity.sass

@@ -34,6 +34,14 @@
           color: #878D8F
           font-weight: bold
           margin-top: 5px
+      .color-preview
+        width: 15px
+        height: 15px
+        border-radius: 3px
+        display: inline-block
+        margin: 0 5px
+        vertical-align: bottom
+        border: 1px solid gray
 
 .posted_at
   float: right