2016-09-13 04:50:21 +08:00
|
|
|
import ko from 'ko';
|
2016-06-07 05:57:52 +08:00
|
|
|
|
|
|
|
import {
|
2021-01-27 07:26:31 +08:00
|
|
|
doc,
|
2020-07-15 20:25:51 +08:00
|
|
|
$htmlCL,
|
2019-07-05 03:19:24 +08:00
|
|
|
leftPanelDisabled,
|
2021-01-27 07:26:31 +08:00
|
|
|
Settings
|
2016-06-07 05:57:52 +08:00
|
|
|
} from 'Common/Globals';
|
|
|
|
|
2020-08-14 04:58:41 +08:00
|
|
|
import { KeyState } from 'Common/Enums';
|
2021-01-27 19:02:37 +08:00
|
|
|
import { logoutLink } from 'Common/Links';
|
2021-01-27 17:59:15 +08:00
|
|
|
import { i18nToNodes, initOnStartOrLangChange } from 'Common/Translator';
|
2015-11-19 01:32:29 +08:00
|
|
|
|
2021-01-27 17:59:15 +08:00
|
|
|
import { LanguageStore } from 'Stores/Language';
|
2021-01-27 07:26:31 +08:00
|
|
|
import { ThemeStore } from 'Stores/Theme';
|
2016-09-13 04:50:21 +08:00
|
|
|
|
2021-01-27 17:59:15 +08:00
|
|
|
import { InputComponent } from 'Component/Input';
|
|
|
|
import { SelectComponent } from 'Component/Select';
|
|
|
|
import { TextAreaComponent } from 'Component/TextArea';
|
|
|
|
import { CheckboxMaterialDesignComponent } from 'Component/MaterialDesign/Checkbox';
|
|
|
|
import { CheckboxComponent } from 'Component/Checkbox';
|
2021-01-26 05:00:13 +08:00
|
|
|
|
2021-01-22 23:32:08 +08:00
|
|
|
export class AbstractApp {
|
2014-08-20 23:03:12 +08:00
|
|
|
/**
|
2014-09-02 08:15:31 +08:00
|
|
|
* @param {RemoteStorage|AdminRemoteStorage} Remote
|
2014-08-20 23:03:12 +08:00
|
|
|
*/
|
2021-01-26 05:00:13 +08:00
|
|
|
constructor(Remote) {
|
|
|
|
this.Remote = Remote;
|
|
|
|
|
2020-10-15 20:43:04 +08:00
|
|
|
const refresh = (()=>dispatchEvent(new CustomEvent('rl.auto-logout-refresh'))).debounce(5000),
|
|
|
|
fn = (ev=>{
|
|
|
|
$htmlCL.toggle('rl-ctrl-key-pressed', ev.ctrlKey);
|
|
|
|
refresh();
|
|
|
|
}).debounce(500);
|
|
|
|
|
|
|
|
// doc.addEventListener('touchstart', fn, {passive:true});
|
|
|
|
['mousedown','keydown','keyup'/*,'mousemove'*/].forEach(t => doc.addEventListener(t, fn));
|
2015-03-16 05:58:50 +08:00
|
|
|
|
2020-09-26 16:20:24 +08:00
|
|
|
shortcuts.add('escape,enter', '', KeyState.All, () => rl.Dropdowns.detectVisibility());
|
2013-11-16 06:21:12 +08:00
|
|
|
}
|
|
|
|
|
2015-11-19 01:32:29 +08:00
|
|
|
remote() {
|
2014-08-22 23:08:56 +08:00
|
|
|
return null;
|
2015-11-19 01:32:29 +08:00
|
|
|
}
|
2014-08-22 23:08:56 +08:00
|
|
|
|
2014-08-20 23:03:12 +08:00
|
|
|
/**
|
2015-11-19 01:32:29 +08:00
|
|
|
* @param {string} link
|
2016-06-30 08:02:45 +08:00
|
|
|
* @returns {boolean}
|
2014-08-20 23:03:12 +08:00
|
|
|
*/
|
2015-11-19 01:32:29 +08:00
|
|
|
download(link) {
|
2021-01-27 07:26:31 +08:00
|
|
|
if (Settings.app('mobile')) {
|
2020-08-12 06:25:36 +08:00
|
|
|
open(link, '_self');
|
|
|
|
focus();
|
2019-07-05 03:19:24 +08:00
|
|
|
} else {
|
2020-10-15 20:43:04 +08:00
|
|
|
const oLink = doc.createElement('a');
|
2020-07-17 01:49:56 +08:00
|
|
|
oLink.href = link;
|
2020-10-15 20:43:04 +08:00
|
|
|
doc.body.appendChild(oLink).click();
|
2020-07-17 01:49:56 +08:00
|
|
|
oLink.remove();
|
2014-08-20 23:03:12 +08:00
|
|
|
}
|
|
|
|
return true;
|
2015-11-19 01:32:29 +08:00
|
|
|
}
|
2014-10-31 04:09:53 +08:00
|
|
|
|
2015-05-06 00:41:15 +08:00
|
|
|
/**
|
2016-04-21 01:12:51 +08:00
|
|
|
* @param {string} token
|
2015-05-06 00:41:15 +08:00
|
|
|
*/
|
2016-04-21 01:12:51 +08:00
|
|
|
setClientSideToken(token) {
|
2020-09-04 18:05:17 +08:00
|
|
|
rl.hash.set();
|
|
|
|
Settings.set('AuthAccountHash', token);
|
2015-11-19 01:32:29 +08:00
|
|
|
}
|
2015-05-06 00:41:15 +08:00
|
|
|
|
2020-09-04 20:36:24 +08:00
|
|
|
logoutReload(close = false) {
|
2021-01-27 19:02:37 +08:00
|
|
|
const url = logoutLink();
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2020-09-04 20:36:24 +08:00
|
|
|
rl.hash.clear();
|
|
|
|
close && window.close && window.close();
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2021-01-27 19:02:37 +08:00
|
|
|
if (location.href !== url) {
|
|
|
|
setTimeout(() => (Settings.app('inIframe') ? parent : window).location.href = url, 100);
|
2019-07-05 03:19:24 +08:00
|
|
|
} else {
|
2020-09-17 02:35:29 +08:00
|
|
|
rl.route.reload();
|
2014-08-20 23:03:12 +08:00
|
|
|
}
|
2015-11-19 01:32:29 +08:00
|
|
|
}
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2015-11-19 01:32:29 +08:00
|
|
|
bootstart() {
|
2021-01-27 07:26:31 +08:00
|
|
|
const mobile = Settings.app('mobile'),
|
2021-01-27 17:59:15 +08:00
|
|
|
register = (key, ClassObject, templateID) => ko.components.register(key, {
|
|
|
|
template: { element: templateID || (key + 'Component') },
|
|
|
|
viewModel: {
|
|
|
|
createViewModel: (params, componentInfo) => {
|
|
|
|
params = params || {};
|
|
|
|
params.element = null;
|
|
|
|
|
|
|
|
if (componentInfo && componentInfo.element) {
|
|
|
|
params.component = componentInfo;
|
|
|
|
params.element = componentInfo.element;
|
|
|
|
|
|
|
|
i18nToNodes(componentInfo.element);
|
|
|
|
|
|
|
|
if (undefined !== params.inline && ko.unwrap(params.inline)) {
|
|
|
|
params.element.style.display = 'inline-block';
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return new ClassObject(params);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
2021-01-27 07:26:31 +08:00
|
|
|
|
|
|
|
register('Input', InputComponent);
|
|
|
|
register('Select', SelectComponent);
|
|
|
|
register('TextArea', TextAreaComponent);
|
2021-01-27 17:59:15 +08:00
|
|
|
register('CheckboxSimple', CheckboxComponent, 'CheckboxComponent');
|
|
|
|
if (mobile || !Settings.app('materialDesign')) {
|
|
|
|
register('Checkbox', CheckboxComponent);
|
|
|
|
} else {
|
|
|
|
register('Checkbox', CheckboxMaterialDesignComponent, 'CheckboxMaterialDesignComponent');
|
|
|
|
}
|
2014-08-20 23:03:12 +08:00
|
|
|
|
2021-01-04 19:08:41 +08:00
|
|
|
initOnStartOrLangChange();
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2021-01-27 07:26:31 +08:00
|
|
|
if (mobile) {
|
2020-08-15 02:35:39 +08:00
|
|
|
leftPanelDisabled(true);
|
2021-01-27 07:26:31 +08:00
|
|
|
} else {
|
|
|
|
window.addEventListener('resize', () => leftPanelDisabled(767 >= window.innerWidth));
|
2016-05-01 09:07:10 +08:00
|
|
|
}
|
|
|
|
|
2016-06-07 05:57:52 +08:00
|
|
|
leftPanelDisabled.valueHasMutated();
|
2016-04-29 04:32:54 +08:00
|
|
|
|
2016-09-13 04:50:21 +08:00
|
|
|
LanguageStore.populate();
|
|
|
|
ThemeStore.populate();
|
2016-04-21 01:12:51 +08:00
|
|
|
}
|
2020-09-17 05:19:34 +08:00
|
|
|
|
|
|
|
/**
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
|
|
|
hideLoading() {
|
2020-10-15 20:43:04 +08:00
|
|
|
const id = id => doc.getElementById(id);
|
2020-09-17 05:19:34 +08:00
|
|
|
id('rl-content').hidden = false;
|
|
|
|
id('rl-loading').remove();
|
|
|
|
}
|
|
|
|
|
2015-11-19 01:32:29 +08:00
|
|
|
}
|