Merge pull request #321 from towards-a-new-leftypol/select_style3

Put style chooser into the options menu
This commit is contained in:
towards-a-new-leftypol 2021-08-21 18:57:43 -04:00 committed by GitHub
commit 726decb27c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 298 additions and 331 deletions

View File

@ -394,7 +394,6 @@ $config['additional_javascript'][] = 'js/options.js';
$config['additional_javascript'][] = 'js/options/general.js';
$config['additional_javascript'][] = 'js/options/user-css.js';
$config['additional_javascript'][] = 'js/options/user-js.js';
$config['additional_javascript'][] = 'js/style-select.js';
$config['additional_javascript'][] = 'js/flag-preview.js';
$config['additional_javascript'][] = 'js/file-selector.js';
$config['additional_javascript'][] = 'js/download-original.js';

View File

@ -12,40 +12,78 @@
+function(){
function styleShitChoicer() {
var savedChoice = localStorage.stylesheet;
var e_select = document.createElement("select");
e_select.name = "opt-style-select";
for (var i=0; i < styles.length; i++) {
var styleName = styles[i][0];
var e_option = document.createElement("option");
e_option.innerHTML = styleName;
e_option.value = styleName;
if (styleName == savedChoice) {
e_option.selected = true;
}
e_select.appendChild(e_option);
}
e_select.addEventListener('change', function(e) {
changeStyle(e.target.value);
});
return e_select;
}
function appendStyleSelectorToTab(tab_content) {
var div = document.createElement('div');
div.className = "options_general_tab--select_opt";
var label = document.createElement('span');
label.innerHTML = "Theme: ";
div.appendChild(label);
div.appendChild(styleShitChoicer());
$(div).appendTo(tab_content);
}
var tab = Options.add_tab("general", "home", _("General"));
$(function(){
var stor = $("<div>"+_("Storage: ")+"</div>");
stor.appendTo(tab.content);
var stor = $("<div>"+_("Storage: ")+"</div>");
stor.appendTo(tab.content);
$("<button>"+_("Export")+"</button>").appendTo(stor).on("click", function() {
var str = JSON.stringify(localStorage);
$("<button>"+_("Export")+"</button>").appendTo(stor).on("click", function() {
var str = JSON.stringify(localStorage);
$(".output").remove();
$("<input type='text' class='output'>").appendTo(stor).val(str);
});
$("<button>"+_("Import")+"</button>").appendTo(stor).on("click", function() {
var str = prompt(_("Paste your storage data"));
if (!str) return false;
var obj = JSON.parse(str);
if (!obj) return false;
$(".output").remove();
$("<input type='text' class='output'>").appendTo(stor).val(str);
});
localStorage.clear();
for (var i in obj) {
localStorage[i] = obj[i];
}
$("<button>"+_("Import")+"</button>").appendTo(stor).on("click", function() {
var str = prompt(_("Paste your storage data"));
if (!str) return false;
var obj = JSON.parse(str);
if (!obj) return false;
document.location.reload();
});
$("<button>"+_("Erase")+"</button>").appendTo(stor).on("click", function() {
if (confirm(_("Are you sure you want to erase your storage? This involves your hidden threads, watched threads, post password and many more."))) {
localStorage.clear();
document.location.reload();
}
});
localStorage.clear();
for (var i in obj) {
localStorage[i] = obj[i];
}
document.location.reload();
});
$("#style-select").detach().css({float:"none","margin-bottom":0}).appendTo(tab.content);
$("<button>"+_("Erase")+"</button>").appendTo(stor).on("click", function() {
if (confirm(_("Are you sure you want to erase your storage? This involves your hidden threads, watched threads, post password and many more."))) {
localStorage.clear();
document.location.reload();
}
});
appendStyleSelectorToTab(tab.content);
});
}();

View File

