Clean up of the event search page options menu and related.

This commit is contained in:
Scott Idem
2025-10-17 17:27:18 -04:00
parent bb993a1028
commit fab1a4916d
3 changed files with 336 additions and 168 deletions

View File

@@ -10,14 +10,23 @@ let {
lq__event_obj
}: Props = $props();
// import type { key_val } from '$lib/ae_stores';
import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
import { events_loc, events_sess, events_slct, events_trigger, events_trig_kv } from '$lib/ae_events_stores';
// import { events_func } from '$lib/ae_events_functions';
import { goto } from '$app/navigation';
// import Element_ae_crud from '$lib/element_ae_crud.svelte';
import type { key_val } from '$lib/ae_stores';
import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
import { core_func } from '$lib/ae_core/ae_core_functions';
import { events_loc, events_sess, events_slct, events_trigger, events_trig_kv } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
import Element_ae_crud from '$lib/element_ae_crud.svelte';
import Element_data_store from '$lib/element_data_store_v2.svelte';
import Comp__pres_mgmt_menu_nav from '../ae_comp__events_menu_nav.svelte';
import Comp__events_menu_nav from '../ae_comp__events_menu_nav.svelte';
import Comp__pres_mgmt_menu_opts from '../ae_comp__events_menu_opts.svelte';
// Variables
let ae_promises: key_val = {};
let ae_tmp: key_val = $state({});
let ae_triggers: key_val = $state({});
</script>
@@ -29,9 +38,10 @@ import Comp__pres_mgmt_menu_nav from '../ae_comp__events_menu_nav.svelte';
<!-- BEGIN: The menu button options -->
<div
class="flex flex-row flex-wrap gap-1 items-center justify-around w-full">
class="flex flex-row flex-wrap gap-1 items-center justify-around w-full"
>
<Comp__pres_mgmt_menu_nav
<Comp__events_menu_nav
hide={!$ae_loc.authenticated_access}
event_id={$lq__event_obj?.event_id}
ae_core={$ae_loc.administrator_access}
@@ -143,179 +153,336 @@ import Comp__pres_mgmt_menu_nav from '../ae_comp__events_menu_nav.svelte';
>
<div
class="flex flex-col gap-1"
class="ae_comp__event_menu_opts w-full"
>
<h2 class="text-sm font-semibold text-center pb-1">
Æ Event Menu Options
</h2>
<div class="flex flex-row flex-wrap gap-1 items-center justify-between">
<div class="flex flex-row gap-1 items-center justify-evenly relative">
<!-- Toggle alert status -->
<button
type="button"
disabled={!$ae_loc.administrator_access}
onclick={() => {
if (!confirm(`Are you sure you want to toggle the alert status for this session?`)) {return false;}
console.log('Toggle alert status for the session.');
let new_alert_value = !$lq__event_obj?.alert;
console.log('New alert value:', new_alert_value);
ae_promises.api_update__ae_obj = core_func.update_ae_obj_id_crud_v2({
api_cfg: $ae_api,
object_type: 'event',
object_id: $lq__event_obj?.event_id_random,
object_reload: true,
field_name: 'alert',
new_field_value: new_alert_value,
log_lvl: 1
})
.then(function (results) {
})
.finally(function () {
});
}}
class:opacity-100={$lq__event_obj?.alert}
class:opacity-50={!$lq__event_obj?.alert}
class="
btn btn-sm
preset-tonal-warning hover:preset-tonal-error
preset-outlined-warning-100-900 hover:preset-outlined-warning-600-400
hover:opacity-100
transition-all
"
title={$lq__event_obj?.alert ? 'Remove alert status' : 'Mark as alert'}
>
{#if $lq__event_obj?.alert}
<!-- class="fas fa-exclamation-triangle" -->
<span class="fas fa-bell-slash m-0.75 text-warning-600" title="This session is marked as an alert."></span>
{:else}
<span class="fas fa-bell m-0.75 text-gray-400" title="This session is not marked as an alert."></span>
{/if}
<span class="hidden">Toggle Alert</span>
</button>
</div>
<div class="flex flex-row flex-wrap gap-1 items-center justify-evenly">
<Element_ae_crud
trigger_patch={ae_triggers.priority}
api_cfg={$ae_api}
object_type={'event'}
object_id={$lq__event_obj?.event_id}
field_name={'priority'}
field_type={'button'}
field_value={ae_tmp.value__priority}
allow_null={true}
hide_edit_btn={true}
outline_element={false}
show_crud={false}
display_inline={true}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event({
api_cfg: $ae_api,
event_id: $lq__event_obj?.event_id,
log_lvl: log_lvl
});
}}
>
<!-- {@html $lq__event_obj?.priority ? '<span class="fas fa-star m-1"></span> High Priority' : '<span class="far fa-star m-1"></span> Priority not set'} -->
<button
type="button"
disabled={!$ae_loc.administrator_access}
onclick={() => {
if (!confirm(`Are you sure you want to mark this event as ${$lq__event_obj?.priority ? 'not priority' : 'high priority'}?`)) {return false;}
ae_tmp.value__priority = !$lq__event_obj?.priority;
// $events_slct.exhibit_tracking_obj.priority = !$lq__event_obj?.priority;
ae_triggers.priority = true;
}}
class="btn btn-sm *:hover:inline"
class:ae_btn_surface_outlined={!$lq__event_obj?.priority}
class:ae_btn_success={$lq__event_obj?.priority}
>
{#if $lq__event_obj?.priority}
<span class="fas fa-star m-1"></span>
<!-- <span class="fas fa-arrow-down m-1"></span> -->
<span class="hidden">
Not Priority?
</span>
{:else}
<!-- <span class="fas fa-toggle-off m-1"></span> -->
<span class="far fa-star m-1"></span>
<span class="hidden">
Priority
</span>
?
{/if}
</button>
</Element_ae_crud>
<Element_ae_crud
trigger_patch={ae_triggers.hide}
api_cfg={$ae_api}
object_type={'event'}
object_id={$lq__event_obj?.event_id}
field_name={'hide'}
field_type={'button'}
field_value={ae_tmp.value__hide}
allow_null={false}
hide_edit_btn={true}
outline_element={false}
show_crud={false}
display_inline={true}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event({
api_cfg: $ae_api,
event_id: $lq__event_obj?.event_id,
log_lvl: log_lvl
});
}}
>
<!-- {($lq__event_obj?.hide ? 'Hidden' : 'Not Hidden')} -->
<button
type="button"
disabled={!$ae_loc.manager_access}
onclick={() => {
if (!confirm(`Are you sure you want to ${$lq__event_obj?.hide ? 'unhide' : 'hide'} this session?`)) {return false;}
ae_tmp.value__hide = !$lq__event_obj?.hide;
ae_triggers.hide = true;
}}
class="btn btn-sm *:hover:inline"
class:ae_btn_success_outlined={!$lq__event_obj?.hide}
class:ae_btn_warning={$lq__event_obj?.hide}
>
{#if $lq__event_obj?.hide}
<span class="fas fa-toggle-on m-1"></span>
Unhide?
{:else}
<!-- <span class="fas fa-toggle-off m-1"></span> -->
<span class="fas fa-eye m-1"></span>
<span class="hidden">
Not Hidden
</span>
{/if}
<!-- {@html ($lq__event_obj?.hide ? '<span class="fas fa-eye m-1"></span> Unhide?' : '<span class="fas fa-eye-slash m-1"></span> Hide?')} -->
</button>
</Element_ae_crud>
<!-- Enable/Disable -->
<Element_ae_crud
trigger_patch={ae_triggers.enable}
api_cfg={$ae_api}
object_type={'event'}
object_id={$lq__event_obj?.event_id}
field_name={'enable'}
field_type={'button'}
field_value={ae_tmp.value__enable}
allow_null={false}
hide_edit_btn={true}
outline_element={false}
show_crud={false}
display_inline={true}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event({
api_cfg: $ae_api,
event_id: $lq__event_obj?.event_id,
log_lvl: log_lvl
})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<!-- {($lq__event_obj?.enable ? 'Enabled' : 'Disabled')} -->
<button
type="button"
disabled={!$ae_loc.manager_access}
onclick={() => {
if (!confirm(`Are you sure you want to ${$lq__event_obj?.enable ? 'disable' : 'enable'} this session?`)) {return false;}
ae_tmp.value__enable = !$lq__event_obj?.enable;
// $events_slct.exhibit_tracking_obj.hide = !$lq__event_obj?.hide;
ae_triggers.enable = true;
}}
class="btn btn-sm"
class:ae_btn_success_outlined={$lq__event_obj?.enable}
class:ae_btn_error={!$lq__event_obj?.enable}
>
{#if $lq__event_obj?.enable}
<span class="fas fa-toggle-on m-1"></span>
Enabled
{:else}
<span class="fas fa-toggle-off m-1"></span>
Enable?
{/if}
<!-- {@html ($lq__event_obj?.enable ? '<span class="fas fa-toggle-on m-1"></span> Disable?' : '<span class="fas fa-toggle-off m-1"></span> Enable?')} -->
</button>
</Element_ae_crud>
<!-- Sort -->
<!-- Group -->
{#if $ae_loc.manager_access}
<button
type="button"
disabled={!$ae_loc.super_access}
onclick={() => {
if (!confirm('Are you sure you want to delete this session?')) {return false;}
events_func.delete_ae_obj_id__event({
api_cfg: $ae_api,
event_id: $lq__event_obj.event_id,
method: 'delete'
})
.then(function (delete_results) {
$events_slct.event_id = null;
$events_slct.event_obj = {};
goto(`/events`);
});
}}
class="btn btn-sm mx-1 ae_btn_error"
title="Delete record permanently"
>
<span class="fas fa-minus-circle mx-1"></span>
Delete
</button>
{:else if $ae_loc.manager_access}
<button
onclick={() => {
if (!confirm('Are you sure you want to remove (disable) this session? This is not common.')) {return false;}
events_func.delete_ae_obj_id__event({
api_cfg: $ae_api,
event_id: $lq__event_obj.event_id,
method: 'disable'
})
.then(function (delete_results) {
$events_slct.event_id = null;
$events_slct.event_obj = {};
goto(`/events`);
});
}}
class="btn btn-sm mx-1 ae_btn_warning"
title="Disable record"
>
<span class="fas fa-minus mx-1"></span>
Delete
</button>
{/if}
</div>
</div>
</div>
<div
class="flex flex-row flex-wrap gap-1 items-center justify-center w-full p-1"
>
<!-- Save search text option toggle button? -->
<button
type="button"
onclick={() => {
$events_loc.pres_mgmt.save_search_text = !$events_loc.pres_mgmt.save_search_text;
}}
class="btn btn-sm"
class="btn btn-sm justify-between w-full max-w-50 text-center"
class:ae_btn_surface={$events_loc.pres_mgmt.save_search_text}
class:ae_btn_surface_outlined={!$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
<span class="grow">
<span class="fas fa-save m-1"></span>
Do Not Save Search?
</span>
{:else}
<span class="fas fa-toggle-off m-1"></span>
<!-- <span class="fas fa-save m-1"></span> -->
<span class="grow">
<span class="fas fa-save m-1"></span>
Save Search Text?
{/if}
</button>
</div>
{#if $ae_loc.authenticated_access}
<div
class="flex flex-col gap-1 items-end justify-center"
>
<!-- Max presenters select options -->
<span
class="flex flex-row gap-1 items-center justify-around"
>
<label
class="text-sm w-32 text-right"
for="qry_limit__presenters">
Max presenters:
</label>
<select
id="qry_limit__presenters"
bind:value={$events_loc.pres_mgmt.qry_limit__presenters}
class="select w-20 text-sm preset-tonal-surface"
>
<option value={25}>25</option>
<option value={50}>50</option>
<option value={75}>75</option>
<option value={100}>100</option>
<option value={150}>150</option>
<option value={200}>200</option>
<option value={250}>250</option>
<option value={300}>300</option>
<option value={500}>500</option>
<option value={750}>750</option>
<option value={1000}>1000</option>
</select>
</span>
<!-- Max sessions select options -->
<span
class="flex flex-row gap-1 items-center justify-around"
>
<label
class="text-sm w-32 text-right"
for="qry_limit__sessions">
Max sessions:
</label>
<select
id="qry_limit__sessions"
bind:value={$events_loc.pres_mgmt.qry_limit__sessions}
class="select w-20 text-sm preset-tonal-surface"
>
<option value={25}>25</option>
<option value={50}>50</option>
<option value={75}>75</option>
<option value={100}>100</option>
<option value={200}>200</option>
<option value={500}>500</option>
</select>
</span>
<!-- Max files select options -->
<span
class="flex flex-row gap-1 items-center justify-around"
>
<label
class="text-sm w-32 text-right"
for="qry_limit__files">
Max files:
</label>
<select
id="qry_limit__files"
bind:value={$events_loc.pres_mgmt.qry_limit__files}
class="select w-20 text-sm preset-tonal-surface"
>
<option value={25}>25</option>
<option value={50}>50</option>
<option value={75}>75</option>
<option value={100}>100</option>
<option value={200}>200</option>
<option value={500}>500</option>
</select>
</span>
<!-- Toggle between the showing hidden sessions -->
<!-- qry_hidden = all, not_hidden, hidden -->
<button
type="button"
onclick={() => {
if ($events_loc.pres_mgmt.qry_hidden == 'all') {
$events_loc.pres_mgmt.qry_hidden = 'not_hidden';
} else {
$events_loc.pres_mgmt.qry_hidden = 'all';
}
}}
class="btn btn-sm ae_btn_surface justify-between w-full text-center"
title="Toggle between showing hidden sessions"
>
<span class="fas {$events_loc.pres_mgmt.qry_hidden == 'all' ? 'fa-toggle-on' : 'fa-toggle-off'} m-1"></span>
{#if $events_loc.pres_mgmt.qry_hidden == 'all'}
<span class="grow">
<span class="fas fa-eye-slash m-1"></span>
Hide Hidden Sessions
</span>
{:else}
<span class="grow">
<span class="fas fa-eye m-1"></span>
Show Hidden Sessions?
</span>
{/if}
</button>
<!-- Toggle between the showing disabled sessions -->
<!-- qry_enabled = all, enabled -->
{#if $ae_loc.manager_access}
<button
type="button"
onclick={() => {
if ($events_loc.pres_mgmt.qry_enabled == 'all') {
$events_loc.pres_mgmt.qry_enabled = 'enabled';
} else {
$events_loc.pres_mgmt.qry_enabled = 'all';
}
}}
class="btn btn-sm ae_btn_surface justify-between w-full text-center"
title="Toggle between showing disabled sessions"
>
<span class="fas {$events_loc.pres_mgmt.qry_enabled == 'all' ? 'fa-toggle-on' : 'fa-toggle-off'} m-1"></span>
{#if $events_loc.pres_mgmt.qry_enabled == 'all'}
<span class="grow">
<span class="fas fa-ban m-1"></span>
Hide Disabled Sessions
</span>
{:else}
<span class="grow">
<span class="fas fa-check-circle m-1"></span>
Show Disabled Sessions?
</span>
{/if}
</button>
{/if}
</div>
{/if}
{#if $ae_loc.authenticated_access}
<div class="flex flex-col gap-1 items-center">
<!-- Show/Hide launcher links (new version) -->
<button
type="button"
onclick={() => {
$events_loc.pres_mgmt.hide__launcher_link = !$events_loc.pres_mgmt.hide__launcher_link;
}}
class="btn btn-sm ae_btn_surface justify-between w-full text-center"
class="btn btn-sm ae_btn_surface justify-between w-full max-w-50 text-center"
>
<span class="fas {$events_loc.pres_mgmt.hide__launcher_link ? 'fa-toggle-off' : 'fa-toggle-on'} m-1"></span>
<span class="grow">
@@ -330,29 +497,28 @@ import Comp__pres_mgmt_menu_nav from '../ae_comp__events_menu_nav.svelte';
onclick={() => {
$events_loc.pres_mgmt.hide__launcher_link_legacy = !$events_loc.pres_mgmt.hide__launcher_link_legacy;
}}
class="btn btn-sm ae_btn_surface justify-between w-full text-center"
class="btn btn-sm ae_btn_surface justify-between w-full max-w-50 text-center"
>
<span class="fas {$events_loc.pres_mgmt.hide__launcher_link_legacy ? 'fa-toggle-off' : 'fa-toggle-on'} m-1"></span>
<span class="grow">
<span class="fas fa-paper-plane m-1"></span>
{$events_loc.pres_mgmt.hide__launcher_link_legacy ? 'Show Launcher Links' : 'Hide Legacy Launcher Links?'}
{$events_loc.pres_mgmt.hide__launcher_link_legacy ? 'Legacy Launcher Links' : 'Hide Legacy Launcher?'}
</span>
</button>
<!-- Show/Hide location (room) links -->
<!-- Show/Hide links to the location (room) -->
<button
type="button"
onclick={() => {
$events_loc.pres_mgmt.hide__location_link = !$events_loc.pres_mgmt.hide__location_link;
}}
class="btn btn-sm ae_btn_surface justify-between w-full text-center"
class="btn btn-sm ae_btn_surface justify-between w-full max-w-50 text-center"
>
<span class="fas {$events_loc.pres_mgmt.hide__location_link ? 'fa-toggle-off' : 'fa-toggle-on'} m-1"></span>
<span class="grow">
<span class="fas fa-map-marker-alt m-1"></span>
{$events_loc.pres_mgmt.hide__location_link ? 'Show Location Links' : 'Hide Location Links?'}
</span>
<!-- Hide={$events_loc.pres_mgmt.hide__location_link} -->
</button>
<!-- Show/Hide the Location (room) column in tables and lists -->
@@ -361,7 +527,7 @@ import Comp__pres_mgmt_menu_nav from '../ae_comp__events_menu_nav.svelte';
onclick={() => {
$events_loc.pres_mgmt.hide__session_li_location_field = !$events_loc.pres_mgmt.hide__session_li_location_field;
}}
class="btn btn-sm ae_btn_surface justify-between w-full text-center"
class="btn btn-sm ae_btn_surface justify-between w-full max-w-50 text-center"
title="Toggle showing the Location column in session lists and tables"
>
<span class="fas {$events_loc.pres_mgmt.hide__session_li_location_field ? 'fa-toggle-off' : 'fa-toggle-on'} m-1"></span>
@@ -377,7 +543,7 @@ import Comp__pres_mgmt_menu_nav from '../ae_comp__events_menu_nav.svelte';
onclick={() => {
$events_loc.pres_mgmt.hide__session_li_poc_field = !$events_loc.pres_mgmt.hide__session_li_poc_field;
}}
class="btn btn-sm ae_btn_surface justify-between w-full text-center"
class="btn btn-sm ae_btn_surface justify-between w-full max-w-50 text-center"
title="Toggle showing the POC column in session lists and tables"
>
<span class="fas {$events_loc.pres_mgmt.hide__session_li_poc_field ? 'fa-toggle-off' : 'fa-toggle-on'} m-1"></span>
@@ -387,9 +553,11 @@ import Comp__pres_mgmt_menu_nav from '../ae_comp__events_menu_nav.svelte';
</span>
</button>
</div>
{/if}
<Comp__pres_mgmt_menu_opts
hide={!$ae_loc.authenticated_access}
/>
</div> <!-- END: The expanded menu area for information and options -->

View File

@@ -43,9 +43,9 @@ let ae_triggers: key_val = $state({});
>
<!-- BEGIN: The menu button options -->
<div
class="flex flex-row flex-wrap gap-1 items-center justify-around w-full">
class="flex flex-row flex-wrap gap-1 items-center justify-around w-full"
>
<!-- launcher_id is the event_location_id -->
<Comp__events_menu_nav

View File

@@ -239,7 +239,7 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig_kv }
<span class="fas fa-toggle-on m-1"></span>
<span class="grow">
<span class="fas fa-save m-1"></span>
No Save Search?
Do Not Save Search?
</span>
{:else}
<span class="fas fa-toggle-off m-1"></span>
@@ -474,7 +474,7 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig_kv }
<span class="fas {$events_loc.pres_mgmt.hide__launcher_link_legacy ? 'fa-toggle-off' : 'fa-toggle-on'} m-1"></span>
<span class="grow">
<span class="fas fa-paper-plane m-1"></span>
{$events_loc.pres_mgmt.hide__launcher_link_legacy ? 'Show Launcher Links' : 'Hide Legacy Launcher Links?'}
{$events_loc.pres_mgmt.hide__launcher_link_legacy ? 'Show Legacy Launcher Links' : 'Hide Legacy Launcher Links?'}
</span>
</button>