MediaWiki:Gadget-theme.js: различия между версиями
Pok (обсуждение | вклад) мНет описания правки |
Pok (обсуждение | вклад) Нет описания правки |
||
| (не показано 5 промежуточных версий этого же участника) | |||
| Строка 1: | Строка 1: | ||
;(function($, mw){ | ;(function($, mw){ | ||
const COOKIE = 'ss14_wikiTheme'; | const COOKIE = 'ss14_wikiTheme'; | ||
const COOKIE_SPACE = 'ss14_spaceAnimation'; | const COOKIE_SPACE = 'ss14_spaceAnimation'; | ||
const COOKIE_PROJECT = 'ss14_preferredProject'; | |||
function loadTheme() { | function loadTheme() { | ||
| Строка 41: | Строка 42: | ||
$body.addClass(`wgl-space-animation-${val}`); | $body.addClass(`wgl-space-animation-${val}`); | ||
mw.hook('wgl.spaceAnimationChanged').fire(val); | mw.hook('wgl.spaceAnimationChanged').fire(val); | ||
} | |||
function loadPreferredProject() { | |||
return $.cookie(COOKIE_PROJECT) || 'corvax'; | |||
} | |||
function savePreferredProject(val) { | |||
$.cookie(COOKIE_PROJECT, val, { expires: 365, path: '/' }); | |||
} | |||
function applyPreferredProject(val) { | |||
const $body = $('body'); | |||
const classes = ($body.attr('class') || '') | |||
.split(/\s+/) | |||
.filter(cls => cls.indexOf('wgl-preferred-project-') === 0); | |||
if (classes.length) { | |||
$body.removeClass(classes.join(' ')); | |||
} | |||
$body.addClass(`wgl-preferred-project-${val}`); | |||
mw.hook('wgl.preferredProjectChanged').fire(val); | |||
} | } | ||
| Строка 64: | Строка 87: | ||
const $wr = $('<div>', { class: 'theme-client-prefs-radio' }); | const $wr = $('<div>', { class: 'theme-client-prefs-radio' }); | ||
const $inp = $('<input>', { | const $inp = $('<input>', { | ||
type: | type: 'radio', | ||
name: | name: 'theme-selection', | ||
id: | id: `theme-value-${opt.key}`, | ||
value: | value: opt.key, | ||
checked: | checked: opt.key === currentTheme | ||
}); | }); | ||
const $lbl = $('<label>', { | const $lbl = $('<label>', { | ||
for: | for: `theme-value-${opt.key}`, | ||
text: | text: opt.label | ||
}); | }); | ||
$wr.append($inp, $lbl); | $wr.append($inp, $lbl); | ||
| Строка 88: | Строка 111: | ||
$container.append($portlet); | $container.append($portlet); | ||
initSpaceMenu($portlet); | initSpaceMenu($portlet); | ||
initPreferredProjectMenu($portlet); | |||
$form.on('change', 'input[name="theme-selection"]', function() { | $form.on('change', 'input[name="theme-selection"]', function() { | ||
| Строка 108: | Строка 132: | ||
); | ); | ||
const $form = $('<form>'); | const $form = $('<form style="grid-template-columns:1fr 1fr;">'); | ||
[ | [ | ||
{ val: 'on', label: 'Включено' }, | { val: 'on', label: 'Включено' }, | ||
{ val: 'off', label: ' | { val: 'off', label: 'Отключено' } | ||
].forEach(opt => { | ].forEach(opt => { | ||
const $wr = $('<div>', { class: 'theme-client-prefs-radio' }); | const $wr = $('<div>', { class: 'theme-client-prefs-radio' }); | ||
| Строка 144: | Строка 168: | ||
saveSpaceAnimation(newVal); | saveSpaceAnimation(newVal); | ||
applySpaceAnimation(newVal); | applySpaceAnimation(newVal); | ||
}); | |||
} | |||
function initPreferredProjectMenu($afterPortlet, currentVal) { | |||
currentVal = currentVal || loadPreferredProject(); | |||
const $projectPortlet = $('<div>', { | |||
class: 'mw-portlet mw-portlet-js theme-menu', | |||
id: 'skin-client-prefs-skin-project' | |||
}); | |||
$projectPortlet.append( | |||
$('<div>', { class: 'theme-menu__heading', text: 'Предпочитаемый проект' }), | |||
$('<div>', { class: 'theme-menu__content' }) | |||
); | |||
const $form = $('<form style="grid-template-columns:1fr 1fr;">'); | |||
[ | |||
{ val: 'corvax', label: 'Corvax' }, | |||
{ val: 'goob', label: 'Goob' }, | |||
{ val: 'wl', label: 'WL' }, | |||
{ val: 'wega', label: 'Wega' } | |||
].forEach(opt => { | |||
const $wr = $('<div>', { class: 'theme-client-prefs-radio' }); | |||
const $inp = $('<input>', { | |||
type: 'radio', | |||
name: 'preferred-project-selection', | |||
id: `project-value-${opt.val}`, | |||
value: opt.val, | |||
checked: opt.val === currentVal | |||
}); | |||
const $lbl = $('<label>', { | |||
for: `project-value-${opt.val}`, | |||
text: opt.label | |||
}); | |||
$wr.append($inp, $lbl); | |||
$form.append($wr); | |||
}); | |||
$projectPortlet.find('.theme-menu__content').append( | |||
$('<ul>', { class: 'theme-menu__content-list' }) | |||
.append( | |||
$('<li>', { class: 'mw-list-item mw-list-item-js' }) | |||
.append($form) | |||
) | |||
); | |||
$afterPortlet.after($projectPortlet); | |||
applyPreferredProject(currentVal); | |||
$form.on('change', 'input[name="preferred-project-selection"]', function() { | |||
const newVal = $(this).val(); | |||
savePreferredProject(newVal); | |||
applyPreferredProject(newVal); | |||
}); | }); | ||
} | } | ||
| Строка 154: | Строка 231: | ||
saveSpaceAnimation, | saveSpaceAnimation, | ||
applySpaceAnimation, | applySpaceAnimation, | ||
initSpaceMenu | initSpaceMenu, | ||
loadPreferredProject, | |||
savePreferredProject, | |||
applyPreferredProject, | |||
initPreferredProjectMenu | |||
}; | }; | ||
}(jQuery, mediaWiki)); | }(jQuery, mediaWiki)); | ||