2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
import _ from '_';
|
|
|
|
import ko from 'ko';
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
import {convertLangName} from 'Common/Utils';
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
import {view, ViewType} from 'Knoin/Knoin';
|
|
|
|
import {AbstractViewNext} from 'Knoin/AbstractViewNext';
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
@view({
|
|
|
|
name: 'View/Popup/Languages',
|
|
|
|
type: ViewType.Popup,
|
|
|
|
templateID: 'PopupsLanguages'
|
|
|
|
})
|
|
|
|
class LanguagesPopupView extends AbstractViewNext
|
2016-06-30 08:02:45 +08:00
|
|
|
{
|
2016-08-17 06:01:20 +08:00
|
|
|
constructor() {
|
|
|
|
super();
|
|
|
|
|
|
|
|
this.fLang = null;
|
|
|
|
this.userLanguage = ko.observable('');
|
|
|
|
|
|
|
|
this.langs = ko.observableArray([]);
|
|
|
|
|
|
|
|
this.languages = ko.computed(() => {
|
|
|
|
const userLanguage = this.userLanguage();
|
|
|
|
return _.map(this.langs(), (language) => ({
|
|
|
|
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
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.langs.subscribe(() => {
|
|
|
|
this.setLanguageSelection();
|
|
|
|
});
|
|
|
|
}
|
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) : '';
|
|
|
|
_.each(this.languages(), (item) => {
|
|
|
|
item.selected(item.key === currentLang);
|
|
|
|
});
|
|
|
|
}
|
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) {
|
|
|
|
if (this.fLang)
|
|
|
|
{
|
|
|
|
this.fLang(lang);
|
|
|
|
}
|
2016-06-30 08:02:45 +08:00
|
|
|
|
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
|
|
|
|
2016-06-30 08:02:45 +08:00
|
|
|
module.exports = LanguagesPopupView;
|