Moved from master

dev/App/User.js

@@ -51,6 +51,7 @@ import { NotificationUserStore } from 'Stores/User/Notification';
 import { AccountUserStore } from 'Stores/User/Account';
 import { ContactUserStore } from 'Stores/User/Contact';
 import { IdentityUserStore } from 'Stores/User/Identity';
+import { TemplateUserStore } from 'Stores/User/Template';
 import { FolderUserStore } from 'Stores/User/Folder';
 import { PgpUserStore } from 'Stores/User/Pgp';
 import { MessageUserStore } from 'Stores/User/Message';
@@ -64,6 +65,7 @@ import Remote from 'Remote/User/Fetch';
 import { EmailModel } from 'Model/Email';
 import { AccountModel } from 'Model/Account';
 import { IdentityModel } from 'Model/Identity';
+import { TemplateModel } from 'Model/Template';
 import { OpenPgpKeyModel } from 'Model/OpenPgpKey';
 
 import { LoginUserScreen } from 'Screen/User/Login';
@@ -495,6 +497,24 @@ class AppUser extends AbstractApp {
 		});
 	}
 
+	templates() {
+		TemplateUserStore.templates.loading(true);
+
+		Remote.templates((iError, data) => {
+			TemplateUserStore.templates.loading(false);
+
+			if (!iError && isArray(data.Result.Templates)) {
+				delegateRunOnDestroy(TemplateUserStore.templates());
+
+				TemplateUserStore.templates(
+					data.Result.Templates.map(templateData =>
+						TemplateModel.reviveFromJson(templateData)
+					).filter(v => v)
+				);
+			}
+		});
+	}
+
 	quota() {
 		Remote.quota((iError, data) => {
 			if (

dev/Common/Enums.js

@@ -21,6 +21,7 @@ export const Capa = {
 	UserBackground: 'USER_BACKGROUND',
 	Sieve: 'SIEVE',
 	AttachmentThumbnails: 'ATTACHMENT_THUMBNAILS',
+	Templates: 'TEMPLATES',
 	AutoLogout: 'AUTOLOGOUT',
 	AdditionalAccounts: 'ADDITIONAL_ACCOUNTS',
 	Identities: 'IDENTITIES'

dev/Model/Template.js

@@ -0,0 +1,23 @@
+import ko from 'ko';
+
+import { AbstractModel } from 'Knoin/AbstractModel';
+
+export class TemplateModel extends AbstractModel {
+	/**
+	 * @param {string} id
+	 * @param {string} name
+	 * @param {string} body
+	 */
+	constructor(id = '', name = '', body = '') {
+		super();
+
+		this.id = id;
+		this.name = name;
+		this.body = body;
+		this.populated = true;
+
+		this.deleteAccess = ko.observable(false);
+	}
+
+//	static reviveFromJson(json) {}
+}

dev/Remote/User/Fetch.js

@@ -185,6 +185,47 @@ class RemoteUserFetch extends AbstractFetchRemote {
 		this.defaultRequest(fCallback, 'Filters', {});
 	}
 
+	/**
+	 * @param {?Function} fCallback
+	 */
+	templates(fCallback) {
+		this.defaultRequest(fCallback, 'Templates', {});
+	}
+
+	/**
+	 * @param {Function} fCallback
+	 * @param {string} sID
+	 */
+	templateGetById(fCallback, sID) {
+		this.defaultRequest(fCallback, 'TemplateGetByID', {
+			ID: sID
+		});
+	}
+
+	/**
+	 * @param {Function} fCallback
+	 * @param {string} sID
+	 */
+	templateDelete(fCallback, sID) {
+		this.defaultRequest(fCallback, 'TemplateDelete', {
+			IdToDelete: sID
+		});
+	}
+
+	/**
+	 * @param {Function} fCallback
+	 * @param {string} sID
+	 * @param {string} sName
+	 * @param {string} sBody
+	 */
+	templateSetup(fCallback, sID, sName, sBody) {
+		this.defaultRequest(fCallback, 'TemplateSetup', {
+			ID: sID,
+			Name: sName,
+			Body: sBody
+		});
+	}
+
 	/**
 	 * @param {Function} fCallback
 	 * @param {object} params

dev/Screen/User/Settings.js

@@ -14,6 +14,7 @@ import { ContactsUserSettings } from 'Settings/User/Contacts';
 import { AccountsUserSettings } from 'Settings/User/Accounts';
 import { FiltersUserSettings } from 'Settings/User/Filters';
 import { SecurityUserSettings } from 'Settings/User/Security';
+import { TemplatesUserSettings } from 'Settings/User/Templates';
 import { FoldersUserSettings } from 'Settings/User/Folders';
 import { ThemesUserSettings } from 'Settings/User/Themes';
 import { OpenPgpUserSettings } from 'Settings/User/OpenPgp';
@@ -67,6 +68,15 @@ export class SettingsUserScreen extends AbstractSettingsScreen {
 			settingsAddViewModel(SecurityUserSettings, 'SettingsSecurity', 'SETTINGS_LABELS/LABEL_SECURITY_NAME', 'security');
 		}
 
+		if (Settings.capa(Capa.Templates)) {
+			settingsAddViewModel(
+				TemplatesUserSettings,
+				'SettingsTemplates',
+				'SETTINGS_LABELS/LABEL_TEMPLATES_NAME',
+				'templates'
+			);
+		}
+
 		settingsAddViewModel(FoldersUserSettings, 'SettingsFolders', 'SETTINGS_LABELS/LABEL_FOLDERS_NAME', 'folders');
 
 		if (Settings.capa(Capa.Themes)) {

dev/Settings/Admin/General.js

@@ -48,6 +48,7 @@ export class GeneralAdminSettings {
 			capaAdditionalAccounts: Settings.capa(Capa.AdditionalAccounts),
 			capaIdentities: Settings.capa(Capa.Identities),
 			capaAttachmentThumbnails: Settings.capa(Capa.AttachmentThumbnails),
+			capaTemplates: Settings.capa(Capa.Templates),
 			dataFolderAccess: false
 		});
 
@@ -125,6 +126,8 @@ export class GeneralAdminSettings {
 
 			capaIdentities: fSaveBoolHelper('CapaIdentities'),
 
+			capaTemplates: fSaveBoolHelper('CapaTemplates'),
+
 			capaAttachmentThumbnails: fSaveBoolHelper('CapaAttachmentThumbnails'),
 
 			capaThemes: fSaveBoolHelper('CapaThemes'),

dev/Settings/User/Templates.js

@@ -0,0 +1,62 @@
+import ko from 'ko';
+
+import { i18n } from 'Common/Translator';
+
+import { TemplateUserStore } from 'Stores/User/Template';
+import Remote from 'Remote/User/Fetch';
+
+import { showScreenPopup } from 'Knoin/Knoin';
+
+import { TemplatePopupView } from 'View/Popup/Template';
+import { addComputablesTo } from 'Common/Utils';
+
+export class TemplatesUserSettings {
+	constructor() {
+		this.templates = TemplateUserStore.templates;
+
+		addComputablesTo(this, {
+			processText: () => TemplateUserStore.templates.loading() ? i18n('SETTINGS_TEMPLETS/LOADING_PROCESS') : '',
+
+			visibility: () => this.processText() ? 'visible' : 'hidden'
+		});
+
+		this.templateForDeletion = ko.observable(null).deleteAccessHelper();
+	}
+
+	addNewTemplate() {
+		showScreenPopup(TemplatePopupView);
+	}
+
+	editTemplate(oTemplateItem) {
+		if (oTemplateItem) {
+			showScreenPopup(TemplatePopupView, [oTemplateItem]);
+		}
+	}
+
+	deleteTemplate(templateToRemove) {
+		if (templateToRemove && templateToRemove.deleteAccess()) {
+			this.templateForDeletion(null);
+
+			if (templateToRemove) {
+				this.templates.remove((template) => templateToRemove === template);
+
+				Remote.templateDelete(() => {
+					this.reloadTemplates();
+				}, templateToRemove.id);
+			}
+		}
+	}
+
+	reloadTemplates() {
+		rl.app.templates();
+	}
+
+	onBuild(oDom) {
+		oDom.addEventListener('click', event => {
+			const el = event.target.closestWithin('td.e-action', oDom);
+			el && ko.dataFor(el) && this.editTemplate(ko.dataFor(el));
+		});
+
+		this.reloadTemplates();
+	}
+}

dev/Stores/User/Template.js

@@ -0,0 +1,28 @@
+import ko from 'ko';
+
+// import Remote from 'Remote/User/Fetch';
+
+export const TemplateUserStore = new class {
+	constructor() {
+		this.templates = ko.observableArray();
+		this.templates.loading = ko.observable(false).extend({ debounce: 100 });
+
+		this.templatesNames = ko.observableArray().extend({ debounce: 1000 });
+		this.templatesNames.skipFirst = true;
+
+		this.templates.subscribe((list) => {
+			this.templatesNames(list.map(item => (item ? item.name : null)).filter(v => v));
+		});
+
+		// this.templatesNames.subscribe((aList) => {
+		// 	if (this.templatesNames.skipFirst)
+		// 	{
+		// 		this.templatesNames.skipFirst = false;
+		// 	}
+		// 	else if (aList && aList.length)
+		// 	{
+		// 		Remote.templatesSortOrder(null, aList);
+		// 	}
+		// });
+	}
+};

dev/Styles/@Main.less

@@ -33,6 +33,7 @@
 @import "User/Shortcuts.less";
 @import "User/FolderList.less";
 @import "User/Filter.less";
+@import "User/Template.less";
 @import "User/OpenPgpKey.less";
 @import "User/Identity.less";
 @import "User/AdvancedSearch.less";
@@ -46,6 +47,7 @@
 @import "User/Settings.less";
 @import "User/SettingsGeneral.less";
 @import "User/SettingsAccounts.less";
+@import "User/SettingsTemplates.less";
 @import "User/SettingsOpenPGP.less";
 @import "User/SettingsFolders.less";
 @import "User/SettingsThemes.less";

dev/Styles/User/SettingsTemplates.less

@@ -0,0 +1,21 @@
+
+.b-settings-templates {
+
+	td + td {
+		width: 150px;
+	}
+	td + td + td {
+		width: 1%;
+	}
+
+	.template-name {
+		display: inline-block;
+		line-height: 22px;
+		word-break: break-all;
+	}
+
+	.delete-template {
+		cursor: pointer;
+		opacity: 0.5;
+	}
+}

dev/Styles/User/Template.less

@@ -0,0 +1,10 @@
+.b-template-add-content {
+
+	&.modal {
+		max-width: 750px;
+	}
+
+	.e-template-place {
+		height: 300px;
+	}
+}

dev/View/Popup/Template.js

@@ -0,0 +1,148 @@
+import { getNotification } from 'Common/Translator';
+import { HtmlEditor } from 'Common/Html';
+
+import Remote from 'Remote/User/Fetch';
+
+import { decorateKoCommands } from 'Knoin/Knoin';
+import { AbstractViewPopup } from 'Knoin/AbstractViews';
+import { TemplateModel } from 'Model/Template';
+
+class TemplatePopupView extends AbstractViewPopup {
+	constructor() {
+		super('Template');
+
+		this.editor = null;
+
+		this.addObservables({
+			signatureDom: null,
+
+			id: '',
+
+			name: '',
+			nameError: false,
+
+			body: '',
+			bodyLoading: false,
+			bodyError: false,
+
+			submitRequest: false,
+			submitError: ''
+		});
+
+		this.name.subscribe(() =>  this.nameError(false));
+
+		this.body.subscribe(() => this.bodyError(false));
+
+		decorateKoCommands(this, {
+			addTemplateCommand: self => !self.submitRequest()
+		});
+	}
+
+	addTemplateCommand() {
+		this.populateBodyFromEditor();
+
+		this.nameError(!this.name().trim());
+		this.bodyError(!this.body().trim() || ':HTML:' === this.body().trim());
+
+		if (this.nameError() || this.bodyError()) {
+			return false;
+		}
+
+		this.submitRequest(true);
+
+		Remote.templateSetup(
+			iError => {
+				this.submitRequest(false);
+				if (iError) {
+					this.submitError(getNotification(iError));
+				} else {
+					rl.app.templates();
+					this.cancelCommand();
+				}
+			},
+			this.id(),
+			this.name(),
+			this.body()
+		);
+
+		return true;
+	}
+
+	clearPopup() {
+		this.id('');
+
+		this.name('');
+		this.nameError(false);
+
+		this.body('');
+		this.bodyLoading(false);
+		this.bodyError(false);
+
+		this.submitRequest(false);
+		this.submitError('');
+
+		if (this.editor) {
+			this.editor.setPlain('');
+		}
+	}
+
+	populateBodyFromEditor() {
+		if (this.editor) {
+			this.body(this.editor.getDataWithHtmlMark());
+		}
+	}
+
+	editorSetBody(sBody) {
+		if (!this.editor && this.signatureDom()) {
+			this.editor = new HtmlEditor(
+				this.signatureDom(),
+				() => this.populateBodyFromEditor(),
+				() => this.editor.setHtmlOrPlain(sBody)
+			);
+		} else {
+			this.editor.setHtmlOrPlain(sBody);
+		}
+	}
+
+	onShow(template) {
+		this.clearPopup();
+
+		if (template && template.id) {
+			this.id(template.id);
+			this.name(template.name);
+			this.body(template.body);
+
+			if (template.populated) {
+				this.editorSetBody(this.body());
+			} else {
+				this.bodyLoading(true);
+				this.bodyError(false);
+
+				Remote.templateGetById((iError, data) => {
+					this.bodyLoading(false);
+
+					if (
+						!iError &&
+						TemplateModel.validJson(data.Result) &&
+						null != data.Result.Body
+					) {
+						template.body = data.Result.Body;
+						template.populated = true;
+
+						this.body(template.body);
+						this.bodyError(false);
+					} else {
+						this.body('');
+						this.bodyError(true);
+					}
+
+					this.editorSetBody(this.body());
+				}, this.id());
+			}
+		} else {
+			this.editorSetBody('');
+		}
+	}
+}
+
+export { TemplatePopupView, TemplatePopupView as default };