www: add global alert

alert service can be called from anywhere do display an alert bar on top
of the window.

Signed-off-by: Pierre Tardy <pierre.tardy@intel.com>

www/src/index.jade

@@ -14,4 +14,7 @@ block content
         div.nav-collapse.collapse
           topmenu
   // fluid container
+  div(ng-controller="alertPanelController")
+    alert(ng-repeat="alert in alerts",type="alert.type",close="closeAlert($index)", ng-animate="'repeat'")
+      | {{alert.msg}}{{alert.occur_msg}}
   ng:view

www/src/scripts/controllers/alertPanelController.coffee

@@ -0,0 +1,24 @@
+angular.module('app').controller 'alertPanelController',
+['$log', '$scope', '$rootScope', '$timeout', 'alert'
+    ($log, $scope, $rootScope, $timeout) ->
+        $scope.alerts = []
+        $scope.closeAlert = (index) ->
+            $scope.alerts.splice(index, 1)
+
+        $rootScope.$on 'alert', (ev, p) ->
+            found = false
+            for v in $scope.alerts
+                if v.msg is p.msg
+                    found = true
+                    v.occur ?= 1
+                    v.occur += 1
+                    v.occur_msg = "(x#{v.occur})"
+            if not found
+                $scope.alerts.push p
+            $timeout( ->
+                for i, v of $scope.alerts
+                    if v is p
+                        $scope.closeAlert(i)
+                null
+            , 10000)
+]

www/src/scripts/services/alertService.coffee

@@ -0,0 +1,31 @@
+angular.module('app').factory 'alert', ['$rootScope', ($rootScope) ->
+
+    alert = (msg, type) ->
+        type ?= 'danger'
+        $rootScope.$broadcast 'alert', type:type, msg: msg
+
+    alert.error = (msg) ->
+        alert msg, 'danger'
+
+    alert.warning = (msg) ->
+        alert msg, 'info'
+
+    alert.success = (msg) ->
+        alert msg, 'success'
+    window.alert = alert
+    return alert
+]
+angular.module('app').config ['$httpProvider', ($httpProvider) ->
+    $httpProvider.responseInterceptors.push ["alert", (alert) ->
+         return (promise) ->
+            promise.then (res)->
+                res
+            , (res) ->
+                if res.config.url.indexOf("views") == 0 and res.status == 404
+                    alert.error "view does not exist: " + res.config.url
+                else
+                    console.log res
+                    alert.error res.data
+    ]
+
+]

www/src/styles/styles.less

@@ -1,5 +1,34 @@
 @import "bootstrap.less";
+@import "font-awesome/font-awesome.less";
 
 .ng-cloak {
 	display: none;
-}
+}
+
+.repeat-enter {
+  -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
+  -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
+  -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
+  transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
+
+  opacity:0;
+  position:relative;
+}
+
+.repeat-enter.repeat-enter-active {
+  opacity:1;
+}
+
+.repeat-leave {
+  -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
+  -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
+  -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
+  transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
+
+  opacity:1;
+  position:relative;
+}
+
+.repeat-leave.repeat-leave-active {
+  opacity:0;
+}