Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore(badges): save in-progress changes — background_image_path, cfg_json support, template form TS fix, view boolean fixes

Browse Source
This commit is contained in:
Scott Idem
2026-04-07 13:57:02 -04:00
parent 1e178c14e7
commit 34bf823987
5 changed files with 245 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
src/routes/events/[event_id]/(badges)/templates/ae_comp__badge_template_form.svelte
View File

@@ -30,6 +30,7 @@ function prevent_default(fn: () => void) {
// Form fields (Runes)
let name = $state('');
let background_image_path = $state('');
let header_path = $state('');
let logo_path = $state('');
let header_row_1 = $state('');
@@ -44,6 +45,14 @@ let ticket_1_text = $state('');
let ticket_2_text = $state('');
let ticket_3_text = $state('');
// Advanced / cfg_json states
let advanced_open = $state(false);
let existing_cfg_raw = $state('');
let cfg_hide_badge_header = $state(false);
let cfg_hide_badge_footer = $state(false);
let cfg_show_qr_front = $state(false);
let cfg_show_qr_back = $state(true);
let submit_status = $state('idle'); // idle, loading, success, error
// Load template data if in edit mode
@@ -65,19 +74,45 @@ async function load_template(id: string) {
});
if (template_obj) {
name = template_obj.name || '';
background_image_path = template_obj.background_image_path || '';
header_path = template_obj.header_path || '';
logo_path = template_obj.logo_path || '';
header_row_1 = template_obj.header_row_1 || '';
header_row_2 = template_obj.header_row_2 || '';
secondary_header_path = template_obj.secondary_header_path || '';
footer_text = template_obj.footer_text || '';
show_qr_front = template_obj.show_qr_front ?? true;
show_qr_back = template_obj.show_qr_back ?? true;
wireless_ssid = template_obj.wireless_ssid || '';
wireless_password = template_obj.wireless_password || '';
ticket_1_text = template_obj.ticket_1_text || '';
ticket_2_text = template_obj.ticket_2_text || '';
ticket_3_text = template_obj.ticket_3_text || '';
// Preserve existing cfg_json and expose cfg flags in the form
existing_cfg_raw = template_obj.cfg_json || '';
let parsed_cfg: any = {};
try {
parsed_cfg = existing_cfg_raw
? typeof existing_cfg_raw === 'string'
? JSON.parse(existing_cfg_raw)
: existing_cfg_raw
: {};
} catch {
parsed_cfg = {};
}
cfg_hide_badge_header = parsed_cfg.hide_badge_header ?? false;
cfg_hide_badge_footer = parsed_cfg.hide_badge_footer ?? false;
cfg_show_qr_front = parsed_cfg.hasOwnProperty('show_qr_front')
? parsed_cfg.show_qr_front
: (template_obj.show_qr_front ?? false);
cfg_show_qr_back = parsed_cfg.hasOwnProperty('show_qr_back')
? parsed_cfg.show_qr_back
: (template_obj.show_qr_back ?? true);
// Keep top-level fields in sync for backward compatibility
show_qr_front = cfg_show_qr_front;
show_qr_back = cfg_show_qr_back;
submit_status = 'idle';
} else {
submit_status = 'error';
@@ -91,21 +126,42 @@ async function load_template(id: string) {
async function handle_submit() {
submit_status = 'loading';
// Merge cfg_json preserving unknown keys, then set our cfg flags
let cfg_obj: any = {};
try {
cfg_obj = existing_cfg_raw
? typeof existing_cfg_raw === 'string'
? JSON.parse(existing_cfg_raw)
: existing_cfg_raw
: {};
} catch {
cfg_obj = {};
}
cfg_obj.hide_badge_header = cfg_hide_badge_header;
cfg_obj.hide_badge_footer = cfg_hide_badge_footer;
cfg_obj.show_qr_front = cfg_show_qr_front;
cfg_obj.show_qr_back = cfg_show_qr_back;
const data_to_save: key_val = {
name,
background_image_path,
header_path,
logo_path,
header_row_1,
header_row_2,
secondary_header_path,
footer_text,
show_qr_front,
show_qr_back,
// keep top-level show_qr fields in sync for backward compatibility
show_qr_front: cfg_show_qr_front,
show_qr_back: cfg_show_qr_back,
wireless_ssid,
wireless_password,
ticket_1_text,
ticket_2_text,
ticket_3_text
ticket_3_text,
cfg_json: JSON.stringify(cfg_obj)
};
try {
@@ -153,7 +209,17 @@ function handle_cancel() {
</label>
<label class="label">
<span>Header Path (URL)</span>
<span>Background Image Path (URL) — full-badge background, replaces header</span>
<input type="text" bind:value={background_image_path} class="input" />
</label>
{#if background_image_path}
<p class="text-xs text-amber-600 dark:text-amber-400">
⚠ When a background image is set, the header path and logo/text header are hidden on the badge front — the background image covers the full badge.
</p>
{/if}
<label class="label">
<span>Header Path (URL) — top banner image (used when no background image)</span>
<input type="text" bind:value={header_path} class="input" />
</label>
<label class="label">
@@ -214,6 +280,35 @@ function handle_cancel() {
></textarea>
</label>
<section class="border-t pt-3">
<button type="button" class="text-sm text-surface-500" onclick={() => (advanced_open = !advanced_open)}>
Advanced (cfg_json) {advanced_open ? '▲' : '▼'}
</button>
{#if advanced_open}
<div class="grid grid-cols-1 gap-2 pt-2">
<label class="label flex items-center gap-2">
<input type="checkbox" bind:checked={cfg_hide_badge_header} class="checkbox" />
<span>Hide badge header</span>
</label>
<label class="label flex items-center gap-2">
<input type="checkbox" bind:checked={cfg_hide_badge_footer} class="checkbox" />
<span>Hide badge footer</span>
</label>
<label class="label flex items-center gap-2">
<input type="checkbox" bind:checked={cfg_show_qr_front} class="checkbox" />
<span>Show QR on Front (cfg_json)</span>
</label>
<label class="label flex items-center gap-2">
<input type="checkbox" bind:checked={cfg_show_qr_back} class="checkbox" />
<span>Show QR on Back (cfg_json)</span>
</label>
<p class="text-xs text-surface-400 italic">
These values are saved into <code>cfg_json</code>. Existing cfg_json keys are preserved.
</p>
</div>
{/if}
</section>
<div class="flex justify-end gap-2">
<button
type="button"