mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-07-13 03:27:39 +03:00
Cleanup component models
This commit is contained in:
parent
536a9d20fd
commit
5748dea4bc
6 changed files with 71 additions and 105 deletions
|
|
@ -1,14 +0,0 @@
|
||||||
|
|
||||||
export class AbstractComponent {
|
|
||||||
constructor() {
|
|
||||||
this.disposable = [];
|
|
||||||
}
|
|
||||||
|
|
||||||
dispose() {
|
|
||||||
this.disposable.forEach((funcToDispose) => {
|
|
||||||
if (funcToDispose && funcToDispose.dispose) {
|
|
||||||
funcToDispose.dispose();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,13 +1,10 @@
|
||||||
import ko from 'ko';
|
import ko from 'ko';
|
||||||
import { AbstractComponent } from 'Component/Abstract';
|
|
||||||
|
|
||||||
class AbstractCheckbox extends AbstractComponent {
|
export class AbstractCheckbox {
|
||||||
/**
|
/**
|
||||||
* @param {Object} params = {}
|
* @param {Object} params = {}
|
||||||
*/
|
*/
|
||||||
constructor(params = {}) {
|
constructor(params = {}) {
|
||||||
super();
|
|
||||||
|
|
||||||
this.value = ko.isObservable(params.value) ? params.value
|
this.value = ko.isObservable(params.value) ? params.value
|
||||||
: ko.observable(!!params.value);
|
: ko.observable(!!params.value);
|
||||||
|
|
||||||
|
|
@ -24,5 +21,3 @@ class AbstractCheckbox extends AbstractComponent {
|
||||||
this.enable() && this.value(!this.value());
|
this.enable() && this.value(!this.value());
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export { AbstractCheckbox };
|
|
||||||
|
|
|
||||||
|
|
@ -1,16 +1,14 @@
|
||||||
import ko from 'ko';
|
import ko from 'ko';
|
||||||
import { pInt } from 'Common/Utils';
|
import { pInt } from 'Common/Utils';
|
||||||
import { SaveSettingsStep } from 'Common/Enums';
|
import { SaveSettingsStep } from 'Common/Enums';
|
||||||
import { AbstractComponent } from 'Component/Abstract';
|
|
||||||
import { koComputable } from 'External/ko';
|
import { koComputable } from 'External/ko';
|
||||||
|
import { dispose } from 'External/ko';
|
||||||
|
|
||||||
class AbstractInput extends AbstractComponent {
|
export class AbstractInput {
|
||||||
/**
|
/**
|
||||||
* @param {Object} params
|
* @param {Object} params
|
||||||
*/
|
*/
|
||||||
constructor(params) {
|
constructor(params) {
|
||||||
super();
|
|
||||||
|
|
||||||
this.value = params.value || '';
|
this.value = params.value || '';
|
||||||
this.label = params.label || '';
|
this.label = params.label || '';
|
||||||
this.enable = null == params.enable ? true : params.enable;
|
this.enable = null == params.enable ? true : params.enable;
|
||||||
|
|
@ -43,13 +41,17 @@ class AbstractInput extends AbstractComponent {
|
||||||
(size + ' settings-saved-trigger-input ' + classForTrigger()).trim()
|
(size + ' settings-saved-trigger-input ' + classForTrigger()).trim()
|
||||||
);
|
);
|
||||||
|
|
||||||
this.disposable.push(this.trigger.subscribe(setTriggerState, this));
|
this.disposable = [
|
||||||
|
this.trigger.subscribe(setTriggerState, this),
|
||||||
|
this.className
|
||||||
|
];
|
||||||
} else {
|
} else {
|
||||||
this.className = size;
|
this.className = size;
|
||||||
|
this.disposable = [];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.disposable.push(this.className);
|
dispose() {
|
||||||
|
this.disposable.forEach(dispose);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export { AbstractInput };
|
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,4 @@
|
||||||
import { doc, createElement } from 'Common/Globals';
|
import { doc, createElement } from 'Common/Globals';
|
||||||
import { isArray } from 'Common/Utils';
|
|
||||||
import { EmailModel } from 'Model/Email';
|
import { EmailModel } from 'Model/Email';
|
||||||
|
|
||||||
const contentType = 'snappymail/emailaddress',
|
const contentType = 'snappymail/emailaddress',
|
||||||
|
|
@ -17,7 +16,7 @@ export class EmailAddressesComponent {
|
||||||
doc.body.append(datalist);
|
doc.body.append(datalist);
|
||||||
}
|
}
|
||||||
|
|
||||||
var self = this,
|
const self = this,
|
||||||
// In Chrome we have no access to dataTransfer.getData unless it's the 'drop' event
|
// In Chrome we have no access to dataTransfer.getData unless it's the 'drop' event
|
||||||
// In Chrome Mobile dataTransfer.types.includes(contentType) fails, only text/plain is set
|
// In Chrome Mobile dataTransfer.types.includes(contentType) fails, only text/plain is set
|
||||||
validDropzone = () => dragAddress && dragAddress.li.parentNode !== self.ul,
|
validDropzone = () => dragAddress && dragAddress.li.parentNode !== self.ul,
|
||||||
|
|
@ -138,20 +137,56 @@ export class EmailAddressesComponent {
|
||||||
|
|
||||||
_parseValue(val) {
|
_parseValue(val) {
|
||||||
if (val) {
|
if (val) {
|
||||||
var self = this,
|
const self = this,
|
||||||
values = [];
|
v = val.trim(),
|
||||||
|
hook = (v && [',', ';', '\n'].includes(v.slice(-1))) ? EmailModel.splitEmailLine(val) : null,
|
||||||
const v = val.trim(),
|
|
||||||
hook = (v && [',', ';', '\n'].includes(v.slice(-1)))
|
|
||||||
? EmailModel.splitEmailLine(val)
|
|
||||||
: null;
|
|
||||||
|
|
||||||
values = (hook || [val]).map(value => EmailModel.parseEmailLine(value))
|
values = (hook || [val]).map(value => EmailModel.parseEmailLine(value))
|
||||||
.flat(Infinity)
|
.flat(Infinity)
|
||||||
.map(item => (item.toLine ? [item.toLine(false), item] : [item, null]));
|
.map(item => (item.toLine ? [item.toLine(false), item] : [item, null]));
|
||||||
|
|
||||||
if (values.length) {
|
if (values.length) {
|
||||||
self._setChosen(values);
|
values.forEach(a => {
|
||||||
|
var v = a[0].trim(),
|
||||||
|
exists = false,
|
||||||
|
lastIndex = -1,
|
||||||
|
obj = {
|
||||||
|
key : '',
|
||||||
|
obj : null,
|
||||||
|
value : ''
|
||||||
|
};
|
||||||
|
|
||||||
|
self._chosenValues.forEach((vv, kk) => {
|
||||||
|
if (vv.value === self._lastEdit) {
|
||||||
|
lastIndex = kk;
|
||||||
|
}
|
||||||
|
|
||||||
|
vv.value === v && (exists = true);
|
||||||
|
});
|
||||||
|
|
||||||
|
if (v !== '' && a[1] && !exists) {
|
||||||
|
|
||||||
|
obj.key = 'mi_' + Math.random().toString( 16 ).slice( 2, 10 );
|
||||||
|
obj.value = v;
|
||||||
|
obj.obj = a[1];
|
||||||
|
|
||||||
|
if (-1 < lastIndex) {
|
||||||
|
self._chosenValues.splice(lastIndex, 0, obj);
|
||||||
|
} else {
|
||||||
|
self._chosenValues.push(obj);
|
||||||
|
}
|
||||||
|
|
||||||
|
self._lastEdit = '';
|
||||||
|
self._renderTags();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if (values.length === 1 && values[0] === '' && self._lastEdit !== '') {
|
||||||
|
self._lastEdit = '';
|
||||||
|
self._renderTags();
|
||||||
|
}
|
||||||
|
|
||||||
|
self._setValue(self._buildValue());
|
||||||
|
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -202,56 +237,6 @@ export class EmailAddressesComponent {
|
||||||
self._resizeInput(ev);
|
self._resizeInput(ev);
|
||||||
}
|
}
|
||||||
|
|
||||||
_setChosen(valArr) {
|
|
||||||
var self = this;
|
|
||||||
|
|
||||||
if (!isArray(valArr)){
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
valArr.forEach(a => {
|
|
||||||
var v = a[0].trim(),
|
|
||||||
exists = false,
|
|
||||||
lastIndex = -1,
|
|
||||||
obj = {
|
|
||||||
key : '',
|
|
||||||
obj : null,
|
|
||||||
value : ''
|
|
||||||
};
|
|
||||||
|
|
||||||
self._chosenValues.forEach((vv, kk) => {
|
|
||||||
if (vv.value === self._lastEdit) {
|
|
||||||
lastIndex = kk;
|
|
||||||
}
|
|
||||||
|
|
||||||
vv.value === v && (exists = true);
|
|
||||||
});
|
|
||||||
|
|
||||||
if (v !== '' && a && a[1] && !exists) {
|
|
||||||
|
|
||||||
obj.key = 'mi_' + Math.random().toString( 16 ).slice( 2, 10 );
|
|
||||||
obj.value = v;
|
|
||||||
obj.obj = a[1];
|
|
||||||
|
|
||||||
if (-1 < lastIndex) {
|
|
||||||
self._chosenValues.splice(lastIndex, 0, obj);
|
|
||||||
} else {
|
|
||||||
self._chosenValues.push(obj);
|
|
||||||
}
|
|
||||||
|
|
||||||
self._lastEdit = '';
|
|
||||||
self._renderTags();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
if (valArr.length === 1 && valArr[0] === '' && self._lastEdit !== '') {
|
|
||||||
self._lastEdit = '';
|
|
||||||
self._renderTags();
|
|
||||||
}
|
|
||||||
|
|
||||||
self._setValue(self._buildValue());
|
|
||||||
}
|
|
||||||
|
|
||||||
_buildValue() {
|
_buildValue() {
|
||||||
return this._chosenValues.map(v => v.value).join(',');
|
return this._chosenValues.map(v => v.value).join(',');
|
||||||
}
|
}
|
||||||
|
|
|
||||||
7
dev/External/ko.js
vendored
7
dev/External/ko.js
vendored
|
|
@ -3,12 +3,15 @@ import { doc, createElement } from 'Common/Globals';
|
||||||
import { SaveSettingsStep } from 'Common/Enums';
|
import { SaveSettingsStep } from 'Common/Enums';
|
||||||
import { arrayLength, isFunction } from 'Common/Utils';
|
import { arrayLength, isFunction } from 'Common/Utils';
|
||||||
|
|
||||||
/**
|
export const
|
||||||
|
/**
|
||||||
* The value of the pureComputed observable shouldn’t vary based on the
|
* The value of the pureComputed observable shouldn’t vary based on the
|
||||||
* number of evaluations or other “hidden” information. Its value should be
|
* number of evaluations or other “hidden” information. Its value should be
|
||||||
* based solely on the values of other observables in the application
|
* based solely on the values of other observables in the application
|
||||||
*/
|
*/
|
||||||
export const koComputable = fn => ko.computed(fn, {'pure':true});
|
koComputable = fn => ko.computed(fn, {'pure':true}),
|
||||||
|
|
||||||
|
dispose = disposable => disposable && isFunction(disposable.dispose) && disposable.dispose();
|
||||||
|
|
||||||
ko.bindingHandlers.tooltipErrorTip = {
|
ko.bindingHandlers.tooltipErrorTip = {
|
||||||
init: (element, fValueAccessor) => {
|
init: (element, fValueAccessor) => {
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,5 @@
|
||||||
import { isArray, isFunction, addObservablesTo, addComputablesTo, forEachObjectValue, forEachObjectEntry } from 'Common/Utils';
|
import { isArray, addObservablesTo, addComputablesTo, forEachObjectValue, forEachObjectEntry } from 'Common/Utils';
|
||||||
|
import { dispose } from 'External/ko';
|
||||||
function dispose(disposable) {
|
|
||||||
if (disposable && isFunction(disposable.dispose)) {
|
|
||||||
disposable.dispose();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function typeCast(curValue, newValue) {
|
function typeCast(curValue, newValue) {
|
||||||
if (null != curValue) {
|
if (null != curValue) {
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue