') || textToRender.trim().startsWith('<')) {
+ if (textToRender.trim().startsWith('
') || textToRender.trim().startsWith("<")) {
body.innerHTML = textToRender;
} else {
body.innerHTML = renderMarkdown(textToRender);
@@ -4775,10 +4685,7 @@ async function saveOpenNoteEditorModal(modal) {
return;
}
- const changed =
- state.hasChanges ||
- title !== (state.lastSavedTitle || "") ||
- markdown !== (state.lastSavedMarkdown || "");
+ const changed = state.hasChanges || title !== (state.lastSavedTitle || "") || markdown !== (state.lastSavedMarkdown || "");
if (!changed || state.isSaving) return;
@@ -5004,14 +4911,18 @@ window.setNoteFilter = function (noteId, filterKey, editUrl) {
if (card) {
const colorClass = Array.from(card.classList).find((cls) => cls.startsWith("note-color-"));
const color = colorClass ? colorClass.replace("note-color-", "") : card.dataset.color || "default";
- applyNoteVisualState(card, { color, filter: normalizedFilterKey });
+ const background = getElementVisualBackground(card);
+ const fontColor = getElementVisualFontColor(card);
+ applyNoteVisualState(card, { color, filter: normalizedFilterKey, background, fontColor });
}
const bookmarkCard = document.querySelector(`.link-outer[data-id="${noteId}"]`);
if (bookmarkCard) {
const colorClass = Array.from(bookmarkCard.classList).find((cls) => cls.startsWith("note-color-"));
const color = colorClass ? colorClass.replace("note-color-", "") : bookmarkCard.dataset.color || "default";
- applyNoteVisualState(bookmarkCard, { color, filter: normalizedFilterKey });
+ const background = getElementVisualBackground(bookmarkCard);
+ const fontColor = getElementVisualFontColor(bookmarkCard);
+ applyNoteVisualState(bookmarkCard, { color, filter: normalizedFilterKey, background, fontColor });
const palettePopup = bookmarkCard.querySelector(".bookmark-palette .palette-popup");
if (palettePopup) {
palettePopup.innerHTML = generateBookmarkPaletteButtons(noteId, editUrl, color, normalizedFilterKey);
@@ -5090,7 +5001,8 @@ window.setNoteBackground = function (noteId, backgroundKey, editUrl) {
const colorClass = Array.from(card.classList).find((cls) => cls.startsWith("note-color-"));
const color = colorClass ? colorClass.replace("note-color-", "") : card.dataset.color || "default";
const filter = card.dataset.filter || "none";
- applyNoteVisualState(card, { color, filter, background: normalizedBackgroundKey });
+ const fontColor = getElementVisualFontColor(card);
+ applyNoteVisualState(card, { color, filter, background: normalizedBackgroundKey, fontColor });
}
const bookmarkCard = document.querySelector(`.link-outer[data-id="${noteId}"]`);
@@ -5098,7 +5010,8 @@ window.setNoteBackground = function (noteId, backgroundKey, editUrl) {
const colorClass = Array.from(bookmarkCard.classList).find((cls) => cls.startsWith("note-color-"));
const color = colorClass ? colorClass.replace("note-color-", "") : bookmarkCard.dataset.color || "default";
const filter = bookmarkCard.dataset.filter || "none";
- applyNoteVisualState(bookmarkCard, { color, filter, background: normalizedBackgroundKey });
+ const fontColor = getElementVisualFontColor(bookmarkCard);
+ applyNoteVisualState(bookmarkCard, { color, filter, background: normalizedBackgroundKey, fontColor });
}
const modal = getOpenModalOverlay();
@@ -5611,17 +5524,16 @@ function openColorPickerPanel({ mode, entityId, editUrl, type }) {
let prevFontColorKey = "auto";
if ((mode || "entity") === "draft") {
const bgPanel = document.getElementById("shaarli-bg-studio");
- prevFontColorKey = bgPanel ? (bgPanel.dataset.fontColor || "auto") : "auto";
- } else
- if ((mode || "entity") === "modal") {
- const modal = getOpenModalOverlay();
- const modalCard = modal ? modal.querySelector(".note-modal") : null;
- prevFontColorKey = (modalCard && modalCard.dataset.fontColor) ? modalCard.dataset.fontColor : "auto";
- } else {
- const noteCard = document.querySelector(`.note-card[data-id="${entityId}"]`);
- const bookmarkCard = document.querySelector(`.link-outer[data-id="${entityId}"]`);
- prevFontColorKey = (noteCard && noteCard.dataset.fontColor) ? noteCard.dataset.fontColor : ((bookmarkCard && bookmarkCard.dataset.fontColor) ? bookmarkCard.dataset.fontColor : "auto");
- }
+ prevFontColorKey = bgPanel ? bgPanel.dataset.fontColor || "auto" : "auto";
+ } else if ((mode || "entity") === "modal") {
+ const modal = getOpenModalOverlay();
+ const modalCard = modal ? modal.querySelector(".note-modal") : null;
+ prevFontColorKey = modalCard && modalCard.dataset.fontColor ? modalCard.dataset.fontColor : "auto";
+ } else {
+ const noteCard = document.querySelector(`.note-card[data-id="${entityId}"]`);
+ const bookmarkCard = document.querySelector(`.link-outer[data-id="${entityId}"]`);
+ prevFontColorKey = noteCard && noteCard.dataset.fontColor ? noteCard.dataset.fontColor : bookmarkCard && bookmarkCard.dataset.fontColor ? bookmarkCard.dataset.fontColor : "auto";
+ }
panel.dataset.prevFontColorKey = prevFontColorKey;
} else {
panel.dataset.prevFontColorKey = "";
@@ -5634,25 +5546,24 @@ function openColorPickerPanel({ mode, entityId, editUrl, type }) {
if (bgPanel) {
prevColorKey = bgPanel.dataset.color || "default";
}
- } else
- if ((mode || "entity") === "modal") {
- const modal = getOpenModalOverlay();
- const modalCard = modal ? modal.querySelector(".note-modal") : null;
- if (modalCard) {
- const isCustom = modalCard.dataset.color === "custom";
- const cc = modalCard.dataset.customColor || "";
- prevColorKey = isCustom && cc ? `custom:${cc}` : getElementVisualColor(modalCard);
- }
- } else {
- const noteCard = document.querySelector(`.note-card[data-id="${entityId}"]`);
- const bookmarkCard = document.querySelector(`.link-outer[data-id="${entityId}"]`);
- const el = noteCard || bookmarkCard;
- if (el) {
- const isCustom = el.dataset.color === "custom";
- const cc = el.dataset.customColor || "";
- prevColorKey = isCustom && cc ? `custom:${cc}` : getElementVisualColor(el);
- }
+ } else if ((mode || "entity") === "modal") {
+ const modal = getOpenModalOverlay();
+ const modalCard = modal ? modal.querySelector(".note-modal") : null;
+ if (modalCard) {
+ const isCustom = modalCard.dataset.color === "custom";
+ const cc = modalCard.dataset.customColor || "";
+ prevColorKey = isCustom && cc ? `custom:${cc}` : getElementVisualColor(modalCard);
}
+ } else {
+ const noteCard = document.querySelector(`.note-card[data-id="${entityId}"]`);
+ const bookmarkCard = document.querySelector(`.link-outer[data-id="${entityId}"]`);
+ const el = noteCard || bookmarkCard;
+ if (el) {
+ const isCustom = el.dataset.color === "custom";
+ const cc = el.dataset.customColor || "";
+ prevColorKey = isCustom && cc ? `custom:${cc}` : getElementVisualColor(el);
+ }
+ }
panel.dataset.prevColorKey = prevColorKey;
} else {
panel.dataset.prevColorKey = "";
@@ -5706,14 +5617,36 @@ function openColorPickerPanel({ mode, entityId, editUrl, type }) {
const m = v - c;
let r, g, b;
- if (h < 60) { r = c; g = x; b = 0; }
- else if (h < 120) { r = x; g = c; b = 0; }
- else if (h < 180) { r = 0; g = c; b = x; }
- else if (h < 240) { r = 0; g = x; b = c; }
- else if (h < 300) { r = x; g = 0; b = c; }
- else { r = c; g = 0; b = x; }
+ if (h < 60) {
+ r = c;
+ g = x;
+ b = 0;
+ } else if (h < 120) {
+ r = x;
+ g = c;
+ b = 0;
+ } else if (h < 180) {
+ r = 0;
+ g = c;
+ b = x;
+ } else if (h < 240) {
+ r = 0;
+ g = x;
+ b = c;
+ } else if (h < 300) {
+ r = x;
+ g = 0;
+ b = c;
+ } else {
+ r = c;
+ g = 0;
+ b = x;
+ }
- const toHex = (n) => Math.round((n + m) * 255).toString(16).padStart(2, "0");
+ const toHex = (n) =>
+ Math.round((n + m) * 255)
+ .toString(16)
+ .padStart(2, "0");
return `#${toHex(r)}${toHex(g)}${toHex(b)}`.toUpperCase();
}
@@ -5731,7 +5664,7 @@ function openColorPickerPanel({ mode, entityId, editUrl, type }) {
let h = 0;
if (d !== 0) {
- if (max === r) h = ((g - b) / d + 6) % 6 * 60;
+ if (max === r) h = (((g - b) / d + 6) % 6) * 60;
else if (max === g) h = ((b - r) / d + 2) * 60;
else h = ((r - g) / d + 4) * 60;
}