Files
OSIT-AE-App-Svelte/src/routes/events/[event_id]/event_page_menu.svelte

644 lines
29 KiB
Svelte
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<script lang="ts">
interface Props {
// export let data: any;
log_lvl?: number;
lq__event_obj: any; // let ae_tmp: key_val = {};
}
let { log_lvl = 0, lq__event_obj }: Props = $props();
import { goto } from '$app/navigation';
import type { key_val } from '$lib/stores/ae_stores';
import {
ae_snip,
ae_loc,
ae_sess,
ae_api,
ae_trig,
slct,
slct_trigger
} from '$lib/stores/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/stores/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
import Element_ae_crud from '$lib/elements/element_ae_crud.svelte';
import Element_data_store from '$lib/elements/element_data_store_v3.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>
<!-- New standard page specific menu 2025-06-20 -->
<div class="pres_mgmt__session_search_menu ae_container_module_menu">
<!-- BEGIN: The menu button options -->
<div class="flex flex-row flex-wrap gap-1 items-center justify-around w-full">
<Comp__events_menu_nav
hide={!$ae_loc.authenticated_access}
event_id={$lq__event_obj?.event_id}
ae_core={$ae_loc.administrator_access}
events__locations={$ae_loc.administrator_access}
events__reports={$ae_loc.trusted_access}
/>
<span
class="ae_menu__object_options flex flex-row flex-wrap gap-0.5 items-center justify-around"
>
<!-- Button to toggle between the regular event session search view and managing event files -->
<button
type="button"
onclick={() => {
if ($events_loc.pres_mgmt.show_content__event_view == 'manage_files') {
$events_loc.pres_mgmt.show_content__event_view = null;
} else {
$events_loc.pres_mgmt.show_content__event_view = 'manage_files';
}
}}
class={ae_snip.classes__events_pres_mgmt_menu__button_special}
class:preset-filled-primary-500={$events_loc.pres_mgmt.show_content__event_view ==
'manage_files'}
class:preset-tonal-primary={$events_loc.pres_mgmt.show_content__event_view !=
'manage_files'}
class:hidden={!$ae_loc.administrator_access || 1 == 1}
disabled={!$ae_loc.manager_access}
title="Session search or manage files for the event"
>
{#if $events_loc.pres_mgmt.show_content__event_view == 'manage_files'}
<span class="fas fa-users m-1"></span>
<!-- View Session Search -->
Session Search?
{:else}
<span class="fas fa-file-archive m-1"></span>
Event Files?
<span
class="badge badge-icon preset-tonal-success absolute -top-1.5 -right-1.5 z-10"
class:hidden={!$lq__event_obj?.file_count}
>
{$lq__event_obj?.file_count}×
</span>
{/if}
</button>
<!-- Button to toggle between showing and not showing the extended options menu -->
<button
type="button"
onclick={() => {
if ($events_loc.pres_mgmt.show_menu__session_search == 'options') {
$events_loc.pres_mgmt.show_menu__session_search = null;
} else {
$events_loc.pres_mgmt.show_menu__session_search = 'options';
}
}}
class="btn btn-sm mx-1"
class:ae_btn_info_filled={$events_loc.pres_mgmt.show_menu__session_search ==
'options'}
class:ae_btn_info={$events_loc.pres_mgmt.show_menu__session_search != 'options'}
class:hidden={!$ae_loc.trusted_access}
title="Options for the event session search"
>
<span class="fas fa-cog m-1"></span>
{#if $events_loc.pres_mgmt.show_menu__session_search == 'options'}
Hide
{:else}
<span class="hidden"> Show </span>
{/if}
Options?
</button>
<button
type="button"
onclick={() => {
if ($events_loc.pres_mgmt.show_menu__session_search == 'help') {
$events_loc.pres_mgmt.show_menu__session_search = null;
} else {
$events_loc.pres_mgmt.show_menu__session_search = 'help';
}
}}
class="btn btn-sm mx-1"
class:ae_btn_info_filled={$events_loc.pres_mgmt.show_menu__session_search == 'help'}
class:ae_btn_info={$events_loc.pres_mgmt.show_menu__session_search != 'help'}
title="Help and information about the session search"
>
<span class="fas fa-question-circle m-1"></span>
{#if $events_loc.pres_mgmt.show_menu__session_search == 'help'}
Hide Help?
{:else}
Help?
{/if}
</button>
</span>
<span class="ae_menu__action_options" class:hidden={true}>
No action options here yet.
</span>
</div>
<!-- END: The menu button options -->
<!-- BEGIN: The expanded menu area for information and options -->
<div
class:ae_container_module_options={$events_loc.pres_mgmt.show_menu__session_search ==
'options'}
class:hidden={$events_loc.pres_mgmt.show_menu__session_search != 'options'}
>
<div 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,
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 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>
<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="grow">
<span class="fas fa-save m-1"></span>
Save Search Text?
</span>
{/if}
</button>
<!-- 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 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">
<span class="fas fa-plane m-1"></span>
{$events_loc.pres_mgmt.hide__launcher_link
? 'Show Launcher Links'
: 'Hide Launcher Links?'}
</span>
</button>
<!-- Show/Hide launcher links (legacy version) -->
<button
type="button"
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 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
? 'Legacy Launcher Links'
: 'Hide Legacy Launcher?'}
</span>
</button>
<!-- 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 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>
</button>
<!-- Show/Hide the Location (room) column in tables and lists -->
<button
type="button"
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 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>
<span class="grow">
<!-- <span class="fas fa-door-open m-1"></span> -->
{$events_loc.pres_mgmt.hide__session_li_location_field
? 'Show Location Column'
: 'Hide Location Column?'}
</span>
</button>
<!-- Show/Hide the POC column in tables and lists -->
<button
type="button"
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 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>
<span class="grow">
<!-- <span class="fas fa-user-tie m-1"></span> -->
{$events_loc.pres_mgmt.hide__session_li_poc_field
? 'Show POC Column'
: 'Hide POC Column?'}
</span>
</button>
</div>
<Comp__pres_mgmt_menu_opts hide={!$ae_loc.authenticated_access} />
</div>
<!-- END: The expanded menu area for information and options -->
<Element_data_store
ds_code="events__pres_mgmt__session_search_help"
ds_name="Default: Events - Pres Mgmt Session Search Help"
ds_type="html"
for_type="event"
for_id={$events_slct.event_id}
class_li="ae_container_module_help"
show_edit={false}
show_edit_btn={true}
hide={$events_loc.pres_mgmt.show_menu__session_search != 'help'}
/>
<div>
<button
type="button"
onclick={() => {
$events_loc.pres_mgmt.show_menu__session_search =
!$events_loc.pres_mgmt.show_menu__session_search;
}}
class="btn btn-sm mx-1 ae_btn_info_filled"
class:hidden={!$events_loc.pres_mgmt.show_menu__session_search}
title="Collapse the expanded menu"
>
<span class="fas fa-chevron-up m-1"></span>
{#if $events_loc.pres_mgmt.show_menu__session_search}
Hide
<!-- Collapse -->
{:else}
Show
{/if}
<!-- Menu? -->
</button>
</div>
</div>
<!-- End of the new standard page specific menu -->