Move widget previews into effect cards
This commit is contained in:
+21
-6
@@ -143,12 +143,12 @@ $("#settingsForm").defaultLanguage.addEventListener("change", () => {
|
||||
renderLauncherPreview();
|
||||
});
|
||||
$("#settingsForm").addEventListener("input", (event) => {
|
||||
if (event.target.matches("[name='launcherShape'], [name='launcherBreathe'], [name='launcherRing'], [name='launcherHoverLabel'], [name='copyOnlineLabel']")) {
|
||||
if (event.target.matches("[name='launcherShape'], [name='launcherBreathe'], [name='launcherRing'], [name='launcherHoverLabel'], [name='copyOnlineLabel'], [name='messagePulse'], [name='messageBadge'], [name='messageLabel'], [name='messageWiggle'], [name='copyNewReplyLabel']")) {
|
||||
renderLauncherPreview();
|
||||
}
|
||||
});
|
||||
$("#settingsForm").addEventListener("change", (event) => {
|
||||
if (event.target.matches("[name='launcherShape'], [name='launcherBreathe'], [name='launcherRing'], [name='launcherHoverLabel']")) {
|
||||
if (event.target.matches("[name='launcherShape'], [name='launcherBreathe'], [name='launcherRing'], [name='launcherHoverLabel'], [name='messagePulse'], [name='messageBadge'], [name='messageLabel'], [name='messageWiggle']")) {
|
||||
renderLauncherPreview();
|
||||
}
|
||||
});
|
||||
@@ -641,22 +641,37 @@ function renderWidgetCopyFields(language) {
|
||||
|
||||
function renderLauncherPreview() {
|
||||
const preview = $("#launcherPreview");
|
||||
const messagePreview = $("#messageEffectPreview");
|
||||
const form = $("#settingsForm");
|
||||
if (!preview || !form) return;
|
||||
if (!preview || !messagePreview || !form) return;
|
||||
const shape = ["circle", "bubble", "messenger", "whatsapp"].includes(form.launcherShape.value)
|
||||
? form.launcherShape.value
|
||||
: "bubble";
|
||||
const brand = normalizeHexColor(form.brandHex.value) || normalizeHexColor(form.brand.value) || "#0f8f6f";
|
||||
preview.style.setProperty("--preview-brand", brand);
|
||||
preview.className = [
|
||||
const baseClasses = [
|
||||
"launcher-preview",
|
||||
`preview-shape-${shape}`,
|
||||
`preview-shape-${shape}`
|
||||
];
|
||||
preview.style.setProperty("--preview-brand", brand);
|
||||
messagePreview.style.setProperty("--preview-brand", brand);
|
||||
preview.className = [
|
||||
...baseClasses,
|
||||
$("#onlineToggle").checked ? "online" : "",
|
||||
form.launcherBreathe.checked ? "effect-breathe" : "",
|
||||
form.launcherRing.checked ? "effect-ring" : "",
|
||||
form.launcherHoverLabel.checked ? "show-label" : ""
|
||||
].filter(Boolean).join(" ");
|
||||
messagePreview.className = [
|
||||
...baseClasses,
|
||||
form.messagePulse.checked ? "notify-pulse" : "",
|
||||
form.messageBadge.checked ? "show-badge" : "",
|
||||
form.messageLabel.checked ? "show-label" : "",
|
||||
form.messageWiggle.checked ? "notify-wiggle" : ""
|
||||
].filter(Boolean).join(" ");
|
||||
const label = preview.querySelector(".launcher-preview-label");
|
||||
if (label) label.textContent = form.copyOnlineLabel.value || "Napiste nam";
|
||||
const messageLabel = messagePreview.querySelector(".launcher-preview-label");
|
||||
if (messageLabel) messageLabel.textContent = form.copyNewReplyLabel.value || "Nova odpoved";
|
||||
}
|
||||
|
||||
function widgetCopyForAdmin(settings, language) {
|
||||
|
||||
Reference in New Issue
Block a user