Dropdown menu keyboard navigation

Keyboard shortcuts help popup (Shift + / )

dev/Admin/Contacts.js

@@ -54,7 +54,7 @@ function AdminContacts()
 		return {
 			'id': sValue,
 			'name': getTypeName(sValue) + (bDisabled ? ' (not supported)' : ''),
-			'disable': bDisabled
+			'disabled': bDisabled
 		};
 	});
 

dev/Admin/Plugins.js

@@ -47,7 +47,7 @@ AdminPlugins.prototype.onBuild = function (oDom)
 				self.configurePlugin(oPlugin);
 			}
 		})
-		.on('click', '.e-item .disable-plugin', function () {
+		.on('click', '.e-item .disabled-plugin', function () {
 			var oPlugin = ko.dataFor(this);
 			if (oPlugin)
 			{

dev/Boots/RainLoopApp.js

@@ -820,7 +820,7 @@ RainLoopApp.prototype.folderListOptionsBuilder = function (aSystem, aList, aDisa
 		aResult.push({
 			'id': aHeaderLines[iIndex][0],
 			'name': aHeaderLines[iIndex][1],
-			'disable': false
+			'disabled': false
 		});
 	}
 
@@ -833,7 +833,7 @@ RainLoopApp.prototype.folderListOptionsBuilder = function (aSystem, aList, aDisa
 				'id': oItem.fullNameRaw,
 				'system': true,
 				'name': fRenameCallback ? fRenameCallback.call(null, oItem) : oItem.name(),
-				'disable': !oItem.selectable || -1 < Utils.inArray(oItem.fullNameRaw, aDisabled) ||
+				'disabled': !oItem.selectable || -1 < Utils.inArray(oItem.fullNameRaw, aDisabled) ||
 					(fDisableCallback ? fDisableCallback.call(null, oItem) : false)
 			});
 		}
@@ -853,7 +853,7 @@ RainLoopApp.prototype.folderListOptionsBuilder = function (aSystem, aList, aDisa
 						'system': false,
 						'name': (new window.Array(oItem.deep + 1 - iUnDeep)).join(sDeepPrefix) + 
 							(fRenameCallback ? fRenameCallback.call(null, oItem) : oItem.name()),
-						'disable': !oItem.selectable || -1 < Utils.inArray(oItem.fullNameRaw, aDisabled) ||
+						'disabled': !oItem.selectable || -1 < Utils.inArray(oItem.fullNameRaw, aDisabled) ||
 							(Enums.FolderType.User !== oItem.type()) ||
 							(fDisableCallback ? fDisableCallback.call(null, oItem) : false)
 					});

dev/Common/Enums.js

@@ -37,6 +37,7 @@ Enums.KeyState = {
 	'MessageList': 'message-list',
 	'MessageView': 'message-view',
 	'Compose': 'compose',
+	'Settings': 'settings',
 	'Menu': 'menu',
 	'PopupComposeOpenPGP': 'compose-open-pgp',
 	'PopupAsk': 'popup-ask'

dev/Common/Globals.js

@@ -10,6 +10,11 @@ Globals.now = (new Date()).getTime();
  */
 Globals.momentTrigger = ko.observable(true);
 
+/**
+ * @type {?}
+ */
+Globals.dropdownVisibility = ko.observable(false);
+
 /**
  * @type {?}
  */

dev/Common/Knockout.js

@@ -46,7 +46,54 @@ ko.bindingHandlers.tooltip2 = {
 	}
 };
 
-ko.bindingHandlers.dropdown = {
+ko.__detectDropdownVisibility = _.debounce(function ($el) {
+	Globals.dropdownVisibility(!!$el.hasClass('open'));
+}, 50);
+
+ko.bindingHandlers.dropdownOpenStatus = {
+	'init': function (oElement) {
+		var $el = $(oElement);
+
+		$el.find('.dropdown-toggle').click(function () {
+			ko.__detectDropdownVisibility($el);
+		});
+		
+//		$el.on('.dropdown-menu .menuitem', 'click', function () {
+//			$el.removeClass('open');
+//			ko.__detectDropdownVisibility($el);
+//		});
+
+//		$el.on('.dropdown-menu .menuitem', 'keydown', function (oEvent) {
+//			if (oEvent && Enums.EventKeyCode.Esc === oEvent.keyCode)
+//			{
+//				$el.removeClass('open');
+//				ko.__detectDropdownVisibility($el);
+//			}
+//		});
+		
+		$html.on('click.dropdown.data-api', function () {
+			ko.__detectDropdownVisibility($el);
+		});
+	}
+};
+
+ko.bindingHandlers.openDropdownTrigger = {
+	'update': function (oElement, fValueAccessor) {
+		if (ko.utils.unwrapObservable(fValueAccessor()))
+		{
+			var $el = $(oElement);
+			if (!$el.hasClass('open'))
+			{
+				$el.find('.dropdown-toggle').dropdown('toggle');
+				ko.__detectDropdownVisibility($el);
+			}
+			
+			fValueAccessor()(false);
+		}
+	}
+};
+
+ko.bindingHandlers.dropdownCloser = {
 	'init': function (oElement) {
 		$(oElement).closest('.dropdown').on('click', '.e-item', function () {
 			$(oElement).dropdown('toggle');

dev/Common/Utils.js

@@ -1370,10 +1370,10 @@ Utils.draggeblePlace = function ()
 
 Utils.defautOptionsAfterRender = function (oOption, oItem)
 {
-	if (oItem && !Utils.isUnd(oItem.disable))
+	if (oItem && !Utils.isUnd(oItem.disabled))
 	{
 		ko.applyBindingsToNode(oOption, {
-			'disable': oItem.disable
+			'disabled': oItem.disabled
 		}, oItem);
 	}
 };

dev/Screens/MailBox.js

@@ -40,11 +40,6 @@ MailBoxScreen.prototype.onShow = function ()
 	RL.data().keyScope(Enums.KeyState.MessageList);
 };
 
-MailBoxScreen.prototype.onHide = function ()
-{
-	RL.data().keyScope(Enums.KeyState.All);
-};
-
 /**
  * @param {string} sFolderHash
  * @param {number} iPage
@@ -131,17 +126,6 @@ MailBoxScreen.prototype.onStart = function ()
 	}, this);
 };
 
-//MailBoxScreen.prototype.onBuild = function ()
-//{
-//	if (!Globals.bMobileDevice)
-//	{
-//		_.defer(function () {
-//			Utils.initLayoutResizer('#rl-resizer-left', '#rl-resizer-right', '#rl-right',
-//				350, 800, 350, 350, Enums.ClientSideKeyName.MailBoxListSize);
-//		});
-//	}
-//};
-
 /**
  * @return {Array}
  */

dev/Screens/Settings.js

@@ -26,4 +26,5 @@ SettingsScreen.prototype.onShow = function ()
 //	AbstractSettings.prototype.onShow.call(this);
 
 	RL.setTitle(this.sSettingsTitle);
+	RL.data().keyScope(Enums.KeyState.Settings);
 };

dev/Storages/AbstractData.js

@@ -5,22 +5,55 @@
  */
 function AbstractData()
 {
-	this.keyScope = ko.observable(Enums.KeyState.All);
-	this.keyScope.subscribe(function (sValue) {
+	this.keyScopeReal = ko.observable(Enums.KeyState.All);
+	this.keyScopeFake = ko.observable(Enums.KeyState.All);
 	
-		if (Enums.KeyState.Compose === sValue)
-		{
-			Utils.disableKeyFilter();
-		}
-		else
-		{
-			Utils.restoreKeyFilter();
-		}
+	this.keyScope = ko.computed({
+		'owner': this,
+		'read': function () {
+			return this.keyScopeFake();
+		},
+		'write': function (sValue) {
 
-//		window.console.log(sValue);
+			if (Enums.KeyState.Menu !== sValue)
+			{
+				if (Enums.KeyState.Compose === sValue)
+				{
+					Utils.disableKeyFilter();
+				}
+				else
+				{
+					Utils.restoreKeyFilter();
+				}
+
+				this.keyScopeFake(sValue);
+				if (Globals.dropdownVisibility())
+				{
+					sValue = Enums.KeyState.Menu;
+				}
+			}
+			
+//			window.console.log(sValue + '/' + this.keyScopeFake());
+			this.keyScopeReal(sValue);
+		}
+	});
+	
+	this.keyScopeReal.subscribe(function (sValue) {
+		window.console.log(sValue);
 		key.setScope(sValue);
 	});
 
+	Globals.dropdownVisibility.subscribe(function (bValue) {
+		if (bValue)
+		{
+			this.keyScope(Enums.KeyState.Menu);
+		}
+		else if (Enums.KeyState.Menu === key.getScope())
+		{
+			this.keyScope(this.keyScopeFake());
+		}
+	}, this);
+
 	Utils.initDataConstructorBySettings(this);
 }
 

dev/Storages/WebMailData.js

@@ -39,17 +39,6 @@ function WebMailDataStorage()
 	this.projectHash = ko.observable('');
 	this.threading = ko.observable(false);
 
-	this.accountMenuFocus = ko.observable(false);
-	this.accountMenuFocus.sKeyState = Enums.KeyState.All;
-	
-	this.accountMenuFocus.subscribe(function (bValue) {
-		if (bValue)
-		{
-			this.accountMenuFocus.sKeyState = RL.data().keyScope();
-		}
-		RL.data().keyScope(bValue ? Enums.KeyState.Menu : this.accountMenuFocus.sKeyState);
-	}, this);
-
 	this.lastFoldersHash = '';
 	this.remoteSuggestions = false;
 
@@ -288,7 +277,14 @@ function WebMailDataStorage()
 	}, this);
 
 	this.message.focused.subscribe(function (bValue) {
-		RL.data().keyScope(bValue ? Enums.KeyState.MessageView : Enums.KeyState.MessageList);
+		if (bValue)
+		{
+			RL.data().keyScope(Enums.KeyState.MessageView);
+		}
+		else if (Enums.KeyState.MessageView === RL.data().keyScope())
+		{
+			RL.data().keyScope(Enums.KeyState.MessageList);
+		}
 	});
 	
 	this.messageLoading.subscribe(function (bValue) {

dev/Styles/AdminDomains.less

@@ -42,16 +42,16 @@
 			}
 		}
 
-		.delete-domain, .disable-domain {
+		.delete-domain, .disabled-domain {
 			cursor: pointer;
 			.opacity(50);
 		}
 
-		&.disabled .disable-domain {
+		&.disabled .disabled-domain {
 			.opacity(50);
 		}
 
-		.delete-domain, .disable-domain {
+		.delete-domain, .disabled-domain {
 			&:hover {
 				.opacity(100);
 			}

dev/Styles/AdminPlugins.less

@@ -26,7 +26,7 @@
 			.plugin-img, .plugin-name {
 				color: #bbb;
 			}
-			.disable-plugin {
+			.disabled-plugin {
 				.opacity(50);
 			}
 		}

dev/Styles/Compose.less

@@ -31,7 +31,7 @@
 			.opacity(100);
 		}
 
-		.btn.disable {
+		.btn.disabled {
 			&.button-delete {
 				visibility: hidden;
 			}
@@ -41,7 +41,7 @@
 			margin-left: 8px;
 		}
 
-		.disable.button-delete {
+		.disabled.button-delete {
 			margin-left: 0px;
 		}
 	}

dev/Styles/Shortcuts.less

@@ -1,5 +1,10 @@
 .popups {
 	.b-shortcuts-content {
+
+		&.modal {
+			width: 1025px;
+		}
+
 		.modal-header {
 			background-color: #fff;
 		}

dev/Styles/Ui.less

@@ -69,14 +69,14 @@
 		color: #fff;
 	}
 
-	.e-item.disable > .e-link {
+	.e-item.disabled > .e-link {
 		cursor: not-allowed;
 		background-color: #fff;
 		background-image: none;
 		color: grey;
 	}
 
-	.e-item.disable [class^="icon-"] {
+	.e-item.disabled [class^="icon-"] {
 		color: grey;
 	}
 }

dev/ViewModels/AbstractSystemDropDownViewModel.js

@@ -13,7 +13,8 @@ function AbstractSystemDropDownViewModel()
 	this.accounts = oData.accounts;
 	this.accountEmail = oData.accountEmail;
 	this.accountsLoading = oData.accountsLoading;
-	this.accountMenuFocus = oData.accountMenuFocus;
+
+	this.accountMenuDropdownTrigger = ko.observable(false);
 
 	this.allowAddAccount = RL.settingsGet('AllowAdditionalAccounts');
 
@@ -22,14 +23,6 @@ function AbstractSystemDropDownViewModel()
 	}, this);
 
 	this.accountClick = _.bind(this.accountClick, this);
-
-	key('`', function () {
-		if (oData.useKeyboardShortcuts() && !RL.popupVisibility() &&
-			!oData.accountMenuFocus())
-		{
-			oData.accountMenuFocus(true);
-		}
-	});
 }
 
 _.extend(AbstractSystemDropDownViewModel.prototype, KnoinAbstractViewModel.prototype);
@@ -77,3 +70,14 @@ AbstractSystemDropDownViewModel.prototype.logoutClick = function ()
 		RL.loginAndLogoutReload(true, RL.settingsGet('ParentEmail') && 0 < RL.settingsGet('ParentEmail').length);
 	});
 };
+
+AbstractSystemDropDownViewModel.prototype.onBuild = function ()
+{
+	var self = this;
+	key('`', [Enums.KeyState.MessageList, Enums.KeyState.MessageView, Enums.KeyState.Settings], function () {
+		if (RL.data().useKeyboardShortcuts() && !RL.popupVisibility() && !Globals.dropdownVisibility() && self.viewModelVisibility())
+		{
+			self.accountMenuDropdownTrigger(true);
+		}
+	});
+};

dev/ViewModels/MailBoxMessageListViewModel.js

@@ -42,6 +42,9 @@ function MailBoxMessageListViewModel()
 	this.userUsageSize = oData.userUsageSize;
 	this.userUsageProc = oData.userUsageProc;
 
+	this.moveDropdownTrigger = ko.observable(false);
+	this.moreDropdownTrigger = ko.observable(false);
+
 	// append drag and drop
 	this.dragOver = ko.observable(false).extend({'throttle': 1});
 	this.dragOverEnter = ko.observable(false).extend({'throttle': 1});
@@ -518,7 +521,7 @@ MailBoxMessageListViewModel.prototype.flagMessages = function (oCurrentMessage)
 	}
 };
 
-MailBoxMessageListViewModel.prototype.flagMessagesFast = function ()
+MailBoxMessageListViewModel.prototype.flagMessagesFast = function (bFlag)
 {
 	var
 		aChecked = this.messageListCheckedOrSelected(),
@@ -531,24 +534,43 @@ MailBoxMessageListViewModel.prototype.flagMessagesFast = function ()
 			return oMessage.flagged();
 		});
 
-		this.setAction(aChecked[0].folderFullNameRaw,
-			aChecked.length === aFlagged.length ? Enums.MessageSetAction.UnsetFlag : Enums.MessageSetAction.SetFlag, aChecked);
+		if (Utils.isUnd(bFlag))
+		{
+			this.setAction(aChecked[0].folderFullNameRaw,
+				aChecked.length === aFlagged.length ? Enums.MessageSetAction.UnsetFlag : Enums.MessageSetAction.SetFlag, aChecked);
+		}
+		else
+		{
+			this.setAction(aChecked[0].folderFullNameRaw,
+				!bFlag ? Enums.MessageSetAction.UnsetFlag : Enums.MessageSetAction.SetFlag, aChecked);
+		}
 	}
 };
 
