From e611094dfc396179a680c0c41cfe7bfe57dcb89c Mon Sep 17 00:00:00 2001 From: Thais Siqueira Date: Wed, 18 Jan 2017 17:58:40 -0200 Subject: [#828] Adds tooltips for encrypt and sign labels We added a tooltip on the "encrypted" and "signed" label to inform the user what these flags mean. And we did some refactoring. With @tayanefernandes --- web-ui/app/js/mail_view/ui/mail_view.js | 95 +++++++++++++------------ web-ui/app/scss/views/_security-labels.scss | 8 +++ web-ui/app/templates/mails/full_view.hbs | 4 +- web-ui/test/spec/mail_view/ui/mail_view.spec.js | 42 ++++++++--- 4 files changed, 92 insertions(+), 57 deletions(-) diff --git a/web-ui/app/js/mail_view/ui/mail_view.js b/web-ui/app/js/mail_view/ui/mail_view.js index 4c9dce30..4315226c 100644 --- a/web-ui/app/js/mail_view/ui/mail_view.js +++ b/web-ui/app/js/mail_view/ui/mail_view.js @@ -96,72 +96,79 @@ define( }; this.checkEncrypted = function(mail) { - if(_.isEmpty(mail.security_casing.locks)) { - return { - cssClass: 'security-status__label--not-encrypted', - label: 'not-encrypted' - }; - } - - var statusClass = ['security-status__label--encrypted']; + var statusClass = ['security-status__label']; var statusLabel; + var tooltip; - var hasAnyEncryptionInfo = _.any(mail.security_casing.locks, function (lock) { - return lock.state === 'valid'; - }); - - if(hasAnyEncryptionInfo) { - statusLabel = 'encrypted'; + if(_.isEmpty(mail.security_casing.locks)) { + statusClass.push('--not-encrypted'); + statusLabel = 'not-encrypted'; + tooltip = 'This message is not encrypted.'; } else { - statusClass.push('--with-error'); - statusLabel = 'encryption-error'; + statusClass.push('--encrypted'); + + var hasAnyEncryptionInfo = _.any(mail.security_casing.locks, function (lock) { + return lock.state === 'valid'; + }); + + if(hasAnyEncryptionInfo) { + statusLabel = 'encrypted'; + tooltip = 'This message was encrypted.'; + } else { + statusClass.push('--with-error'); + statusLabel = 'encryption-error'; + tooltip = 'This message had an encryption error.'; + } } return { cssClass: statusClass.join(''), - label: statusLabel + label: statusLabel, + tooltipText: tooltip }; }; this.checkSigned = function(mail) { - var statusNotSigned = { - cssClass: 'security-status__label--not-signed', - label: 'not-signed' - }; - - if(_.isEmpty(mail.security_casing.imprints)) { - return statusNotSigned; - } + var statusClass = ['security-status__label']; + var statusLabel = []; + var tooltip; var hasNoSignatureInformation = _.any(mail.security_casing.imprints, function (imprint) { return imprint.state === 'no_signature_information'; }); - if(hasNoSignatureInformation) { - return statusNotSigned; - } - - var statusClass = ['security-status__label--signed']; - var statusLabel = ['signed']; - - if(_.any(mail.security_casing.imprints, function(imprint) { return imprint.state === 'from_revoked'; })) { - statusClass.push('--revoked'); - statusLabel.push('signature-revoked'); - } + if(_.isEmpty(mail.security_casing.imprints) || hasNoSignatureInformation) { + statusClass.push('--not-signed'); + statusLabel.push('not-signed'); + tooltip = 'The sender could not be verified.'; + } else { + statusClass.push('--signed'); + statusLabel.push('signed'); + tooltip = 'You are communicating with the real sender.'; + + if(_.any(mail.security_casing.imprints, function(imprint) { return imprint.state === 'from_revoked'; })) { + statusClass.push('--revoked'); + statusLabel.push('signature-revoked'); + tooltip = 'The sender could not be verified.'; + } - if(_.any(mail.security_casing.imprints, function(imprint) { return imprint.state === 'from_expired'; })) { - statusClass.push('--expired'); - statusLabel.push('signature-expired'); - } + if(_.any(mail.security_casing.imprints, function(imprint) { return imprint.state === 'from_expired'; })) { + statusClass.push('--expired'); + statusLabel.push('signature-expired'); + tooltip = 'The sender could not be verified.'; + } - if(this.isNotTrusted(mail)) { - statusClass.push('--not-trusted'); - statusLabel.push('signature-not-trusted'); + if(this.isNotTrusted(mail)) { + statusClass.push('--not-trusted'); + statusLabel.push('signature-not-trusted'); + tooltip = 'The sender could not be verified.'; + } } return { cssClass: statusClass.join(''), - label: statusLabel.join(' ') + label: statusLabel.join(' '), + tooltipText: tooltip }; }; diff --git a/web-ui/app/scss/views/_security-labels.scss b/web-ui/app/scss/views/_security-labels.scss index ac966ded..5319eb1d 100644 --- a/web-ui/app/scss/views/_security-labels.scss +++ b/web-ui/app/scss/views/_security-labels.scss @@ -8,11 +8,19 @@ background: $success; color: $white; border-radius: 12px; + position: relative; &:before { font-family: FontAwesome; } + &:hover:after { + content: attr(data-label); + font-size: 0.5rem; + + @include tooltip(25px, 0px); + } + &--encrypted { &:before { content: "\f023"; diff --git a/web-ui/app/templates/mails/full_view.hbs b/web-ui/app/templates/mails/full_view.hbs index 736bc854..44ed44ed 100644 --- a/web-ui/app/templates/mails/full_view.hbs +++ b/web-ui/app/templates/mails/full_view.hbs @@ -8,12 +8,12 @@
{{#if signatureStatus}} - + {{t signatureStatus.label }} {{/if}} {{#if encryptionStatus}} - + {{t encryptionStatus.label }} {{/if}} diff --git a/web-ui/test/spec/mail_view/ui/mail_view.spec.js b/web-ui/test/spec/mail_view/ui/mail_view.spec.js index 0e05ddef..75a3895e 100644 --- a/web-ui/test/spec/mail_view/ui/mail_view.spec.js +++ b/web-ui/test/spec/mail_view/ui/mail_view.spec.js @@ -110,61 +110,81 @@ describeComponent('mail_view/ui/mail_view', function () { it('assumes that the mail is encrypted and valid if at least one of the locks are valid', function() { var email = testData; email.security_casing = {locks: [{state: 'valid'}, {state: 'failure'}]}; - expect(this.component.checkEncrypted(email).cssClass).toEqual('security-status__label--encrypted'); + var checkEncrypted = this.component.checkEncrypted(email); + expect(checkEncrypted.cssClass).toEqual('security-status__label--encrypted'); + expect(checkEncrypted.tooltipText).toEqual('This message was encrypted.'); }); it('assumes that the mail is encrypted and failure if all the locks are failed', function() { var email = testData; email.security_casing = {locks: [{state: 'failure'}, {state: 'failure'}]}; - expect(this.component.checkEncrypted(email).cssClass).toEqual('security-status__label--encrypted--with-error'); + var checkEncrypted = this.component.checkEncrypted(email); + expect(checkEncrypted.cssClass).toEqual('security-status__label--encrypted--with-error'); + expect(checkEncrypted.tooltipText).toEqual('This message had an encryption error.'); }); it('assumes that the mail is not encrypted if it doesn\'t have any locks', function() { var email = testData; email.security_casing = {locks: []}; - expect(this.component.checkEncrypted(email).cssClass).toEqual('security-status__label--not-encrypted'); + var checkEncrypted = this.component.checkEncrypted(email); + expect(checkEncrypted.cssClass).toEqual('security-status__label--not-encrypted'); + expect(checkEncrypted.tooltipText).toEqual('This message is not encrypted.'); }); it('assumes that the mail is signed only if all imprints are valid', function() { var email = testData; email.security_casing = {imprints: [{state: 'valid', seal: {trust: 'marginal', validity: 'marginal'}}, {state: 'valid', seal: {trust: 'marginal', validity: 'marginal'}}]}; - expect(this.component.checkSigned(email).cssClass).toEqual('security-status__label--signed'); + var checkSigned = this.component.checkSigned(email); + expect(checkSigned.cssClass).toEqual('security-status__label--signed'); + expect(checkSigned.tooltipText).toEqual('You are communicating with the real sender.'); }); it('assumes that the mail is signed with failures if there is a revoke or expire', function() { var email = testData; email.security_casing = {imprints: [{state: 'valid', seal: {trust: 'marginal', validity: 'marginal'}}, {state: 'from_revoked', seal: {trust: 'marginal', validity: 'marginal'}}]}; - expect(this.component.checkSigned(email).cssClass).toEqual('security-status__label--signed--revoked'); + var checkSigned = this.component.checkSigned(email); + expect(checkSigned.cssClass).toEqual('security-status__label--signed--revoked'); + expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); }); it('assumes that mail is not trusted if its signature contains no_trust from the user', function() { var email = testData; email.security_casing = {imprints: [{seal: {trust: 'no_trust', validity: 'ultimate'}}]}; - expect(this.component.checkSigned(email).cssClass).toEqual('security-status__label--signed--not-trusted'); + var checkSigned = this.component.checkSigned(email); + expect(checkSigned.cssClass).toEqual('security-status__label--signed--not-trusted'); + expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); }); it('uses validity when trust is not present', function() { var email = testData; email.security_casing = {imprints: [{seal: { validity: 'no_trust'}}]}; - expect(this.component.checkSigned(email).cssClass).toEqual('security-status__label--signed--not-trusted'); + var checkSigned = this.component.checkSigned(email); + expect(checkSigned.cssClass).toEqual('security-status__label--signed--not-trusted'); + expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); }); - it('assumes not trusted when the signature is not found', function(){ + it('assumes not trusted when the seal signature is not found', function(){ var email = testData; email.security_casing = {imprints: [{seal: null}]}; - expect(this.component.checkSigned(email).cssClass).toEqual('security-status__label--signed--not-trusted'); + var checkSigned = this.component.checkSigned(email); + expect(checkSigned.cssClass).toEqual('security-status__label--signed--not-trusted'); + expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); }); it('assumes that the mail is not signed if there are no imprints', function() { var email = testData; email.security_casing = {imprints: []}; - expect(this.component.checkSigned(email).cssClass).toEqual('security-status__label--not-signed'); + var checkSigned = this.component.checkSigned(email); + expect(checkSigned.cssClass).toEqual('security-status__label--not-signed'); + expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); }); it('assumes that there is no signature info to show', function() { var email = testData; email.security_casing = {imprints: [{state: 'no_signature_information'}]}; - expect(this.component.checkSigned(email).cssClass).toEqual('security-status__label--not-signed'); + var checkSigned = this.component.checkSigned(email); + expect(checkSigned.cssClass).toEqual('security-status__label--not-signed'); + expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); }); it('shows that mail is encrypted if it is', function() { -- cgit v1.2.3 From f9bda79686c5a4f65bc1c98bc5a1936faf1bc8e0 Mon Sep 17 00:00:00 2001 From: Thais Siqueira Date: Wed, 18 Jan 2017 19:01:05 -0200 Subject: [#828] Replaced plain text to translation properties with @tayanefernandes --- web-ui/app/js/mail_view/ui/mail_view.js | 16 ++++++++-------- web-ui/app/locales/en_US/translation.json | 5 +++++ web-ui/app/templates/mails/full_view.hbs | 4 ++-- web-ui/test/spec/mail_view/ui/mail_view.spec.js | 20 ++++++++++---------- 4 files changed, 25 insertions(+), 20 deletions(-) diff --git a/web-ui/app/js/mail_view/ui/mail_view.js b/web-ui/app/js/mail_view/ui/mail_view.js index 4315226c..86605b37 100644 --- a/web-ui/app/js/mail_view/ui/mail_view.js +++ b/web-ui/app/js/mail_view/ui/mail_view.js @@ -103,7 +103,7 @@ define( if(_.isEmpty(mail.security_casing.locks)) { statusClass.push('--not-encrypted'); statusLabel = 'not-encrypted'; - tooltip = 'This message is not encrypted.'; + tooltip = 'not-encrypted-label-tooltip'; } else { statusClass.push('--encrypted'); @@ -113,11 +113,11 @@ define( if(hasAnyEncryptionInfo) { statusLabel = 'encrypted'; - tooltip = 'This message was encrypted.'; + tooltip = 'encrypted-label-tooltip'; } else { statusClass.push('--with-error'); statusLabel = 'encryption-error'; - tooltip = 'This message had an encryption error.'; + tooltip = 'encryption-error-label-tooltip'; } } @@ -140,28 +140,28 @@ define( if(_.isEmpty(mail.security_casing.imprints) || hasNoSignatureInformation) { statusClass.push('--not-signed'); statusLabel.push('not-signed'); - tooltip = 'The sender could not be verified.'; + tooltip = 'not-signed-label-tooltip'; } else { statusClass.push('--signed'); statusLabel.push('signed'); - tooltip = 'You are communicating with the real sender.'; + tooltip = 'signed-label-tooltip'; if(_.any(mail.security_casing.imprints, function(imprint) { return imprint.state === 'from_revoked'; })) { statusClass.push('--revoked'); statusLabel.push('signature-revoked'); - tooltip = 'The sender could not be verified.'; + tooltip = 'not-signed-label-tooltip'; } if(_.any(mail.security_casing.imprints, function(imprint) { return imprint.state === 'from_expired'; })) { statusClass.push('--expired'); statusLabel.push('signature-expired'); - tooltip = 'The sender could not be verified.'; + tooltip = 'not-signed-label-tooltip'; } if(this.isNotTrusted(mail)) { statusClass.push('--not-trusted'); statusLabel.push('signature-not-trusted'); - tooltip = 'The sender could not be verified.'; + tooltip = 'not-signed-label-tooltip'; } } diff --git a/web-ui/app/locales/en_US/translation.json b/web-ui/app/locales/en_US/translation.json index 873b4a56..6e2cef80 100644 --- a/web-ui/app/locales/en_US/translation.json +++ b/web-ui/app/locales/en_US/translation.json @@ -38,6 +38,11 @@ "not-encrypted": "Not encrypted", "signed": "Verified sender", "not-signed": "Not signed", + "encrypted-label-tooltip": "This message was encrypted.", + "encryption-error-label-tooltip": "This message had an encryption error.", + "not-encrypted-label-tooltip": "This message is not encrypted.", + "not-signed-label-tooltip": "The sender could not be verified.", + "signed-label-tooltip": "You are communicating with the real sender.", "sending-mail": "Sending...", "trash-button": "Delete it", "search-placeholder" : "Search...", diff --git a/web-ui/app/templates/mails/full_view.hbs b/web-ui/app/templates/mails/full_view.hbs index 44ed44ed..0068b7f7 100644 --- a/web-ui/app/templates/mails/full_view.hbs +++ b/web-ui/app/templates/mails/full_view.hbs @@ -8,12 +8,12 @@
{{#if signatureStatus}} - + {{t signatureStatus.label }} {{/if}} {{#if encryptionStatus}} - + {{t encryptionStatus.label }} {{/if}} diff --git a/web-ui/test/spec/mail_view/ui/mail_view.spec.js b/web-ui/test/spec/mail_view/ui/mail_view.spec.js index 75a3895e..a99eba59 100644 --- a/web-ui/test/spec/mail_view/ui/mail_view.spec.js +++ b/web-ui/test/spec/mail_view/ui/mail_view.spec.js @@ -112,7 +112,7 @@ describeComponent('mail_view/ui/mail_view', function () { email.security_casing = {locks: [{state: 'valid'}, {state: 'failure'}]}; var checkEncrypted = this.component.checkEncrypted(email); expect(checkEncrypted.cssClass).toEqual('security-status__label--encrypted'); - expect(checkEncrypted.tooltipText).toEqual('This message was encrypted.'); + expect(checkEncrypted.tooltipText).toEqual('encrypted-label-tooltip'); }); it('assumes that the mail is encrypted and failure if all the locks are failed', function() { @@ -120,7 +120,7 @@ describeComponent('mail_view/ui/mail_view', function () { email.security_casing = {locks: [{state: 'failure'}, {state: 'failure'}]}; var checkEncrypted = this.component.checkEncrypted(email); expect(checkEncrypted.cssClass).toEqual('security-status__label--encrypted--with-error'); - expect(checkEncrypted.tooltipText).toEqual('This message had an encryption error.'); + expect(checkEncrypted.tooltipText).toEqual('encryption-error-label-tooltip'); }); it('assumes that the mail is not encrypted if it doesn\'t have any locks', function() { @@ -128,7 +128,7 @@ describeComponent('mail_view/ui/mail_view', function () { email.security_casing = {locks: []}; var checkEncrypted = this.component.checkEncrypted(email); expect(checkEncrypted.cssClass).toEqual('security-status__label--not-encrypted'); - expect(checkEncrypted.tooltipText).toEqual('This message is not encrypted.'); + expect(checkEncrypted.tooltipText).toEqual('not-encrypted-label-tooltip'); }); it('assumes that the mail is signed only if all imprints are valid', function() { @@ -136,7 +136,7 @@ describeComponent('mail_view/ui/mail_view', function () { email.security_casing = {imprints: [{state: 'valid', seal: {trust: 'marginal', validity: 'marginal'}}, {state: 'valid', seal: {trust: 'marginal', validity: 'marginal'}}]}; var checkSigned = this.component.checkSigned(email); expect(checkSigned.cssClass).toEqual('security-status__label--signed'); - expect(checkSigned.tooltipText).toEqual('You are communicating with the real sender.'); + expect(checkSigned.tooltipText).toEqual('signed-label-tooltip'); }); it('assumes that the mail is signed with failures if there is a revoke or expire', function() { @@ -144,7 +144,7 @@ describeComponent('mail_view/ui/mail_view', function () { email.security_casing = {imprints: [{state: 'valid', seal: {trust: 'marginal', validity: 'marginal'}}, {state: 'from_revoked', seal: {trust: 'marginal', validity: 'marginal'}}]}; var checkSigned = this.component.checkSigned(email); expect(checkSigned.cssClass).toEqual('security-status__label--signed--revoked'); - expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); + expect(checkSigned.tooltipText).toEqual('not-signed-label-tooltip'); }); it('assumes that mail is not trusted if its signature contains no_trust from the user', function() { @@ -152,7 +152,7 @@ describeComponent('mail_view/ui/mail_view', function () { email.security_casing = {imprints: [{seal: {trust: 'no_trust', validity: 'ultimate'}}]}; var checkSigned = this.component.checkSigned(email); expect(checkSigned.cssClass).toEqual('security-status__label--signed--not-trusted'); - expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); + expect(checkSigned.tooltipText).toEqual('not-signed-label-tooltip'); }); it('uses validity when trust is not present', function() { @@ -160,7 +160,7 @@ describeComponent('mail_view/ui/mail_view', function () { email.security_casing = {imprints: [{seal: { validity: 'no_trust'}}]}; var checkSigned = this.component.checkSigned(email); expect(checkSigned.cssClass).toEqual('security-status__label--signed--not-trusted'); - expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); + expect(checkSigned.tooltipText).toEqual('not-signed-label-tooltip'); }); it('assumes not trusted when the seal signature is not found', function(){ @@ -168,7 +168,7 @@ describeComponent('mail_view/ui/mail_view', function () { email.security_casing = {imprints: [{seal: null}]}; var checkSigned = this.component.checkSigned(email); expect(checkSigned.cssClass).toEqual('security-status__label--signed--not-trusted'); - expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); + expect(checkSigned.tooltipText).toEqual('not-signed-label-tooltip'); }); it('assumes that the mail is not signed if there are no imprints', function() { @@ -176,7 +176,7 @@ describeComponent('mail_view/ui/mail_view', function () { email.security_casing = {imprints: []}; var checkSigned = this.component.checkSigned(email); expect(checkSigned.cssClass).toEqual('security-status__label--not-signed'); - expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); + expect(checkSigned.tooltipText).toEqual('not-signed-label-tooltip'); }); it('assumes that there is no signature info to show', function() { @@ -184,7 +184,7 @@ describeComponent('mail_view/ui/mail_view', function () { email.security_casing = {imprints: [{state: 'no_signature_information'}]}; var checkSigned = this.component.checkSigned(email); expect(checkSigned.cssClass).toEqual('security-status__label--not-signed'); - expect(checkSigned.tooltipText).toEqual('The sender could not be verified.'); + expect(checkSigned.tooltipText).toEqual('not-signed-label-tooltip'); }); it('shows that mail is encrypted if it is', function() { -- cgit v1.2.3 From 55b394ce3f962897e08c5853fc313026ddec03b8 Mon Sep 17 00:00:00 2001 From: Thais Siqueira Date: Thu, 19 Jan 2017 14:55:48 -0200 Subject: [#828] Adds Portuguese translation for encrypted and signed tooltips with @tayanefernandes --- web-ui/app/locales/pt_BR/translation.json | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/web-ui/app/locales/pt_BR/translation.json b/web-ui/app/locales/pt_BR/translation.json index ff766a2b..d1ab7245 100644 --- a/web-ui/app/locales/pt_BR/translation.json +++ b/web-ui/app/locales/pt_BR/translation.json @@ -36,8 +36,13 @@ "you": "você", "encrypted": "Criptografado", "not-encrypted": "Não criptografado", - "signed": "Rementente verificado", + "signed": "Remetente verificado", "not-signed": "Não assinado", + "encrypted-label-tooltip": "Esta mensagem foi criptografada.", + "encryption-error-label-tooltip": "Esta mensagem contém um erro de criptografia.", + "not-encrypted-label-tooltip": "Esta mensagem não foi criptografada.", + "not-signed-label-tooltip": "O remetente não pode ser verificado.", + "signed-label-tooltip": "Você está se comunicando com o remetente real.", "sending-mail": "Enviando...", "trash-button": "Deletar", "search-placeholder" : "Pesquisar...", -- cgit v1.2.3 From a05b42935725a032196157a9200fb4f7019ae132 Mon Sep 17 00:00:00 2001 From: Thais Siqueira Date: Thu, 19 Jan 2017 15:47:32 -0200 Subject: [#828] Refactoring checkEncrypted and checkSigned functions with @tayanefernandes --- web-ui/app/js/mail_view/ui/mail_view.js | 128 ++++++++++++++++++-------------- 1 file changed, 71 insertions(+), 57 deletions(-) diff --git a/web-ui/app/js/mail_view/ui/mail_view.js b/web-ui/app/js/mail_view/ui/mail_view.js index 86605b37..029707c1 100644 --- a/web-ui/app/js/mail_view/ui/mail_view.js +++ b/web-ui/app/js/mail_view/ui/mail_view.js @@ -96,80 +96,94 @@ define( }; this.checkEncrypted = function(mail) { - var statusClass = ['security-status__label']; - var statusLabel; - var tooltip; + var ENCRYPTED_FLAG = { + cssClass: 'security-status__label--encrypted', + label: 'encrypted', + tooltipText: 'encrypted-label-tooltip' + }; + + var ENCRYPTED_WITH_ERROR_FLAG = { + cssClass: 'security-status__label--encrypted--with-error', + label: 'encryption-error', + tooltipText: 'encryption-error-label-tooltip' + }; + + var NOT_ENCRYPTED_FLAG = { + cssClass: 'security-status__label--not-encrypted', + label: 'not-encrypted', + tooltipText: 'not-encrypted-label-tooltip' + }; if(_.isEmpty(mail.security_casing.locks)) { - statusClass.push('--not-encrypted'); - statusLabel = 'not-encrypted'; - tooltip = 'not-encrypted-label-tooltip'; - } else { - statusClass.push('--encrypted'); - - var hasAnyEncryptionInfo = _.any(mail.security_casing.locks, function (lock) { - return lock.state === 'valid'; - }); - - if(hasAnyEncryptionInfo) { - statusLabel = 'encrypted'; - tooltip = 'encrypted-label-tooltip'; - } else { - statusClass.push('--with-error'); - statusLabel = 'encryption-error'; - tooltip = 'encryption-error-label-tooltip'; - } + return NOT_ENCRYPTED_FLAG; } - return { - cssClass: statusClass.join(''), - label: statusLabel, - tooltipText: tooltip - }; + if(this.hasAnyEncryptionInfo(mail)) { + return ENCRYPTED_FLAG; + } + + return ENCRYPTED_WITH_ERROR_FLAG; + }; + + this.hasAnyEncryptionInfo = function(mail) { + return _.any(mail.security_casing.locks, function (lock) { + return lock.state === 'valid'; + }); }; this.checkSigned = function(mail) { - var statusClass = ['security-status__label']; - var statusLabel = []; - var tooltip; + + var SIGNED_FLAG = { + cssClass: 'security-status__label--signed', + label: 'signed', + tooltipText: 'signed-label-tooltip' + }; + + var SIGNED_REVOKED_FLAG = { + cssClass: 'security-status__label--signed--revoked', + label: 'signature-revoked', + tooltipText: 'not-signed-label-tooltip' + }; + + var SIGNED_EXPIRED_FLAG = { + cssClass: 'security-status__label--signed--expired', + label: 'signature-expired', + tooltipText: 'not-signed-label-tooltip' + }; + + var SIGNED_NOT_TRUSTED_FLAG = { + cssClass: 'security-status__label--signed--not-trusted', + label: 'signature-not-trusted', + tooltipText: 'not-signed-label-tooltip' + }; + + var NOT_SIGNED_FLAG = { + cssClass: 'security-status__label--not-signed', + label: 'not-signed', + tooltipText: 'not-signed-label-tooltip' + }; var hasNoSignatureInformation = _.any(mail.security_casing.imprints, function (imprint) { return imprint.state === 'no_signature_information'; }); if(_.isEmpty(mail.security_casing.imprints) || hasNoSignatureInformation) { - statusClass.push('--not-signed'); - statusLabel.push('not-signed'); - tooltip = 'not-signed-label-tooltip'; - } else { - statusClass.push('--signed'); - statusLabel.push('signed'); - tooltip = 'signed-label-tooltip'; - - if(_.any(mail.security_casing.imprints, function(imprint) { return imprint.state === 'from_revoked'; })) { - statusClass.push('--revoked'); - statusLabel.push('signature-revoked'); - tooltip = 'not-signed-label-tooltip'; - } + return NOT_SIGNED_FLAG; + } - if(_.any(mail.security_casing.imprints, function(imprint) { return imprint.state === 'from_expired'; })) { - statusClass.push('--expired'); - statusLabel.push('signature-expired'); - tooltip = 'not-signed-label-tooltip'; - } + if(_.any(mail.security_casing.imprints, function(imprint) { return imprint.state === 'from_revoked'; })) { + return SIGNED_REVOKED_FLAG; + } - if(this.isNotTrusted(mail)) { - statusClass.push('--not-trusted'); - statusLabel.push('signature-not-trusted'); - tooltip = 'not-signed-label-tooltip'; - } + if(_.any(mail.security_casing.imprints, function(imprint) { return imprint.state === 'from_expired'; })) { + return SIGNED_EXPIRED_FLAG; } - return { - cssClass: statusClass.join(''), - label: statusLabel.join(' '), - tooltipText: tooltip - }; + if(this.isNotTrusted(mail)) { + return SIGNED_NOT_TRUSTED_FLAG; + } + + return SIGNED_FLAG; }; this.isNotTrusted = function(mail){ -- cgit v1.2.3 From f611ab80133efdea8cf1e303636c1a850b5d52d0 Mon Sep 17 00:00:00 2001 From: Thais Siqueira Date: Thu, 19 Jan 2017 16:23:38 -0200 Subject: [#828] Changes color and size of tooltip with @tayanefernandes --- web-ui/app/scss/_mixins.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/web-ui/app/scss/_mixins.scss b/web-ui/app/scss/_mixins.scss index d3aa0220..6509bdcf 100644 --- a/web-ui/app/scss/_mixins.scss +++ b/web-ui/app/scss/_mixins.scss @@ -6,14 +6,14 @@ } @mixin tooltip($top: 8px, $left: 40px) { - background: rgba(0, 0, 0, 0.7); + background: $dark_slate_gray; color: $white; position: absolute; z-index: 2; left: $left; top: $top; font-size: 0.8rem; - padding: 2px 10px; + padding: 4px 10px; white-space: nowrap; @include border-radius(2px); } -- cgit v1.2.3