From af26018c0d469ecf4dc6a4edeae026087afc979f Mon Sep 17 00:00:00 2001
From: Petr Vobornik <pvoborni@redhat.com>
Date: Wed, 6 Nov 2013 14:44:55 +0100
Subject: Status widgets icons

https://fedorahosted.org/freeipa/ticket/3904
---
 install/ui/src/freeipa/certificate.js | 74 ++++++++++++++---------------------
 install/ui/src/freeipa/host.js        | 72 ++++++++++++++++------------------
 install/ui/src/freeipa/service.js     | 32 +++++++--------
 3 files changed, 78 insertions(+), 100 deletions(-)

(limited to 'install/ui/src')

diff --git a/install/ui/src/freeipa/certificate.js b/install/ui/src/freeipa/certificate.js
index 5da1de81..bd9f7459 100755
--- a/install/ui/src/freeipa/certificate.js
+++ b/install/ui/src/freeipa/certificate.js
@@ -823,60 +823,44 @@ IPA.cert.status_widget = function(spec) {
 
         that.widget_create(container);
 
-        that.status_valid = $('<div/>', {
-            name: 'certificate-valid',
-            style: 'display: none;'
-        }).appendTo(container);
-
-        $('<img/>', {
-            src: 'images/check-icon.png',
-            style: 'float: left;',
-            'class': 'status-icon'
-        }).appendTo(that.status_valid);
-
-        var content_div = $('<div/>', {
-            style: 'float: left;'
-        }).appendTo(that.status_valid);
+        that.status_valid = that.create_status('certificate-valid',
+                                               text.get('@i18n:objects.cert.valid'),
+                                               'fa fa-check');
+        that.status_valid.appendTo(container);
 
-        content_div.append('<b>'+text.get('@i18n:objects.cert.valid')+'</b>');
+        that.status_revoked = that.create_status('certificate-revoked',
+                                               text.get('@i18n:objects.cert.revoked'),
+                                               'fa fa-warning');
+        that.status_revoked.appendTo(container);
 
-        that.status_revoked = $('<div/>', {
-            name: 'certificate-revoked',
-            style: 'display: none;'
-        }).appendTo(container);
-
-        $('<img/>', {
-            src: 'images/caution-icon.png',
-            style: 'float: left;',
-            'class': 'status-icon'
+        that.revocation_reason = $('<span/>', {
+            'name': 'revocation_reason'
         }).appendTo(that.status_revoked);
 
-        content_div = $('<div/>', {
-            style: 'float: left;'
-        }).appendTo(that.status_revoked);
+        that.status_missing = that.create_status('certificate-missing',
+                                               text.get('@i18n:objects.cert.missing'),
+                                               'fa fa-warning');
+        that.status_missing.appendTo(container);
+    };
 
-        content_div.append('<b>'+text.get('@i18n:objects.cert.revoked')+'</b>');
-        content_div.append(' ');
-        that.revocation_reason = $('<span/>', {
-            'name': 'revocation_reason'
-        }).appendTo(content_div);
+    that.create_status = function(name, text, icon) {
 
-        that.status_missing = $('<div/>', {
-            name: 'certificate-missing',
+        var container = $('<div>', {
+            name: name,
             style: 'display: none;'
+        });
+
+        var status = $('<label/>', {
+            'class': 'certificate-status'
         }).appendTo(container);
 
-        $('<img/>', {
-            src: 'images/caution-icon.png',
-            style: 'float: left;',
-            'class': 'status-icon'
-        }).appendTo(that.status_missing);
+        $('<i/>', {
+            'class': icon
+        }).appendTo(status);
 
-        content_div = $('<div/>', {
-            style: 'float: left;'
-        }).appendTo(that.status_missing);
+        status.append(" " +text);
 
-        content_div.append('<b>'+text.get('@i18n:objects.cert.missing')+'</b>');
+        return container;
     };
 
     that.update = function(certificate) {
@@ -911,7 +895,9 @@ IPA.cert.status_widget = function(spec) {
             that.status_revoked.css('display', status === IPA.cert.CERTIFICATE_STATUS_REVOKED ? '' : 'none');
 
             var reason = IPA.cert.CRL_REASON[revocation_reason];
-            that.revocation_reason.html(revocation_reason === undefined || reason === null ? '' : text.get('@i18n:objects.cert.'+reason));
+            var reason_text = revocation_reason === undefined || reason === null ? '' : text.get('@i18n:objects.cert.'+reason);
+            reason_text = ' ('+reason_text+')';
+            that.revocation_reason.html(reason_text);
         }
     };
 
diff --git a/install/ui/src/freeipa/host.js b/install/ui/src/freeipa/host.js
index 1786c9eb..a96fc982 100644
--- a/install/ui/src/freeipa/host.js
+++ b/install/ui/src/freeipa/host.js
@@ -589,33 +589,31 @@ IPA.host_keytab_widget = function(spec) {
 
         that.widget_create(container);
 
-        that.missing_span = $('<span/>', {
+        that.missing_el = $('<label/>', {
             name: 'missing',
             style: 'display: none;'
         }).appendTo(container);
 
-        $('<img/>', {
-            src: 'images/caution-icon.png',
-            'class': 'status-icon'
-        }).appendTo(that.missing_span);
+        $('<i/>', {
+            'class': 'fa fa-warning'
+        }).appendTo(that.missing_el);
 
-        that.missing_span.append(' ');
+        that.missing_el.append(' ');
 
-        that.missing_span.append(text.get('@i18n:objects.host.keytab_missing'));
+        that.missing_el.append(text.get('@i18n:objects.host.keytab_missing'));
 
-        that.present_span = $('<span/>', {
+        that.present_el = $('<label/>', {
             name: 'present',
             style: 'display: none;'
         }).appendTo(container);
 
-        $('<img/>', {
-            src: 'images/check-icon.png',
-            'class': 'status-icon'
-        }).appendTo(that.present_span);
+        $('<i/>', {
+            'class': 'fa fa-check'
+        }).appendTo(that.present_el);
 
-        that.present_span.append(' ');
+        that.present_el.append(' ');
 
-        that.present_span.append(text.get('@i18n:objects.host.keytab_present'));
+        that.present_el.append(text.get('@i18n:objects.host.keytab_present'));
     };
 
     that.update = function(values) {
@@ -625,13 +623,13 @@ IPA.host_keytab_widget = function(spec) {
     };
 
     that.clear = function() {
-        that.present_span.css('display', 'none');
-        that.missing_span.css('display', 'none');
+        that.present_el.css('display', 'none');
+        that.missing_el.css('display', 'none');
     };
 
     function set_status(status) {
-        that.present_span.css('display', status == 'present' ? 'inline' : 'none');
-        that.missing_span.css('display', status == 'missing' ? 'inline' : 'none');
+        that.present_el.css('display', status == 'present' ? '' : 'none');
+        that.missing_el.css('display', status == 'missing' ? '' : 'none');
     }
 
     return that;
@@ -753,32 +751,30 @@ IPA.host_password_widget = function(spec) {
 
         that.widget_create(container);
 
-        that.missing_span = $('<span/>', {
+        that.missing_el = $('<label/>', {
             name: 'missing'
         }).appendTo(container);
 
-        $('<img/>', {
-            src: 'images/caution-icon.png',
-            'class': 'status-icon'
-        }).appendTo(that.missing_span);
+        $('<i/>', {
+            'class': 'fa fa-warning'
+        }).appendTo(that.missing_el);
 
-        that.missing_span.append(' ');
+        that.missing_el.append(' ');
 
-        that.missing_span.append(text.get('@i18n:objects.host.password_missing'));
+        that.missing_el.append(text.get('@i18n:objects.host.password_missing'));
 
-        that.present_span = $('<span/>', {
+        that.present_el = $('<label/>', {
             name: 'present',
             style: 'display: none;'
         }).appendTo(container);
 
-        $('<img/>', {
-            src: 'images/check-icon.png',
-            'class': 'status-icon'
-        }).appendTo(that.present_span);
+        $('<i/>', {
+            'class': 'fa fa-check'
+        }).appendTo(that.present_el);
 
-        that.present_span.append(' ');
+        that.present_el.append(' ');
 
-        that.present_span.append(text.get('@i18n:objects.host.password_present'));
+        that.present_el.append(text.get('@i18n:objects.host.password_present'));
     };
 
     that.update = function(values) {
@@ -788,8 +784,8 @@ IPA.host_password_widget = function(spec) {
     };
 
     that.clear = function() {
-        that.missing_span.css('display', 'none');
-        that.present_span.css('display', 'none');
+        that.missing_el.css('display', 'none');
+        that.present_el.css('display', 'none');
     };
 
     function set_status(status) {
@@ -797,11 +793,11 @@ IPA.host_password_widget = function(spec) {
         that.status = status;
 
         if (status == 'missing') {
-            that.missing_span.css('display', 'inline');
-            that.present_span.css('display', 'none');
+            that.missing_el.css('display', '');
+            that.present_el.css('display', 'none');
         } else {
-            that.missing_span.css('display', 'none');
-            that.present_span.css('display', 'inline');
+            that.missing_el.css('display', 'none');
+            that.present_el.css('display', '');
         }
     }
 
diff --git a/install/ui/src/freeipa/service.js b/install/ui/src/freeipa/service.js
index 788cb95b..241f2275 100644
--- a/install/ui/src/freeipa/service.js
+++ b/install/ui/src/freeipa/service.js
@@ -322,37 +322,33 @@ IPA.service_provisioning_status_widget = function (spec) {
 
         that.status_valid = $('<div/>', {
             name: 'kerberos-key-valid',
+            'class': 'provisioning-status',
             style: 'display: none;'
         }).appendTo(container);
 
-        $('<img/>', {
-            src: 'images/check-icon.png',
-            style: 'float: left;',
-            'class': 'status-icon'
+        var content = $('<label/>', {
         }).appendTo(that.status_valid);
 
-        var content_div = $('<div/>', {
-            style: 'float: left;'
-        }).appendTo(that.status_valid);
-
-        content_div.append('<b>'+text.get('@i18n:objects.service.valid')+'</b>');
+        $('<i/>', {
+            'class': 'fa fa-check'
+        }).appendTo(content);
+        content.append(' ');
+        content.append(text.get('@i18n:objects.service.valid'));
 
         that.status_missing = $('<div/>', {
             name: 'kerberos-key-missing',
+            'class': 'provisioning-status',
             style: 'display: none;'
         }).appendTo(container);
 
-        $('<img/>', {
-            src: 'images/caution-icon.png',
-            style: 'float: left;',
-            'class': 'status-icon'
-        }).appendTo(that.status_missing);
-
-        content_div = $('<div/>', {
-            style: 'float: left;'
+        content = $('<label/>', {
         }).appendTo(that.status_missing);
 
-        content_div.append('<b>'+text.get('@i18n:objects.service.missing')+'</b>');
+        $('<i/>', {
+            'class': 'fa fa-warning'
+        }).appendTo(content);
+        content.append(' ');
+        content.append(text.get('@i18n:objects.service.missing'));
     };
 
     that.update = function(values) {
-- 
cgit