AMBARI-4839 Make Background Ops badge more intuitive. (ababiichuk)

ambari-web/app/messages.js

@@ -49,6 +49,7 @@ Em.I18n.translations = {
   'yes':'Yes',
   'no':'No',
   'add': 'Add',
+  'ops': 'ops',
 
 
   'common.access':'Access',

ambari-web/app/styles/application.less

@@ -20,6 +20,25 @@
 @space-m: 10px;
 @space-l: 20px;
 
+@-webkit-keyframes greenPulse {
+  from { background-color: #118fff; }
+  50% { background-color: #006DCC; }
+  to { background-color: #118fff; }
+}
+
+@-moz-keyframes greenPulse {
+  from { background-color: #118fff; }
+  50% { background-color: #006DCC; }
+  to { background-color: #118fff; }
+}
+
+@keyframes greenPulse
+{
+  0% { background-color: #118fff; }
+  50% { background-color: #006DCC; }
+  100% { background-color: #118fff; }
+}
+
 .gradient(@color: #FAFAFA, @start: #FFFFFF, @stop: #F2F2F2) {
   background: @color;
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0, @start), color-stop(1, @stop));
@@ -92,6 +111,15 @@ footer {
 
       .operations-count {
         background-color: #006DCC;
+        -webkit-animation-name: greenPulse;
+        -webkit-animation-duration: 1s;
+        -webkit-animation-iteration-count: infinite;
+        -moz-animation-name: greenPulse;
+        -moz-animation-duration: 1s;
+        -moz-animation-iteration-count: infinite;
+        animation-name: greenPulse;
+        animation-duration: 1s;
+        animation-iteration-count: infinite;
         margin: 2px;
       }
     }

ambari-web/app/templates/application.hbs

@@ -30,9 +30,9 @@
 
               {{#with App.router.backgroundOperationsController}}
                 {{#if allOperationsCount}}
-                  <span class="label operations-count" {{action "showPopup" target="App.router.backgroundOperationsController"}}>{{allOperationsCount}}</span>
+                  <span class="label operations-count" {{action "showPopup" target="App.router.backgroundOperationsController"}}>{{allOperationsCount}} {{t ops}}</span>
                 {{else}}
-                  <span class="label" {{action "showPopup" target="App.router.backgroundOperationsController"}}>{{allOperationsCount}}</span>
+                  <span class="label" {{action "showPopup" target="App.router.backgroundOperationsController"}}>{{allOperationsCount}} {{t ops}}</span>
                 {{/if}}
               {{/with}}
             </a>

ambari-web/test/views/common/table_view_test.js

@@ -20,6 +20,7 @@ var App = require('app');
 require('utils/db');
 require('views/common/filter_view');
 require('views/common/sort_view');
+require('mixins');
 require('mixins/common/userPref');
 require('views/common/table_view');
 

ambari-web/test/views/main/host/details/host_component_views/decommissionable_test.js

@@ -19,6 +19,7 @@
 var App = require('app');
 require('models/host_component');
 require('views/main/host/details/host_component_view');
+require('mixins');
 require('mixins/main/host/details/host_components/decommissionable');
 
 var hostComponentView;