milas/jellyfish-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Use static imports for html templates

Browse source
This commit is contained in:
Bill Thornton 2020-11-25 00:17:24 -05:00
parent 75e1fc4605
commit d8f2cc1245
31 changed files with 1010 additions and 1041 deletions
Download patch file Download diff file Expand all files Collapse all files

119
src/components/viewSettings/viewSettings.js
View file

@ -10,6 +10,7 @@ import '../../elements/emby-select/emby-select';
import 'material-design-icons-iconfont';
import '../formdialog.css';
import '../../assets/css/flexstyles.scss';
import template from './viewSettings.template.html';
function onSubmit(e) {
e.preventDefault();
@ -59,81 +60,79 @@ class ViewSettings {
}
show(options) {
return new Promise(function (resolve, reject) {
import('./viewSettings.template.html').then(({default: template}) => {
const dialogOptions = {
removeOnClose: true,
scrollY: false
};
const dialogOptions = {
removeOnClose: true,
scrollY: false
};
if (layoutManager.tv) {
dialogOptions.size = 'fullscreen';
if (layoutManager.tv) {
dialogOptions.size = 'fullscreen';
} else {
dialogOptions.size = 'small';
}
const dlg = dialogHelper.createDialog(dialogOptions);
dlg.classList.add('formDialog');
let html = '';
html += '<div class="formDialogHeader">';
html += '<button is="paper-icon-button-light" class="btnCancel hide-mouse-idle-tv" tabindex="-1"><span class="material-icons arrow_back"></span></button>';
html += '<h3 class="formDialogHeaderTitle">${Settings}</h3>';
html += '</div>';
html += template;
dlg.innerHTML = globalize.translateHtml(html, 'core');
const settingElements = dlg.querySelectorAll('.viewSetting');
for (const settingElement of settingElements) {
if (options.visibleSettings.indexOf(settingElement.getAttribute('data-settingname')) === -1) {
settingElement.classList.add('hide');
settingElement.classList.add('hiddenFromViewSettings');
} else {
dialogOptions.size = 'small';
settingElement.classList.remove('hide');
settingElement.classList.remove('hiddenFromViewSettings');
}
}
const dlg = dialogHelper.createDialog(dialogOptions);
initEditor(dlg, options.settings);
dlg.classList.add('formDialog');
dlg.querySelector('.selectImageType').addEventListener('change', function () {
showIfAllowed(dlg, '.chkTitleContainer', this.value !== 'list');
showIfAllowed(dlg, '.chkYearContainer', this.value !== 'list');
});
let html = '';
dlg.querySelector('.btnCancel').addEventListener('click', function () {
dialogHelper.close(dlg);
});
html += '<div class="formDialogHeader">';
html += '<button is="paper-icon-button-light" class="btnCancel hide-mouse-idle-tv" tabindex="-1"><span class="material-icons arrow_back"></span></button>';
html += '<h3 class="formDialogHeaderTitle">${Settings}</h3>';
if (layoutManager.tv) {
centerFocus(dlg.querySelector('.formDialogContent'), false, true);
}
html += '</div>';
let submitted;
html += template;
dlg.querySelector('.selectImageType').dispatchEvent(new CustomEvent('change', {}));
dlg.innerHTML = globalize.translateHtml(html, 'core');
const settingElements = dlg.querySelectorAll('.viewSetting');
for (const settingElement of settingElements) {
if (options.visibleSettings.indexOf(settingElement.getAttribute('data-settingname')) === -1) {
settingElement.classList.add('hide');
settingElement.classList.add('hiddenFromViewSettings');
} else {
settingElement.classList.remove('hide');
settingElement.classList.remove('hiddenFromViewSettings');
}
}
initEditor(dlg, options.settings);
dlg.querySelector('.selectImageType').addEventListener('change', function () {
showIfAllowed(dlg, '.chkTitleContainer', this.value !== 'list');
showIfAllowed(dlg, '.chkYearContainer', this.value !== 'list');
});
dlg.querySelector('.btnCancel').addEventListener('click', function () {
dialogHelper.close(dlg);
});
dlg.querySelector('form').addEventListener('change', function () {
submitted = true;
}, true);
dialogHelper.open(dlg).then(function () {
if (layoutManager.tv) {
centerFocus(dlg.querySelector('.formDialogContent'), false, true);
centerFocus(dlg.querySelector('.formDialogContent'), false, false);
}
let submitted;
if (submitted) {
saveValues(dlg, options.settings, options.settingsKey);
resolve();
return;
}
dlg.querySelector('.selectImageType').dispatchEvent(new CustomEvent('change', {}));
dlg.querySelector('form').addEventListener('change', function () {
submitted = true;
}, true);
dialogHelper.open(dlg).then(function () {
if (layoutManager.tv) {
centerFocus(dlg.querySelector('.formDialogContent'), false, false);
}
if (submitted) {
saveValues(dlg, options.settings, options.settingsKey);
resolve();
return;
}
reject();
});
reject();
});
});
}