-MailBoxMessageListViewModel.prototype.seenMessagesFast = function ()
+MailBoxMessageListViewModel.prototype.seenMessagesFast = function (bSeen)
 {
 	var
 		aChecked = this.messageListCheckedOrSelected(),
 		aUnseen = []
 	;
 
-	aUnseen = _.filter(aChecked, function (oMessage) {
-		return oMessage.unseen();
-	});
+	if (0 < aChecked.length)
+	{
+		aUnseen = _.filter(aChecked, function (oMessage) {
+			return oMessage.unseen();
+		});
 
-	this.setAction(aChecked[0].folderFullNameRaw,
-		0 < aUnseen.length ? Enums.MessageSetAction.SetSeen : Enums.MessageSetAction.UnsetSeen, aChecked);
+		if (Utils.isUnd(bSeen))
+		{
+			this.setAction(aChecked[0].folderFullNameRaw,
+				0 < aUnseen.length ? Enums.MessageSetAction.SetSeen : Enums.MessageSetAction.UnsetSeen, aChecked);
+		}
+		else
+		{
+			this.setAction(aChecked[0].folderFullNameRaw,
+				bSeen ? Enums.MessageSetAction.SetSeen : Enums.MessageSetAction.UnsetSeen, aChecked);
+		}
+	}
 };
 
 MailBoxMessageListViewModel.prototype.onBuild = function (oDom)
@@ -648,6 +670,14 @@ MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 		}
 	});
 
+	key('z', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+		if (oData.useKeyboardShortcuts())
+		{
+			self.moreDropdownTrigger(true);
+			return false;
+		}
+	});
+
 	// delete
 	key('delete, shift+delete', Enums.KeyState.MessageList, function (event, handler) {
 		if (oData.useKeyboardShortcuts() && event)
@@ -677,8 +707,8 @@ MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 		}
 	});
 
-	// new message (open compose popup)
-	key('c,n', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+	// write/compose (open compose popup)
+	key('w,c', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
 		if (oData.useKeyboardShortcuts())
 		{
 			kn.showScreenPopup(PopupsComposeViewModel);
@@ -686,8 +716,8 @@ MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 		}
 	});
 
-	// star/flag messages
-	key('s', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+	// important - star/flag messages
+	key('i', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
 		if (oData.useKeyboardShortcuts())
 		{
 			self.flagMessagesFast();
@@ -695,11 +725,29 @@ MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 		}
 	});
 
-	// mark as read/unread
-	key('m', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+	// move
+	key('m', Enums.KeyState.MessageList, function () {
 		if (oData.useKeyboardShortcuts())
 		{
-			self.seenMessagesFast();
+			self.moveDropdownTrigger(true);
+			return false;
+		}
+	});
+
+	// read
+	key('q', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+		if (oData.useKeyboardShortcuts())
+		{
+			self.seenMessagesFast(true);
+			return false;
+		}
+	});
+
+	// unread
+	key('u', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+		if (oData.useKeyboardShortcuts())
+		{
+			self.seenMessagesFast(false);
 			return false;
 		}
 	});

dev/ViewModels/MailBoxMessageViewViewModel.js

@@ -40,6 +40,7 @@ function MailBoxMessageViewViewModel()
 	this.fullScreenMode = oData.messageFullScreenMode;
 
 	this.showFullInfo = ko.observable(false);
+	this.moreDropdownTrigger = ko.observable(false);
 	this.messageDomFocused = ko.observable(false).extend({'rateLimit': 0});
 
 	this.messageVisibility = ko.computed(function () {
@@ -360,6 +361,13 @@ MailBoxMessageViewViewModel.prototype.onBuild = function (oDom)
 		this.messageDomFocused(!!bValue);
 	}, this);
 
+	this.messageDomFocused.subscribe(function (bValue) {
+		if (!bValue && Enums.KeyState.MessageView === this.keyScope())
+		{
+			this.message.focused(false);
+		}
+	}, this);
+
 	this.keyScope.subscribe(function (sValue) {
 		if (Enums.KeyState.MessageView === sValue && this.message.focused())
 		{
@@ -384,10 +392,14 @@ MailBoxMessageViewViewModel.prototype.escShortcuts = function ()
 		{
 			this.fullScreenMode(false);
 		}
-		else
+		else if (Enums.Layout.NoPreview === RL.data().layout())
 		{
 			this.message(null);
 		}
+		else
+		{
+			this.message.focused(false);
+		}
 
 		return false;
 	}
@@ -412,6 +424,14 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 		}
 	});
 
+	key('x', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+		if (oData.useKeyboardShortcuts())
+		{
+			self.moreDropdownTrigger(true);
+			return false;
+		}
+	});
+
 	// reply
 	key('r', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
 		if (oData.useKeyboardShortcuts() && oData.message())
@@ -440,13 +460,13 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 	});
 
 	// message information
