Fix styles in CSL Preview window (#3873)

This commit is contained in:
Tom Najdek 2024-03-24 10:56:23 +01:00 committed by GitHub
parent 65db66eb33
commit a0658b5ada
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 47 additions and 32 deletions

View file

@ -24,25 +24,27 @@
Contributed by Julian Onions
*/
// eslint-disable-next-line no-unused-vars
var Zotero_CSL_Preview = new function () {
this.init = init;
this.refresh = refresh;
this.generateBibliography = generateBibliography;
this.lastContent = null;
function init() {
this.init = function () {
var menulist = document.getElementById("locale-menu");
Zotero.Styles.populateLocaleList(menulist);
menulist.value = Zotero.Prefs.get('export.lastLocale');;
menulist.value = Zotero.Prefs.get('export.lastLocale');
var iframe = document.getElementById('zotero-csl-preview-box');
iframe.contentDocument.documentElement.innerHTML = '<html><head><title></title></head><body><p>' + Zotero.getString('styles.preview.instructions') + '</p></body></html>';
}
function refresh() {
var iframe = document.getElementById('zotero-csl-preview-box');
this.updateIframe(Zotero.getString('styles.preview.instructions'));
window.matchMedia('(prefers-color-scheme: dark)').addEventListener("change", () => {
this.updateIframe(this.lastContent.content, this.lastContent.containerClass);
});
};
this.refresh = function () {
var items = Zotero.getActiveZoteroPane().getSelectedItems();
if (items.length === 0) {
iframe.contentDocument.documentElement.innerHTML = '<html><head><title></title></head><body><p style="color: red">' + Zotero.getString('styles.editor.warning.noItems') + '</p></body></html>';
this.updateIframe(Zotero.getString('styles.editor.warning.noItems'), 'warning');
return;
}
var progressWin = new Zotero.ProgressWindow();
@ -52,11 +54,12 @@ var Zotero_CSL_Preview = new function() {
progressWin.addLines(document.title, icon);
progressWin.show();
progressWin.startCloseTimer();
var f = function() {
// Give progress window time to appear
setTimeout(() => {
var d = new Date();
var styles = Zotero.Styles.getVisible();
// XXX needs its own string really for the title!
var str = '<html><head><title></title></head><body>';
var str = '<div>';
for (let style of styles) {
if (style.source) {
continue;
@ -65,7 +68,7 @@ var Zotero_CSL_Preview = new function() {
let bib;
let err = false;
try {
bib = generateBibliography(style);
bib = this.generateBibliography(style);
}
catch (e) {
err = e;
@ -78,18 +81,14 @@ var Zotero_CSL_Preview = new function() {
}
}
str += '</body></html>';
iframe.contentDocument.documentElement.innerHTML = str;
str += '</div>';
this.updateIframe(str);
Zotero.debug(`Generated previews in ${new Date() - d} ms`);
}, 100);
};
// Give progress window time to appear
setTimeout(f, 100);
}
function generateBibliography(style) {
var iframe = document.getElementById('zotero-csl-preview-box');
this.generateBibliography = function (style) {
var items = Zotero.getActiveZoteroPane().getSelectedItems();
if (items.length === 0) {
return '';
@ -123,7 +122,23 @@ var Zotero_CSL_Preview = new function() {
styleEngine.free();
return '<p>' + citations + '</p>' + bibliography;
};
this.updateIframe = function (content, containerClass = 'preview') {
this.lastContent = { content, containerClass };
const isDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
let iframe = document.getElementById('zotero-csl-preview-box');
iframe.contentDocument.documentElement.innerHTML = `<html>
<head>
<title></title>
<link rel="stylesheet" href="chrome://zotero-platform/content/zotero.css">
<style>
html {
color-scheme: ${isDarkMode ? "dark" : "light"};
}
</style>
</head>
<body id="csl-edit-preview"><div class="${containerClass} zotero-dialog">${content}</div></body>
</html>`;
};
}();

View file

@ -25,7 +25,7 @@
Contributed by Julian Onions
-->
<?xml-stylesheet href="chrome://global/skin/global.css"?>
<?xml-stylesheet href="chrome://zotero/skin/zotero.css" type="text/css"?>
<?xml-stylesheet href="chrome://zotero-platform/content/zotero.css"?>
<!DOCTYPE window [
<!ENTITY % cslpreviewDTD SYSTEM "chrome://zotero/locale/cslpreview.dtd"> %cslpreviewDTD;
@ -59,7 +59,7 @@
<menulist id="locale-menu" oncommand="Zotero.Prefs.set('export.lastLocale', this.value); Zotero_CSL_Preview.refresh()"/>
</hbox>
<iframe id="zotero-csl-preview-box" flex="1" style="padding: 0 1em; background:white;" overflow="auto" type="content"/>
<iframe id="zotero-csl-preview-box" flex="1" overflow="auto" type="content"/>
</vbox>
</window>