#89 Composer move sign/encrypt buttons from menu to view

dev/Stores/User/GnuPG.js

@@ -133,13 +133,13 @@ export const GnuPGUserStore = new class {
 	/**
 	 * Checks if verifying/encrypting a message is possible with given email addresses.
 	 */
-	hasPublicKeyForEmails(recipients, all) {
+	hasPublicKeyForEmails(recipients) {
 		const count = recipients.length,
 			length = count ? recipients.filter(email =>
 //				(key.can_verify || key.can_encrypt) &&
 				this.publicKeys.find(key => key.emails.includes(email))
 			).length : 0;
-		return length && (!all || length === count);
+		return length && length === count;
 	}
 
 	getPrivateKeyFor(query, sign) {

dev/Stores/User/OpenPGP.js

@@ -145,12 +145,12 @@ export const OpenPGPUserStore = new class {
 	/**
 	 * Checks if verifying/encrypting a message is possible with given email addresses.
 	 */
-	hasPublicKeyForEmails(recipients, all) {
+	hasPublicKeyForEmails(recipients) {
 		const count = recipients.length,
 			length = count ? recipients.filter(email =>
 				this.publicKeys().find(key => key.emails.includes(email))
 			).length : 0;
-		return length && (!all || length === count);
+		return length && length === count;
 	}
 
 	getPrivateKeyFor(query/*, sign*/) {

dev/Stores/User/Pgp.js

@@ -74,33 +74,28 @@ export const PgpUserStore = new class {
 		return 0 === text.trim().indexOf('-----BEGIN PGP MESSAGE-----');
 	}
 
-	async mailvelopeHasPublicKeyForEmails(recipients, all) {
+	async mailvelopeHasPublicKeyForEmails(recipients) {
 		const
 			keyring = this.mailvelopeKeyring,
 			mailvelope = keyring && await keyring.validKeyForAddress(recipients)
 				/*.then(LookupResult => Object.entries(LookupResult))*/,
 			entries = mailvelope && Object.entries(mailvelope);
-		return !!(entries && (all ? (entries.filter(value => value[1]).length === recipients.length) : entries.length));
+		return entries && entries.filter(value => value[1]).length === recipients.length;
 	}
 
 	/**
 	 * Checks if verifying/encrypting a message is possible with given email addresses.
 	 * Returns the first library that can.
 	 */
-	async hasPublicKeyForEmails(recipients, all) {
+	async hasPublicKeyForEmails(recipients) {
 		const count = recipients.length;
 		if (count) {
-			if (OpenPGPUserStore.hasPublicKeyForEmails(recipients, all)) {
+			if (OpenPGPUserStore.hasPublicKeyForEmails(recipients)) {
 				return 'openpgp';
 			}
-
+			if (GnuPGUserStore.hasPublicKeyForEmails(recipients)) {
-			if (GnuPGUserStore.hasPublicKeyForEmails(recipients, all)) {
 				return 'gnupg';
 			}
-
-			if (await this.mailvelopeHasPublicKeyForEmails(recipients, all)) {
-				return 'mailvelope';
-			}
 		}
 		return false;
 	}

dev/Styles/User/Compose.less

@@ -113,10 +113,6 @@
 			}
 		}
 
-		> div {
-			line-height: 30px;
-		}
-
 		textarea, input[type="text"] {
 			width: 100%;
 		}

dev/View/Popup/Compose.js

@@ -134,8 +134,6 @@ class ComposePopupView extends AbstractViewPopup {
 
 		this.bSkipNextHide = false;
 
-		this.capaOpenPGP = PgpUserStore.isSupported();
-
 		this.addObservables({
 			identitiesDropdownTrigger: false,
 
@@ -183,8 +181,6 @@ class ComposePopupView extends AbstractViewPopup {
 
 			viewArea: 'body',
 
-			composeUploaderButton: null, // initDom
-			composeUploaderDropPlace: null, // initDom
 			attacheMultipleAllowed: false,
 			addAttachmentEnabled: false,
 
@@ -283,7 +279,10 @@ class ComposePopupView extends AbstractViewPopup {
 			currentIdentity: value => {
 				this.canPgpSign(false);
 				value && PgpUserStore.getKeyForSigning(value.email()).then(result => {
-					console.log({canPgpSign:result});
+					console.log({
+						email: value.email(),
+						canPgpSign:result
+					});
 					this.canPgpSign(result)
 				});
 			},
@@ -1120,14 +1119,12 @@ class ComposePopupView extends AbstractViewPopup {
 		}
 	}
 
-	onBuild() {
+	onBuild(dom) {
 		// initUploader
-
-		if (this.composeUploaderButton()) {
 		const oJua = new Jua({
 				action: serverRequest('Upload'),
-					clickElement: this.composeUploaderButton(),
+				clickElement: dom.querySelector('#composeUploadButton'),
-					dragAndDropElement: this.composeUploaderDropPlace()
+				dragAndDropElement: dom.querySelector('.b-attachment-place')
 			}),
 			uploadCache = {},
 			attachmentSizeLimit = pInt(SettingsGet('AttachmentLimit'));
@@ -1239,7 +1236,6 @@ class ComposePopupView extends AbstractViewPopup {
 			});
 
 		this.addAttachmentEnabled(true);
-		}
 
 		shortcuts.add('q', 'meta', Scope.Compose, ()=>false);
 		shortcuts.add('w', 'meta', Scope.Compose, ()=>false);
@@ -1514,7 +1510,7 @@ class ComposePopupView extends AbstractViewPopup {
 				quotedMailHeader: '', // header to be added before the quoted mail
 				keepAttachments: false, // add attachments of quotedMail to editor (default: false)
 */
-				signMsg: confirm('Also sign this message?')
+				signMsg: this.pgpSign() || confirm('Sign this message?')
 			}).then(editor => this.mailvelope = editor);
 		}
 		this.viewArea('mailvelope');
@@ -1542,11 +1538,12 @@ class ComposePopupView extends AbstractViewPopup {
 	}
 
 	initPgpEncrypt() {
-		PgpUserStore.hasPublicKeyForEmails(this.allRecipients(), 1).then(result => {
+		const recipients = this.allRecipients();
+		PgpUserStore.hasPublicKeyForEmails(recipients).then(result => {
 			console.log({canPgpEncrypt:result});
 			this.canPgpEncrypt(result);
 		});
-		PgpUserStore.mailvelopeHasPublicKeyForEmails(this.allRecipients(), 1).then(result => {
+		PgpUserStore.mailvelopeHasPublicKeyForEmails(recipients).then(result => {
 			console.log({canMailvelope:result});
 			this.canMailvelope(result);
 			if (!result) {

snappymail/v/0.0.0/app/templates/Views/User/PopupsCompose.html

@@ -40,7 +40,7 @@
 						<a class="btn" data-i18n="GLOBAL/BCC"
 							data-bind="visible: !showBcc(), click: function () { showBcc(true); }"></a>
 						<a class="btn fontastic" data-bind="visible: allowContacts, command: contactsCommand" data-i18n="[title]GLOBAL/CONTACTS">📇</a>
-						<div class="btn-group dropdown" data-bind="registerBootstrapDropdown: true" style="display:inline;vertical-align:top">
+						<div class="btn-group dropdown" data-bind="registerBootstrapDropdown: true" style="display:inline-block;vertical-align:top">
 							<a class="btn dropdown-toggle fontastic">☰</a>
 							<ul class="dropdown-menu right-edge" role="menu">
 								<li data-bind="click: function () { showBcc(!showBcc()); }">
@@ -79,20 +79,6 @@
 										<span data-i18n="COMPOSE/BUTTON_MARK_AS_IMPORTANT"></span>
 									</a>
 								</li>
-								<!-- ko if: capaOpenPGP -->
-								<li class="dividerbar" data-bind="click: togglePgpSign, css: {'disabled': !canPgpSign()}">
-									<a>
-										<i class="fontastic" data-bind="text: pgpSign() ? '✍' : '☐'"></i>
-										<span data-i18n="OPENPGP/LABEL_SIGN"></span>
-									</a>
-								</li>
-								<li data-bind="click: togglePgpEncrypt, css: {'disabled': !canPgpEncrypt()}">
-									<a>
-										<i class="fontastic" data-bind="text: pgpEncrypt() ? '🔒' : '☐'"></i>
-										<span data-i18n="OPENPGP/LABEL_ENCRYPT"></span>
-									</a>
-								</li>
-								<!-- /ko -->
 							</ul>
 						</div>
 					</span>
@@ -131,9 +117,8 @@
 					<input type="text" size="70" autocomplete="off" data-bind="textInput: subject" />
 				</td>
 			</tr>
-			<tr>
+		</table>
-				<td></td>
+		<div style="display:flex">
-				<td style="display:flex">
 			<div class="btn-group" style="flex-grow:1" id="area-toggle">
 				<button type="button" class="btn" data-bind="click: bodyArea,
 					css: { 'active': 'body' == viewArea() }">
@@ -153,19 +138,24 @@
 				</button>
 			</div>
 			<div class="btn-group">
-						<a class="btn"
+				<a class="btn" data-bind="click: togglePgpSign, visible: canPgpSign, css: {'btn-success': pgpSign()}">
-							style="padding-left: 10px; padding-right: 10px;"
+					<i class="fontastic" data-bind="text: pgpSign() ? '☑' : '☐'"></i>
-							data-bind="visible: addAttachmentEnabled(), initDom: composeUploaderButton" data-i18n="[title]COMPOSE/ATTACH_FILES">
+					<span data-i18n="OPENPGP/LABEL_SIGN"></span>
-							<sup style="font-weight: bold; font-size: 100%; top: -0.3em;">+</sup><i class="icon-attachment"></i>
+				</a>
+				<a class="btn" data-bind="click: togglePgpEncrypt, visible: canPgpEncrypt, css: {'btn-success': pgpEncrypt()}">
+					<i class="fontastic" data-bind="text: pgpEncrypt() ? '☑' : '☐'"></i>
+					<span data-i18n="OPENPGP/LABEL_ENCRYPT"></span>
+				</a>
+				<a class="btn fontastic" style="padding-left: 10px; padding-right: 10px;" id="composeUploadButton"
+					data-bind="visible: addAttachmentEnabled()" data-i18n="[title]COMPOSE/ATTACH_FILES">
+					⁺📎
 				</a>
 			</div>
-				</td>
+		</div>
-			</tr>
-		</table>
 	</div>
 
 	<div class="attachmentAreaParent" data-bind="visible: 'attachments' == viewArea()">
-		<div class="b-attachment-place" data-bind="visible: addAttachmentEnabled() && dragAndDropVisible(), initDom: composeUploaderDropPlace, css: {'dragAndDropOver': dragAndDropOver}"
+		<div class="b-attachment-place" data-bind="visible: addAttachmentEnabled() && dragAndDropVisible(), css: {'dragAndDropOver': dragAndDropOver}"
 			data-i18n="COMPOSE/ATTACH_DROP_FILES_DESC"></div>
 		<ul class="attachmentList" data-bind="foreach: attachments">
 			<li class="attachmentItem" data-bind="attr: { 'title': title }, css: { 'waiting': waiting, 'error': '' !== error() }">