@ -1,55 +0,0 @@
/*
* style-select.js
* https://github.com/savetheinternet/Tinyboard/blob/master/js/style-select.js
*
* Changes the stylesheet chooser links to a <select>
*
* Released under the MIT license
* Copyright (c) 2013 Michael Save <savetheinternet@tinyboard.org>
* Copyright (c) 2013-2014 Marcin Łabanowski <marcin@6irc.net>
*
* 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 = [];
var i = 1;
stylesDiv.children().each(function() {
var name = this.innerHTML.replace(/(^\[|\]$)/g, '');
var opt = $('<option></option>')
.html(name)
.val(i);
if ($(this).hasClass('selected'))
opt.attr('selected', true);
options.push ([name.toUpperCase (), opt]);
$(this).attr('id', 'style-select-' + i);
i++;
});
options.sort ((a, b) => {
const keya = a [0];
const keyb = b [0];
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();
});
stylesDiv.hide()
pages.after(
$('<div id="style-select"></div>')
.append(_('Select theme: '), stylesSelect)
);
});

View File

@ -1965,3 +1965,15 @@ span.strikethrough {
span.orangeQuote {
color: #FF8C00;
}
.options_general_tab--select_opt {
height: 2.5em;
}
.options_general_tab--select_opt span {
line-height: 2.5em;
}
.options_general_tab--select_opt select {
float: none;
}

View File

@ -7,7 +7,7 @@
* Witaj!
*/
function _(s) {
return (typeof l10n != 'undefined' && typeof l10n[s] != 'undefined') ? l10n[s] : s;
return (typeof l10n != 'undefined' && typeof l10n[s] != 'undefined') ? l10n[s] : s;
}
/* printf-like formatting function, example of usage:
@ -19,7 +19,7 @@ function _(s) {
* 3 uzytkownikow
*/
function fmt(s,a) {
return s.replace(/\{([0-9]+)\}/g, function(x) { return a[x[1]]; });
return s.replace(/\{([0-9]+)\}/g, function(x) { return a[x[1]]; });
}
function until($timestamp) {
@ -110,309 +110,282 @@ var saved = {};
var selectedstyle = '{% endraw %}{{ config.default_stylesheet.0|addslashes }}{% raw %}';
var styles = {
{% endraw %}
{% for stylesheet in stylesheets %}{% raw %}'{% endraw %}{{ stylesheet.name|addslashes }}{% raw %}' : '{% endraw %}{{ stylesheet.uri|addslashes }}{% raw %}',
{% endraw %}{% endfor %}{% raw %}
};
var styles = [
{% endraw %}
{% for stylesheet in stylesheets %}{% raw %}['{% endraw %}{{ stylesheet.name|addslashes }}{% raw %}', '{% endraw %}{{ stylesheet.uri|addslashes }}{% raw %}'],
{% endraw %}{% endfor %}{% raw %}
];
var codestyles = {
{% endraw %}
{% for stylesheet in code_stylesheets %}{% raw %}'{% endraw %}{{ stylesheet.name|addslashes }}{% raw %}' : '{% endraw %}{{ stylesheet.uri|addslashes }}{% raw %}',
{% endraw %}{% endfor %}{% raw %}
{% endraw %}
{% for stylesheet in code_stylesheets %}{% raw %}'{% endraw %}{{ stylesheet.name|addslashes }}{% raw %}' : '{% endraw %}{{ stylesheet.uri|addslashes }}{% raw %}',
{% endraw %}{% endfor %}{% raw %}
};
if (typeof board_name === 'undefined') {
var board_name = false;
var board_name = false;
}
function changeStyle(styleName, link) {
{% endraw %}
{% if config.stylesheets_board %}{% raw %}
if (board_name) {
stylesheet_choices[board_name] = styleName;
localStorage.board_stylesheets = JSON.stringify(stylesheet_choices);
}
{% endraw %}{% else %}
localStorage.stylesheet = styleName;
{% endif %}
{% raw %}
// Main stylesheet
if (!document.getElementById('stylesheet')) {
var s = document.createElement('link');
s.rel = 'stylesheet';
s.type = 'text/css';
s.id = 'stylesheet';
var x = document.getElementsByTagName('head')[0];
x.appendChild(s);
}
function changeStyle(styleName) {
{% endraw %}
{% if config.stylesheets_board %}{% raw %}
if (board_name) {
stylesheet_choices[board_name] = styleName;
localStorage.board_stylesheets = JSON.stringify(stylesheet_choices);
}
{% endraw %}{% else %}
localStorage.stylesheet = styleName;
{% endif %}
{% raw %}
document.getElementById('stylesheet').href = styles[styleName];
selectedstyle = styleName;
var styleUrl;
// Code stylesheet
if (!document.getElementById('code_stylesheet')) {
var s = document.createElement('link');
s.rel = 'stylesheet';
s.type = 'text/css';
s.id = 'code_stylesheet';
var x = document.getElementsByTagName('head')[0];
x.appendChild(s);
}
// Don't store all styles in an object, it's harder to iterate over to build dom elements later
for (var i=0; i < styles.length; i++) {
var nameUrlPair = styles[i];
document.getElementById('code_stylesheet').href = codestyles[styleName];
if (document.getElementsByClassName('styles').length != 0) {
var styleLinks = document.getElementsByClassName('styles')[0].childNodes;
for (var i = 0; i < styleLinks.length; i++) {
styleLinks[i].className = '';
}
}
if (link) {
link.className = 'selected';
}
if (typeof $ != 'undefined')
$(window).trigger('stylesheet', styleName);
if (nameUrlPair[0] == styleName) {
styleUrl = nameUrlPair[1];
}
}
// Main stylesheet
if (!document.getElementById('stylesheet')) {
var s = document.createElement('link');
s.rel = 'stylesheet';
s.type = 'text/css';
s.id = 'stylesheet';
var x = document.getElementsByTagName('head')[0];
x.appendChild(s);
}
document.getElementById('stylesheet').href = styleUrl;
selectedstyle = styleName;
// Code stylesheet
if (!document.getElementById('code_stylesheet')) {
var s = document.createElement('link');
s.rel = 'stylesheet';
s.type = 'text/css';
s.id = 'code_stylesheet';
var x = document.getElementsByTagName('head')[0];
x.appendChild(s);
}
document.getElementById('code_stylesheet').href = codestyles[styleName];
if (typeof $ != 'undefined')
$(window).trigger('stylesheet', styleName);
}
{% endraw %}
{% if config.stylesheets_board %}
{% raw %}
if (!localStorage.board_stylesheets) {
localStorage.board_stylesheets = '{}';
}
var stylesheet_choices = JSON.parse(localStorage.board_stylesheets);
if (board_name && stylesheet_choices[board_name]) {
for (var styleName in styles) {
if (styleName == stylesheet_choices[board_name]) {
changeStyle(styleName);
break;
}
}
}
{% endraw%}
{% raw %}
if (!localStorage.board_stylesheets) {
localStorage.board_stylesheets = '{}';
}
var stylesheet_choices = JSON.parse(localStorage.board_stylesheets);
if (board_name && stylesheet_choices[board_name]) {
for (var styleName in styles) {
if (styleName == stylesheet_choices[board_name]) {
changeStyle(styleName);
break;
}
}
}
{% endraw%}
{% else %}
{% raw %}
if (localStorage.stylesheet) {
for (var styleName in styles) {
if (styleName == localStorage.stylesheet) {
changeStyle(styleName);
break;
}
}
}
{% endraw %}
{% raw %}
if (localStorage.stylesheet) {
changeStyle(localStorage.stylesheet);
}
{% endraw %}
{% endif %}
{% raw %}
function init_stylechooser() {
var newElement = document.createElement('div');
newElement.className = 'styles';
for (styleName in styles) {
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.getElementsByTagName('body')[0].insertBefore(newElement, document.getElementsByTagName('body')[0].lastChild.nextSibling);
}
function get_cookie(cookie_name) {
var results = document.cookie.match ( '(^|;) ?' + cookie_name + '=([^;]*)(;|$)');
if (results)
return (unescape(results[2]));
else
return null;
var results = document.cookie.match ( '(^|;) ?' + cookie_name + '=([^;]*)(;|$)');
if (results)
return (unescape(results[2]));
else
return null;
}
function highlightReply(id) {
if (typeof window.event != "undefined" && event.which == 2) {
// don't highlight on middle click
return true;
}
var divs = document.getElementsByTagName('div');
for (var i = 0; i < divs.length; i++)
{
if (divs[i].className.indexOf('post') != -1)
divs[i].className = divs[i].className.replace(/highlighted/, '');
}
if (id) {
var post = document.getElementById('reply_'+id);
if (post)
post.className += ' highlighted';
window.location.hash = id;
}
return true;
if (typeof window.event != "undefined" && event.which == 2) {
// don't highlight on middle click
return true;
}
var divs = document.getElementsByTagName('div');
for (var i = 0; i < divs.length; i++)
{
if (divs[i].className.indexOf('post') != -1)
divs[i].className = divs[i].className.replace(/highlighted/, '');
}
if (id) {
var post = document.getElementById('reply_'+id);
if (post)
post.className += ' highlighted';
window.location.hash = id;
}
return true;
}
function generatePassword() {
var pass = '';
var chars = '{% endraw %}{{ config.genpassword_chars }}{% raw %}';
for (var i = 0; i < 8; i++) {
var rnd = Math.floor(Math.random() * chars.length);
pass += chars.substring(rnd, rnd + 1);
}
return pass;
var pass = '';
var chars = '{% endraw %}{{ config.genpassword_chars }}{% raw %}';
for (var i = 0; i < 8; i++) {
var rnd = Math.floor(Math.random() * chars.length);
pass += chars.substring(rnd, rnd + 1);
}
return pass;
}
function dopost(form) {
if (form.elements['name']) {
localStorage.name = form.elements['name'].value.replace(/( |^)## .+$/, '');
}
if (form.elements['password']) {
localStorage.password = form.elements['password'].value;
}
if (form.elements['email'] && form.elements['email'].value != 'sage') {
localStorage.email = form.elements['email'].value;
}
saved[document.location] = form.elements['body'].value;
sessionStorage.body = JSON.stringify(saved);
return form.elements['body'].value != "" || (form.elements['file'] && form.elements['file'].value != "") || (form.elements.file_url && form.elements['file_url'].value != "");
if (form.elements['name']) {
localStorage.name = form.elements['name'].value.replace(/( |^)## .+$/, '');
}
if (form.elements['password']) {
localStorage.password = form.elements['password'].value;
}
if (form.elements['email'] && form.elements['email'].value != 'sage') {
localStorage.email = form.elements['email'].value;
}
saved[document.location] = form.elements['body'].value;
sessionStorage.body = JSON.stringify(saved);
return form.elements['body'].value != "" || (form.elements['file'] && form.elements['file'].value != "") || (form.elements.file_url && form.elements['file_url'].value != "");
}
function reloadCaptcha() {
// Reload captcha images (date reduces chance of caching)
// If no securimage captcha is enabled, no elements will be found
captchaImgs = document.querySelectorAll('[id=captcha-img]');
for (var i = 0; i < captchaImgs.length; ++i)
captchaImgs[i].src = "/captcha.php?"+Date.now();
captchas = document.querySelectorAll('[id=captcha]');
for (var i = 0; i < captchas.length; ++i)
captchas[i].value = "";
// Reload captcha images (date reduces chance of caching)
// If no securimage captcha is enabled, no elements will be found
captchaImgs = document.querySelectorAll('[id=captcha-img]');
for (var i = 0; i < captchaImgs.length; ++i)
captchaImgs[i].src = "/captcha.php?"+Date.now();
captchas = document.querySelectorAll('[id=captcha]');
for (var i = 0; i < captchas.length; ++i)
captchas[i].value = "";
}
function citeReply(id, with_link) {
var textarea = document.getElementById('body');
var textarea = document.getElementById('body');
if (!textarea) return false;
if (document.selection) {
// IE
textarea.focus();
var sel = document.selection.createRange();
sel.text = '>>' + id + '\n';
} else if (textarea.selectionStart || textarea.selectionStart == '0') {
var start = textarea.selectionStart;
var end = textarea.selectionEnd;
textarea.value = textarea.value.substring(0, start) + '>>' + id + '\n' + textarea.value.substring(end, textarea.value.length);
textarea.selectionStart += ('>>' + id).length + 1;
textarea.selectionEnd = textarea.selectionStart;
} else {
// ???
textarea.value += '>>' + id + '\n';
}
if (typeof $ != 'undefined') {
var select = document.getSelection().toString();
if (select) {
var body = $('#reply_' + id + ', #op_' + id).find('div.body'); // TODO: support for OPs
var index = body.text().indexOf(select.replace('\n', '')); // for some reason this only works like this
if (index > -1) {
textarea.value += '>' + select + '\n';
}
}
if (!textarea) return false;
if (document.selection) {
// IE
textarea.focus();
var sel = document.selection.createRange();
sel.text = '>>' + id + '\n';
} else if (textarea.selectionStart || textarea.selectionStart == '0') {
var start = textarea.selectionStart;
var end = textarea.selectionEnd;
textarea.value = textarea.value.substring(0, start) + '>>' + id + '\n' + textarea.value.substring(end, textarea.value.length);
textarea.selectionStart += ('>>' + id).length + 1;
textarea.selectionEnd = textarea.selectionStart;
} else {
// ???
textarea.value += '>>' + id + '\n';
}
if (typeof $ != 'undefined') {
var select = document.getSelection().toString();
if (select) {
var body = $('#reply_' + id + ', #op_' + id).find('div.body'); // TODO: support for OPs
var index = body.text().indexOf(select.replace('\n', '')); // for some reason this only works like this
if (index > -1) {
textarea.value += '>' + select + '\n';
}
}
$(window).trigger('cite', [id, with_link]);
$(textarea).change();
}
return false;
$(window).trigger('cite', [id, with_link]);
$(textarea).change();
}
return false;
}
function rememberStuff() {
if (document.forms.post) {
if (document.forms.post.password) {
if (!localStorage.password)
localStorage.password = generatePassword();
document.forms.post.password.value = localStorage.password;
}
if (localStorage.name && document.forms.post.elements['name'])
document.forms.post.elements['name'].value = localStorage.name;
if (localStorage.email && document.forms.post.elements['email'])
document.forms.post.elements['email'].value = localStorage.email;
if (window.location.hash.indexOf('q') == 1)
citeReply(window.location.hash.substring(2), true);
if (sessionStorage.body) {
var saved = JSON.parse(sessionStorage.body);
if (get_cookie('{% endraw %}{{ config.cookies.js }}{% raw %}')) {
// Remove successful posts
var successful = JSON.parse(get_cookie('{% endraw %}{{ config.cookies.js }}{% raw %}'));
for (var url in successful) {
saved[url] = null;
}
sessionStorage.body = JSON.stringify(saved);
document.cookie = '{% endraw %}{{ config.cookies.js }}{% raw %}={};expires=0;path=/;';
}
if (saved[document.location]) {
document.forms.post.body.value = saved[document.location];
}
}
if (localStorage.body) {
document.forms.post.body.value = localStorage.body;
localStorage.body = '';
}
}
if (document.forms.post) {
if (document.forms.post.password) {
if (!localStorage.password)
localStorage.password = generatePassword();
document.forms.post.password.value = localStorage.password;
}
if (localStorage.name && document.forms.post.elements['name'])
document.forms.post.elements['name'].value = localStorage.name;
if (localStorage.email && document.forms.post.elements['email'])
document.forms.post.elements['email'].value = localStorage.email;
if (window.location.hash.indexOf('q') == 1)
citeReply(window.location.hash.substring(2), true);
if (sessionStorage.body) {
var saved = JSON.parse(sessionStorage.body);
if (get_cookie('{% endraw %}{{ config.cookies.js }}{% raw %}')) {
// Remove successful posts
var successful = JSON.parse(get_cookie('{% endraw %}{{ config.cookies.js }}{% raw %}'));
for (var url in successful) {
saved[url] = null;
}
sessionStorage.body = JSON.stringify(saved);
document.cookie = '{% endraw %}{{ config.cookies.js }}{% raw %}={};expires=0;path=/;';
}
if (saved[document.location]) {
document.forms.post.body.value = saved[document.location];
}
}
if (localStorage.body) {
document.forms.post.body.value = localStorage.body;
localStorage.body = '';
}
}
}
var script_settings = function(script_name) {
this.script_name = script_name;
this.get = function(var_name, default_val) {
if (typeof tb_settings == 'undefined' ||
typeof tb_settings[this.script_name] == 'undefined' ||
typeof tb_settings[this.script_name][var_name] == 'undefined')
return default_val;
return tb_settings[this.script_name][var_name];
}
this.script_name = script_name;
this.get = function(var_name, default_val) {
if (typeof tb_settings == 'undefined' ||
typeof tb_settings[this.script_name] == 'undefined' ||
typeof tb_settings[this.script_name][var_name] == 'undefined')
return default_val;
return tb_settings[this.script_name][var_name];
}
};
function init() {
init_stylechooser();
{% endraw %}
{% if config.allow_delete %}
if (document.forms.postcontrols) {
document.forms.postcontrols.password.value = localStorage.password;
}
{% endif %}
{% raw %}
if (window.location.hash.indexOf('q') != 1 && window.location.hash.substring(1))
highlightReply(window.location.hash.substring(1));
{% endraw %}
{% if config.allow_delete %}
if (document.forms.postcontrols) {
document.forms.postcontrols.password.value = localStorage.password;
}
{% endif %}
{% raw %}
if (window.location.hash.indexOf('q') != 1 && window.location.hash.substring(1))
highlightReply(window.location.hash.substring(1));
}
var RecaptchaOptions = {
theme : 'clean'
theme : 'clean'
};
onready_callbacks = [];
function onready(fnc) {
onready_callbacks.push(fnc);
onready_callbacks.push(fnc);
}
function ready() {
for (var i = 0; i < onready_callbacks.length; i++) {
onready_callbacks[i]();
}
for (var i = 0; i < onready_callbacks.length; i++) {
onready_callbacks[i]();
}
}
{% endraw %}