2016-08-17 06:01:20 +08:00
|
|
|
import ko from 'ko';
|
|
|
|
|
2021-03-16 17:59:47 +08:00
|
|
|
import { inFocus, addObservablesTo, addComputablesTo, addSubscribablesTo } from 'Common/Utils';
|
2021-03-16 23:06:16 +08:00
|
|
|
import { Scope } from 'Common/Enums';
|
2020-07-15 20:25:51 +08:00
|
|
|
import { keyScope } from 'Common/Globals';
|
2021-01-24 17:25:23 +08:00
|
|
|
import { ViewType } from 'Knoin/Knoin';
|
2016-08-17 06:01:20 +08:00
|
|
|
|
2021-01-24 17:25:23 +08:00
|
|
|
class AbstractView {
|
2021-09-23 15:41:02 +08:00
|
|
|
constructor(templateID, type)
|
2021-01-24 17:25:23 +08:00
|
|
|
{
|
2021-10-11 20:31:54 +08:00
|
|
|
// Object.defineProperty(this, 'viewModelTemplateID', { value: templateID });
|
|
|
|
this.viewModelTemplateID = templateID;
|
2021-09-23 02:17:44 +08:00
|
|
|
this.viewType = type;
|
|
|
|
this.viewModelDom = null;
|
2021-03-16 23:06:16 +08:00
|
|
|
|
|
|
|
this.modalVisibility = ko.observable(false).extend({ rateLimit: 0 });
|
|
|
|
|
2021-09-23 02:17:44 +08:00
|
|
|
this.keyScope = {
|
|
|
|
scope: Scope.None,
|
|
|
|
previous: Scope.None,
|
|
|
|
set: function() {
|
|
|
|
this.previous = keyScope();
|
|
|
|
keyScope(this.scope);
|
|
|
|
},
|
|
|
|
unset: function() {
|
|
|
|
keyScope(this.previous);
|
|
|
|
}
|
|
|
|
};
|
2016-08-17 06:01:20 +08:00
|
|
|
}
|
|
|
|
|
2021-09-23 02:17:44 +08:00
|
|
|
/*
|
|
|
|
onBuild() {}
|
|
|
|
onBeforeShow() {}
|
|
|
|
onShow() {}
|
|
|
|
onHide() {}
|
|
|
|
*/
|
2016-08-17 06:01:20 +08:00
|
|
|
|
2021-01-24 17:25:23 +08:00
|
|
|
querySelector(selectors) {
|
|
|
|
return this.viewModelDom.querySelector(selectors);
|
|
|
|
}
|
|
|
|
|
|
|
|
addObservables(observables) {
|
2021-03-16 17:59:47 +08:00
|
|
|
addObservablesTo(this, observables);
|
2021-01-24 17:25:23 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
addComputables(computables) {
|
2021-03-16 17:59:47 +08:00
|
|
|
addComputablesTo(this, computables);
|
2021-01-24 17:25:23 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
addSubscribables(subscribables) {
|
2021-03-16 17:59:47 +08:00
|
|
|
addSubscribablesTo(this, subscribables);
|
2021-01-24 17:25:23 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
export class AbstractViewPopup extends AbstractView
|
|
|
|
{
|
|
|
|
constructor(name)
|
|
|
|
{
|
2021-09-23 15:41:02 +08:00
|
|
|
super('Popups' + name, ViewType.Popup);
|
2021-03-16 23:06:16 +08:00
|
|
|
if (name in Scope) {
|
2021-09-23 02:17:44 +08:00
|
|
|
this.keyScope.scope = Scope[name];
|
2021-03-16 23:06:16 +08:00
|
|
|
}
|
2021-09-22 19:37:12 +08:00
|
|
|
this.bDisabeCloseOnEsc = false;
|
2021-01-24 17:25:23 +08:00
|
|
|
}
|
2021-07-16 15:11:10 +08:00
|
|
|
/*
|
2021-09-23 02:17:44 +08:00
|
|
|
onShowWithDelay() {}
|
|
|
|
onHideWithDelay() {}
|
|
|
|
|
2021-07-16 15:11:10 +08:00
|
|
|
cancelCommand() {}
|
|
|
|
closeCommand() {}
|
|
|
|
*/
|
2016-08-17 06:01:20 +08:00
|
|
|
/**
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
|
|
|
registerPopupKeyDown() {
|
2020-09-17 23:47:35 +08:00
|
|
|
addEventListener('keydown', event => {
|
2021-09-01 17:02:51 +08:00
|
|
|
if (event && this.modalVisibility()) {
|
2020-09-17 23:47:35 +08:00
|
|
|
if (!this.bDisabeCloseOnEsc && 'Escape' == event.key) {
|
2021-07-16 15:11:10 +08:00
|
|
|
this.cancelCommand();
|
2016-08-17 06:01:20 +08:00
|
|
|
return false;
|
2020-09-17 23:47:35 +08:00
|
|
|
} else if ('Backspace' == event.key && !inFocus()) {
|
2016-08-17 06:01:20 +08:00
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return true;
|
|
|
|
});
|
|
|
|
}
|
2021-01-24 17:25:23 +08:00
|
|
|
}
|
2016-08-17 06:01:20 +08:00
|
|
|
|
2021-01-24 17:25:23 +08:00
|
|
|
export class AbstractViewCenter extends AbstractView
|
|
|
|
{
|
2021-09-23 15:41:02 +08:00
|
|
|
constructor(templateID)
|
2021-01-24 17:25:23 +08:00
|
|
|
{
|
2021-09-23 15:41:02 +08:00
|
|
|
super(templateID, ViewType.Content);
|
2020-10-26 19:54:03 +08:00
|
|
|
}
|
2021-01-24 17:25:23 +08:00
|
|
|
}
|
2020-10-26 19:54:03 +08:00
|
|
|
|
2021-01-24 17:25:23 +08:00
|
|
|
export class AbstractViewLeft extends AbstractView
|
|
|
|
{
|
2021-09-23 15:41:02 +08:00
|
|
|
constructor(templateID)
|
2021-01-24 17:25:23 +08:00
|
|
|
{
|
2021-09-23 15:41:02 +08:00
|
|
|
super(templateID, ViewType.Left);
|
2020-10-26 19:54:03 +08:00
|
|
|
}
|
2021-01-24 17:25:23 +08:00
|
|
|
}
|
2020-10-26 19:54:03 +08:00
|
|
|
|
2021-01-24 17:25:23 +08:00
|
|
|
export class AbstractViewRight extends AbstractView
|
|
|
|
{
|
2021-09-23 15:41:02 +08:00
|
|
|
constructor(templateID)
|
2021-01-24 17:25:23 +08:00
|
|
|
{
|
2021-09-23 15:41:02 +08:00
|
|
|
super(templateID, ViewType.Right);
|
2020-10-26 19:54:03 +08:00
|
|
|
}
|
2016-08-17 06:01:20 +08:00
|
|
|
}
|
2021-09-23 02:17:44 +08:00
|
|
|
|
|
|
|
/*
|
|
|
|
export class AbstractViewSettings
|
|
|
|
{
|
|
|
|
onBuild(viewModelDom) {}
|
|
|
|
onBeforeShow() {}
|
|
|
|
onShow() {}
|
|
|
|
onHide() {}
|
|
|
|
viewModelDom
|
|
|
|
}
|
|
|
|
*/
|