mirror of
https://github.com/ether/etherpad-lite.git
synced 2025-04-21 07:56:16 -04:00
lint: skin-variants (#4603)
* 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:
parent
29179e512f
commit
5bcd6f44a5
1 changed files with 21 additions and 21 deletions
|
@ -1,19 +1,14 @@
|
|||
// Specific hash to display the skin variants builder popup
|
||||
if (window.location.hash.toLowerCase() == '#skinvariantsbuilder') {
|
||||
$('#skin-variants').addClass('popup-show');
|
||||
'use strict';
|
||||
|
||||
$('.skin-variant').change(() => {
|
||||
updateSkinVariantsClasses();
|
||||
});
|
||||
// Specific hash to display the skin variants builder popup
|
||||
if (window.location.hash.toLowerCase() === '#skinvariantsbuilder') {
|
||||
$('#skin-variants').addClass('popup-show');
|
||||
|
||||
const containers = ['editor', 'background', 'toolbar'];
|
||||
const colors = ['super-light', 'light', 'dark', 'super-dark'];
|
||||
|
||||
updateCheckboxFromSkinClasses();
|
||||
updateSkinVariantsClasses();
|
||||
|
||||
// add corresponding classes when config change
|
||||
function updateSkinVariantsClasses() {
|
||||
const updateSkinVariantsClasses = () => {
|
||||
const domsToUpdate = [
|
||||
$('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'); });
|
||||
|
||||
const new_classes = [];
|
||||
const newClasses = [];
|
||||
$('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
|
||||
function updateCheckboxFromSkinClasses() {
|
||||
const updateCheckboxFromSkinClasses = () => {
|
||||
$('html').attr('class').split(' ').forEach((classItem) => {
|
||||
var container = classItem.split('-').slice(-1);
|
||||
|
||||
var container = classItem.substring(classItem.lastIndexOf('-') + 1, classItem.length);
|
||||
const container = classItem.substring(classItem.lastIndexOf('-') + 1, classItem.length);
|
||||
if (containers.indexOf(container) > -1) {
|
||||
const color = classItem.substring(0, classItem.lastIndexOf('-'));
|
||||
$(`.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').change(() => {
|
||||
updateSkinVariantsClasses();
|
||||
});
|
||||
|
||||
updateCheckboxFromSkinClasses();
|
||||
updateSkinVariantsClasses();
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue