Clean up icons
Clean up duplicate svg icons from assets directory.
Created a statusIcon component to dynamically render
status icons instead of using background-image in
scss files.
- Moved/removed on, off, critical, warning svg icons from
assets directory
- Updated background-image status icons to use <icon>
or <status-icon> directive
Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: Ic0f06d78b0861d6f60d40b2dcc0b80fd6dad2a88
diff --git a/app/common/components/status-icon.js b/app/common/components/status-icon.js
new file mode 100644
index 0000000..d756326
--- /dev/null
+++ b/app/common/components/status-icon.js
@@ -0,0 +1,42 @@
+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>`
+
+ /**
+ * Register statusIcon component
+ */
+ angular.module('app.common.components')
+ .component('statusIcon', {template, bindings: {status: '@'}})
+})(window.angular);
\ No newline at end of file