From af17a0502245d5905127aca1029fe57dddcdd130 Mon Sep 17 00:00:00 2001 From: Scott Idem Date: Thu, 18 Jul 2024 17:15:12 -0400 Subject: [PATCH] Now with QR codes for sessions and presenters! --- src/app.postcss | 17 +++ src/lib/ae_core__qr_code.ts | 109 ++++++++++++++++++ src/lib/ae_core_functions.ts | 9 +- src/lib/ae_events_stores.ts | 4 +- .../core/person/[person_id]/+page.svelte | 4 +- .../events_pres_mgmt/presenter_view.svelte | 64 ++++++++++ .../session/[slug]/+page.svelte | 36 ++++++ 7 files changed, 234 insertions(+), 9 deletions(-) create mode 100644 src/lib/ae_core__qr_code.ts diff --git a/src/app.postcss b/src/app.postcss index c978705d..e63387f4 100644 --- a/src/app.postcss +++ b/src/app.postcss @@ -313,4 +313,21 @@ section.ae_quick_popover_small { } .ae_root--auth_access .auth_view_only { display: initial; +} + + + +img.qr_code { + /* outline: solid thin hsla(30, 100%, 50%, .1); */ + /* width: 1.50in; */ +} + +img.qr_code:hover { + /* outline: solid thin green; */ + /* width: 2.50in; */ +} + +img.qr_code:focus { + /* outline: solid thin red; */ + /* width: 2.50in; */ } \ No newline at end of file diff --git a/src/lib/ae_core__qr_code.ts b/src/lib/ae_core__qr_code.ts new file mode 100644 index 00000000..24272ce2 --- /dev/null +++ b/src/lib/ae_core__qr_code.ts @@ -0,0 +1,109 @@ +import type { key_val } from '$lib/ae_stores'; +import { api } from '$lib/api'; + +import { db_core } from "$lib/db_core"; + +let ae_promises: key_val = {}; + + +// Updated 2024-07-18 +export async function generate_qr_code( + { + api_cfg, + account_id, + qr_type, // mecard, obj, str, vcard + qr_id, // This is essentially the filename it can be found at /qr/{account_id}/{qr_id} + qr_data, // vcard fields: + obj_type, + obj_id, + str, // For encoding a string (like a URL) into a QR code. + return_blob=true, // blob or url? + try_cache=false, + log_lvl=0 + }: { + api_cfg: any, + account_id: string, + qr_type: string, + qr_id: string, + qr_data?: any, + obj_type?: string, + obj_id?: string, + str?: string, + return_blob?: boolean, + try_cache?: boolean, + log_lvl?: number + } + ) { + console.log(`*** generate_qr_code() *** qr_id=${qr_id}`); + + let endpoint = `/qr/${account_id}/${qr_id}`; + console.log('Endpoint', endpoint); + let params: key_val = { + 'regen': true, // Regenerate the file even if nothing has changed. + 'return_file': return_blob, + 'qr_type': qr_type, // mecard, obj, vcard + 'qr_send': return_blob + }; + + if (qr_type == 'vcard') { + if (qr_data.informal_name) { + params['n'] = `${qr_data.family_name};${qr_data.given_name};${qr_data.informal_name}`; + } else { + params['n'] = `${qr_data.family_name};${qr_data.given_name}`; + } + params['fn'] = qr_data.full_name_override; + if (qr_data.affiliations) { params['org'] = qr_data.affiliations; } + + // url + params['email'] = qr_data.email; + if (qr_data.phone) { params['tel'] = qr_data.phone; } + + params['adr'] = qr_data.location_override; + + if (qr_data.address_line_1) { params['adr_str'] = qr_data.address_line_1; } + + params['adr_loc'] = qr_data.city; + params['adr_reg'] = qr_data.state_province; + params['adr_postal'] = qr_data.postal_code; + params['adr_country'] = qr_data.country; + } else if (qr_type == 'obj') { + params['obj_type'] = obj_type; + params['obj_id'] = obj_id; + } else if (qr_type == 'str') { + params['str'] = str; + } + + console.log('Params', params); + + + // let filename = `qr_${$ae_loc.account_id}_${qr_id}_${qr_type}.png`; + let filename = null; + + ae_promises.generate_qr_code = await api.get_object({ + api_cfg: api_cfg, + endpoint: endpoint, + params: params, + return_blob: return_blob, + filename: filename, + auto_download: false, + log_lvl: log_lvl + }); + console.log('QR Badge ID done?'); + + if (return_blob) { + let img_blob = new Blob([ae_promises.generate_qr_code.data]); + + let img_obj_url = URL.createObjectURL(img_blob); + // console.log(img_obj_url); + + // return img_blob; + return img_obj_url; + } + // let img_blob = new Blob([ae_promises.generate_qr_code.data]); + // console.log(img_blob); + // let img_obj_url = URL.createObjectURL(img_blob); + // console.log(img_obj_url); + // let qr_img_src = img_obj_url; + + return ae_promises.generate_qr_code; +} \ No newline at end of file diff --git a/src/lib/ae_core_functions.ts b/src/lib/ae_core_functions.ts index 83875d94..842a2638 100644 --- a/src/lib/ae_core_functions.ts +++ b/src/lib/ae_core_functions.ts @@ -11,12 +11,10 @@ import { // handle_db_save_ae_obj_li__person } from "$lib/ae_core__person"; -// import { liveQuery } from "dexie"; -// import { db_core } from "$lib/db_core"; +import { + generate_qr_code, +} from "$lib/ae_core__qr_code"; -// let example_li = liveQuery( -// () => db_core.badges.toArray() -// ); let ae_promises: key_val = {}; // Promise; @@ -373,5 +371,6 @@ let export_obj = { handle_create_ae_obj__person: handle_create_ae_obj__person, handle_update_ae_obj_id_crud: handle_update_ae_obj_id_crud, handle_download_export__obj_type: handle_download_export__obj_type, + generate_qr_code: generate_qr_code }; export let core_func = export_obj; diff --git a/src/lib/ae_events_stores.ts b/src/lib/ae_events_stores.ts index 7d315144..02fb9510 100644 --- a/src/lib/ae_events_stores.ts +++ b/src/lib/ae_events_stores.ts @@ -287,9 +287,9 @@ let events_session_data_struct: key_val = { new_upload_list: null, files_uploading_count: null, - qry_max__sessions: 25, + qry_max__sessions: 75, qry_max__presentations: 25, - qry_max__presenters: 25, + qry_max__presenters: 75, qry_max__files: 25, show_fields__presentation: true, show_fields__session: true, diff --git a/src/routes/core/person/[person_id]/+page.svelte b/src/routes/core/person/[person_id]/+page.svelte index 02560a0f..39454f3f 100644 --- a/src/routes/core/person/[person_id]/+page.svelte +++ b/src/routes/core/person/[person_id]/+page.svelte @@ -1,7 +1,7 @@ @@ -385,6 +397,58 @@ async function handle_delete__event_file({event_file_id}) { Presenter: + + +{#await ae_promises.generate_qr_code_obj_id} + Generating... +{:then result} + {#if ae_promises.generate_qr_code_obj_id} + + + + + + + + + Presenter ID + + + {/if} +{/await} + +{#await ae_promises.generate_qr_code_url} + Generating... +{:then result} + {#if ae_promises.generate_qr_code_url && $ae_loc.trusted_access} + + URL QR code + + + Presenter URL + + + + + {/if} +{/await} +
    diff --git a/src/routes/events_pres_mgmt/session/[slug]/+page.svelte b/src/routes/events_pres_mgmt/session/[slug]/+page.svelte index ec544da9..72916fc8 100644 --- a/src/routes/events_pres_mgmt/session/[slug]/+page.svelte +++ b/src/routes/events_pres_mgmt/session/[slug]/+page.svelte @@ -454,7 +454,19 @@ $: if ($slct_trigger == 'load__event_presenter_obj_li') { // }); // } +$: if ($lq__event_session_obj) { + // Generate a QR code for the object ID. + // ae_promises.generate_qr_code_obj_id = core_func.generate_qr_code({api_cfg: $ae_api, account_id: $slct.account_id, qr_type: 'obj', qr_id: $lq__event_session_obj?.event_session_id_random, obj_type: 'event_session', obj_id: $lq__event_session_obj?.event_session_id_random}); + // Generate a QR code for the URL. + let qr_id_url = `${$lq__event_session_obj?.event_session_id_random}_url`; + + // URL for this page (be sure to URL encode it): + let url_str = `${$ae_loc.url_origin}/events_pres_mgmt/session/${$lq__event_session_obj.event_session_id_random}`; + url_str = encodeURI(url_str); + + ae_promises.generate_qr_code_url = core_func.generate_qr_code({api_cfg: $ae_api, account_id: $slct.account_id, qr_type: 'str', qr_id: qr_id_url, str: url_str}); +} @@ -540,6 +552,30 @@ $: if ($slct_trigger == 'load__event_presenter_obj_li') {
    + +{#await ae_promises.generate_qr_code_url} + Generating... +{:then result} + {#if ae_promises.generate_qr_code_url && $ae_loc.trusted_access} + + URL QR code + + + Session URL + + + + {/if} +{/await} + +