/* This file is part of Ezra Bible App.
Copyright (C) 2019 - 2023 Ezra Bible App Development Team <contact@ezrabibleapp.net>
Ezra Bible App is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 2 of the License, or
(at your option) any later version.
Ezra Bible App is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Ezra Bible App. See the file LICENSE.
If not, see <http://www.gnu.org/licenses/>. */
const { html } = require('../../helpers/ezra_helper.js');
module.exports.lockDialogForAction = function (elementId) {
elementId = '#' + elementId;
// Disable close button of dialog, at this point we don't allow the user to close the dialog any longer
$('.module-assistant-dialog').find('.ui-dialog-titlebar-close').hide();
// Disable the back button, there is no way back from here
$($(elementId).find('.actions').find('li')[0]).addClass('disabled');
// Disable the finish button as long as we haven't finished
$($(elementId).find('.actions').find('li')[2]).addClass('disabled');
};
module.exports.unlockDialog = function (elementId) {
elementId = '#' + elementId;
// Enable the finish button
$($(elementId).find('.actions').find('li')[2]).removeClass('disabled');
// Enable close button of dialog
$('.module-assistant-dialog').find('.ui-dialog-titlebar-close').show();
};
module.exports.resetModuleAssistantContent = function (container, htmlTemplate) {
container.innerHTML = '';
const $container = $(container);
// light version of $.fn.steps('destroy')
const eventNamespace = $container.data("eventNamespace");
if (eventNamespace) {
// Remove virtual data objects from the wizard
$container.unbind(eventNamespace).removeData("uid").removeData("options")
.removeData("state").removeData("steps").removeData("eventNamespace")
.find(".actions a").unbind(eventNamespace);
}
container.appendChild(htmlTemplate);
};
module.exports.sortByText = function (strA, strB) {
return strA.localeCompare(strB);
};
/**
* Generates an HTML fragment with title and checkboxes from array of items
* @param {Array} arr array of items
* @param {Set<string>} selected array of values that will be shown as checked
* @param {string=} sectionTitle Section title
* @param {object} options additional options for the layout
* @param {number} [options.columns='auto-fill'] number of columns
* @param {boolean} [options.info=false] display info icon and generate event on click
* @param {boolean} [options.extraIndent=false] add extra indent to make sure that all item icons will be visible
* @param {string} [options.rowGap="0.5em"] CSS size for the gap between the rows
* @param {boolean} [options.limitRows=false] Explicity set grid rows height (for performance)
* @returns {DocumentFragment} HTML fragment with appropriate <assistant-checkbox> elements for each item
*/
module.exports.listCheckboxSection = function (arr, selected, sectionTitle="", options={}) {
if (arr.length === 0) {
return '';
}
options = {
columns: 'auto-fill',
info: false,
extraIndent: false,
rowGap: '0.5em',
...options
};
var checkboxes = [];
if (arr instanceof Map) {
const sortedKeys = [...arr.keys()].sort(this.sortByText);
for (const key of sortedKeys) {
const item = arr.get(key);
if (item.count === undefined || item.count && item.count !== 0) {
if (options.info) {
checkboxes.push('<div style="display: flex;">');
}
checkboxes.push(generateCheckbox(item, selected.has(typeof item === 'string' ? item : item.code), options));
if (options.info) {
checkboxes.push(generateInfoButton());
checkboxes.push('</div>');
}
}
}
} else {
for (const item of arr) {
if (item.count === undefined || item.count && item.count !== 0) {
checkboxes.push(generateCheckbox(item, selected.has(typeof item === 'string' ? item : item.code), options));
}
}
}
const paddingLeft = options.extraIndent ? '1em' : '0';
const rowHight = options.limitRows ? '1.8em' : 'auto';
const template = html`
<h3 style="margin: 1em 0 0;">${sectionTitle}</h3>
<div class="language-list" style="display: grid; grid-template-columns: repeat(${options.columns}, minmax(15em, 1fr)); grid-row-gap: ${options.rowGap}; grid-column-gap: 1em; grid-auto-flow: dense; padding: 0.5em 0 0.5em ${paddingLeft}; grid-auto-rows:${rowHight};">
${checkboxes}
</div>`;
return template.content;
};
function generateCheckbox(item, checked, options) {
if (typeof item === 'string') {
return `<assistant-checkbox code="${item}" ${checked ? 'checked' : ''}>${item}</assistant-checkbox>`;
} else {
const { code, text, description, count, disabled, ...rest } = item;
const style = text && text.trim().length > 22 && (options.columns === 'auto-fill' || options.columns > 1) ? 'style="grid-column-end: span 2"' : '';
const extraAttr = Object.entries(rest).map(([attr, val]) => `${attr}="${val}"`);
const checkbox = `
<assistant-checkbox
${style}
code="${code}"
${checked ? 'checked' : ''}
${disabled ? 'disabled' : ''}
${count ? `count="${count}"` : ''}
${description ? `description="${description}"` : ''}
${options.info ? 'flex-align-top' : ''}
${extraAttr.join(' ')}>
${text ? text.trim() : code}
</assistant-checkbox>`;
return checkbox;
}
}
function generateInfoButton() {
return `<a href="#" class="module-info-button" title="${i18n.t("module-assistant.step-modules.show-module-info")}" style="margin-inline-start: auto;"><svg style="height: 1.1rem; fill: var(--accent-color, gray);" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!-- Font Awesome Free 5.15.3 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) --><path d="M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z"/></svg></a>`;
}
module.exports.localizeContainer = function (container, module_type) {
var context;
if (module_type == 'BIBLE') {
context = i18n.t("module-assistant.module-type-bible", {context: 'gender'});
} else if (module_type == 'DICT') {
context = i18n.t("module-assistant.module-type-dict", {context: 'gender'});
} else if (module_type == 'COMMENTARY') {
context = i18n.t("module-assistant.module-type-commentary", {context: 'gender'});
}
container.querySelectorAll('[i18n]').forEach(element => {
element.innerHTML = i18n.t(element.getAttribute('i18n'),
{
module_type,
context,
interpolation: {
alwaysFormat: true,
}
});
});
};
module.exports.localizeText = function (key, data) {
var context;
if (typeof data === 'string') {
if (data == 'BIBLE') {
context = i18n.t("module-assistant.module-type-bible", {context: 'gender'});
} else if (data == 'DICT') {
context = i18n.t("module-assistant.module-type-dict", {context: 'gender'});
} else if (data == 'COMMENTARY') {
context = i18n.t("module-assistant.module-type-commentary", {context: 'gender'});
}
data = { module_type: data };
}
return i18n.t(key,
{
...data,
context,
interpolation: {
alwaysFormat: true,
}
});
};
Source