mirror of
https://github.com/OPSnet/Gazelle.git
synced 2026-01-16 18:04:34 -05:00
move cssgallery.js handlers into user_settings.js
This commit is contained in:
@@ -1,47 +0,0 @@
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
// If the custom stylesheet field is empty, select the current style from the previews
|
||||
if (!$('input#styleurl').val()){
|
||||
var radiobutton = $('input[name="stylesheet_gallery"][value="' + $('select#stylesheet').val() + '"]');
|
||||
radiobutton.click();
|
||||
$('.preview_wrapper').removeClass('selected');
|
||||
radiobutton.parent().parent().addClass('selected');
|
||||
}
|
||||
// If the input is clicked, redirect it to the overlay click event
|
||||
$('input[name="stylesheet_gallery"]').change(function() {
|
||||
$('.preview_wrapper').removeClass('selected');
|
||||
var parent = $(this).parent();
|
||||
parent.addClass('selected');
|
||||
var radiobutton = parent.find('input');
|
||||
radiobutton.prop('checked', true);
|
||||
$('select#stylesheet').val(radiobutton.attr('value'));
|
||||
$('input#styleurl').val('');
|
||||
});
|
||||
// If the drop-down is changed, select the appropriate item in gallery, clear the custom CSS field
|
||||
$('select#stylesheet').change(function() {
|
||||
var radiobutton = $('input[name="stylesheet_gallery"][value="' + $(this).val() + '"]');
|
||||
radiobutton.prop('checked', true);
|
||||
$('.preview_wrapper').removeClass('selected');
|
||||
radiobutton.parent().parent().addClass('selected');
|
||||
$('input#styleurl').val('');
|
||||
});
|
||||
// If the custom CSS field is changed, clear radio buttons
|
||||
$('input#styleurl').keydown(function() {
|
||||
$('input[name="stylesheet_gallery"]').each(function() {
|
||||
$(this).prop('checked', false);
|
||||
});
|
||||
$('.preview_wrapper').removeClass('selected');
|
||||
});
|
||||
// If the input is empty, select appropriate gallery item again by the drop-down
|
||||
$('input#styleurl').keyup(function() {
|
||||
if (!$(this).val()){
|
||||
$('select#stylesheet').change();
|
||||
}
|
||||
});
|
||||
// Allow the CSS gallery to be expanded/contracted
|
||||
$('#toggle_css_gallery').click(function (e) {
|
||||
e.preventDefault();
|
||||
$('#css_gallery').slideToggle(function () {
|
||||
$('#toggle_css_gallery').text($(this).is(':visible') ? 'Hide gallery' : 'Show gallery');
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -151,6 +151,66 @@ function fetchPushbulletDevices(apikey) {
|
||||
});
|
||||
}
|
||||
|
||||
function init_css_gallery() {
|
||||
let gallery = Array.from(
|
||||
document.querySelectorAll('input[name="stylesheet_gallery"]')
|
||||
);
|
||||
|
||||
let stylesheet = document.querySelector('select#stylesheet');
|
||||
function update_radio() {
|
||||
let radio = gallery[
|
||||
gallery.findIndex((g) => { return g.value == stylesheet.value; })
|
||||
];
|
||||
radio.click();
|
||||
radio.parentNode.parentNode.classList.add('selected');
|
||||
}
|
||||
|
||||
stylesheet.addEventListener('change', () => {
|
||||
// select the appropriate gallery item, clear the external url
|
||||
update_radio();
|
||||
external_url.value = '';
|
||||
});
|
||||
|
||||
// If no custom stylesheet, select the current gallery
|
||||
let external_url = document.querySelector('input#styleurl');
|
||||
if (external_url.value === '') {
|
||||
update_radio();
|
||||
}
|
||||
external_url.addEventListener('keydown', () => {
|
||||
// If the custom CSS field is changed, clear radio buttons
|
||||
gallery.forEach((g) => {
|
||||
g.checked = false;
|
||||
});
|
||||
});
|
||||
external_url.addEventListener('keyup', (e) => {
|
||||
// If the field is empty, select appropriate gallery item again by the drop-down
|
||||
if (e.target.value === "") {
|
||||
update_radio();
|
||||
}
|
||||
});
|
||||
|
||||
// When a gallery radio is clicked, update the drop-down
|
||||
gallery.forEach((g) => {
|
||||
g.addEventListener('change', () => {
|
||||
stylesheet.value = g.value;
|
||||
external_url.value = '';
|
||||
});
|
||||
});
|
||||
|
||||
// gallery visibility can be toggled
|
||||
let toggle = document.getElementById('toggle_css_gallery');
|
||||
toggle.addEventListener('click', (e) => {
|
||||
if (toggle.innerHTML === 'Hide gallery') {
|
||||
toggle.innerHTML = 'Show gallery';
|
||||
document.getElementById('css_gallery').style.display = 'none';
|
||||
} else {
|
||||
toggle.innerHTML = 'Hide gallery';
|
||||
document.getElementById('css_gallery').style.display = 'block';
|
||||
}
|
||||
e.preventDefault();
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
Array.from(document.querySelectorAll("#settings_sections li"))
|
||||
.filter((li) => { return li.dataset.gazelleSectionId != 'live_search'; })
|
||||
@@ -276,4 +336,5 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
|
||||
refresh_paranoia();
|
||||
toggle_identicons();
|
||||
init_css_gallery();
|
||||
});
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
{{ header(user.username ~ " › Settings", {'js': 'vendor/jquery-ui,bbcode,cssgallery,donor_titles,password,password_validate,preview_paranoia,release_sort,user_settings'}) }}
|
||||
{{ header(user.username ~ " › Settings", {'js': 'vendor/jquery-ui,bbcode,donor_titles,password,password_validate,preview_paranoia,release_sort,user_settings'}) }}
|
||||
<div class="thin">
|
||||
<div class="header">
|
||||
<h2>{{ user.id|user_url }} › Settings</h2>
|
||||
|
||||
Reference in New Issue
Block a user