-	key('i', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts())
-		{
-			self.showFullInfo(!self.showFullInfo());
-			return false;
-		}
-	});
+//	key('i', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+//		if (oData.useKeyboardShortcuts())
+//		{
+//			self.showFullInfo(!self.showFullInfo());
+//			return false;
+//		}
+//	});
 
 	// toggle message blockquotes
 	key('b', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {

dev/ViewModels/SettingsPaneViewModel.js

@@ -13,6 +13,17 @@ function SettingsPaneViewModel()
 
 Utils.extendAsViewModel('SettingsPaneViewModel', SettingsPaneViewModel);
 
+SettingsPaneViewModel.prototype.onBuild = function ()
+{
+	var self = this;
+	key('esc', Enums.KeyState.Settings, function () {
+		if (RL.data().useKeyboardShortcuts())
+		{
+			self.backToMailBoxClick();
+		}
+	});
+};
+
 SettingsPaneViewModel.prototype.onShow = function ()
 {
 	RL.data().message(null);

rainloop/v/0.0.0/app/templates/Themes/custom-values-dark.less

@@ -21,7 +21,7 @@
 @dropdown-menu-background-color: #fff;
 @dropdown-menu-hover-background-color: #48525C;
 @dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disabled-color: #999;
 
 // FOLDERS
 @folders-color: #fff;

rainloop/v/0.0.0/app/templates/Themes/custom-values-light.less

@@ -20,7 +20,7 @@
 @dropdown-menu-background-color: #fff;
 @dropdown-menu-hover-background-color: #757575;
 @dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disabled-color: #999;
 
 // FOLDERS
 @folders-color: #000;

rainloop/v/0.0.0/app/templates/Themes/template.less

@@ -98,12 +98,12 @@
 	}
 }
 
-.g-ui-menu .e-item.disable > .e-link, .g-ui-menu .e-item.disable > .e-link:hover {
-	color: @dropdown-menu-disable-color !important;
+.g-ui-menu .e-item.disabled > .e-link, .g-ui-menu .e-item.disabled > .e-link:hover {
+	color: @dropdown-menu-disabled-color !important;
 	background-color: @dropdown-menu-background-color !important;
 
 	> i {
-		color: @dropdown-menu-disable-color !important;
+		color: @dropdown-menu-disabled-color !important;
 	}
 }
 

rainloop/v/0.0.0/app/templates/Themes/values.less

@@ -24,7 +24,7 @@
 @dropdown-menu-background-color: #fff;
 @dropdown-menu-hover-background-color: #444;
 @dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disabled-color: #999;
 @dropdown-menu-selected-background-color: #eee;
 
 // FOLDERS

rainloop/v/0.0.0/app/templates/Views/AdminSettingsDomainListItem.html

@@ -13,7 +13,7 @@
 		</span>
 	</td>
 	<td>
-		<span class="disable-domain" data-bind="click: function (oDomain) { $root.disableDomain(oDomain); }">
+		<span class="disabled-domain" data-bind="click: function (oDomain) { $root.disableDomain(oDomain); }">
 			<i data-bind="css: {'icon-checkbox-checked': !disabled(), 'icon-checkbox-unchecked': disabled}"></i>
 		</span>
 	</td>

rainloop/v/0.0.0/app/templates/Views/AdminSettingsPluginListItem.html

@@ -4,7 +4,7 @@
 		<span class="plugin-name" data-bind="text: name"></span>
 	</td>
 	<td>
-		<span class="disable-plugin">
+		<span class="disabled-plugin">
 			<i data-bind="css: {'e-action icon-checkbox-checked': !disabled(), 'e-action icon-checkbox-unchecked': disabled}"></i>
 		</span>
 	</td>

rainloop/v/0.0.0/app/templates/Views/MailFolderList.html

@@ -1,9 +1,9 @@
 <div class="b-folders g-ui-user-select-none thm-folders">
 	<div class="b-toolbar btn-toolbar">
-		<a class="btn buttonCompose" data-placement="bottom" data-bind="click: composeClick, tooltip: 'FOLDER_LIST/BUTTON_COMPOSE'">
+		<a class="btn buttonCompose" data-tooltip-placement="bottom" data-bind="click: composeClick, tooltip: 'FOLDER_LIST/BUTTON_COMPOSE'">
 			<i class="icon-paper-plane"></i>
 		</a>
-		<a class="btn buttonContacts" data-placement="bottom" data-bind="visible: allowContacts, click: contactsClick, tooltip: 'FOLDER_LIST/BUTTON_CONTACTS'">
+		<a class="btn buttonContacts" data-tooltip-placement="bottom" data-bind="visible: allowContacts, click: contactsClick, tooltip: 'FOLDER_LIST/BUTTON_CONTACTS'">
 			<i class="icon-address-book"></i>
 		</a>
 	</div>

rainloop/v/0.0.0/app/templates/Views/MailMessageList.html

@@ -4,95 +4,95 @@
 		<div class="toolbar">
 			<div class="btn-toolbar">
 				<div class="btn-group">
-					<a class="btn buttonReload" data-placement="bottom" data-bind="command: reloadCommand, tooltip: 'MESSAGE_LIST/BUTTON_RELOAD'">
+					<a class="btn buttonReload" data-tooltip-placement="bottom" data-bind="command: reloadCommand, tooltip: 'MESSAGE_LIST/BUTTON_RELOAD'">
 						<i class="icon-spinner" data-bind="css: {'animated': messageListCompleteLoadingThrottle}"></i>
 					</a>
 				</div>
 				<div class="btn-group">&nbsp;</div>
-				<div class="btn-group">
-					<a class="btn dropdown-toggle buttonMove" data-toggle="dropdown" data-placement="bottom" data-bind="command: moveCommand, tooltip: 'MESSAGE_LIST/BUTTON_MOVE_TO'">
+				<div class="btn-group dropdown" data-bind="dropdownOpenStatus: true, openDropdownTrigger: moveDropdownTrigger">
+					<a id="move-dropdown-id" href="#" tabindex="-1" class="btn dropdown-toggle buttonMove" data-toggle="dropdown" data-tooltip-placement="bottom" data-bind="command: moveCommand, tooltip: 'MESSAGE_LIST/BUTTON_MOVE_TO'">
 						<i class="icon-folder"></i>
 						&nbsp;&nbsp;
 						<span class="caret"></span>
 					</a>
-					<ul class="dropdown-menu g-ui-menu" role="menu" data-bind="foreach: folderMenuForMove">
-						<li class="e-item" data-bind="css: { 'disable': disable }, click: function () { if (!disable) $root.moveSelectedMessagesToFolder(id); }">
-							<a class="e-link" data-bind="text: name"></a>
+					<ul class="dropdown-menu g-ui-menu" role="menu" aria-labelledby="move-dropdown-id" role="menu" data-bind="foreach: folderMenuForMove">
+						<li class="e-item" role="presentation" data-bind="css: { 'disabled': disabled }, click: function () { if (!disabled) $root.moveSelectedMessagesToFolder(id); }">
+							<a class="e-link menuitem" href="#" tabindex="-1" data-bind="text: name"></a>
 						</li>
 					</ul>
 				</div>
 				<div class="btn-group">&nbsp;</div>
 				<div class="btn-group">
-					<a class="btn btn-dark-disabled-border button-archive" data-placement="bottom" data-bind="visible: !isArchiveFolder() && !isArchiveDisabled() && !isDraftFolder(), command: archiveCommand, tooltip: 'MESSAGE_LIST/BUTTON_ARCHIVE'">
+					<a class="btn btn-dark-disabled-border button-archive" data-tooltip-placement="bottom" data-bind="visible: !isArchiveFolder() && !isArchiveDisabled() && !isDraftFolder(), command: archiveCommand, tooltip: 'MESSAGE_LIST/BUTTON_ARCHIVE'">
 						<i class="icon-archive"></i>
 					</a>
-					<a class="btn btn-dark-disabled-border button-spam" data-placement="bottom" data-bind="visible: !isSpamFolder() && !isSpamDisabled() && !isDraftFolder() && !isSentFolder(), command: spamCommand, tooltip: 'MESSAGE_LIST/BUTTON_SPAM'">
+					<a class="btn btn-dark-disabled-border button-spam" data-tooltip-placement="bottom" data-bind="visible: !isSpamFolder() && !isSpamDisabled() && !isDraftFolder() && !isSentFolder(), command: spamCommand, tooltip: 'MESSAGE_LIST/BUTTON_SPAM'">
 						<i class="icon-bug"></i>
 					</a>
-					<a class="btn btn-dark-disabled-border button-delete" data-placement="bottom" data-bind="command: deleteCommand, tooltip: 'MESSAGE_LIST/BUTTON_DELETE'">
+					<a class="btn btn-dark-disabled-border button-delete" data-tooltip-placement="bottom" data-bind="command: deleteCommand, tooltip: 'MESSAGE_LIST/BUTTON_DELETE'">
 						<i class="icon-trash"></i>
 						<span data-bind="text: printableMessageCountForDeletion()"></span>
 					</a>
 				</div>
 				<div class="btn-group">&nbsp;</div>
-				<div class="btn-group">
-					<a class="btn dropdown-toggle buttonMore" data-toggle="dropdown" data-placement="bottom" data-bind="tooltip: 'MESSAGE_LIST/BUTTON_MORE'">
+				<div class="btn-group dropdown" data-bind="dropdownOpenStatus: true, openDropdownTrigger: moreDropdownTrigger">
+					<a class="btn dropdown-toggle buttonMore" href="#" tabindex="-1" data-toggle="dropdown" data-tooltip-placement="bottom" data-bind="tooltip: 'MESSAGE_LIST/BUTTON_MORE'">
 						<i class="icon-list"></i>
 					</a>
 					<ul class="dropdown-menu g-ui-menu" role="menu">
-						<li class="e-item" data-bind="click: listUnsetSeen, css: {'disable': !hasCheckedOrSelectedLines()}">
-							<a class="e-link">
+						<li class="e-item" role="presentation" data-bind="click: listUnsetSeen, css: {'disabled': !hasCheckedOrSelectedLines()}">
+							<a class="e-link menuitem" href="#" tabindex="-1">
 								<i class="icon-none"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE_LIST/MENU_UNSET_SEEN"></span>
 							</a>
 						</li>
-						<li class="e-item" data-bind="click: listSetSeen, css: {'disable': !hasCheckedOrSelectedLines()}">
-							<a class="e-link">
+						<li class="e-item" role="presentation" data-bind="click: listSetSeen, css: {'disabled': !hasCheckedOrSelectedLines()}">
+							<a class="e-link menuitem" href="#" tabindex="-1">
 								<i class="icon-none"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE_LIST/MENU_SET_SEEN"></span>
 							</a>
 						</li>
-						<li class="e-item" data-bind="click: listSetFlags, css: {'disable': !hasCheckedOrSelectedLines()}">
-							<a class="e-link">
+						<li class="e-item" role="presentation" data-bind="click: listSetFlags, css: {'disabled': !hasCheckedOrSelectedLines()}">
+							<a class="e-link menuitem" href="#" tabindex="-1">
 								<i class="icon-none"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE_LIST/MENU_SET_FLAG"></span>
 							</a>
 						</li>
-						<li class="e-item" data-bind="click: listUnsetFlags, css: {'disable': !hasCheckedOrSelectedLines()}">
-							<a class="e-link">
+						<li class="e-item" role="presentation" data-bind="click: listUnsetFlags, css: {'disabled': !hasCheckedOrSelectedLines()}">
+							<a class="e-link menuitem" href="#" tabindex="-1">
 								<i class="icon-none"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE_LIST/MENU_UNSET_FLAG"></span>
 							</a>
 						</li>
-						<li class="e-item" data-bind="click: listSetAllSeen, css: {'disable': !hasMessages()}">
-							<a class="e-link">
+						<li class="e-item" role="presentation" data-bind="click: listSetAllSeen, css: {'disabled': !hasMessages()}">
+							<a class="e-link menuitem" href="#" tabindex="-1">
 								<i class="icon-none"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE_LIST/MENU_SET_ALL_SEEN"></span>
 							</a>
 						</li>
-						<li class="divider"></li>
-						<li class="e-item" data-bind="command: multyForwardCommand">
-							<a class="e-link">
+						<li class="divider" role="presentation"></li>
+						<li class="e-item" role="presentation" data-bind="command: multyForwardCommand">
+							<a class="e-link menuitem" href="#" tabindex="-1">
 								<i class="icon-reply-all"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE_LIST/BUTTON_MULTY_FORWARD"></span>
 							</a>
 						</li>
-						<li class="divider"></li>
-						<li class="e-item" data-bind="command: deleteWithoutMoveCommand">
-							<a class="e-link">
+						<li class="divider" role="presentation"></li>
+						<li class="e-item" role="presentation" data-bind="command: deleteWithoutMoveCommand">
+							<a class="e-link menuitem" href="#" tabindex="-1">
 								<i class="icon-trash"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE_LIST/BUTTON_DELETE_WITHOUT_MOVE"></span>
 							</a>
 						</li>
-						<li class="e-item" data-bind="command: clearCommand">
-							<a class="e-link">
+						<li class="e-item" role="presentation" data-bind="command: clearCommand">
+							<a class="e-link menuitem" href="#" tabindex="-1">
 								<i class="icon-fire"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE_LIST/BUTTON_EMPTY_FOLDER"></span>
@@ -153,11 +153,6 @@
 			</div>
 			<div class="mainDelimiter footerDelimiter"></div>
 			<div class="b-footer thm-message-list-bottom-toolbar">
-<!--
-				<a class="btn buttonReload" data-placement="right" data-bind="command: reloadCommand, tooltip: 'MESSAGE_LIST/BUTTON_RELOAD'">
-					<i class="icon-spinner" data-bind="css: {'animated': messageListCompleteLoadingThrottle}"></i>
-				</a>
--->
 				<span data-bind="visible: 0 < userUsageProc(), tooltip2: quotaTooltip" class="e-quota">
 					<span data-bind="text: userUsageProc"></span>%
 				</span>

rainloop/v/0.0.0/app/templates/Views/MailMessageView.html

@@ -2,107 +2,107 @@
 	<div class="messageView" data-bind="css: {'message-selected': isMessageSelected, 'message-focused': message.focused}">
 		<div class="toolbar g-ui-user-select-none">
 			<div class="messageButtons btn-toolbar">
-				<div class="btn-group" data-placement="bottom" data-bind="visible: !usePreviewPane(), tooltip: 'MESSAGE/BUTTON_CLOSE'">
+				<div class="btn-group" data-tooltip-placement="bottom" data-bind="visible: !usePreviewPane(), tooltip: 'MESSAGE/BUTTON_CLOSE'">
 					<a class="btn buttonClose" data-bind="command: closeMessage">
 						<i class="icon-remove"></i>
 					</a>
 				</div>
 				<div class="btn-group">&nbsp;</div>
-				<div class="btn-group" data-placement="bottom" data-bind="visible: isDraftFolder(), tooltip: 'MESSAGE/BUTTON_EDIT'">
+				<div class="btn-group" data-tooltip-placement="bottom" data-bind="visible: isDraftFolder(), tooltip: 'MESSAGE/BUTTON_EDIT'">
 					<a class="btn btn-success buttonEdit" data-bind="command: messageEditCommand">
 						<i class="icon-pencil icon-white"></i>
 					</a>
 				</div>
 				<div class="btn-group" data-bind="visible: !isDraftFolder()">
-					<a class="btn btn-dark-disabled-border buttonReply" data-placement="bottom" data-bind="command: replyCommand, tooltip: 'MESSAGE/BUTTON_REPLY'">
+					<a class="btn btn-dark-disabled-border buttonReply" data-tooltip-placement="bottom" data-bind="command: replyCommand, tooltip: 'MESSAGE/BUTTON_REPLY'">
 						<i class="icon-reply"></i>
 					</a>
-					<a class="btn btn-dark-disabled-border buttonReplyAll" data-placement="bottom" data-bind="command: replyAllCommand, tooltip: 'MESSAGE/BUTTON_REPLY_ALL'">
+					<a class="btn btn-dark-disabled-border buttonReplyAll" data-tooltip-placement="bottom" data-bind="command: replyAllCommand, tooltip: 'MESSAGE/BUTTON_REPLY_ALL'">
 						<i class="icon-reply-all"></i>
 					</a>
-					<a class="btn btn-dark-disabled-border buttonForward" data-placement="bottom" data-bind=" command: forwardCommand, tooltip: 'MESSAGE/BUTTON_FORWARD'">
+					<a class="btn btn-dark-disabled-border buttonForward" data-tooltip-placement="bottom" data-bind=" command: forwardCommand, tooltip: 'MESSAGE/BUTTON_FORWARD'">
 						<i class="icon-forward"></i>
 					</a>
 				</div>
 				<div class="btn-group" data-bind="visible: !usePreviewPane()">&nbsp;</div>
 				<div class="btn-group" data-bind="visible: !usePreviewPane()">
-					<a class="btn btn-dark-disabled-border button-archive" data-placement="bottom" data-bind="visible: !isDraftFolder() && !isArchiveFolder() && !isArchiveDisabled(), command: archiveCommand, tooltip: 'MESSAGE/BUTTON_ARCHIVE'">
+					<a class="btn btn-dark-disabled-border button-archive" data-tooltip-placement="bottom" data-bind="visible: !isDraftFolder() && !isArchiveFolder() && !isArchiveDisabled(), command: archiveCommand, tooltip: 'MESSAGE/BUTTON_ARCHIVE'">
 						<i class="icon-archive"></i>
 					</a>
-					<a class="btn btn-dark-disabled-border button-spam" data-placement="bottom" data-bind="visible: !isDraftFolder() && !isSentFolder() && !isSpamFolder() && !isSpamDisabled(), command: spamCommand, tooltip: 'MESSAGE/BUTTON_SPAM'">
+					<a class="btn btn-dark-disabled-border button-spam" data-tooltip-placement="bottom" data-bind="visible: !isDraftFolder() && !isSentFolder() && !isSpamFolder() && !isSpamDisabled(), command: spamCommand, tooltip: 'MESSAGE/BUTTON_SPAM'">
 						<i class="icon-bug"></i>
 					</a>
-					<a class="btn btn-dark-disabled-border button-delete" data-placement="bottom" data-bind="command: deleteCommand, tooltip: 'MESSAGE/BUTTON_DELETE'">
+					<a class="btn btn-dark-disabled-border button-delete" data-tooltip-placement="bottom" data-bind="command: deleteCommand, tooltip: 'MESSAGE/BUTTON_DELETE'">
 						<i class="icon-trash"></i>
 					</a>
 				</div>
 				<div class="btn-group">&nbsp;</div>
-				<div class="btn-group">
-					<a class="btn dropdown-toggle buttonMore" data-placement="bottom" data-toggle="dropdown" data-bind="command: messageVisibilityCommand, tooltip: 'MESSAGE/BUTTON_MORE'">
+				<div class="btn-group dropdown" data-bind="dropdownOpenStatus: true, openDropdownTrigger: moreDropdownTrigger"">
+					<a class="btn dropdown-toggle buttonMore" href="#" tabindex="-1" data-toggle="dropdown" data-tooltip-placement="bottom" data-bind="command: messageVisibilityCommand, tooltip: 'MESSAGE/BUTTON_MORE'">
 						<i class="icon-list"></i>
 					</a>
 					<ul class="dropdown-menu g-ui-menu" role="menu">
-						<li class="e-item" data-bind="visible: !isDraftFolder()">
-							<a class="e-link" data-bind="command: forwardAsAttachmentCommand">
+						<li class="e-item" role="presentation" data-bind="visible: !isDraftFolder()">
+							<a class="e-link menuitem" href="#" tabindex="-1" data-bind="command: forwardAsAttachmentCommand">
 								<i class="icon-reply"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE/BUTTON_FORWARD_AS_ATTACHMENT"></span>
 							</a>
 						</li>
-						<li class="e-item" data-bind="visible: !isDraftFolder()">
-							<a class="e-link" data-bind="command: editAsNewCommand">
+						<li class="e-item" role="presentation" data-bind="visible: !isDraftFolder()">
+							<a class="e-link menuitem" href="#" tabindex="-1" data-bind="command: editAsNewCommand">
 								<i class="icon-pencil"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE/BUTTON_EDIT_AS_NEW"></span>
 							</a>
 						</li>
-						<li class="divider" data-bind="visible: !isDraftFolder()"></li>
-						<li class="e-item" data-bind="visible: usePreviewPane() && !isDraftFolder() && !isArchiveFolder() && !isArchiveDisabled()">
-							<a target="_blank" class="e-link" data-bind="command: archiveCommand">
+						<li class="divider" role="presentation" data-bind="visible: !isDraftFolder()"></li>
+						<li class="e-item" role="presentation" data-bind="visible: usePreviewPane() && !isDraftFolder() && !isArchiveFolder() && !isArchiveDisabled()">
+							<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="command: archiveCommand">
 								<i class="icon-archive"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE/BUTTON_ARCHIVE"></span>
 							</a>
 						</li>
-						<li class="e-item" data-bind="visible: usePreviewPane() && !isDraftFolder() && !isSentFolder() && !isSpamFolder() && !isSpamDisabled()">
-							<a target="_blank" class="e-link" data-bind="command: spamCommand">
+						<li class="e-item" role="presentation" data-bind="visible: usePreviewPane() && !isDraftFolder() && !isSentFolder() && !isSpamFolder() && !isSpamDisabled()">
+							<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="command: spamCommand">
 								<i class="icon-bug"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE/BUTTON_SPAM"></span>
 							</a>
 						</li>
-						<li class="e-item" data-bind="visible: usePreviewPane()">
-							<a target="_blank" class="e-link" data-bind="command: deleteCommand">
+						<li class="e-item" role="presentation" data-bind="visible: usePreviewPane()">
+							<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="command: deleteCommand">
 								<i class="icon-trash"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE/BUTTON_DELETE"></span>
 							</a>
 						</li>
-						<li class="divider" data-bind="visible: usePreviewPane()"></li>
-						<li class="e-item">
-							<a target="_blank" class="e-link" data-bind="click: function () { if (message()) { message().printMessage(); }} ">
+						<li class="divider" role="presentation" data-bind="visible: usePreviewPane()"></li>
+						<li class="e-item" role="presentation">
+							<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="click: function () { if (message()) { message().printMessage(); }} ">
 								<i class="icon-print"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE/MENU_PRINT"></span>
 							</a>
 						</li>
-						<li class="e-item">
-							<a target="_blank" class="e-link" data-bind="click: function () { if (message()) { message().viewPopupMessage(); }}">
+						<li class="e-item" role="presentation">
+							<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="click: function () { if (message()) { message().viewPopupMessage(); }}">
 								<i class="icon-popup"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE/BUTTON_IN_NEW_WINDOW"></span>
 							</a>
 						</li>
-						<li class="divider"></li>
-						<li class="e-item">
-							<a target="_blank" class="e-link" data-bind="link: viewViewLink()">
+						<li class="divider" role="presentation"></li>
+						<li class="e-item" role="presentation">
+							<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="link: viewViewLink()">
 								<i class="icon-file-code"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE/MENU_VIEW_ORIGINAL"></span>
 							</a>
 						</li>
-						<li class="e-item">
-							<a target="_blank" class="e-link" data-bind="link: viewDownloadLink()">
+						<li class="e-item" role="presentation">
+							<a target="_blank" class="e-link menuitem" href="#" tabindex="-1" data-bind="link: viewDownloadLink()">
 								<i class="icon-download"></i>
 								&nbsp;&nbsp;
 								<span class="i18n" data-i18n-text="MESSAGE/MENU_DOWNLOAD_ORIGINAL"></span>

rainloop/v/0.0.0/app/templates/Views/PopupsCompose.html

@@ -31,13 +31,13 @@
 								<div class="dropdown pull-left">
 									<span class="dropdown-toggle g-ui-dropdown e-identity" 
 										id="IdentityLabel" role="button" data-toggle="dropdown"
-										data-bind="text: currentIdentityString, dropdown: true, css: {'multiply': 1 < identitiesOptions().length }">
+										data-bind="text: currentIdentityString, dropdownCloser: true, css: {'multiply': 1 < identitiesOptions().length }">
 									</span>
 									<!-- ko if: 1 < identitiesOptions().length -->
 										<ul class="dropdown-menu g-ui-menu" role="menu" aria-labelledby="IdentityLabel">
 											<!-- ko foreach: identitiesOptions -->
 												<li class="e-item">
-													<a class="e-link"  data-bind="click: function (oIdentity) { $root.selectIdentity(oIdentity); return true; }">
+													<a class="e-link" tabindex="-1" href="#" data-bind="click: function (oIdentity) { $root.selectIdentity(oIdentity); return true; }">
 														<span data-bind="text: optText"></span>
 													</a>
 												</li>
@@ -108,7 +108,7 @@
 									</div>
 									<div class="pull-right">
 										<div class="btn-group pull-right">
-											<a class="btn dropdown-toggle buttonMore" data-placement="bottom" data-toggle="dropdown">
+											<a class="btn dropdown-toggle buttonMore" data-toggle="dropdown">
 												<i class="icon-list"></i>
 											</a>
 											<ul class="dropdown-menu g-ui-menu" role="menu">
@@ -120,7 +120,7 @@
 													</a>
 												</li>
 												<li class="divider"></li>
-												<li class="e-item" data-bind="visible: allowOpenPGP, click: openOpenPgpPopup, css: {'disable': isHtml()}">
+												<li class="e-item" data-bind="visible: allowOpenPGP, click: openOpenPgpPopup, css: {'disabled': isHtml()}">
 													<a class="e-link">
 														<i class="icon-key"></i>
 														&nbsp;&nbsp;
@@ -131,13 +131,13 @@
 										</div>
 										<div class="btn-group pull-right">&nbsp;</div>
 										<div class="btn-group pull-right">
-											<a class="btn" data-placement="top" data-bind="visible: addAttachmentEnabled(), initDom: composeUploaderButton, tooltip: 'COMPOSE/ATTACH_FILES'">
+											<a class="btn" data-tooltip-placement="top" data-bind="visible: addAttachmentEnabled(), initDom: composeUploaderButton, tooltip: 'COMPOSE/ATTACH_FILES'">
 												<i class="icon-attachment"></i>
 											</a>
-											<a class="btn" data-placement="top" data-bind="visible: dropboxEnabled, command: dropboxCommand, tooltip: 'COMPOSE/DROPBOX'">
+											<a class="btn" data-tooltip-placement="top" data-bind="visible: dropboxEnabled, command: dropboxCommand, tooltip: 'COMPOSE/DROPBOX'">
 												<i class="icon-dropbox"></i>
 											</a>
-											<a class="btn" data-placement="top" data-bind="visible: driveEnabled, command: driveCommand, tooltip: 'COMPOSE/GOOGLE_DRIVE'">
+											<a class="btn" data-tooltip-placement="top" data-bind="visible: driveEnabled, command: driveCommand, tooltip: 'COMPOSE/GOOGLE_DRIVE'">
 												<i class="icon-google-drive"></i>
 											</a>
 										</div>

rainloop/v/0.0.0/app/templates/Views/PopupsContacts.html

@@ -109,7 +109,7 @@
 								</div>
 								<div class="control-group" data-bind="visible: !viewReadOnly() || 0 < viewPropertiesEmails().length">
 									<label class="control-label remove-padding-top fix-width">
-										<i class="icon-at iconsize24" data-placement="left" data-bind="tooltip: 'CONTACTS/LABEL_EMAIL'"></i>
+										<i class="icon-at iconsize24" data-tooltip-placement="left" data-bind="tooltip: 'CONTACTS/LABEL_EMAIL'"></i>
 									</label>
 									<div class="controls fix-width">
 										<div data-bind="foreach: viewPropertiesEmails">
@@ -123,7 +123,7 @@
 								</div>
 								<div class="control-group" data-bind="visible: !viewReadOnly() || 0 < viewPropertiesPhones().length">
 									<label class="control-label remove-padding-top fix-width">
-										<i class="icon-telephone iconsize24" data-placement="left" data-bind="tooltip: 'CONTACTS/LABEL_PHONE'"></i>
+										<i class="icon-telephone iconsize24" data-tooltip-placement="left" data-bind="tooltip: 'CONTACTS/LABEL_PHONE'"></i>
 									</label>
 									<div class="controls fix-width">
 										<div data-bind="foreach: viewPropertiesPhones">
@@ -144,12 +144,12 @@
 							</div>
 							
 							<div class="e-read-only-sign">
-								<i class="icon-lock iconsize24" data-placement="left" data-bind="tooltip: 'CONTACTS/LABEL_READ_ONLY'"></i>
+								<i class="icon-lock iconsize24" data-tooltip-placement="left" data-bind="tooltip: 'CONTACTS/LABEL_READ_ONLY'"></i>
 							</div>
 
 							<div class="e-share-sign" data-bind="visible: contactsSharingIsAllowed">
 								<div class="btn-group pull-right">
-									<a class="btn dropdown-toggle" data-placement="left" data-toggle="dropdown" data-bind="tooltip: 'CONTACTS/LABEL_SHARE'">
+									<a class="btn dropdown-toggle" data-tooltip-placement="left" data-toggle="dropdown" data-bind="tooltip: 'CONTACTS/LABEL_SHARE'">
 										<i data-bind="css: shareIcon"></i>
 										&nbsp;&nbsp;
 										<span class="caret"></span>

rainloop/v/0.0.0/app/templates/Views/PopupsKeyboardShortcutsHelp.html

@@ -7,11 +7,58 @@
 			</h3>
 		</div>
 		<div class="modal-body">
-			<br />
-			Coming soon!
-			<br />
-			<br />
-			<br />
+			<div class="row" style="margin-left: 0">
+				<div class="span6">
+
+<table class="table table-condensed table-striped">
+<thead><tr><th>Mailbox</th></tr></thead>
+<tbody>
+	<tr><td>Open user dropdown</td><td>`</td></tr>
+	<tr><td>Compose popup</td><td>W, C</td></tr>
+	<tr><td>Open message list more dropdown</td><td>Z</td></tr>
+	<tr><td>Open message view  more dropdown</td><td>X</td></tr>
+	<tr><td>Help</td><td>?, Shift + /</td></tr>
+</tbody>
+</table>
+
+<table class="table table-condensed table-striped">
+<thead><tr><th>Message view (focused)</th></tr></thead>
+<tbody>
+	<tr><td>Toggle fullscreen mode</td><td>Enter</td></tr>
+	<tr><td>Toggle message blockquotes</td><td>B</td></tr>
+	<tr><td>Print</td><td>Ctrl + P, Command + P</td></tr>
+	<tr><td>Exit fullscreen mode</td><td>Esc</td></tr>
+	<tr><td>Close message (No preview pane layout)</td><td>Esc</td></tr>
+	<tr><td>Switch focus back to message list</td><td>Tab, Shift + Tab</td></tr>
+</tbody>
+</table>
+
+				</div>
+				<div class="span6">
+
+<table class="table table-condensed table-striped">
+<thead><tr><th>Message list</th></tr></thead>
+<tbody>
+	<tr><td>Check All</td><td>Ctrl + A, Command + A</td></tr>
+	<tr><td>Delete selected messages</td><td>Delete, Shift + delete</td></tr>
+	<tr><td>Reply selected message</td><td>R</td></tr>
+	<tr><td>Reply All selected message</td><td>A</td></tr>
+	<tr><td>Froward selected message</td><td>F</td></tr>
+	<tr><td>Froward (multiply) selected messages</td><td>Shift + F</td></tr>
+	<tr><td>Move selected messages</td><td>M</td></tr>
+	<tr><td>Read selected messages</td><td>R</td></tr>
+	<tr><td>UnRead selected messages</td><td>U</td></tr>
+	<tr><td>Important, star/flag selected messages</td><td>I</td></tr>
+	<tr><td>Search</td><td>/</td></tr>
+	<tr><td>Cancel search</td><td>Esc</td></tr>
+	<tr><td>View message (No preview pane layout)</td><td>Enter</td></tr>
+	<tr><td>Switch focus to selected message</td><td>Tab, Shift + Tab</td></tr>
+</tbody>
+</table>
+
+				</div>
+			</div>
+
 		</div>
 	</div>
 </div>

rainloop/v/0.0.0/app/templates/Views/SystemDropDown.html

@@ -9,10 +9,10 @@
 			<div class="btn-group pull-right">
 				&nbsp;&nbsp;&nbsp;
 			</div>-->
-			<div class="btn-group pull-right">
+			<div class="btn-group pull-right dropdown" data-bind="dropdownOpenStatus: true, openDropdownTrigger: accountMenuDropdownTrigger">
 				<a id="top-system-dropdown-id" href="#" tabindex="-1" class="btn btn-ellipsis btn-block dropdown-toggle system-dropdown"
-					data-placement="left" data-toggle="dropdown"
-					data-tooltip-class="tooltip-big" data-bind="tooltip2: emailTitle, hasfocus: accountMenuFocus">
+					data-toggle="dropdown" data-tooltip-placement="left"
+					data-tooltip-class="tooltip-big" data-bind="tooltip2: emailTitle">
 
 					<i data-bind="css: {'icon-user': !loading(), 'icon-spinner animated': loading()}"></i>
 					&nbsp;&nbsp;

rainloop/v/0.0.0/static/css/app.css

@@ -1535,7 +1535,7 @@ table {
   -moz-border-radius    : 5px;
   -webkit-border-radius : 5px;
   border-radius         : 5px;
-  z-index: 10000;
+  z-index: 102;
   margin                : 2px;
 }
 
@@ -5869,13 +5869,13 @@ html.no-rgba .modal {
   background-image: none;
   color: #fff;
 }
-.g-ui-menu .e-item.disable > .e-link {
+.g-ui-menu .e-item.disabled > .e-link {
   cursor: not-allowed;
   background-color: #fff;
   background-image: none;
   color: grey;
 }
-.g-ui-menu .e-item.disable [class^="icon-"] {
+.g-ui-menu .e-item.disabled [class^="icon-"] {
   color: grey;
 }
 .g-ui-table {
@@ -6417,6 +6417,9 @@ html.rl-no-preview-pane #rl-right .ui-resizable-handle {
 .popups .b-ask-content .desc-place {
   font-size: 18px;
 }
+.popups .b-shortcuts-content.modal {
+  width: 1025px;
+}
 .popups .b-shortcuts-content .modal-header {
   background-color: #fff;
 }
@@ -7850,7 +7853,7 @@ html.rl-message-fullscreen .messageView .b-content .buttonFull {
   opacity: 1;
   filter: alpha(opacity=100);
 }
-.b-compose .b-header-toolbar .btn.disable.button-delete {
+.b-compose .b-header-toolbar .btn.disabled.button-delete {
   visibility: hidden;
 }
 .b-compose .b-header-toolbar .button-save,
@@ -7858,7 +7861,7 @@ html.rl-message-fullscreen .messageView .b-content .buttonFull {
 .b-compose .b-header-toolbar .saved-text {
   margin-left: 8px;
 }
-.b-compose .b-header-toolbar .disable.button-delete {
+.b-compose .b-header-toolbar .disabled.button-delete {
   margin-left: 0px;
 }
 .b-compose .b-header {
@@ -8064,17 +8067,17 @@ html.rl-message-fullscreen .messageView .b-content .buttonFull {
   filter: alpha(opacity=100);
 }
 .b-admin-domains-list-table .e-item .delete-domain,
-.b-admin-domains-list-table .e-item .disable-domain {
+.b-admin-domains-list-table .e-item .disabled-domain {
   cursor: pointer;
   opacity: 0.5;
   filter: alpha(opacity=50);
 }
-.b-admin-domains-list-table .e-item.disabled .disable-domain {
+.b-admin-domains-list-table .e-item.disabled .disabled-domain {
   opacity: 0.5;
   filter: alpha(opacity=50);
 }
 .b-admin-domains-list-table .e-item .delete-domain:hover,
-.b-admin-domains-list-table .e-item .disable-domain:hover {
+.b-admin-domains-list-table .e-item .disabled-domain:hover {
   opacity: 1;
   filter: alpha(opacity=100);
 }
@@ -8159,7 +8162,7 @@ html.rl-message-fullscreen .messageView .b-content .buttonFull {
 .b-admin-plugins-list-table .e-item.disabled .plugin-name {
   color: #bbb;
 }
-.b-admin-plugins-list-table .e-item.disabled .disable-plugin {
+.b-admin-plugins-list-table .e-item.disabled .disabled-plugin {
   opacity: 0.5;
   filter: alpha(opacity=50);
 }

rainloop/v/0.0.0/static/js/admin.js

@@ -88,6 +88,11 @@ Globals.now = (new Date()).getTime();
  */
 Globals.momentTrigger = ko.observable(true);
 
+/**
+ * @type {?}
+ */
+Globals.dropdownVisibility = ko.observable(false);
+
 /**
  * @type {?}
  */
@@ -377,6 +382,7 @@ Enums.KeyState = {
 	'MessageList': 'message-list',
 	'MessageView': 'message-view',
 	'Compose': 'compose',
+	'Settings': 'settings',
 	'Menu': 'menu',
 	'PopupComposeOpenPGP': 'compose-open-pgp',
 	'PopupAsk': 'popup-ask'
@@ -2087,10 +2093,10 @@ Utils.draggeblePlace = function ()
 
 Utils.defautOptionsAfterRender = function (oOption, oItem)
 {
-	if (oItem && !Utils.isUnd(oItem.disable))
+	if (oItem && !Utils.isUnd(oItem.disabled))
 	{
 		ko.applyBindingsToNode(oOption, {
-			'disable': oItem.disable
+			'disabled': oItem.disabled
 		}, oItem);
 	}
 };
@@ -2685,7 +2691,54 @@ ko.bindingHandlers.tooltip2 = {
 	}
 };
 
-ko.bindingHandlers.dropdown = {
+ko.__detectDropdownVisibility = _.debounce(function ($el) {
+	Globals.dropdownVisibility(!!$el.hasClass('open'));
+}, 50);
+
+ko.bindingHandlers.dropdownOpenStatus = {
+	'init': function (oElement) {
+		var $el = $(oElement);
+
+		$el.find('.dropdown-toggle').click(function () {
+			ko.__detectDropdownVisibility($el);
+		});
+		
+//		$el.on('.dropdown-menu .menuitem', 'click', function () {
+//			$el.removeClass('open');
+//			ko.__detectDropdownVisibility($el);
+//		});
+
+//		$el.on('.dropdown-menu .menuitem', 'keydown', function (oEvent) {
+//			if (oEvent && Enums.EventKeyCode.Esc === oEvent.keyCode)
+//			{
+//				$el.removeClass('open');
+//				ko.__detectDropdownVisibility($el);
+//			}
+//		});
+		
+		$html.on('click.dropdown.data-api', function () {
+			ko.__detectDropdownVisibility($el);
+		});
+	}
+};
+
+ko.bindingHandlers.openDropdownTrigger = {
+	'update': function (oElement, fValueAccessor) {
+		if (ko.utils.unwrapObservable(fValueAccessor()))
+		{
+			var $el = $(oElement);
+			if (!$el.hasClass('open'))
+			{
+				$el.find('.dropdown-toggle').dropdown('toggle');
+				ko.__detectDropdownVisibility($el);
+			}
+			
+			fValueAccessor()(false);
+		}
+	}
+};
+
+ko.bindingHandlers.dropdownCloser = {
 	'init': function (oElement) {
 		$(oElement).closest('.dropdown').on('click', '.e-item', function () {
 			$(oElement).dropdown('toggle');
@@ -5853,7 +5906,7 @@ function AdminContacts()
 		return {
 			'id': sValue,
 			'name': getTypeName(sValue) + (bDisabled ? ' (not supported)' : ''),
-			'disable': bDisabled
+			'disabled': bDisabled
 		};
 	});
 
@@ -6366,7 +6419,7 @@ AdminPlugins.prototype.onBuild = function (oDom)
 				self.configurePlugin(oPlugin);
 			}
 		})
-		.on('click', '.e-item .disable-plugin', function () {
+		.on('click', '.e-item .disabled-plugin', function () {
 			var oPlugin = ko.dataFor(this);
 			if (oPlugin)
 			{
@@ -6570,22 +6623,55 @@ AdminLicensing.prototype.licenseExpiredMomentValue = function ()
  */
 function AbstractData()
 {
-	this.keyScope = ko.observable(Enums.KeyState.All);
-	this.keyScope.subscribe(function (sValue) {
+	this.keyScopeReal = ko.observable(Enums.KeyState.All);
+	this.keyScopeFake = ko.observable(Enums.KeyState.All);
 	
-		if (Enums.KeyState.Compose === sValue)
-		{
-			Utils.disableKeyFilter();
-		}
-		else
-		{
-			Utils.restoreKeyFilter();
-		}
+	this.keyScope = ko.computed({
+		'owner': this,
+		'read': function () {
+			return this.keyScopeFake();
+		},
+		'write': function (sValue) {
 
-//		window.console.log(sValue);
+			if (Enums.KeyState.Menu !== sValue)
+			{
+				if (Enums.KeyState.Compose === sValue)
+				{
+					Utils.disableKeyFilter();
+				}
+				else
+				{
+					Utils.restoreKeyFilter();
+				}
+
+				this.keyScopeFake(sValue);
+				if (Globals.dropdownVisibility())
+				{
+					sValue = Enums.KeyState.Menu;
+				}
+			}
+			
+//			window.console.log(sValue + '/' + this.keyScopeFake());
+			this.keyScopeReal(sValue);
+		}
+	});
+	
+	this.keyScopeReal.subscribe(function (sValue) {
+		window.console.log(sValue);
 		key.setScope(sValue);
 	});
 
+	Globals.dropdownVisibility.subscribe(function (bValue) {
+		if (bValue)
+		{
+			this.keyScope(Enums.KeyState.Menu);
+		}
+		else if (Enums.KeyState.Menu === key.getScope())
+		{
+			this.keyScope(this.keyScopeFake());
+		}
+	}, this);
+
 	Utils.initDataConstructorBySettings(this);
 }
 

rainloop/v/0.0.0/static/js/app.js

@@ -92,6 +92,11 @@ Globals.now = (new Date()).getTime();
  */
 Globals.momentTrigger = ko.observable(true);
 
+/**
+ * @type {?}
+ */
+Globals.dropdownVisibility = ko.observable(false);
+
 /**
  * @type {?}
  */
@@ -381,6 +386,7 @@ Enums.KeyState = {
 	'MessageList': 'message-list',
 	'MessageView': 'message-view',
 	'Compose': 'compose',
+	'Settings': 'settings',
 	'Menu': 'menu',
 	'PopupComposeOpenPGP': 'compose-open-pgp',
 	'PopupAsk': 'popup-ask'
@@ -2091,10 +2097,10 @@ Utils.draggeblePlace = function ()
 
 Utils.defautOptionsAfterRender = function (oOption, oItem)
 {
-	if (oItem && !Utils.isUnd(oItem.disable))
+	if (oItem && !Utils.isUnd(oItem.disabled))
 	{
 		ko.applyBindingsToNode(oOption, {
-			'disable': oItem.disable
+			'disabled': oItem.disabled
 		}, oItem);
 	}
 };
@@ -2689,7 +2695,54 @@ ko.bindingHandlers.tooltip2 = {
 	}
 };
 
-ko.bindingHandlers.dropdown = {
+ko.__detectDropdownVisibility = _.debounce(function ($el) {
+	Globals.dropdownVisibility(!!$el.hasClass('open'));
+}, 50);
+
+ko.bindingHandlers.dropdownOpenStatus = {
+	'init': function (oElement) {
+		var $el = $(oElement);
+
+		$el.find('.dropdown-toggle').click(function () {
+			ko.__detectDropdownVisibility($el);
+		});
+		
+//		$el.on('.dropdown-menu .menuitem', 'click', function () {
+//			$el.removeClass('open');
+//			ko.__detectDropdownVisibility($el);
+//		});
+
+//		$el.on('.dropdown-menu .menuitem', 'keydown', function (oEvent) {
+//			if (oEvent && Enums.EventKeyCode.Esc === oEvent.keyCode)
+//			{
+//				$el.removeClass('open');
+//				ko.__detectDropdownVisibility($el);
+//			}
+//		});
+		
+		$html.on('click.dropdown.data-api', function () {
+			ko.__detectDropdownVisibility($el);
+		});
+	}
+};
+
+ko.bindingHandlers.openDropdownTrigger = {
+	'update': function (oElement, fValueAccessor) {
+		if (ko.utils.unwrapObservable(fValueAccessor()))
+		{
+			var $el = $(oElement);
+			if (!$el.hasClass('open'))
+			{
+				$el.find('.dropdown-toggle').dropdown('toggle');
+				ko.__detectDropdownVisibility($el);
+			}
+			
+			fValueAccessor()(false);
+		}
+	}
+};
+
+ko.bindingHandlers.dropdownCloser = {
 	'init': function (oElement) {
 		$(oElement).closest('.dropdown').on('click', '.e-item', function () {
 			$(oElement).dropdown('toggle');
@@ -11661,7 +11714,8 @@ function AbstractSystemDropDownViewModel()
 	this.accounts = oData.accounts;
 	this.accountEmail = oData.accountEmail;
 	this.accountsLoading = oData.accountsLoading;
-	this.accountMenuFocus = oData.accountMenuFocus;
+
+	this.accountMenuDropdownTrigger = ko.observable(false);
 
 	this.allowAddAccount = RL.settingsGet('AllowAdditionalAccounts');
 
@@ -11670,14 +11724,6 @@ function AbstractSystemDropDownViewModel()
 	}, this);
 
 	this.accountClick = _.bind(this.accountClick, this);
-
-	key('`', function () {
-		if (oData.useKeyboardShortcuts() && !RL.popupVisibility() &&
-			!oData.accountMenuFocus())
-		{
-			oData.accountMenuFocus(true);
-		}
-	});
 }
 
 _.extend(AbstractSystemDropDownViewModel.prototype, KnoinAbstractViewModel.prototype);
