forked from leftypol/leftypol
Merge branch '44-extract-the-default-theme-selection-buttons-to-js' into 'config'
Resolve "Extract the default theme selection buttons to JS" Closes #44 See merge request leftypol/leftypol!26
This commit is contained in:
commit
fd0e3113b3
3 changed files with 68 additions and 50 deletions
36
js/style-select-simple.js
Normal file
36
js/style-select-simple.js
Normal file
|
@ -0,0 +1,36 @@
|
|||
/*
|
||||
* style-select-simple.js
|
||||
*
|
||||
* Changes the stylesheet chooser links to a <select>
|
||||
*
|
||||
* Released under the MIT license
|
||||
* Copyright (c) 2025 Zankaria Auxa <zankaria.auxa@mailu.io>
|
||||
*
|
||||
* Usage:
|
||||
* $config['additional_javascript'][] = 'js/jquery.min.js';
|
||||
* // $config['additional_javascript'][] = 'js/style-select.js'; // Conflicts with this file.
|
||||
* $config['additional_javascript'][] = 'js/style-select-simple.js';
|
||||
*/
|
||||
|
||||
$(document).ready(function() {
|
||||
let newElement = document.createElement('div');
|
||||
newElement.className = 'styles';
|
||||
|
||||
// styles is defined in main.js.
|
||||
for (styleName in styles) {
|
||||
if (styleName) {
|
||||
let style = document.createElement('a');
|
||||
style.innerHTML = '[' + styleName + ']';
|
||||
style.onclick = function() {
|
||||
changeStyle(this.innerHTML.substring(1, this.innerHTML.length - 1), this);
|
||||
};
|
||||
if (styleName == selectedstyle) {
|
||||
style.className = 'selected';
|
||||
}
|
||||
style.href = 'javascript:void(0);';
|
||||
newElement.appendChild(style);
|
||||
}
|
||||
}
|
||||
|
||||
document.getElementById('bottom-hud').before(newElement);
|
||||
});
|
|
@ -11,43 +11,48 @@
|
|||
* Usage:
|
||||
* $config['additional_javascript'][] = 'js/jquery.min.js';
|
||||
* $config['additional_javascript'][] = 'js/style-select.js';
|
||||
*
|
||||
*/
|
||||
|
||||
$(document).ready(function() {
|
||||
var stylesDiv = $('div.styles');
|
||||
var pages = $('div.pages');
|
||||
var stylesSelect = $('<select></select>').css({float:"none"});
|
||||
var options = [];
|
||||
let pages = $('div.pages');
|
||||
let stylesSelect = $('<select></select>').css({float:"none"});
|
||||
let options = [];
|
||||
|
||||
var i = 1;
|
||||
stylesDiv.children().each(function() {
|
||||
var name = this.innerHTML.replace(/(^\[|\]$)/g, '');
|
||||
var opt = $('<option></option>')
|
||||
.html(name)
|
||||
let i = 1;
|
||||
for (styleName in styles) {
|
||||
if (styleName) {
|
||||
let opt = $('<option></option>')
|
||||
.html(styleName)
|
||||
.val(i);
|
||||
if ($(this).hasClass('selected'))
|
||||
if (selectedstyle == styleName) {
|
||||
opt.attr('selected', true);
|
||||
options.push ([name.toUpperCase (), opt]);
|
||||
$(this).attr('id', 'style-select-' + i);
|
||||
}
|
||||
opt.attr('id', 'style-select-' + i);
|
||||
options.push([styleName.toUpperCase (), opt]);
|
||||
i++;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
options.sort((a, b) => {
|
||||
const keya = a [0];
|
||||
const keyb = b [0];
|
||||
if (keya < keyb) { return -1; }
|
||||
if (keya > keyb) { return 1; }
|
||||
if (keya < keyb) {
|
||||
return -1;
|
||||
}
|
||||
if (keya > keyb) {
|
||||
return 1;
|
||||
}
|
||||
return 0;
|
||||
}).forEach(([key, opt]) => {
|
||||
stylesSelect.append(opt);
|
||||
});
|
||||
|
||||
stylesSelect.change(function() {
|
||||
$('#style-select-' + $(this).val()).click();
|
||||
let sel = $(this).find(":selected")[0];
|
||||
let styleName = sel.innerHTML;
|
||||
changeStyle(styleName, sel);
|
||||
});
|
||||
|
||||
stylesDiv.hide()
|
||||
pages.after(
|
||||
$('<div id="style-select"></div>')
|
||||
.append(_('Select theme: '), stylesSelect)
|
||||
|
|
|
@ -231,28 +231,6 @@ var resourceVersion = document.currentScript.getAttribute('data-resource-version
|
|||
{% endif %}
|
||||
{% raw %}
|
||||
|
||||
function initStyleChooser() {
|
||||
var newElement = document.createElement('div');
|
||||
newElement.className = 'styles';
|
||||
|
||||
for (styleName in styles) {
|
||||
if (styleName) {
|
||||
var style = document.createElement('a');
|
||||
style.innerHTML = '[' + styleName + ']';
|
||||
style.onclick = function() {
|
||||
changeStyle(this.innerHTML.substring(1, this.innerHTML.length - 1), this);
|
||||
};
|
||||
if (styleName == selectedstyle) {
|
||||
style.className = 'selected';
|
||||
}
|
||||
style.href = 'javascript:void(0);';
|
||||
newElement.appendChild(style);
|
||||
}
|
||||
}
|
||||
|
||||
document.getElementById('bottom-hud').before(newElement);
|
||||
}
|
||||
|
||||
function getCookie(cookie_name) {
|
||||
let results = document.cookie.match('(^|;) ?' + cookie_name + '=([^;]*)(;|$)');
|
||||
if (results) {
|
||||
|
@ -528,7 +506,6 @@ var script_settings = function(script_name) {
|
|||
};
|
||||
|
||||
function init() {
|
||||
initStyleChooser();
|
||||
initCaptcha();
|
||||
|
||||
{% endraw %}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue