summaryrefslogtreecommitdiffstats
path: root/app/common/components/status-icon.js
blob: f7929c28f5121073f99bea49c1c78000e2bd83eb (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
window.angular && (function(angular) {
  'use strict';

  /**
   * statusIcon Component
   *
   * To use:
   * The <status-icon> component expects a 'status' attribute
   * with a status value (on, off, warn, error)
   *
   */

  /**
   * statusIcon Component template
   */
  const template = `<icon ng-if="$ctrl.status === 'on'"
                          file="icon-on.svg"
                          aria-hidden="true"
                          class="status-icon">
                    </icon>
                    <icon ng-if="$ctrl.status === 'off'"
                          file="icon-off.svg"
                          aria-hidden="true"
                          class="status-icon">
                    </icon>
                    <icon ng-if="$ctrl.status === 'warn'"
                          file="icon-warning.svg"
                          aria-hidden="true"
                          class="status-icon">
                    </icon>
                    <icon ng-if="$ctrl.status === 'error'"
                          file="icon-critical.svg"
                          aria-hidden="true"
                          class="status-icon">
                    </icon>
                    <icon ng-if="$ctrl.status === 'loading'"
                          file="icon-loader.svg"
                          aria-hidden="true"
                          class="icon__loader icon__loader-sm">
                    </icon>
                    `

  /**
   * Register statusIcon component
   */
  angular.module('app.common.components')
      .component('statusIcon', {template, bindings: {status: '@'}})
})(window.angular);
OpenPOWER on IntegriCloud