{
const form = document.getElementById("mgSupportForm");
if (!form) return;
const qtyPre = document.getElementById("mg_preorder_quantity");
const qtyUnder = document.getElementById("mg_underwritten_copies");
const piece = document.getElementById("mg_piece_selection");
const email = document.getElementById("mg_email");
const address = document.getElementById("mg_address");
const notes = document.getElementById("mg_notes");
const framingGroup = document.getElementById("mgFramingGroup");
const framingInputs = form.querySelectorAll('input[name="framing_preference"]');
const warnLine = document.getElementById("mgSubmitWarning");
const summary = document.getElementById("mgSubmissionSummary");
const toInt = (v) => {
const n = parseInt(String(v || "").trim(), 10);
return Number.isFinite(n) ? n : 0;
};
const getCheckedValue = (nodes) => {
for (const n of nodes) if (n.checked) return n.value;
return "";
};
const setWarnLine = (on) => {
if (!warnLine) return;
warnLine.classList.toggle("is-active", !!on);
};
const markFramingWarn = (on) => {
if (!framingGroup) return;
framingGroup.querySelectorAll(".mg-yn span").forEach((s) => {
s.classList.toggle("mg-warn", !!on);
});
};
const clearWarn = () => {
qtyPre?.classList.remove("mg-warn");
qtyUnder?.classList.remove("mg-warn");
piece?.classList.remove("mg-warn");
email?.classList.remove("mg-warn");
address?.classList.remove("mg-warn");
markFramingWarn(false);
};
const validate = () => {
clearWarn();
setWarnLine(false);
let ok = true;
const pre = toInt(qtyPre?.value);
const under = toInt(qtyUnder?.value);
if (pre <= 0 && under <= 0) {
qtyPre?.classList.add("mg-warn");
qtyUnder?.classList.add("mg-warn");
ok = false;
}
if (!String(piece?.value || "").trim()) {
piece?.classList.add("mg-warn");
ok = false;
}
if (!String(email?.value || "").trim() || (email && !email.checkValidity())) {
email?.classList.add("mg-warn");
ok = false;
}
if (!String(address?.value || "").trim()) {
address?.classList.add("mg-warn");
ok = false;
}
const framingVal = getCheckedValue(framingInputs);
if (!framingVal) {
markFramingWarn(true);
ok = false;
}
if (!ok) setWarnLine(true);
return { ok, pre, under, framingVal };
};
for (const el of [qtyPre, qtyUnder]) {
if (!el) continue;
el.addEventListener("input", () => {
el.value = el.value.replace(/[^\d]/g, "");
});
}
const revalidateOn = (el, events) => {
if (!el) return;
const evts = Array.isArray(events) ? events : [events];
evts.forEach((evt) => {
el.addEventListener(evt, () => {
if (!warnLine?.classList.contains("is-active")) return;
validate();
});
});
};
revalidateOn(qtyPre, ["input", "focus", "blur"]);
revalidateOn(qtyUnder, ["input", "focus", "blur"]);
revalidateOn(piece, ["input", "focus", "blur"]);
revalidateOn(email, ["input", "focus", "blur"]);
revalidateOn(address, ["input", "focus", "blur"]);
framingInputs.forEach((r) => {
r.addEventListener("change", () => {
if (!warnLine?.classList.contains("is-active")) return;
validate();
});
});
form.addEventListener("submit", (e) => {
const { ok, pre, under, framingVal } = validate();
if (!ok) {
e.preventDefault();
return;
}
if (summary) {
summary.value = [
`Pre-order quantity: ${pre || 0}`,
`Underwritten copies: ${under || 0}`,
`Piece selection: ${String(piece?.value || "").trim()}`,
`Framing: ${framingVal}`,
`Email: ${String(email?.value || "").trim()}`,
`Shipping address: ${String(address?.value || "").trim()}`,
`Message to Rizzoli: ${String(notes?.value || "").trim()}`
].join("\n");
}
});
})();
// ]]>