Replace viewDecorator and popupDecorator with proper AbstractView classes

dev/Knoin/AbstractViews.js

@@ -3,8 +3,9 @@ import ko from 'ko';
 import { inFocus } from 'Common/Utils';
 import { KeyState } from 'Common/Enums';
 import { keyScope } from 'Common/Globals';
+import { ViewType } from 'Knoin/Knoin';
 
-export class AbstractViewNext {
+class AbstractView {
 	bDisabeCloseOnEsc = false;
 	sDefaultKeyScope = KeyState.None;
 	sCurrentKeyScope = KeyState.None;
@@ -13,9 +14,15 @@ export class AbstractViewNext {
 	modalVisibility = ko.observable(false).extend({ rateLimit: 0 });
 
 	viewModelName = '';
-	viewModelNames = [];
 	viewModelDom = null;
 
+	constructor(name, templateID, type)
+	{
+		this.viewModelName = 'View/' + name;
+		this.viewModelTemplateID = templateID;
+		this.viewModelPosition = type;
+	}
+
 	/**
 	 * @returns {void}
 	 */
@@ -31,24 +38,6 @@ export class AbstractViewNext {
 		keyScope(this.sCurrentKeyScope);
 	}
 
-	/**
-	 * @returns {void}
-	 */
-	registerPopupKeyDown() {
-		addEventListener('keydown', event => {
-			if (event && this.modalVisibility && this.modalVisibility()) {
-				if (!this.bDisabeCloseOnEsc && 'Escape' == event.key) {
-					this.cancelCommand && this.cancelCommand();
-					return false;
-				} else if ('Backspace' == event.key && !inFocus()) {
-					return false;
-				}
-			}
-
-			return true;
-		});
-	}
-
 	cancelCommand() {} // eslint-disable-line no-empty-function
 	closeCommand() {} // eslint-disable-line no-empty-function
 
@@ -69,3 +58,53 @@ export class AbstractViewNext {
 	}
 
 }
+
+export class AbstractViewPopup extends AbstractView
+{
+	constructor(name)
+	{
+		super('Popup/' + name, 'Popups' + name, ViewType.Popup);
+	}
+
+	/**
+	 * @returns {void}
+	 */
+	registerPopupKeyDown() {
+		addEventListener('keydown', event => {
+			if (event && this.modalVisibility && this.modalVisibility()) {
+				if (!this.bDisabeCloseOnEsc && 'Escape' == event.key) {
+					this.cancelCommand && this.cancelCommand();
+					return false;
+				} else if ('Backspace' == event.key && !inFocus()) {
+					return false;
+				}
+			}
+
+			return true;
+		});
+	}
+}
+
+export class AbstractViewCenter extends AbstractView
+{
+	constructor(name, templateID)
+	{
+		super(name, templateID, ViewType.Center);
+	}
+}
+
+export class AbstractViewLeft extends AbstractView
+{
+	constructor(name, templateID)
+	{
+		super(name, templateID, ViewType.Left);
+	}
+}
+
+export class AbstractViewRight extends AbstractView
+{
+	constructor(name, templateID)
+	{
+		super(name, templateID, ViewType.Right);
+	}
+}

dev/Knoin/Knoin.js

@@ -105,17 +105,12 @@ function buildViewModel(ViewModelClass, vmScreen) {
 	if (ViewModelClass && !ViewModelClass.__builded) {
 		let vmDom = null;
 		const vm = new ViewModelClass(vmScreen),
-			position = ViewModelClass.__type || '',
+			position = vm.viewModelPosition || '',
 			vmPlace = position ? document.querySelector('#rl-content #rl-' + position.toLowerCase()) : null;
 
 		ViewModelClass.__builded = true;
 		ViewModelClass.__vm = vm;
 
-		vm.viewModelName = ViewModelClass.__name;
-		vm.viewModelNames = ViewModelClass.__names;
-		vm.viewModelTemplateID = ViewModelClass.__templateID;
-		vm.viewModelPosition = ViewModelClass.__type;
-
 		if (vmPlace) {
 			vmDom = Element.fromHTML('<div class="rl-view-model RL-' + vm.viewModelTemplateID + '" hidden=""></div>');
 			vmPlace.append(vmDom);
@@ -368,42 +363,6 @@ export function startScreens(screensClasses) {
 	setTimeout(() => $htmlCL.add('rl-started-delay'), 200);
 }
 
-/**
- * @param {Object} params
- * @returns {Function}
- */
-function viewDecorator({ name, type, templateID }) {
-	return (target) => {
-		if (target) {
-			if (name) {
-				if (Array.isArray(name)) {
-					target.__names = name;
-				} else {
-					target.__names = [name];
-				}
-
-				target.__name = target.__names[0];
-			}
-
-			if (type) {
-				target.__type = type;
-			}
-
-			if (templateID) {
-				target.__templateID = templateID;
-			}
-		}
-	};
-}
-
-/**
- * @param {Object} params
- * @returns {Function}
- */
-function popupDecorator({ name, templateID }) {
-	return viewDecorator({ name, type: ViewType.Popup, templateID });
-}
-
 /**
  * @param {Function} canExecute
  * @returns {Function}
@@ -441,7 +400,7 @@ function settingsMenuKeysHandler(items) {
 		let index = items.length;
 		if (event && index) {
 			while (index-- && !items[index].matches('.selected'));
-			if (handler && 'up' === handler.shortcut) {
+			if (handler && 'arrowup' === handler.shortcut) {
 				index && --index;
 			} else if (index < items.length - 1) {
 				++index;
@@ -456,9 +415,5 @@ function settingsMenuKeysHandler(items) {
 export {
 	commandDecorator,
 	commandDecorator as command,
-	viewDecorator,
-	viewDecorator as view,
-	popupDecorator,
-	popupDecorator as popup,
 	settingsMenuKeysHandler
 };

dev/View/Admin/Login.js

@@ -5,17 +5,12 @@ import { getNotification } from 'Common/Translator';
 
 import Remote from 'Remote/Admin/Fetch';
 
-import { view, command, ViewType } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewCenter } from 'Knoin/AbstractViews';
 
-@view({
+class LoginAdminView extends AbstractViewCenter {
-	name: 'View/Admin/Login',
-	type: ViewType.Center,
-	templateID: 'AdminLogin'
-})
-class LoginAdminView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Admin/Login', 'AdminLogin');
 
 		const appSettingsGet = rl.settings.app;
 		this.mobile = !!appSettingsGet('mobile');

dev/View/Admin/Settings/Menu.js

@@ -1,20 +1,15 @@
 import { leftPanelDisabled } from 'Common/Globals';
 import { KeyState } from 'Common/Enums';
 
-import { view, ViewType, settingsMenuKeysHandler } from 'Knoin/Knoin';
+import { settingsMenuKeysHandler } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewLeft } from 'Knoin/AbstractViews';
 
-@view({
+class MenuSettingsAdminView extends AbstractViewLeft {
-	name: 'View/Admin/Settings/Menu',
-	type: ViewType.Left,
-	templateID: 'AdminMenu'
-})
-class MenuSettingsAdminView extends AbstractViewNext {
 	/**
 	 * @param {?} screen
 	 */
 	constructor(screen) {
-		super();
+		super('Admin/Settings/Menu', 'AdminMenu');
 
 		this.leftPanelDisabled = leftPanelDisabled;
 

dev/View/Admin/Settings/Pane.js

@@ -6,17 +6,11 @@ import DomainStore from 'Stores/Admin/Domain';
 import PluginStore from 'Stores/Admin/Plugin';
 import PackageStore from 'Stores/Admin/Package';
 
-import { view, ViewType } from 'Knoin/Knoin';
+import { AbstractViewRight } from 'Knoin/AbstractViews';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
 
-@view({
+class PaneSettingsAdminView extends AbstractViewRight {
-	name: 'View/Admin/Settings/Pane',
-	type: ViewType.Right,
-	templateID: 'AdminPane'
-})
-class PaneSettingsAdminView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Admin/Settings/Pane', 'AdminPane');
 
 		this.version = ko.observable(rl.settings.app('version'));
 

dev/View/Popup/Account.js

@@ -3,16 +3,12 @@ import { getNotification } from 'Common/Translator';
 
 import Remote from 'Remote/User/Fetch';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class AccountPopupView extends AbstractViewPopup {
-	name: 'View/Popup/Account',
-	templateID: 'PopupsAccount'
-})
-class AccountPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Account');
 
 		this.addObservables({
 			isNew: true,

dev/View/Popup/AddOpenPgpKey.js

@@ -1,15 +1,11 @@
 import PgpStore from 'Stores/User/Pgp';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class AddOpenPgpKeyPopupView extends AbstractViewPopup {
-	name: 'View/Popup/AddOpenPgpKey',
-	templateID: 'PopupsAddOpenPgpKey'
-})
-class AddOpenPgpKeyPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('AddOpenPgpKey');
 
 		this.addObservables({
 			key: '',

dev/View/Popup/AdvancedSearch.js

@@ -4,16 +4,12 @@ import { i18n, trigger as translatorTrigger } from 'Common/Translator';
 
 import MessageStore from 'Stores/User/Message';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class AdvancedSearchPopupView extends AbstractViewPopup {
-	name: 'View/Popup/AdvancedSearch',
-	templateID: 'PopupsAdvancedSearch'
-})
-class AdvancedSearchPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('AdvancedSearch');
 
 		this.addObservables({
 			fromFocus: false,

dev/View/Popup/Ask.js

@@ -1,16 +1,11 @@
 import { KeyState } from 'Common/Enums';
 import { i18n } from 'Common/Translator';
 
-import { popup } from 'Knoin/Knoin';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
 
-@popup({
+class AskPopupView extends AbstractViewPopup {
-	name: 'View/Popup/Ask',
-	templateID: 'PopupsAsk'
-})
-class AskPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Ask');
 
 		this.addObservables({
 			askDesc: '',

dev/View/Popup/Compose.js

@@ -34,8 +34,8 @@ import Remote from 'Remote/User/Fetch';
 
 import { ComposeAttachmentModel } from 'Model/ComposeAttachment';
 
-import { popup, command, isPopupVisible, showScreenPopup, hideScreenPopup } from 'Knoin/Knoin';
+import { command, isPopupVisible, showScreenPopup, hideScreenPopup } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
 const Settings = rl.settings,
 	/**
@@ -88,13 +88,9 @@ ko.extenders.toggleSubscribe = (target, options) => {
 	return target;
 };
 
-@popup({
+class ComposePopupView extends AbstractViewPopup {
-	name: 'View/Popup/Compose',
-	templateID: 'PopupsCompose'
-})
-class ComposePopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Compose');
 
 		const fEmailOutInHelper = (context, identity, name, isIn) => {
 			if (identity && context && identity[name]() && (isIn ? true : context[name]())) {

dev/View/Popup/ComposeOpenPgp.js

@@ -9,18 +9,14 @@ import PgpStore from 'Stores/User/Pgp';
 
 import { EmailModel } from 'Model/Email';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
 const KEY_NAME_SUBSTR = -8;
 
-@popup({
+class ComposeOpenPgpPopupView extends AbstractViewPopup {
-	name: 'View/Popup/ComposeOpenPgp',
-	templateID: 'PopupsComposeOpenPgp'
-})
-class ComposeOpenPgpPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('ComposeOpenPgp');
 
 		this.publicKeysOptionsCaption = i18n('PGP_NOTIFICATIONS/ADD_A_PUBLICK_KEY');
 		this.privateKeysOptionsCaption = i18n('PGP_NOTIFICATIONS/SELECT_A_PRIVATE_KEY');

dev/View/Popup/Contacts.js

@@ -26,20 +26,16 @@ import { EmailModel } from 'Model/Email';
 import { ContactModel } from 'Model/Contact';
 import { ContactPropertyModel } from 'Model/ContactProperty';
 
-import { popup, command, showScreenPopup, hideScreenPopup } from 'Knoin/Knoin';
+import { command, showScreenPopup, hideScreenPopup } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
 const CONTACTS_PER_PAGE = 50,
 	propertyIsMail = prop => prop.isType(ContactPropertyType.Email),
 	propertyIsName = prop => prop.isType(ContactPropertyType.FirstName) || prop.isType(ContactPropertyType.LastName);
 
-@popup({
+class ContactsPopupView extends AbstractViewPopup {
-	name: 'View/Popup/Contacts',
-	templateID: 'PopupsContacts'
-})
-class ContactsPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Contacts');
 
 		this.bBackToCompose = false;
 		this.sLastComposeFocusedField = '';

dev/View/Popup/Domain.js

@@ -6,16 +6,12 @@ import CapaAdminStore from 'Stores/Admin/Capa';
 
 import Remote from 'Remote/Admin/Fetch';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class DomainPopupView extends AbstractViewPopup {
-	name: 'View/Popup/Domain',
-	templateID: 'PopupsDomain'
-})
-class DomainPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Domain');
 
 		this.addObservables({
 			edit: false,

dev/View/Popup/DomainAlias.js

@@ -7,16 +7,12 @@ import DomainStore from 'Stores/Admin/Domain';
 
 import Remote from 'Remote/Admin/Fetch';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class DomainAliasPopupView extends AbstractViewPopup {
-	name: 'View/Popup/DomainAlias',
-	templateID: 'PopupsDomainAlias'
-})
-class DomainAliasPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('DomainAlias');
 
 		this.addObservables({
 			saving: false,

dev/View/Popup/Filter.js

@@ -7,16 +7,12 @@ import { i18n, initOnStartOrLangChange } from 'Common/Translator';
 import FolderStore from 'Stores/User/Folder';
 import SieveStore from 'Stores/User/Sieve';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class FilterPopupView extends AbstractViewPopup {
-	name: 'View/Popup/Filter',
-	templateID: 'PopupsFilter'
-})
-class FilterPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Filter');
 
 		this.addObservables({
 			isNew: true,

dev/View/Popup/FolderClear.js

@@ -6,16 +6,12 @@ import MessageStore from 'Stores/User/Message';
 
 import Remote from 'Remote/User/Fetch';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class FolderClearPopupView extends AbstractViewPopup {
-	name: 'View/Popup/FolderClear',
-	templateID: 'PopupsFolderClear'
-})
-class FolderClearPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('FolderClear');
 
 		this.addObservables({
 			selectedFolder: null,

dev/View/Popup/FolderCreate.js

@@ -9,16 +9,12 @@ import FolderStore from 'Stores/User/Folder';
 
 import Remote from 'Remote/User/Fetch';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class FolderCreateView extends AbstractViewPopup {
-	name: 'View/Popup/FolderCreate',
-	templateID: 'PopupsFolderCreate'
-})
-class FolderCreateView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('FolderCreate');
 
 		this.addObservables({
 			folderName: '',

dev/View/Popup/FolderSystem.js

@@ -10,16 +10,11 @@ import FolderStore from 'Stores/User/Folder';
 
 import Remote from 'Remote/User/Fetch';
 
-import { popup } from 'Knoin/Knoin';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
 
-@popup({
+class FolderSystemPopupView extends AbstractViewPopup {
-	name: 'View/Popup/FolderSystem',
-	templateID: 'PopupsFolderSystem'
-})
-class FolderSystemPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('FolderSystem');
 
 		this.sChooseOnText = '';
 		this.sUnuseText = '';

dev/View/Popup/Identity.js

@@ -3,18 +3,14 @@ import { getNotification } from 'Common/Translator';
 
 import Remote from 'Remote/User/Fetch';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
 const reEmail = /^[^@\s]+@[^@\s]+$/;
 
-@popup({
+class IdentityPopupView extends AbstractViewPopup {
-	name: 'View/Popup/Identity',
-	templateID: 'PopupsIdentity'
-})
-class IdentityPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Identity');
 
 		this.id = '';
 		this.addObservables({

dev/View/Popup/KeyboardShortcutsHelp.js

@@ -1,15 +1,10 @@
 import { KeyState } from 'Common/Enums';
 
-import { popup } from 'Knoin/Knoin';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
 
-@popup({
+class KeyboardShortcutsHelpPopupView extends AbstractViewPopup {
-	name: 'View/Popup/KeyboardShortcutsHelp',
-	templateID: 'PopupsKeyboardShortcutsHelp'
-})
-class KeyboardShortcutsHelpPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('KeyboardShortcutsHelp');
 		this.sDefaultKeyScope = KeyState.PopupKeyboardShortcutsHelp;
 	}
 

dev/View/Popup/Languages.js

@@ -2,17 +2,11 @@ import ko from 'ko';
 
 import { convertLangName } from 'Common/Utils';
 
-// import {view, ViewType} from 'Knoin/Knoin';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
-import { popup } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
 
-@popup({
+class LanguagesPopupView extends AbstractViewPopup {
-	name: 'View/Popup/Languages',
-	templateID: 'PopupsLanguages'
-})
-class LanguagesPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Languages');
 
 		this.fLang = null;
 		this.userLanguage = ko.observable('');

dev/View/Popup/MessageOpenPgp.js

@@ -3,16 +3,12 @@ import ko from 'ko';
 import { pString } from 'Common/Utils';
 import { KeyState } from 'Common/Enums';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class MessageOpenPgpPopupView extends AbstractViewPopup {
-	name: 'View/Popup/MessageOpenPgp',
-	templateID: 'PopupsMessageOpenPgp'
-})
-class MessageOpenPgpPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('MessageOpenPgp');
 
 		this.addObservables({
 			notification: '',

dev/View/Popup/NewOpenPgpKey.js

@@ -2,16 +2,12 @@ import { pInt } from 'Common/Utils';
 
 import PgpStore from 'Stores/User/Pgp';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class NewOpenPgpKeyPopupView extends AbstractViewPopup {
-	name: 'View/Popup/NewOpenPgpKey',
-	templateID: 'PopupsNewOpenPgpKey'
-})
-class NewOpenPgpKeyPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('NewOpenPgpKey');
 
 		this.addObservables({
 			email: '',

dev/View/Popup/Plugin.js

@@ -5,16 +5,12 @@ import { getNotification, i18n } from 'Common/Translator';
 
 import Remote from 'Remote/Admin/Fetch';
 
-import { popup, command, isPopupVisible, showScreenPopup } from 'Knoin/Knoin';
+import { command, isPopupVisible, showScreenPopup } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class PluginPopupView extends AbstractViewPopup {
-	name: 'View/Popup/Plugin',
-	templateID: 'PopupsPlugin'
-})
-class PluginPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Plugin');
 
 		this.onPluginSettingsUpdateResponse = this.onPluginSettingsUpdateResponse.bind(this);
 

dev/View/Popup/SieveScript.js

@@ -9,16 +9,12 @@ import Remote from 'Remote/User/Fetch';
 import { FilterModel } from 'Model/Filter';
 import SieveStore from 'Stores/User/Sieve';
 
-import { popup, showScreenPopup/*, command*/ } from 'Knoin/Knoin';
+import { showScreenPopup/*, command*/ } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class SieveScriptPopupView extends AbstractViewPopup {
-	name: 'View/Popup/SieveScript',
-	templateID: 'PopupsSieveScript'
-})
-class SieveScriptPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('SieveScript');
 
 		ko.addObservablesTo(this, {
 			saveError: false,

dev/View/Popup/Template.js

@@ -4,17 +4,13 @@ import { HtmlEditor } from 'Common/HtmlEditor';
 
 import Remote from 'Remote/User/Fetch';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 import { TemplateModel } from 'Model/Template';
 
-@popup({
+class TemplatePopupView extends AbstractViewPopup {
-	name: 'View/Popup/Template',
-	templateID: 'PopupsTemplate'
-})
-class TemplatePopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('Template');
 
 		this.editor = null;
 

dev/View/Popup/TwoFactorConfiguration.js

@@ -4,16 +4,12 @@ import { i18n, trigger as translatorTrigger } from 'Common/Translator';
 
 import Remote from 'Remote/User/Fetch';
 
-import { popup, showScreenPopup } from 'Knoin/Knoin';
+import { showScreenPopup } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class TwoFactorConfigurationPopupView extends AbstractViewPopup {
-	name: 'View/Popup/TwoFactorConfiguration',
-	templateID: 'PopupsTwoFactorConfiguration'
-})
-class TwoFactorConfigurationPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('TwoFactorConfiguration');
 
 		this.addObservables({
 			lock: false,

dev/View/Popup/TwoFactorTest.js

@@ -2,16 +2,12 @@ import { StorageResultType } from 'Common/Enums';
 
 import Remote from 'Remote/User/Fetch';
 
-import { popup, command } from 'Knoin/Knoin';
+import { command } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
 
-@popup({
+class TwoFactorTestPopupView extends AbstractViewPopup {
-	name: 'View/Popup/TwoFactorTest',
-	templateID: 'PopupsTwoFactorTest'
-})
-class TwoFactorTestPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('TwoFactorTest');
 
 		this.addObservables({
 			code: '',

dev/View/Popup/ViewOpenPgpKey.js

@@ -1,15 +1,10 @@
 import { KeyState } from 'Common/Enums';
 
-import { popup } from 'Knoin/Knoin';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
 
-@popup({
+class ViewOpenPgpKeyPopupView extends AbstractViewPopup {
-	name: 'View/Popup/ViewOpenPgpKey',
-	templateID: 'PopupsViewOpenPgpKey'
-})
-class ViewOpenPgpKeyPopupView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('ViewOpenPgpKey');
 
 		this.addObservables({
 			key: '',

dev/View/User/AbstractSystemDropDown.js

@@ -6,13 +6,13 @@ import { Capa, KeyState } from 'Common/Enums';
 import { settings } from 'Common/Links';
 
 import { showScreenPopup } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewRight } from 'Knoin/AbstractViews';
 
 const Settings = rl.settings;
 
-export class AbstractSystemDropDownUserView extends AbstractViewNext {
+export class AbstractSystemDropDownUserView extends AbstractViewRight {
-	constructor() {
+	constructor(name) {
-		super();
+		super(name, 'SystemDropDown');
 
 		this.mobile = !!Settings.app('mobile');
 		this.mobileDevice = !!Settings.app('mobileDevice');

dev/View/User/Login.js

@@ -19,21 +19,16 @@ import * as Local from 'Storage/Client';
 
 import Remote from 'Remote/User/Fetch';
 
-import { view, command, ViewType, showScreenPopup } from 'Knoin/Knoin';
+import { command, showScreenPopup } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewCenter } from 'Knoin/AbstractViews';
 
 import { rootAdmin } from 'Common/Links';
 
 const Settings = rl.settings;
 
-@view({
+class LoginUserView extends AbstractViewCenter {
-	name: ['View/App/Login', 'View/User/Login'],
-	type: ViewType.Center,
-	templateID: 'Login'
-})
-class LoginUserView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('User/Login', 'Login');
 
 		this.hideSubmitButton = Settings.app('hideSubmitButton');
 

dev/View/User/MailBox/FolderList.js

@@ -10,19 +10,14 @@ import SettingsStore from 'Stores/User/Settings';
 import FolderStore from 'Stores/User/Folder';
 import MessageStore from 'Stores/User/Message';
 
-import { view, ViewType, showScreenPopup } from 'Knoin/Knoin';
+import { showScreenPopup } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewLeft } from 'Knoin/AbstractViews';
 
 const Settings = rl.settings;
 
-@view({
+class FolderListMailBoxUserView extends AbstractViewLeft {
-	name: 'View/User/MailBox/FolderList',
-	type: ViewType.Left,
-	templateID: 'MailFolderList'
-})
-class FolderListMailBoxUserView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('User/MailBox/FolderList', 'MailFolderList');
 
 		this.oContentScrollable = null;
 

dev/View/User/MailBox/MessageList.js

@@ -38,22 +38,17 @@ import MessageStore from 'Stores/User/Message';
 
 import Remote from 'Remote/User/Fetch';
 
-import { view, command, ViewType, showScreenPopup, popupVisibility } from 'Knoin/Knoin';
+import { command, showScreenPopup, popupVisibility } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewRight } from 'Knoin/AbstractViews';
 
 const
 	Settings = rl.settings,
 	canBeMovedHelper = (self) => self.canBeMoved(),
 	ifvisible = window.ifvisible;
 
-@view({
+class MessageListMailBoxUserView extends AbstractViewRight {
-	name: 'View/User/MailBox/MessageList',
-	type: ViewType.Right,
-	templateID: 'MailMessageList'
-})
-class MessageListMailBoxUserView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('User/MailBox/MessageList', 'MailMessageList');
 
 		this.sLastUid = null;
 		this.bPrefetch = false;

dev/View/User/MailBox/MessageView.js

@@ -35,8 +35,8 @@ import * as Local from 'Storage/Client';
 
 import Remote from 'Remote/User/Fetch';
 
-import { view, command, ViewType, showScreenPopup, createCommand } from 'Knoin/Knoin';
+import { command, showScreenPopup, createCommand } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewRight } from 'Knoin/AbstractViews';
 
 const Settings = rl.settings;
 
@@ -44,14 +44,9 @@ function isTransparent(color) {
 	return 'rgba(0, 0, 0, 0)' === color || 'transparent' === color;
 }
 
-@view({
+class MessageViewMailBoxUserView extends AbstractViewRight {
-	name: 'View/User/MailBox/MessageView',
-	type: ViewType.Right,
-	templateID: 'MailMessageView'
-})
-class MessageViewMailBoxUserView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('User/MailBox/MessageView', 'MailMessageView');
 
 		const createCommandReplyHelper = type =>
 			createCommand(() => {

dev/View/User/MailBox/SystemDropDown.js

@@ -1,11 +1,10 @@
-import { view, ViewType } from 'Knoin/Knoin';
 import { AbstractSystemDropDownUserView } from 'View/User/AbstractSystemDropDown';
 
-@view({
+class SystemDropDownMailBoxUserView extends AbstractSystemDropDownUserView
-	name: 'View/User/MailBox/SystemDropDown',
+{
-	type: ViewType.Right,
+	constructor() {
-	templateID: 'SystemDropDown'
+		super('User/MailBox/SystemDropDown');
-})
+	}
-class SystemDropDownMailBoxUserView extends AbstractSystemDropDownUserView {}
+}
 
 export { SystemDropDownMailBoxUserView };

dev/View/User/Settings/Menu.js

@@ -3,20 +3,15 @@ import { leftPanelDisabled } from 'Common/Globals';
 import { settings, inbox } from 'Common/Links';
 import { getFolderInboxName } from 'Common/Cache';
 
-import { view, ViewType, settingsMenuKeysHandler } from 'Knoin/Knoin';
+import { settingsMenuKeysHandler } from 'Knoin/Knoin';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
+import { AbstractViewLeft } from 'Knoin/AbstractViews';
 
-@view({
+class MenuSettingsUserView extends AbstractViewLeft {
-	name: 'View/User/Settings/Menu',
-	type: ViewType.Left,
-	templateID: 'SettingsMenu'
-})
-class MenuSettingsUserView extends AbstractViewNext {
 	/**
 	 * @param {Object} screen
 	 */
 	constructor(screen) {
-		super();
+		super('User/Settings/Menu', 'SettingsMenu');
 
 		this.leftPanelDisabled = leftPanelDisabled;
 

dev/View/User/Settings/Pane.js

@@ -4,17 +4,11 @@ import { leftPanelDisabled } from 'Common/Globals';
 
 import MessageStore from 'Stores/User/Message';
 
-import { view, ViewType } from 'Knoin/Knoin';
+import { AbstractViewRight } from 'Knoin/AbstractViews';
-import { AbstractViewNext } from 'Knoin/AbstractViewNext';
 
-@view({
+class PaneSettingsUserView extends AbstractViewRight {
-	name: 'View/User/Settings/Pane',
-	type: ViewType.Right,
-	templateID: 'SettingsPane'
-})
-class PaneSettingsUserView extends AbstractViewNext {
 	constructor() {
-		super();
+		super('User/Settings/Pane', 'SettingsPane');
 
 		this.mobile = rl.settings.app('mobile');
 

dev/View/User/Settings/SystemDropDown.js

@@ -1,11 +1,10 @@
-import { view, ViewType } from 'Knoin/Knoin';
 import { AbstractSystemDropDownUserView } from 'View/User/AbstractSystemDropDown';
 
-@view({
+class SystemDropDownSettingsUserView extends AbstractSystemDropDownUserView
-	name: 'View/User/Settings/SystemDropDown',
+{
-	type: ViewType.Right,
+	constructor() {
-	templateID: 'SystemDropDown'
+		super('User/Settings/SystemDropDown');
-})
+	}
-class SystemDropDownSettingsUserView extends AbstractSystemDropDownUserView {}
+}
 
 export { SystemDropDownSettingsUserView };