Clean up. New ability to save the session search text.

This commit is contained in:
Scott Idem
2024-08-15 14:14:41 -04:00
parent 146bea0a67
commit 35052898b4
6 changed files with 114 additions and 46 deletions

View File

@@ -337,3 +337,28 @@ img.qr_code:focus {
opacity: 0.5; opacity: 0.5;
color: hsla(0, 0%, 50%, .95); color: hsla(0, 0%, 50%, .95);
} }
@media (max-width: 767px) {
.sk_header.hide_sm {
display: none;
}
.sk_header.show_sm {
display: initial;
}
.sk_header.show_md {
display: none;
}
}
@media (min-width: 768px) {
.sk_header.hide_md {
display: none;
}
.sk_header.show_md {
display: initial;
}
.sk_header.show_sm {
display: none;
}
}

View File

@@ -182,6 +182,9 @@ let events_local_data_struct: key_val = {
qry_and__file_count: true, // Essentially it should be greater than 0 qry_and__file_count: true, // Essentially it should be greater than 0
save_search_text: true,
saved_search__session: null,
// show_content__agree_text: false, // show_content__agree_text: false,
show_content__presentation_description: false, show_content__presentation_description: false,
show_content__presenter_page_help: true, show_content__presenter_page_help: true,

View File

@@ -381,14 +381,16 @@ let lq_kv__event_session_obj_li = liveQuery(
</section> </section>
{:else} {:else}
<p class="text-center text-2xl bg-gray-100 p-4 rounded-md"> <p class="text-center text-2xl bg-gray-100 p-4 rounded-md">
<span class="fas fa-exclamation-triangle text-2xl text-yellow-500"></span>
No results to show. Please use the search above to find your session. No results to show. Please use the search above to find your session.
<span class="fas fa-exclamation-triangle text-2xl text-yellow-500"></span>
</p> </p>
<div class="text-sm text-gray-500 text-center"> <!-- <div class="text-sm text-gray-500 text-center"> -->
Query results length: {$events_slct.event_session_obj_li?.length}; <!-- Query results length: {$events_slct.event_session_obj_li?.length}; -->
<!-- ID list length: {event_session_id_random_li?.length}; --> <!-- ID list length: {event_session_id_random_li?.length}; -->
<!-- LQ results length: {$lq__event_session_obj_li?.length} --> <!-- LQ results length: {$lq__event_session_obj_li?.length} -->
LQ KV results length: {$lq_kv__event_session_obj_li?.length} <!-- LQ KV results length: {$lq_kv__event_session_obj_li?.length} -->
</div> <!-- </div> -->
{/if} {/if}
<!-- This is to help correct a bug(?) with Dexie and LiveQuery and Svelte. The LiveQuery value may not be updated if no results are found. This a problem on the very first run. --> <!-- This is to help correct a bug(?) with Dexie and LiveQuery and Svelte. The LiveQuery value may not be updated if no results are found. This a problem on the very first run. -->

View File

@@ -1,16 +1,17 @@
<script lang="ts"> <script lang="ts">
/** @type {import('./$types').PageData} */ /** @type {import('./$types').PageData} */
export let data: any; export let data: any;
let log_lvl = 0;
// console.log(`ae_events_pres_mgmt event [slug] +page.svelte data:`, data); // console.log(`ae_events_pres_mgmt event [slug] +page.svelte data:`, data);
import { onMount } from 'svelte'; import { browser } from '$app/environment';
// import { goto, invalidate, pushState, replaceState } from '$app/navigation'; // import { goto, invalidate, pushState, replaceState } from '$app/navigation';
// import { clipboard, FileDropzone, getModalStore, localStorageStore, ProgressRadial, RadioGroup, RadioItem, TabGroup, Tab, TabAnchor } from '@skeletonlabs/skeleton'; // import { clipboard, FileDropzone, getModalStore, localStorageStore, ProgressRadial, RadioGroup, RadioItem, TabGroup, Tab, TabAnchor } from '@skeletonlabs/skeleton';
import type { key_val } from '$lib/ae_stores'; import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils'; import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api'; // import { api } from '$lib/api';
// import Element_ae_crud from '$lib/element_ae_crud.svelte'; // import Element_ae_crud from '$lib/element_ae_crud.svelte';
// import Element_data_store from '$lib/element_data_store.svelte'; // import Element_data_store from '$lib/element_data_store.svelte';
import Comp_event_session_obj_li from '../../ae_comp__event_session_obj_li.svelte'; import Comp_event_session_obj_li from '../../ae_comp__event_session_obj_li.svelte';
@@ -24,6 +25,7 @@ import { events_func } from '$lib/ae_events_functions';
import Event_page_menu from './../../event_page_menu.svelte'; import Event_page_menu from './../../event_page_menu.svelte';
// Quickly save the data passed from the parent(s) to the Svelte stores, localStorage, and other. // Quickly save the data passed from the parent(s) to the Svelte stores, localStorage, and other.
$slct.account_id = data.account_id; $slct.account_id = data.account_id;
// console.log(`$slct.account_id = `, $slct.account_id); // console.log(`$slct.account_id = `, $slct.account_id);
@@ -104,15 +106,16 @@ let ae_tmp: key_val = {};
let ae_triggers: key_val = {}; let ae_triggers: key_val = {};
onMount(() => { if ($events_loc.pres_mgmt?.save_search_text && $events_loc.pres_mgmt?.saved_search__session) {
$events_sess.pres_mgmt.fulltext_search_qry_str = $events_loc.pres_mgmt.saved_search__session;
}
// Functions and Logic
if (browser) {
console.log('Events Event [slug]: +page.svelte'); console.log('Events Event [slug]: +page.svelte');
$events_trigger = 'load__event_session_obj_li';
if (!$events_slct.event_id) { }
console.log(`No ID! Nothing to show. Try setting the ID again.`);
$events_slct.event_id = $events_slct.event_id;
}
});
// Updated 2024-06-12 late // Updated 2024-06-12 late
@@ -121,15 +124,23 @@ $: if ($events_trigger == 'load__event_session_obj_li' && $events_slct.event_id)
$events_trigger = null; $events_trigger = null;
if ($events_loc.pres_mgmt.save_search_text) {
if (log_lvl) {
console.log(`*** Save search text *** ${$events_loc.pres_mgmt.save_search_text}`);
}
$events_loc.pres_mgmt.saved_search__session = $events_sess.pres_mgmt.fulltext_search_qry_str;
}
if ( $events_sess.pres_mgmt.fulltext_search_qry_str?.length > 2 ) { if ( $events_sess.pres_mgmt.fulltext_search_qry_str?.length > 2 ) {
console.log('*** Search string is valid ***'); console.log('*** Search string is valid ***');
process_search_string($events_sess.pres_mgmt.fulltext_search_qry_str); process_search_string($events_sess.pres_mgmt.fulltext_search_qry_str);
} else if ( $ae_loc.administrator_access || $ae_loc.trusted_access ) { } else if ( $ae_loc.authenticated_access ) {
console.log('*** Administrator Access or Trusted Access ***'); console.log('*** Administrator Access or Trusted Access ***');
process_search_string($events_sess.pres_mgmt.fulltext_search_qry_str); process_search_string($events_sess.pres_mgmt.fulltext_search_qry_str);
} else { } else {
console.log('*** No search string or too short ***'); console.log('*** Check permissions and or search string. Not allowed or too short. ***');
// $events_slct.event_session_obj_li = []; $events_slct.event_session_obj_li = [];
event_session_id_random_li = [];
} }
} }
@@ -137,18 +148,15 @@ $: if ($events_trigger == 'load__event_session_obj_li' && $events_slct.event_id)
function process_search_string(search_str: string) { function process_search_string(search_str: string) {
console.log('process_search_string()'); console.log('process_search_string()');
if ( $ae_loc.administrator_access || $ae_loc.trusted_access ) { if (search_str?.length) {
console.log('*** Administrator or Trusted Access ***'); console.log(`*** Search string length: ${search_str.length} ***`);
} else if (search_str.length > 1 ) {
console.log('*** Search string is valid ***');
// $events_slct.event_session_obj_li = []; // $events_slct.event_session_obj_li = [];
// $events_sess.pres_mgmt.fulltext_search_qry_str = ''; // $events_sess.pres_mgmt.fulltext_search_qry_str = '';
} else { } else {
console.log('*** No search string or too short ***'); console.log(`*** Search string is empty ***`);
$events_slct.event_session_obj_li = []; // $events_slct.event_session_obj_li = [];
// event_session_id_random_li = []; // event_session_id_random_li = [];
return false; // return false;
} }
// let type_code = $events_sess.pres_mgmt.search_badge_type_code; // let type_code = $events_sess.pres_mgmt.search_badge_type_code;
@@ -379,20 +387,20 @@ async function handle_search__event_session(
</button> </button>
<input <input
type="search" type="search"
placeholder="Search for a session" placeholder="Search for a session"
id="session_fulltext_search_qry_str" id="session_fulltext_search_qry_str"
bind:value={$events_sess.pres_mgmt.fulltext_search_qry_str} bind:value={$events_sess.pres_mgmt.fulltext_search_qry_str}
class="input text-1xl hover:text-2xl font-bold font-mono w-80 transition-all mx-1" class="input text-1xl hover:text-2xl font-bold font-mono w-80 transition-all mx-1"
on:keyup={() => { on:keyup={() => {
if ($events_sess.pres_mgmt?.fulltext_search_qry_str && $events_sess.pres_mgmt.fulltext_search_qry_str.length >= 3) { if ($events_sess.pres_mgmt?.fulltext_search_qry_str && $events_sess.pres_mgmt.fulltext_search_qry_str.length >= 3) {
$events_trigger = 'load__event_session_obj_li'; $events_trigger = 'load__event_session_obj_li';
} }
}} }}
autofocus autofocus
suggest="off" suggest="off"
data-ignore="true" data-ignore="true"
/> />
<button <button
type="submit" type="submit"
@@ -430,7 +438,7 @@ async function handle_search__event_session(
{/if} {/if}
{/await} --> {/await} -->
{#if $events_slct.event_session_obj_li?.length == event_session_id_random_li?.length} {#if $events_slct.event_session_obj_li?.length && $events_slct.event_session_obj_li?.length == event_session_id_random_li?.length}
<!-- <div class="sm:bg-red-200 md:bg-yellow-200 lg:bg-green-200 md:max-w-screen-md lg:max-w-screen-lg xl:max-w-screen-xl overflow-x-scroll outline"> --> <!-- <div class="sm:bg-red-200 md:bg-yellow-200 lg:bg-green-200 md:max-w-screen-md lg:max-w-screen-lg xl:max-w-screen-xl overflow-x-scroll outline"> -->
<div class="sm:bg-red-200 md:bg-yellow-200 lg:bg-white"> <div class="sm:bg-red-200 md:bg-yellow-200 lg:bg-white">
<Comp_event_session_obj_li <Comp_event_session_obj_li
@@ -441,10 +449,15 @@ async function handle_search__event_session(
</div> </div>
{:else} {:else}
<section class="text-center text-2xl bg-yellow-100 p-4 rounded-md lg:max-w-lg space-y-2"> <section class="text-center text-2xl bg-yellow-100 p-4 rounded-md lg:max-w-lg space-y-2">
<p> <div>
<span class="fas fa-exclamation-triangle text-2xl text-yellow-500"></span> <span class="fas fa-exclamation-triangle text-2xl text-yellow-500"></span>
No results to show. Please use the search above to find your session. <strong>No results to show</strong>
</p> <span class="fas fa-exclamation-triangle text-2xl text-yellow-500"></span>
<br>
<div class="text-lg">
Please use the search above to find your session.
</div>
</div>
<div> <div>
<strong>Search by:</strong> <strong>Search by:</strong>
<ul <ul

View File

@@ -330,7 +330,7 @@ async function handle_qry__event_session(
{#if $lq__event_obj} {#if $lq__event_obj}
<header> <header>
<h2 class="h3 text-center">{$lq__event_obj?.name}</h2> <h2 class="h3 text-center hidden md:block">{$lq__event_obj?.name}</h2>
<h3 class="h4 text-center">Presentations - Reports</h3> <h3 class="h4 text-center">Presentations - Reports</h3>
</header> </header>
{/if} {/if}

View File

@@ -117,9 +117,34 @@ let ae_triggers: key_val = {};
class:hidden={$events_loc.pres_mgmt.show_menu__session_search != 'options'} class:hidden={$events_loc.pres_mgmt.show_menu__session_search != 'options'}
> >
<div
class="flex flex-col gap-1"
>
<!-- Save search text option toggle button? -->
<button
type="button"
on:click={() => {
$events_loc.pres_mgmt.save_search_text = !$events_loc.pres_mgmt.save_search_text;
}}
class="btn btn-sm"
class:variant-ghost-success={$events_loc.pres_mgmt.save_search_text}
class:variant-ghost-warning={!$events_loc.pres_mgmt.save_search_text}
title="Save the search text for this session search?"
>
{#if $events_loc.pres_mgmt.save_search_text}
<span class="fas fa-toggle-on m-1"></span>
Save Search Text
{:else}
<span class="fas fa-toggle-off m-1"></span>
<!-- <span class="fas fa-save m-1"></span> -->
Save Search Text?
{/if}
</button>
</div>
{#if $ae_loc.authenticated_access} {#if $ae_loc.authenticated_access}
<div <div
class="flex flex-col gap-1 items-end w-56" class="flex flex-col gap-1 items-end justify-center"
> >
<!-- Max presenters select options --> <!-- Max presenters select options -->
<span <span