From aa48d3b72efa4a9e285815c01ec89fc98ccaa22c Mon Sep 17 00:00:00 2001 From: "Endi S. Dewata" Date: Mon, 17 Jan 2011 20:43:43 +0700 Subject: [PATCH] New certificate and Kerberos key status behavior. The status panel for certificates and Kerberos keys has been modified to display only the current status with the relevant buttons. New icons have been added to replace the red/yellow/green bullets. --- install/static/Makefile.am | 2 + install/static/caution.png | Bin 0 -> 438 bytes install/static/certificate.js | 137 +++++++++++++++++++++------------- install/static/check.png | Bin 0 -> 3209 bytes install/static/host.js | 82 ++++++++++---------- install/static/ipa.css | 12 +-- install/static/service.js | 58 ++++++++------ 7 files changed, 169 insertions(+), 122 deletions(-) create mode 100755 install/static/caution.png create mode 100755 install/static/check.png diff --git a/install/static/Makefile.am b/install/static/Makefile.am index c1a5a7555..998c4ffe5 100644 --- a/install/static/Makefile.am +++ b/install/static/Makefile.am @@ -11,6 +11,8 @@ app_DATA = \ aci.js \ add.js \ associate.js \ + caution.png \ + check.png \ ipa_logo_180x50.png \ ipa.js \ ipa.css \ diff --git a/install/static/caution.png b/install/static/caution.png new file mode 100755 index 0000000000000000000000000000000000000000..ce7a68ad960852235b2cb4815cf502cc74939e85 GIT binary patch literal 438 zcmV;n0ZIOeP))V@2l(BEA!$e^WZ7y=;-e5?*IP!@!Lu8+ClW=aQEw&_2-54>#OwScek^Y{{8jp z*DLkrAouGU($doN;V1w9|CiLGF#rGnj7da6RCwA{$k!HvFc3x22|^Ge9Ti)^-g}P< z|NmD+6I9N_%v~EYk?Y9;@}I9|Xi#jIpl_id{DTDR`g-w$`yTl|I`qD9TGe<)y8yQy zTfBJSNoc0ePsUMzO{)(PP2La&IF;eyE(7OcGR7*J#_!T>Ik1JBLdd8y8xx{*VFKzj gdKJy1jhYKE072_0N6_SRw*UYD07*qoM6N<$f(cRaw*UYD literal 0 HcmV?d00001 diff --git a/install/static/certificate.js b/install/static/certificate.js index e81d3a784..b7e5a51d3 100755 --- a/install/static/certificate.js +++ b/install/static/certificate.js @@ -413,96 +413,132 @@ function certificate_status_widget(spec) { that.widget_create(container); - var table = $('', { - 'class': 'certificate-status' + var dd = $('
', { + 'class': 'first' }).appendTo(container); - var tr = $('
').appendTo(table); + var div = $('
', { + name: 'certificate-valid' + }).appendTo(dd); - var td = $('
').appendTo(table); + div = $('
', { + name: 'certificate-revoked' + }).appendTo(dd); - td = $('
').appendTo(table); + div = $('
', { + name: 'certificate-missing' + }).appendTo(dd); - td = $('
').appendTo(table); + var div = $('
', { + name: 'kerberos-key-valid' + }).appendTo(dd); - var td = $('
').appendTo(table); + div = $('
', { + name: 'kerberos-key-missing' + }).appendTo(dd); - td = $('
').appendTo(table); + content_div.append('
'); - td = $('').appendTo(table); - - td = $('
').appendTo(tr); + $('', { + src: 'check.png', + style: 'float: left;', + 'class': 'status-icon' + }).appendTo(div); - $('
', { - 'class': 'status-icon status-valid' - }).appendTo(td); + var content_div = $('
', { + style: 'float: left;' + }).appendTo(div); - td = $('
').appendTo(tr); - td.append('Valid Certificate Present:'); + content_div.append('Valid Certificate Present:'); - td = $('').appendTo(tr); + content_div.append(' '); $('', { 'type': 'button', 'name': 'get', 'value': 'Get' - }).appendTo(td); + }).appendTo(content_div); - td.append(' '); + content_div.append(' '); if (!that.is_selfsign()) { $('', { 'type': 'button', 'name': 'revoke', 'value': 'Revoke' - }).appendTo(td); + }).appendTo(content_div); - td.append(' '); + content_div.append(' '); } $('', { 'type': 'button', 'name': 'view', 'value': 'View' - }).appendTo(td); + }).appendTo(content_div); + + content_div.append(' '); + + $('', { + 'type': 'button', + 'name': 'create', + 'value': 'New Certificate' + }).appendTo(content_div); if (!that.is_selfsign()) { - tr = $('
').appendTo(tr); - $('
', { - 'class': 'status-icon status-revoked' - }).appendTo(td); + $('', { + src: 'caution.png', + style: 'float: left;', + 'class': 'status-icon' + }).appendTo(div); - td = $('
').appendTo(tr); - td.append('Certificate Revoked:'); + content_div = $('
', { + style: 'float: left;' + }).appendTo(div); - td = $('
').appendTo(tr); - td.append($('', { + content_div.append('Certificate Revoked:'); + + content_div.append(' '); + + content_div.append($('', { 'name': 'revocation_reason' })); - td.append(' '); + + content_div.append(' '); $('', { 'type': 'button', 'name': 'restore', 'value': 'Restore' - }).appendTo(td); + }).appendTo(content_div); + + content_div.append(' '); + + $('', { + 'type': 'button', + 'name': 'create', + 'value': 'New Certificate' + }).appendTo(content_div); } - tr = $('
').appendTo(tr); - $('
', { - 'class': 'status-icon status-missing' - }).appendTo(td); + $('', { + src: 'caution.png', + style: 'float: left;', + 'class': 'status-icon' + }).appendTo(div); - td = $('
').appendTo(tr); - td.append('No Valid Certificate:'); + content_div = $('
', { + style: 'float: left;' + }).appendTo(div); + + content_div.append('No Valid Certificate:'); + + content_div.append(' '); - td = $('
').appendTo(tr); $('', { 'type': 'button', 'name': 'create', 'value': 'New Certificate' - }).appendTo(td); + }).appendTo(content_div); }; that.setup = function(container) { that.widget_setup(container); - that.valid = $('.status-valid', that.container); - that.revoked = $('.status-revoked', that.container); - that.missing = $('.status-missing', that.container); + that.valid = $('div[name=certificate-valid]', that.container); + that.revoked = $('div[name=certificate-revoked]', that.container); + that.missing = $('div[name=certificate-missing]', that.container); var button = $('input[name=get]', that.container); that.get_button = IPA.button({ @@ -558,14 +594,16 @@ function certificate_status_widget(spec) { }); button.replaceWith(that.restore_button); - button = $('input[name=create]', that.container); - that.create_button = IPA.button({ - 'label': 'New Certificate', - 'click': function() { - request_certificate(that.result); - } + $('input[name=create]', that.container).each(function(index) { + button = $(this); + that.create_button = IPA.button({ + 'label': 'New Certificate', + 'click': function() { + request_certificate(that.result); + } + }); + button.replaceWith(that.create_button); }); - button.replaceWith(that.create_button); }; that.load = function(result) { @@ -582,14 +620,11 @@ function certificate_status_widget(spec) { }; function set_status(status, revocation_reason) { - that.valid.toggleClass('status-valid-active', status == CERTIFICATE_STATUS_VALID); - that.missing.toggleClass('status-missing-active', status == CERTIFICATE_STATUS_MISSING); - - that.get_button.css('visibility', status == CERTIFICATE_STATUS_VALID ? 'visible' : 'hidden'); - that.view_button.css('visibility', status == CERTIFICATE_STATUS_VALID ? 'visible' : 'hidden'); + that.valid.css('display', status == CERTIFICATE_STATUS_VALID ? 'inline' : 'none'); + that.missing.css('display', status == CERTIFICATE_STATUS_MISSING ? 'inline' : 'none'); if (!that.is_selfsign()) { - that.revoked.toggleClass('status-revoked-active', status == CERTIFICATE_STATUS_REVOKED); + that.revoked.css('display', status == CERTIFICATE_STATUS_REVOKED ? 'inline' : 'none'); that.revoke_button.css('visibility', status == CERTIFICATE_STATUS_VALID ? 'visible' : 'hidden'); that.revocation_reason.html(revocation_reason == undefined ? '' : CRL_REASON[revocation_reason]); that.restore_button.css('visibility', revocation_reason == 6 ? 'visible' : 'hidden'); diff --git a/install/static/check.png b/install/static/check.png new file mode 100755 index 0000000000000000000000000000000000000000..c3646db11272b689616ea1d3cba941fb582901c2 GIT binary patch literal 3209 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', { - 'class': 'kerberos-key-status' + var dd = $('
', { + 'class': 'first' }).appendTo(container); - var tr = $('
').appendTo(tr); - $('
', { - 'class': 'status-icon status-valid' - }).appendTo(td); + $('', { + src: 'check.png', + style: 'float: left;', + 'class': 'status-icon' + }).appendTo(div); - td = $('
').appendTo(tr); - td.append('Kerberos Key Present, Host Provisioned:'); + var content_div = $('
', { + style: 'float: left;' + }).appendTo(div); - td = $('
').appendTo(tr); + content_div.append('Kerberos Key Present, Host Provisioned:'); + + content_div.append(' '); $('', { 'type': 'button', 'name': 'unprovision', 'value': 'Delete Key, Unprovision' - }).appendTo(td); + }).appendTo(content_div); - tr = $('
').appendTo(tr); - $('
', { - 'class': 'status-icon status-missing' - }).appendTo(td); + $('', { + src: 'caution.png', + style: 'float: left;', + 'class': 'status-icon' + }).appendTo(div); - td = $('
').appendTo(tr); - td.append('Kerberos Key Not Present'); + content_div = $('
', { + style: 'float: left;' + }).appendTo(div); - td = $('
').appendTo(tr); + content_div.append('Kerberos Key Not Present'); - tr = $('
').appendTo(tr); + content_div.append('Enroll via One-Time-Password:'); - td = $('').appendTo(tr); - td.append('Enroll via One-Time-Password:'); - - td = $('').appendTo(tr); - - tr = $('
').appendTo(tr); - - td = $('').appendTo(tr); + content_div.append('
'); + content_div.append('
'); $('', { 'type': 'text', 'name': 'otp', 'class': 'otp' - }).appendTo(td); + }).appendTo(content_div); - td = $('
').appendTo(tr); + content_div.append(' '); $('', { 'type': 'button', 'name': 'enroll', 'value': 'Set OTP' - }).appendTo(td); + }).appendTo(content_div); }; that.setup = function(container) { that.widget_setup(container); - that.valid = $('.status-valid', that.container); - that.missing = $('.status-missing', that.container); + that.valid = $('div[name=kerberos-key-valid]', that.container); + that.missing = $('div[name=kerberos-key-missing]', that.container); var button = $('input[name=unprovision]', that.container); that.unprovision_button = IPA.button({ @@ -392,12 +394,8 @@ function host_provisioning_status_widget(spec) { }; function set_status(status) { - that.valid.toggleClass('status-valid-active', status == 'valid'); - that.missing.toggleClass('status-missing-active', status == 'missing'); - - that.unprovision_button.css('visibility', status == 'valid' ? 'visible' : 'hidden'); - that.otp_input.css('visibility', status == 'missing' ? 'visible' : 'hidden'); - that.enroll_button.css('visibility', status == 'missing' ? 'visible' : 'hidden'); + that.valid.css('display', status == 'valid' ? 'inline' : 'none'); + that.missing.css('display', status == 'missing' ? 'inline' : 'none'); } return that; diff --git a/install/static/ipa.css b/install/static/ipa.css index d94dbc75a..518e8aa26 100644 --- a/install/static/ipa.css +++ b/install/static/ipa.css @@ -235,7 +235,7 @@ dl.entryattrs input { dl.entryattrs input.otp { min-width: 15em; - width: 98%; + width: 15em; } span.attrhint { @@ -619,13 +619,15 @@ table.kerberos-key-status { } .status-icon { - width: 0.5em; - height: 0.5em; - -webkit-border-radius: 0.5em; - -moz-border-radius: 0.5em; + vertical-align: bottom; +# width: auto; +# height: 1em; +# -webkit-border-radius: 0.5em; +# -moz-border-radius: 0.5em; } .status-valid { + background-image:url('check.png'); border: 0.2em solid #008000; } diff --git a/install/static/service.js b/install/static/service.js index 62243c223..fb99b74d5 100644 --- a/install/static/service.js +++ b/install/static/service.js @@ -274,45 +274,57 @@ function service_provisioning_status_widget(spec) { that.widget_create(container); - var table = $('', { - 'class': 'kerberos-key-status' + var dd = $('
', { + 'class': 'first' }).appendTo(container); - var tr = $('
').appendTo(table); + var div = $('
', { + 'class': 'kerberos-key-valid' + }).appendTo(dd); - var td = $('
').appendTo(table); + div = $('
', { + name: 'kerberos-key-missing' + }).appendTo(dd); - td = $('
').appendTo(tr); - $('
', { - 'class': 'status-icon status-valid' - }).appendTo(td); + $('', { + src: 'check.png', + style: 'float: left;', + 'class': 'status-icon' + }).appendTo(div); - td = $('
').appendTo(tr); - td.append('Kerberos Key Present, Service Provisioned:'); + var content_div = $('
', { + style: 'float: left;' + }).appendTo(div); - td = $('
').appendTo(tr); + content_div.append('Kerberos Key Present, Service Provisioned:'); + + content_div.append(' '); $('', { 'type': 'button', 'name': 'unprovision', 'value': 'Delete Key, Unprovision' - }).appendTo(td); + }).appendTo(content_div); - tr = $('
').appendTo(tr); - $('
', { - 'class': 'status-icon status-missing' - }).appendTo(td); + $('', { + src: 'caution.png', + style: 'float: left;', + 'class': 'status-icon' + }).appendTo(div); - td = $('
').appendTo(tr); - td.append('Kerberos Key Not Present'); + content_div = $('
', { + style: 'float: left;' + }).appendTo(div); + + content_div.append('Kerberos Key Not Present'); }; that.setup = function(container) { that.widget_setup(container); - that.valid = $('.status-valid', that.container); - that.missing = $('.status-missing', that.container); + that.valid = $('div[name=kerberos-key-valid]', that.container); + that.missing = $('div[name=kerberos-key-missing]', that.container); var button = $('input[name=unprovision]', that.container); that.unprovision_button = IPA.button({ @@ -366,10 +378,8 @@ function service_provisioning_status_widget(spec) { }; function set_status(status) { - that.valid.toggleClass('status-valid-active', status == 'valid'); - that.missing.toggleClass('status-missing-active', status == 'missing'); - - that.unprovision_button.css('visibility', status == 'valid' ? 'visible' : 'hidden'); + that.valid.css('display', status == 'valid' ? 'inline' : 'none'); + that.missing.css('display', status == 'missing' ? 'inline' : 'none'); } return that;