mirrors/etherpad-lite
1
0
Fork 0
mirror of https://github.com/ether/etherpad-lite.git synced 2025-04-21 07:56:16 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

lint: skin-variants (#4603)

Browse source 
* lint: skin-variants

* for squash: Fix attachment of event listener

Before this PR the statement was outside the function. I'm assuming
the move into the function body was accidental, so move it back out.

* for squash: Preserve order of function calls

Co-authored-by: Richard Hansen <rhansen@rhansen.org>
This commit is contained in:
John McLear 2021-01-30 07:32:12 +00:00 • committed by GitHub
parent 29179e512f
commit 5bcd6f44a5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 21 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

42
src/static/js/skin_variants.js
View file

@ -1,19 +1,14 @@
// Specific hash to display the skin variants builder popup 'use strict';
if (window.location.hash.toLowerCase() == '#skinvariantsbuilder') {
$('#skin-variants').addClass('popup-show');
$('.skin-variant').change(() => { // Specific hash to display the skin variants builder popup
updateSkinVariantsClasses(); if (window.location.hash.toLowerCase() === '#skinvariantsbuilder') {
}); $('#skin-variants').addClass('popup-show');
const containers = ['editor', 'background', 'toolbar']; const containers = ['editor', 'background', 'toolbar'];
const colors = ['super-light', 'light', 'dark', 'super-dark']; const colors = ['super-light', 'light', 'dark', 'super-dark'];
updateCheckboxFromSkinClasses();
updateSkinVariantsClasses();
// add corresponding classes when config change // add corresponding classes when config change
function updateSkinVariantsClasses() { const updateSkinVariantsClasses = () => {
const domsToUpdate = [ const domsToUpdate = [
$('html'), $('html'),
$('iframe[name=ace_outer]').contents().find('html'), $('iframe[name=ace_outer]').contents().find('html'),
@ -27,23 +22,21 @@ if (window.location.hash.toLowerCase() == '#skinvariantsbuilder') {
domsToUpdate.forEach((el) => { el.removeClass('full-width-editor'); }); domsToUpdate.forEach((el) => { el.removeClass('full-width-editor'); });
const new_classes = []; const newClasses = [];
$('select.skin-variant-color').each(function () { $('select.skin-variant-color').each(function () {
new_classes.push(`${$(this).val()}-${$(this).data('container')}`); newClasses.push(`${$(this).val()}-${$(this).data('container')}`);
}); });
if ($('#skin-variant-full-width').is(':checked')) new_classes.push('full-width-editor'); if ($('#skin-variant-full-width').is(':checked')) newClasses.push('full-width-editor');
domsToUpdate.forEach((el) => { el.addClass(new_classes.join(' ')); }); domsToUpdate.forEach((el) => { el.addClass(newClasses.join(' ')); });
$('#skin-variants-result').val(`"skinVariants": "${new_classes.join(' ')}",`); $('#skin-variants-result').val(`"skinVariants": "${newClasses.join(' ')}",`);
} };
// run on init // run on init
function updateCheckboxFromSkinClasses() { const updateCheckboxFromSkinClasses = () => {
$('html').attr('class').split(' ').forEach((classItem) => { $('html').attr('class').split(' ').forEach((classItem) => {
var container = classItem.split('-').slice(-1); const container = classItem.substring(classItem.lastIndexOf('-') + 1, classItem.length);
var container = classItem.substring(classItem.lastIndexOf('-') + 1, classItem.length);
if (containers.indexOf(container) > -1) { if (containers.indexOf(container) > -1) {
const color = classItem.substring(0, classItem.lastIndexOf('-')); const color = classItem.substring(0, classItem.lastIndexOf('-'));
$(`.skin-variant-color[data-container="${container}"`).val(color); $(`.skin-variant-color[data-container="${container}"`).val(color);
@ -51,5 +44,12 @@ if (window.location.hash.toLowerCase() == '#skinvariantsbuilder') {
}); });
$('#skin-variant-full-width').prop('checked', $('html').hasClass('full-width-editor')); $('#skin-variant-full-width').prop('checked', $('html').hasClass('full-width-editor'));
} };
$('.skin-variant').change(() => {
updateSkinVariantsClasses();
});
updateCheckboxFromSkinClasses();
updateSkinVariantsClasses();
} }