2016-08-17 06:01:20 +08:00
|
|
|
import ko from 'ko';
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2021-01-26 05:00:13 +08:00
|
|
|
import { convertLangName } from 'Common/Translator';
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2021-01-24 17:25:23 +08:00
|
|
|
import { AbstractViewPopup } from 'Knoin/AbstractViews';
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2021-01-24 17:25:23 +08:00
|
|
|
class LanguagesPopupView extends AbstractViewPopup {
|
2016-08-17 06:01:20 +08:00
|
|
|
constructor() {
|
2021-01-24 17:25:23 +08:00
|
|
|
super('Languages');
|
2016-08-17 06:01:20 +08:00
|
|
|
|
|
|
|
this.fLang = null;
|
|
|
|
this.userLanguage = ko.observable('');
|
|
|
|
|
2021-01-22 19:23:20 +08:00
|
|
|
this.langs = ko.observableArray();
|
2016-08-17 06:01:20 +08:00
|
|
|
|
|
|
|
this.languages = ko.computed(() => {
|
|
|
|
const userLanguage = this.userLanguage();
|
2021-01-22 19:23:20 +08:00
|
|
|
return this.langs.map(language => ({
|
2016-08-17 06:01:20 +08:00
|
|
|
key: language,
|
|
|
|
user: language === userLanguage,
|
|
|
|
selected: ko.observable(false),
|
|
|
|
fullName: convertLangName(language)
|
|
|
|
}));
|
2013-11-16 06:21:12 +08:00
|
|
|
});
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2020-10-26 19:54:03 +08:00
|
|
|
this.langs.subscribe(() => this.setLanguageSelection());
|
2016-08-17 06:01:20 +08:00
|
|
|
}
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
languageTooltipName(language) {
|
|
|
|
const result = convertLangName(language, true);
|
|
|
|
return convertLangName(language, false) === result ? '' : result;
|
|
|
|
}
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
setLanguageSelection() {
|
|
|
|
const currentLang = this.fLang ? ko.unwrap(this.fLang) : '';
|
2021-01-27 17:59:15 +08:00
|
|
|
this.languages().forEach(item => item.selected(item.key === currentLang));
|
2016-08-17 06:01:20 +08:00
|
|
|
}
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
onBeforeShow() {
|
|
|
|
this.fLang = null;
|
|
|
|
this.userLanguage('');
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.langs([]);
|
|
|
|
}
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
onShow(fLanguage, langs, userLanguage) {
|
|
|
|
this.fLang = fLanguage;
|
|
|
|
this.userLanguage(userLanguage || '');
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.langs(langs);
|
|
|
|
}
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
changeLanguage(lang) {
|
2021-01-27 17:59:15 +08:00
|
|
|
this.fLang && this.fLang(lang);
|
2016-08-17 06:01:20 +08:00
|
|
|
this.cancelCommand();
|
2016-06-30 08:02:45 +08:00
|
|
|
}
|
2016-08-17 06:01:20 +08:00
|
|
|
}
|
2014-08-21 23:08:34 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
export { LanguagesPopupView, LanguagesPopupView as default };
|