@@ -11725,6 +11771,18 @@ AbstractSystemDropDownViewModel.prototype.logoutClick = function ()
 		RL.loginAndLogoutReload(true, RL.settingsGet('ParentEmail') && 0 < RL.settingsGet('ParentEmail').length);
 	});
 };
+
+AbstractSystemDropDownViewModel.prototype.onBuild = function ()
+{
+	var self = this;
+	key('`', [Enums.KeyState.MessageList, Enums.KeyState.MessageView, Enums.KeyState.Settings], function () {
+		if (RL.data().useKeyboardShortcuts() && !RL.popupVisibility() && !Globals.dropdownVisibility() && self.viewModelVisibility())
+		{
+			self.accountMenuDropdownTrigger(true);
+		}
+	});
+};
+
 /**
  * @constructor
  * @extends AbstractSystemDropDownViewModel
@@ -11928,6 +11986,9 @@ function MailBoxMessageListViewModel()
 	this.userUsageSize = oData.userUsageSize;
 	this.userUsageProc = oData.userUsageProc;
 
+	this.moveDropdownTrigger = ko.observable(false);
+	this.moreDropdownTrigger = ko.observable(false);
+
 	// append drag and drop
 	this.dragOver = ko.observable(false).extend({'throttle': 1});
 	this.dragOverEnter = ko.observable(false).extend({'throttle': 1});
@@ -12404,7 +12465,7 @@ MailBoxMessageListViewModel.prototype.flagMessages = function (oCurrentMessage)
 	}
 };
 
-MailBoxMessageListViewModel.prototype.flagMessagesFast = function ()
+MailBoxMessageListViewModel.prototype.flagMessagesFast = function (bFlag)
 {
 	var
 		aChecked = this.messageListCheckedOrSelected(),
@@ -12417,24 +12478,43 @@ MailBoxMessageListViewModel.prototype.flagMessagesFast = function ()
 			return oMessage.flagged();
 		});
 
-		this.setAction(aChecked[0].folderFullNameRaw,
-			aChecked.length === aFlagged.length ? Enums.MessageSetAction.UnsetFlag : Enums.MessageSetAction.SetFlag, aChecked);
+		if (Utils.isUnd(bFlag))
+		{
+			this.setAction(aChecked[0].folderFullNameRaw,
+				aChecked.length === aFlagged.length ? Enums.MessageSetAction.UnsetFlag : Enums.MessageSetAction.SetFlag, aChecked);
+		}
+		else
+		{
+			this.setAction(aChecked[0].folderFullNameRaw,
+				!bFlag ? Enums.MessageSetAction.UnsetFlag : Enums.MessageSetAction.SetFlag, aChecked);
+		}
 	}
 };
 
-MailBoxMessageListViewModel.prototype.seenMessagesFast = function ()
+MailBoxMessageListViewModel.prototype.seenMessagesFast = function (bSeen)
 {
 	var
 		aChecked = this.messageListCheckedOrSelected(),
 		aUnseen = []
 	;
 
-	aUnseen = _.filter(aChecked, function (oMessage) {
-		return oMessage.unseen();
-	});
+	if (0 < aChecked.length)
+	{
+		aUnseen = _.filter(aChecked, function (oMessage) {
+			return oMessage.unseen();
+		});
 
-	this.setAction(aChecked[0].folderFullNameRaw,
-		0 < aUnseen.length ? Enums.MessageSetAction.SetSeen : Enums.MessageSetAction.UnsetSeen, aChecked);
+		if (Utils.isUnd(bSeen))
+		{
+			this.setAction(aChecked[0].folderFullNameRaw,
+				0 < aUnseen.length ? Enums.MessageSetAction.SetSeen : Enums.MessageSetAction.UnsetSeen, aChecked);
+		}
+		else
+		{
+			this.setAction(aChecked[0].folderFullNameRaw,
+				bSeen ? Enums.MessageSetAction.SetSeen : Enums.MessageSetAction.UnsetSeen, aChecked);
+		}
+	}
 };
 
 MailBoxMessageListViewModel.prototype.onBuild = function (oDom)
@@ -12534,6 +12614,14 @@ MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 		}
 	});
 
+	key('z', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+		if (oData.useKeyboardShortcuts())
+		{
+			self.moreDropdownTrigger(true);
+			return false;
+		}
+	});
+
 	// delete
 	key('delete, shift+delete', Enums.KeyState.MessageList, function (event, handler) {
 		if (oData.useKeyboardShortcuts() && event)
@@ -12563,8 +12651,8 @@ MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 		}
 	});
 
-	// new message (open compose popup)
-	key('c,n', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+	// write/compose (open compose popup)
+	key('w,c', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
 		if (oData.useKeyboardShortcuts())
 		{
 			kn.showScreenPopup(PopupsComposeViewModel);
@@ -12572,8 +12660,8 @@ MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 		}
 	});
 
-	// star/flag messages
-	key('s', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+	// important - star/flag messages
+	key('i', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
 		if (oData.useKeyboardShortcuts())
 		{
 			self.flagMessagesFast();
@@ -12581,11 +12669,29 @@ MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 		}
 	});
 
-	// mark as read/unread
-	key('m', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+	// move
+	key('m', Enums.KeyState.MessageList, function () {
 		if (oData.useKeyboardShortcuts())
 		{
-			self.seenMessagesFast();
+			self.moveDropdownTrigger(true);
+			return false;
+		}
+	});
+
+	// read
+	key('q', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+		if (oData.useKeyboardShortcuts())
+		{
+			self.seenMessagesFast(true);
+			return false;
+		}
+	});
+
+	// unread
+	key('u', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+		if (oData.useKeyboardShortcuts())
+		{
+			self.seenMessagesFast(false);
 			return false;
 		}
 	});
@@ -12806,6 +12912,7 @@ function MailBoxMessageViewViewModel()
 	this.fullScreenMode = oData.messageFullScreenMode;
 
 	this.showFullInfo = ko.observable(false);
+	this.moreDropdownTrigger = ko.observable(false);
 	this.messageDomFocused = ko.observable(false).extend({'rateLimit': 0});
 
 	this.messageVisibility = ko.computed(function () {
@@ -13126,6 +13233,13 @@ MailBoxMessageViewViewModel.prototype.onBuild = function (oDom)
 		this.messageDomFocused(!!bValue);
 	}, this);
 
+	this.messageDomFocused.subscribe(function (bValue) {
+		if (!bValue && Enums.KeyState.MessageView === this.keyScope())
+		{
+			this.message.focused(false);
+		}
+	}, this);
+
 	this.keyScope.subscribe(function (sValue) {
 		if (Enums.KeyState.MessageView === sValue && this.message.focused())
 		{
@@ -13150,10 +13264,14 @@ MailBoxMessageViewViewModel.prototype.escShortcuts = function ()
 		{
 			this.fullScreenMode(false);
 		}
-		else
+		else if (Enums.Layout.NoPreview === RL.data().layout())
 		{
 			this.message(null);
 		}
+		else
+		{
+			this.message.focused(false);
+		}
 
 		return false;
 	}
@@ -13178,6 +13296,14 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 		}
 	});
 
+	key('x', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+		if (oData.useKeyboardShortcuts())
+		{
+			self.moreDropdownTrigger(true);
+			return false;
+		}
+	});
+
 	// reply
 	key('r', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
 		if (oData.useKeyboardShortcuts() && oData.message())
@@ -13206,13 +13332,13 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 	});
 
 	// message information
-	key('i', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts())
-		{
-			self.showFullInfo(!self.showFullInfo());
-			return false;
-		}
-	});
+//	key('i', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+//		if (oData.useKeyboardShortcuts())
+//		{
+//			self.showFullInfo(!self.showFullInfo());
+//			return false;
+//		}
+//	});
 
 	// toggle message blockquotes
 	key('b', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
@@ -13452,6 +13578,17 @@ function SettingsPaneViewModel()
 
 Utils.extendAsViewModel('SettingsPaneViewModel', SettingsPaneViewModel);
 
+SettingsPaneViewModel.prototype.onBuild = function ()
+{
+	var self = this;
+	key('esc', Enums.KeyState.Settings, function () {
+		if (RL.data().useKeyboardShortcuts())
+		{
+			self.backToMailBoxClick();
+		}
+	});
+};
+
 SettingsPaneViewModel.prototype.onShow = function ()
 {
 	RL.data().message(null);
@@ -14747,22 +14884,55 @@ SettingsOpenPGP.prototype.deleteOpenPgpKey = function (oOpenPgpKeyToRemove)
  */
 function AbstractData()
 {
-	this.keyScope = ko.observable(Enums.KeyState.All);
-	this.keyScope.subscribe(function (sValue) {
+	this.keyScopeReal = ko.observable(Enums.KeyState.All);
+	this.keyScopeFake = ko.observable(Enums.KeyState.All);
 	
-		if (Enums.KeyState.Compose === sValue)
-		{
-			Utils.disableKeyFilter();
-		}
-		else
-		{
-			Utils.restoreKeyFilter();
-		}
+	this.keyScope = ko.computed({
+		'owner': this,
+		'read': function () {
+			return this.keyScopeFake();
+		},
+		'write': function (sValue) {
 
-//		window.console.log(sValue);
+			if (Enums.KeyState.Menu !== sValue)
+			{
+				if (Enums.KeyState.Compose === sValue)
+				{
+					Utils.disableKeyFilter();
+				}
+				else
+				{
+					Utils.restoreKeyFilter();
+				}
+
+				this.keyScopeFake(sValue);
+				if (Globals.dropdownVisibility())
+				{
+					sValue = Enums.KeyState.Menu;
+				}
+			}
+			
+//			window.console.log(sValue + '/' + this.keyScopeFake());
+			this.keyScopeReal(sValue);
+		}
+	});
+	
+	this.keyScopeReal.subscribe(function (sValue) {
+		window.console.log(sValue);
 		key.setScope(sValue);
 	});
 
+	Globals.dropdownVisibility.subscribe(function (bValue) {
+		if (bValue)
+		{
+			this.keyScope(Enums.KeyState.Menu);
+		}
+		else if (Enums.KeyState.Menu === key.getScope())
+		{
+			this.keyScope(this.keyScopeFake());
+		}
+	}, this);
+
 	Utils.initDataConstructorBySettings(this);
 }
 
@@ -14872,17 +15042,6 @@ function WebMailDataStorage()
 	this.projectHash = ko.observable('');
 	this.threading = ko.observable(false);
 
-	this.accountMenuFocus = ko.observable(false);
-	this.accountMenuFocus.sKeyState = Enums.KeyState.All;
-	
-	this.accountMenuFocus.subscribe(function (bValue) {
-		if (bValue)
-		{
-			this.accountMenuFocus.sKeyState = RL.data().keyScope();
-		}
-		RL.data().keyScope(bValue ? Enums.KeyState.Menu : this.accountMenuFocus.sKeyState);
-	}, this);
-
 	this.lastFoldersHash = '';
 	this.remoteSuggestions = false;
 
@@ -15121,7 +15280,14 @@ function WebMailDataStorage()
 	}, this);
 
 	this.message.focused.subscribe(function (bValue) {
-		RL.data().keyScope(bValue ? Enums.KeyState.MessageView : Enums.KeyState.MessageList);
+		if (bValue)
+		{
+			RL.data().keyScope(Enums.KeyState.MessageView);
+		}
+		else if (Enums.KeyState.MessageView === RL.data().keyScope())
+		{
+			RL.data().keyScope(Enums.KeyState.MessageList);
+		}
 	});
 	
 	this.messageLoading.subscribe(function (bValue) {
@@ -17712,11 +17878,6 @@ MailBoxScreen.prototype.onShow = function ()
 	RL.data().keyScope(Enums.KeyState.MessageList);
 };
 
-MailBoxScreen.prototype.onHide = function ()
-{
-	RL.data().keyScope(Enums.KeyState.All);
-};
-
 /**
  * @param {string} sFolderHash
  * @param {number} iPage
@@ -17803,17 +17964,6 @@ MailBoxScreen.prototype.onStart = function ()
 	}, this);
 };
 
-//MailBoxScreen.prototype.onBuild = function ()
-//{
-//	if (!Globals.bMobileDevice)
-//	{
-//		_.defer(function () {
-//			Utils.initLayoutResizer('#rl-resizer-left', '#rl-resizer-right', '#rl-right',
-//				350, 800, 350, 350, Enums.ClientSideKeyName.MailBoxListSize);
-//		});
-//	}
-//};
-
 /**
  * @return {Array}
  */
@@ -17885,6 +18035,7 @@ SettingsScreen.prototype.onShow = function ()
 //	AbstractSettings.prototype.onShow.call(this);
 
 	RL.setTitle(this.sSettingsTitle);
+	RL.data().keyScope(Enums.KeyState.Settings);
 };
 
 /**
@@ -19027,7 +19178,7 @@ RainLoopApp.prototype.folderListOptionsBuilder = function (aSystem, aList, aDisa
 		aResult.push({
 			'id': aHeaderLines[iIndex][0],
 			'name': aHeaderLines[iIndex][1],
-			'disable': false
+			'disabled': false
 		});
 	}
 
@@ -19040,7 +19191,7 @@ RainLoopApp.prototype.folderListOptionsBuilder = function (aSystem, aList, aDisa
 				'id': oItem.fullNameRaw,
 				'system': true,
 				'name': fRenameCallback ? fRenameCallback.call(null, oItem) : oItem.name(),
-				'disable': !oItem.selectable || -1 < Utils.inArray(oItem.fullNameRaw, aDisabled) ||
+				'disabled': !oItem.selectable || -1 < Utils.inArray(oItem.fullNameRaw, aDisabled) ||
 					(fDisableCallback ? fDisableCallback.call(null, oItem) : false)
 			});
 		}
@@ -19060,7 +19211,7 @@ RainLoopApp.prototype.folderListOptionsBuilder = function (aSystem, aList, aDisa
 						'system': false,
 						'name': (new window.Array(oItem.deep + 1 - iUnDeep)).join(sDeepPrefix) + 
 							(fRenameCallback ? fRenameCallback.call(null, oItem) : oItem.name()),
-						'disable': !oItem.selectable || -1 < Utils.inArray(oItem.fullNameRaw, aDisabled) ||
+						'disabled': !oItem.selectable || -1 < Utils.inArray(oItem.fullNameRaw, aDisabled) ||
 							(Enums.FolderType.User !== oItem.type()) ||
 							(fDisableCallback ? fDisableCallback.call(null, oItem) : false)
 					});

vendors/jquery-nanoscroller/nanoscroller.css

@@ -49,7 +49,7 @@
   -moz-border-radius    : 5px;
   -webkit-border-radius : 5px;
   border-radius         : 5px;
-  z-index: 10000;
+  z-index: 102;
   margin                : 2px;
 }