From 8c2241e610f14259691fbc2319577b4f7d289647 Mon Sep 17 00:00:00 2001 From: Scott Idem Date: Fri, 10 Oct 2025 17:40:35 -0400 Subject: [PATCH] Work on badge rendering. --- src/lib/ae_journals/ae_journals_stores.ts | 2 +- .../[badge_id]/ae_comp__badge_obj_view.svelte | 926 ++++++++++-------- 2 files changed, 522 insertions(+), 406 deletions(-) diff --git a/src/lib/ae_journals/ae_journals_stores.ts b/src/lib/ae_journals/ae_journals_stores.ts index 55e288ea..6f0fb9fe 100644 --- a/src/lib/ae_journals/ae_journals_stores.ts +++ b/src/lib/ae_journals/ae_journals_stores.ts @@ -39,7 +39,7 @@ let journals_local_data_struct: key_val = { llm__api_base_url: 'https://ai.dgrzone.com/api', llm__api_model: 'dgrzone-deepseek-8b-quick', - llm__api_token: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjVhYjI2MzdlLThiMjktNGM2Zi05MzVhLWFkYjU1MDkwMGU5MCJ9.4y5AStXZJAVnWRlgG3lVV0-xKIfMzqdNRuInGwT0ThQ', + llm__api_token: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjVhYjI2MzdlLThiMjktNGM2Zi05MzVhLWFkYjU1MDkwMGU5MCJ9.VObfR91GrX3j1vHbHZqGsOWEyrL981cbSWWjaXfYbUQ', llm__api_dangerous_browser: false, // This allows for use of localhost. llm__stream: false, // Whether to use streaming or not. Not all APIs support this. llm__timeout_ms: 60000, // 60 seconds diff --git a/src/routes/events/[event_id]/(badges)/badges/[badge_id]/ae_comp__badge_obj_view.svelte b/src/routes/events/[event_id]/(badges)/badges/[badge_id]/ae_comp__badge_obj_view.svelte index e37a48c6..9be4ff4c 100644 --- a/src/routes/events/[event_id]/(badges)/badges/[badge_id]/ae_comp__badge_obj_view.svelte +++ b/src/routes/events/[event_id]/(badges)/badges/[badge_id]/ae_comp__badge_obj_view.svelte @@ -190,6 +190,10 @@ code_to_html.option_2['First Time '] = '' /* *** END *** This should be moved out */ +let full_name_class_size: string = $state('text-[.80in]'); +let professional_title_class_size: string = $state('text-[.40in]'); +let affiliations_class_size: string = $state('text-[.60in]'); +let location_class_size: string = $state('text-[.40in]'); let lq__event_badge_template_obj = $derived(liveQuery(async () => { if (log_lvl) { @@ -199,24 +203,49 @@ let lq__event_badge_template_obj = $derived(liveQuery(async () => { .get($lq__event_badge_obj?.event_badge_template_id); full_name_override = $lq__event_badge_obj?.full_name_override ?? $lq__event_badge_obj?.full_name; + longest_full_name_override_part = longest_str_part(full_name_override ?? ''); - // if (full_name_override) { - // let name_parts = full_name_override.trim().split(' '); - // longest_full_name_override_part = 0; - // for (let part of name_parts) { - // if (part.length > longest_full_name_override_part) { - // longest_full_name_override_part = part.length; - // } - // } - // } else { - // longest_full_name_override_part = 0; - // } + if (longest_full_name_override_part >= 9) { + full_name_class_size = 'text-[.70in]'; + } else if (longest_full_name_override_part >= 7) { + full_name_class_size = 'text-[.80in]'; + } else { + full_name_class_size = 'text-[.80in]'; + } professional_title_override = $lq__event_badge_obj?.professional_title_override ?? $lq__event_badge_obj?.professional_title; + longest_professional_title_override_part = longest_str_part(professional_title_override ?? ''); + if (longest_professional_title_override_part >= 13) { + professional_title_class_size = 'text-[.40in]'; + } else if (longest_professional_title_override_part >= 10) { + professional_title_class_size = 'text-[.40in]'; + } else if (longest_professional_title_override_part >= 7) { + professional_title_class_size = 'text-[.40in]'; + } else { + professional_title_class_size = 'text-[.40in]'; + } affiliations_override = $lq__event_badge_obj?.affiliations_override ?? $lq__event_badge_obj?.affiliations; + longest_affiliations_override_part = longest_str_part(affiliations_override ?? ''); location_override = $lq__event_badge_obj?.location_override ?? $lq__event_badge_obj?.location; + longest_location_override_part = longest_str_part(location_override ?? ''); + if (longest_location_override_part >= 55) { + location_class_size = 'text-[.30in]'; + } else if (longest_location_override_part >= 45) { + location_class_size = 'text-[.35in]'; + } else if (longest_location_override_part >= 35) { + location_class_size = 'text-[.40in]'; + } else if (longest_location_override_part >= 25) { + location_class_size = 'text-[.40in]'; + } else if (longest_location_override_part >= 20) { + location_class_size = 'text-[.40in]'; + } else if (longest_location_override_part >= 15) { + location_class_size = 'text-[.40in]'; + } else { + location_class_size = 'text-[.40in]'; + } + option_other_1_override = $lq__event_badge_obj?.option_other_1_override ?? $lq__event_badge_obj?.option_other_1; option_other_2_override = $lq__event_badge_obj?.option_other_2_override ?? $lq__event_badge_obj?.option_other_2; @@ -241,7 +270,20 @@ function preventDefault(fn) { }; } - +function longest_str_part(str: string) { + if (str) { + let parts = str.trim().split(' '); + let longest = 0; + for (let part of parts) { + if (part.length > longest) { + longest = part.length; + } + } + return longest; + } else { + return 0; + } +} let qr_data_url: any = $state(''); @@ -348,438 +390,444 @@ onkeypress={() => { items-stretch justify-center p-2 m-0 outline-2 outline-dashed outline-blue-500 + min-h-[6.0in] + max-w-[8.5in] overflow-visible " > + {#if $lq__event_badge_obj && $lq__event_badge_template_obj} - -
+ + Front of badge + + + +
+ + + +
+

+ Show list of fields that they can edit here. This may need to broken down in to sections that can be collapsed. +

+
    +
  • Full Name
    • +
  • Professional Title
    • +
  • Affiliations
    • +
  • Location
    • +
  • Option Ticket 1
    • +
  • Option Ticket 2
    • +
  • Option Ticket 3
    • +
  • Option Other 1
    • +
  • Option Other 2
    • +
  • Badge Type
    • +
  • Allow Tracking
    • +
  • Show Print Message
    • +
  • Hide QR Code
    • +
+
+ +
+ + {#if $lq__event_badge_template_obj.header_path}
-

- Show list of fields that they can edit here. This may need to broken down in to sections that can be collapsed. -

-
    -
  • Full Name
    • -
  • Professional Title
    • -
  • Affiliations
    • -
  • Location
    • -
  • Option Ticket 1
    • -
  • Option Ticket 2
    • -
  • Option Ticket 3
    • -
  • Option Other 1
    • -
  • Option Other 2
    • -
  • Badge Type
    • -
  • Allow Tracking
    • -
  • Show Print Message
    • -
  • Hide QR Code
    • -
-
- - - - {#if $lq__event_badge_template_obj.header_path} -
- check header path -
- {:else} -
- - -
- {/if} - -
-
- - + check header path +
+ {:else} +
+ + +
+ {/if} -
=20} +
+
+ + + +
+ + + + + {#if full_name_override} + {@html full_name_override.trim()} + {:else} + -- no name -- + {/if} + + + + +
+ + {#if professional_title_override} +
- - - - {#if full_name_override} - {@html full_name_override.trim()} - {:else} - -- no name -- - {/if} - - - + {@html professional_title_override}
- - {#if professional_title_override} -
=15} - class:str_17={professional_title_override.length>=17} - class:str_20={professional_title_override.length>=20} - class:str_25={professional_title_override.length>=25} - class:str_30={professional_title_override.length>=30} - > - {@html professional_title_override} -
- {/if} -
- - - - - - {#if affiliations_override || location_override} -
- {#if affiliations_override} -
=15} - class:str_20={affiliations_override.length>=20} - class:str_25={affiliations_override.length>=25} - class:str_35={affiliations_override.length>=35} - class:str_45={affiliations_override.length>=45} - class:str_55={affiliations_override.length>=55} - > - {@html affiliations_override} -
- {/if} - - {#if location_override} -
=15} - class:str_20={location_override.length>=20} - class:str_25={location_override.length>=25} - class:str_35={location_override.length>=35} - class:str_45={location_override.length>=45} - class:str_55={location_override.length>=55} - > - {@html location_override} -
- {/if} -
- {/if} - - {#if ['front_bool', 'front_back_bool'].includes(option_ticket_1_display_opt) || ['front_bool', 'front_back_bool'].includes(option_ticket_2_display_opt) || ['front_bool', 'front_back_bool'].includes(option_ticket_3_display_opt) || $lq__event_badge_template_obj.show_qr_front} -
- - - {#if option_ticket_1_override}{/if} - - - {#if option_ticket_2_override} - - - {/if} - {#if option_ticket_3_override} - - {/if} - - {#if $lq__event_badge_template_obj.show_qr_front} - {#await qr_data_url} - Generating... - {:then result} - {#if qr_data_url} - missing QR code - {/if} - {/await} - {/if} -
{/if}
-
- {#if (option_other_1_override && ['front_bool', 'front_back_bool'].includes(option_other_1_display_opt))} - - {:else if (option_other_1_override && ['front_html', 'front_back_html'].includes(option_other_1_display_opt))} - {@html option_other_1_override} - {/if} - - {@html use_badge_type} - - - - {#if (option_other_2_override && ['front_bool', 'front_back_bool'].includes(option_other_2_display_opt))} - - {:else if (option_other_2_override && ['front_html', 'front_back_html'].includes(option_other_2_display_opt))} - {@html option_other_2_override} - {/if} -
- - - + + {#if affiliations_override || location_override} +
+ {#if affiliations_override} +
+ {@html affiliations_override} +
+ {/if} + + {#if location_override} +
+ {@html location_override} +
+ {/if} +
+ {/if} + + {#if ['front_bool', 'front_back_bool'].includes(option_ticket_1_display_opt) || ['front_bool', 'front_back_bool'].includes(option_ticket_2_display_opt) || ['front_bool', 'front_back_bool'].includes(option_ticket_3_display_opt) || $lq__event_badge_template_obj.show_qr_front} +
+ + + {#if option_ticket_1_override}{/if} + + + {#if option_ticket_2_override} + + + {/if} + {#if option_ticket_3_override} + + {/if} + + {#if $lq__event_badge_template_obj.show_qr_front} + {#await qr_data_url} + Generating... + {:then result} + {#if qr_data_url} + missing QR code + {/if} + {/await} + {/if} +
+ {/if} +
+ +
THE FOOTER + {#if (option_other_1_override && ['front_bool', 'front_back_bool'].includes(option_other_1_display_opt))} + + {:else if (option_other_1_override && ['front_html', 'front_back_html'].includes(option_other_1_display_opt))} + {@html option_other_1_override} + {/if} + + {@html use_badge_type} + + + + {#if (option_other_2_override && ['front_bool', 'front_back_bool'].includes(option_other_2_display_opt))} + + {:else if (option_other_2_override && ['front_html', 'front_back_html'].includes(option_other_2_display_opt))} + {@html option_other_2_override} + {/if} +
+ + + {/await} +
+ {/if} --> - {#if $lq__event_badge_template_obj.show_qr_front} - {#await event_badge_qr_id_get_promise} - Generating... - {:then result} - {#if event_badge_qr_id_get_promise} - - - missing QR code { - // (hide_qr) ? hide_qr = !hide_qr : hide_qr; - (hide_qr) ? hide_qr = false : hide_qr = true; - }} - /> - - {/if} - {/await} + - -
- + {#if $lq__event_badge_template_obj.show_qr_front} + {#await event_badge_qr_id_get_promise} + Generating... + {:then result} + {#if event_badge_qr_id_get_promise} + + + -
{ + // (hide_qr) ? hide_qr = !hide_qr : hide_qr; + (hide_qr) ? hide_qr = false : hide_qr = true; + }} + /> + + {/if} + {/await} + {/if} + + +
+ + + + +
+ + + Back of badge + - - Back of badge - - - {#if $lq__event_badge_template_obj.secondary_header_path} -
- check secondary header path + check secondary header path +
+ {:else if $lq__event_badge_template_obj.header_path} +
+ check primary header path +
+ {:else} +
+ + - {:else if $lq__event_badge_template_obj.header_path} -
- check primary header path -
- {:else} -
- - -
- {/if} +
+ {/if} -
-
+
+ +
{#if $lq__event_badge_template_obj.wireless_ssid} -
WiFi:
-
-
Signal Name: - {$lq__event_badge_template_obj.wireless_ssid} -
-
Access Code: - {$lq__event_badge_template_obj.wireless_password} -
+ +
+ + + Signal Name + + + {$lq__event_badge_template_obj.wireless_ssid} + + + + + Access Code + + + {$lq__event_badge_template_obj.wireless_password} + + +
+
+ + WiFi
{/if} -
+
- - {#if $lq__event_badge_template_obj.show_qr_back} -
-
- {$lq__event_badge_obj.given_name}'s - QR Code and Badge ID: -
- {#await qr_data_url} - - Generating... - {:then result} - {#if result} -
- - - badge QR code { - // (hide_qr) ? hide_qr = !hide_qr : hide_qr; - (hide_qr) ? hide_qr = false : hide_qr = true; - }} - /> -
- {#if allow_tracking} -

This was allowed at the time your badge was printed. You may opt-out at anytime.

-

By allowing this QR code to be scanned by an exhibitor and/or industry supporter, you understand and agree that they may use your personal information.

- {:else} -

This was not allowed at the time your badge was printed. You may opt-in at anytime.

-

If this QR code is scanned by an exhibitor and/or industry supporter, they will not have access to your information.

- {/if} -
-
- {/if} - {/await} - -
- - {$lq__event_badge_obj.event_badge_id_random} -
-
- {/if} - -
+
Download Meeting App:
    @@ -792,7 +840,7 @@ onkeypress={() => { {#if $lq__event_badge_obj.other_1 || $lq__event_badge_obj.other_2 || $lq__event_badge_obj.ticket_1_code || $lq__event_badge_obj.ticket_2_code || $lq__event_badge_obj.ticket_3_code || $lq__event_badge_obj.ticket_4_code || $lq__event_badge_obj.ticket_5_code} -
    +
      {#if $lq__event_badge_obj.ticket_1_code} @@ -871,20 +919,83 @@ onkeypress={() => {
    {/if} + {#if $lq__event_badge_template_obj.show_qr_back} +
    +
    + + {$lq__event_badge_obj.given_name}'s + + Badge ID and QR Code: +
    +
    + + {$lq__event_badge_obj.event_badge_id_random + } + +
    + {#await qr_data_url} + + Generating... + {:then result} + {#if result} +
    + badge QR code { + // (hide_qr) ? hide_qr = !hide_qr : hide_qr; + (hide_qr) ? hide_qr = false : hide_qr = true; + }} + /> +
    + {#if allow_tracking} +

    This was allowed at the time your badge was printed. You may opt-out at anytime.

    +

    By allowing this QR code to be scanned by an exhibitor or staff, you understand and agree that they may use your personal information.

    + {:else} +

    Tracking was not allowed at the time your badge was printed. You may opt-in at anytime.

    +

    If this QR code is scanned by an exhibitor or staff, they will not have access to your information.

    + {/if} +
    +
    + {/if} + {/await}
    + {/if} -
    - - Fold in half here - -
    +
    - -
- +
+ + Fold in half here + +
+ + + + @@ -1007,7 +1118,12 @@ onkeypress={() => { -
+
     {JSON.stringify($lq__event_badge_obj, null, 2)}