From 82b494a7b2b9ff922a8192d6ceaaae609b462425 Mon Sep 17 00:00:00 2001
From: Guillaume Wuip <guillaume@wuips.com>
Date: Mon, 15 Dec 2014 22:01:33 +0100
Subject: [PATCH] Add flat colors

---
 static/js/directives/block.js        | 25 ++++++++++++++++++++++++-
 static/partials/elements/blocks.html |  6 +++++-
 2 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/static/js/directives/block.js b/static/js/directives/block.js
index 032f437..1ef4fb1 100644
--- a/static/js/directives/block.js
+++ b/static/js/directives/block.js
@@ -9,6 +9,17 @@
      * to display folder name, dates and file name
      */
 
+    var colors =  [
+        "#16a085",
+        "#27ae60",
+        "#2980b9",
+        "#8e44ad",
+        "#f39c12",
+        "#d35400",
+        "#c0392b",
+        "#7f8c8d"
+    ];
+
     window.app.directive('block', [function () {
 
         return {
@@ -58,7 +69,19 @@
             },
             restrict    : "E",
             templateUrl : 'partials/elements/blocks.html',
-            replace     : true
+            replace     : true,
+
+            controller : ['$scope', function ($scope) {
+                
+                /**
+                 * $scope.color
+                 * 
+                 * @return {String}     A radom haxa color from `colors`
+                 */
+                $scope.color = function () {
+                    return colors[Math.floor(Math.random() * colors.length)]
+                };
+            }]
         };
 
     }]);
diff --git a/static/partials/elements/blocks.html b/static/partials/elements/blocks.html
index 7b4f711..9e8b115 100644
--- a/static/partials/elements/blocks.html
+++ b/static/partials/elements/blocks.html
@@ -1,4 +1,8 @@
-<div class="block" ng-class="{'block--date' : type == 'date', 'block--file': forceFile}">
+<div 
+    class="block"
+    ng-class="{'block--date' : type == 'date', 'block--file': forceFile}"
+    style="background: {{ color() }}"
+    >
     <p class="block__message block__message--top" ng-if="messageTop">{{messageTop}}</p>
     <p class="block__message block__message--middle" ng-if="message">{{message}}</p>
     <p class="block__message block__message--bottom" ng-if="messageBottom">{{messageBottom}}</p>