Add color support.

css/preview.css

@@ -1,5 +1,16 @@
 body {
   font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
+  overflow: hidden;
+  margin: 0;
+  padding: 0;
+}
+
+.text.color {
+  height: 100%;
+  width: 100%;
+  line-height: 200px;
+  font-size: 30px;
+  text-align: center;
 }
 
 .meta {
@@ -11,3 +22,7 @@ body {
   text-align: center;
   margin-bottom: 5px;
 }
+
+.text.dark, .meta.dark {
+  color: #F9F9F9;
+}

package.json

@@ -4,6 +4,7 @@
   "description": "A clipboard manager for Zazu.",
   "main": "monitor.js",
   "dependencies": {
+    "color": "^0.11.3",
     "dnode": "^1.2.2",
     "nedb": "^1.8.0",
     "s-ago": "^1.1.0"

readme.md

@@ -36,3 +36,9 @@ If you prefer to disable image storing, you can set the `ignoreImages` to
   },
 }
 ~~~
+
+## Screenshots
+
+![text](./assets/text_screenshot.png)
+
+![color](./assets/color_screenshot.png)

src/lib/present.js

@@ -1,16 +1,31 @@
 const ago = require('s-ago')
+const Color = require('color')
 
 module.exports = (allClips) => {
   return allClips.map((clip) => {
     if (clip.type === 'text') {
-      return {
+      const isHexColor = clip.raw.match(/^#([0-9a-f]{3}){1,2}$/i)
+      const response = {
         title: clip.raw,
         value: clip._id,
         preview: `
           <pre class="text">${clip.raw}</pre>
           <div class="meta">${ago(new Date(clip.createdAt))}<br />${clip.raw.length} characters</div>
-        `,
+        `
+      }
+      if (isHexColor) {
+        const color = new Color(clip.raw)
+        const colorType = color.dark() ? 'dark' : 'light'
+        response.preview = `
+          <pre
+            class="text color ${colorType}"
+            style="background-color: ${clip.raw};">${clip.raw}</pre>
+          <div class="meta ${colorType}">
+            ${ago(new Date(clip.createdAt))}<br />${clip.raw.length} characters
+          </div>
+        `
       }
+      return response
     } else if(clip.type === 'image') {
       return {
         title: clip.title,

test/present.spec.js

@@ -0,0 +1,36 @@
+const expect = require('chai').expect
+const present = require('../src/lib/present')
+
+const clips = {
+  short_hex: { _id: 1, type: 'text', raw: '#fff', createdAt: new Date() },
+  long_hex:  { _id: 2, type: 'text', raw: '#000000', createdAt: new Date() },
+  word:      { _id: 3, type: 'text', raw: 'Quadrupoles', createdAt: new Date() },
+}
+
+describe('Present', () => {
+  describe('given a short hex color', () => {
+    it('finds the literal pole', () => {
+      const clip = clips.short_hex
+      const results = present([clip])
+      expect(results[0].preview).to.contain('color')
+      expect(results[0].preview).to.contain('light')
+    })
+  })
+
+  describe('given a long hex color', () => {
+    it('finds the case insensntive pole', () => {
+      const clip = clips.long_hex
+      const results = present([clip])
+      expect(results[0].preview).to.contain('color')
+      expect(results[0].preview).to.contain('dark')
+    })
+  })
+
+  describe('given a word', () => {
+    it('does not find the pole with extra characters', () => {
+      const clip = clips.word
+      const results = present([clip])
+      expect(results[0].preview).to.not.contain('color')
+    })
+  })
+})