Lots of work on the Launcher and configuration. Looks pretty good and useful.

This commit is contained in:
Scott Idem
2025-10-15 19:01:30 -04:00
parent a6058efaf0
commit 9678c5620d
16 changed files with 446 additions and 155 deletions

View File

@@ -1,6 +1,6 @@
{
"name": "osit-aether-app-svelte",
"version": "3.8.0",
"version": "3.9.0",
"description": "One Sky IT's Aether App created with Svelte, SvelteKit, Tailwind CSS, Lucide, Font Awesome, and Skeleton UI. -Scott Idem",
"homepage": "https://oneskyit.com/",
"private": true,

View File

@@ -5,8 +5,8 @@ import type { Writable } from 'svelte/store';
import type { key_val } from '$lib/ae_stores';
// Set the version for the app data. Changing this should force a notification and ask the user to clear and reload the page.
let ver = '2025-10-15_1401';
let ver_idb = '2025-10-15_1401';
let ver = '2025-10-15_1423';
let ver_idb = '2025-10-15_1423';
/* *** BEGIN *** Initialize events_local_data_struct */
// Longer-term app data. This should be stored to *local* storage.
@@ -158,12 +158,11 @@ let events_local_data_struct: key_val = {
'host_file_config_path': 'device_configs/ae_native_app_config.default.json',
},
idle_timer: 5*60*1000, // How many seconds until idle
idle_cycle: 2*1000, // How frequently the idle status is checked
idle_loop_period: 1*60*1000, // How frequently the loop runs for the screen saver and similar
idle_timer: 7*60*1000, // How many seconds until idle
idle_cycle: 5*1000, // How frequently the idle status is checked
idle_loop_period: 3*60*1000, // How frequently the loop runs for the screen saver and similar
screen_saver_img_kv: {},
// screen_saver_img_li: [],
screen_saver_img_kv: {}, // This key value list is generate when the launcher_file_cont is loaded. It only adds image file types.
modal__title: '-- Not Set --',
modal__open: null,
modal__open_filename: null,

View File

@@ -141,7 +141,7 @@ export let iso_datetime_formatter = function iso_datetime_formatter(
datetime_string = dayjs(raw_datetime).format('hh:mm:ss A Z');
break;
case 'time_long':
datetime_string = dayjs(raw_datetime).format('HH:mm:ss A');
datetime_string = dayjs(raw_datetime).format('HH:mm:ss');
break;
case 'time_12_long':
datetime_string = dayjs(raw_datetime).format('hh:mm:ss A');

View File

@@ -1,6 +1,6 @@
<script lang="ts">
// *** Import Svelte specific
import { tick } from 'svelte';
// import { tick } from 'svelte';
// import { goto, invalidateAll } from '$app/navigation';
// *** Import other supporting libraries
@@ -116,7 +116,7 @@ max-w-max -->
class:top-0={expand && 1 == 3}
class:opacity-100={expand}
class:w-full={expand}
class:hidden={false}
class:hidden={hide}
class:border-transparent={!expand}
class:bg-transparent={!expand}
>

View File

@@ -4,6 +4,8 @@ interface Props {
ws_connect?: boolean;
ws_connect_status?: null|string;
ws_server?: string;
ws_retry_delay?: number;
ws_retry_count?: number;
base_url?: any;
group_id?: string;
client_id?: any;
@@ -27,6 +29,8 @@ let {
ws_connect = $bindable(false),
ws_connect_status = $bindable(null),
ws_server = 'dev-api.oneskyit.com',
ws_retry_delay = 3500,
ws_retry_count = 0,
base_url = `wss://${ws_server}/ws`,
group_id = $bindable('ae-grp-99'),
client_id = $bindable(Date.now()),
@@ -103,6 +107,8 @@ function ws_connect_group_id({group_id, client_id}) {
// });
ws_conn_status = 'connected';
ws_retry_count = 0;
// ws_connection.send(JSON.stringify({
// client_id: client_id,
// target: 'echo',
@@ -203,11 +209,17 @@ function ws_connect_group_id({group_id, client_id}) {
ws_conn_status = 'disconnected';
if (ws_connect) {
if (ws_retry_count >= 10) {
ws_retry_delay = ws_retry_delay += 4999; // Set to a very long time
ws_retry_delay = Math.min(ws_retry_delay, 120000); // Max of 2 minutes
console.log(`WS: Retry count exceeded. Increasing the delay. ws_retry_count=${ws_retry_count} ws_retry_delay=${ws_retry_delay}`);
}
setTimeout(function() {
console.log('WS: Disconnected... Try again!');
ws_retry_count += 1;
ws_connect_group_id({group_id: group_id, client_id: client_id});
console.log('WS: Again done?');
}, 1000);
}, ws_retry_delay);
}
};

View File

@@ -8,12 +8,12 @@ import { browser } from '$app/environment';
// *** Import other supporting libraries
// import * as icons from '@lucide/svelte';
import {
Brain,
House, Library,
RefreshCw,
Satellite
} from '@lucide/svelte';
import { Modal } from '@skeletonlabs/skeleton-svelte';
Brain,
House, Library,
RefreshCw,
Satellite
} from '@lucide/svelte';
// import { Modal } from '@skeletonlabs/skeleton-svelte';
// *** Import Aether specific variables and functions
import type { key_val } from '$lib/ae_stores';
@@ -39,7 +39,7 @@ $events_loc.qry__limit = 15;
$events_loc.qry__offset = 0;
// 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);
if (log_lvl) {
console.log(`$slct.account_id = `, $slct.account_id);
@@ -102,7 +102,7 @@ function clear_local() {
$ae_loc.authenticated_access = false;
$ae_loc.edit_mode = false;
$ae_loc.ver = '';
// $ae_loc.ver = '';
localStorage.clear();
// window.localStorage.clear();
@@ -151,12 +151,11 @@ function clear_sess() {
// Clear localStorage and sessionStorage
clear_local();
// clear_sess();
clear_sess();
alert('The page will now reload. You may need to sign in again.');
// Clear local storage and reload the page to get the latest version.
// window.localStorage.clear();
location.reload();
// window.location.reload(true);
}}
title="A new version of One Sky IT's Aether Events module is available. Click to reload the page and use the latest version."
>

View File

@@ -24,7 +24,6 @@ import {
// RefreshCw,
Satellite
} from '@lucide/svelte';
// import { AppBar } from '@skeletonlabs/skeleton-svelte';
// *** Import Aether specific variables and functions
import type { key_val } from '$lib/ae_stores';
@@ -42,7 +41,7 @@ import Element_websocket_v2 from '$lib/element_websocket_v2.svelte';
// *** Set initial variables
// 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);
let ae_acct = data[$slct.account_id];
// console.log(`ae_acct = `, ae_acct);
@@ -639,13 +638,14 @@ async function handle_event_file_close () {
if (!$events_loc.launcher.idle_timer) {
$events_loc.launcher.idle_timer = 4 * 60 * 1000;
$events_loc.launcher.idle_timer = 5 * 60 * 1000;
}
// $events_loc.launcher.idle_timer = .25 * 60 * 1000;
if (!$events_loc.launcher.idle_cycle) {
$events_loc.launcher.idle_cycle = 5 * 1000;
}
if (!$events_loc.launcher.idle_loop_period) {
$events_loc.launcher.idle_loop_period = 1 * 60 * 1000;
$events_loc.launcher.idle_loop_period = 3 * 60 * 1000;
}
// Safer to run this once the component has mounted and initialized???
listen({
@@ -654,19 +654,27 @@ listen({
});
let idle_timer_interval: any = $state();
clearInterval(idle_timer_interval);
// clearInterval(idle_timer_interval);
let saver_looping: boolean = $state(false);
function handle_idle_client() {
// Start the digital poster screen saver after additional idle time.
if ($events_slct?.event_session_obj && $events_slct.event_session_obj?.type_code == 'poster') {
console.log('Open poster file in poster session...');
if ($lq__event_session_obj && $lq__event_session_obj?.type_code == 'poster') {
if (log_lvl) {
console.log(`Turned idle! Open poster file for poster session in ${($events_loc.launcher.idle_loop_period / 60000).toPrecision(4)} minutes.`);
}
if (saver_looping) {
console.log('Screen saver already looping.');
return false;
}
saver_looping = true;
idle_timer_interval = setInterval(() => {
if (log_lvl) {
console.log('Screen saver tick!');
// console.log($events_loc.launcher.screen_saver_img_kv);
console.log(`Screen saver tick every ${($events_loc.launcher.idle_loop_period / 60000).toPrecision(4)} minutes after initially being idle for ${($events_loc.launcher.idle_timer / 60000).toPrecision(4)} minutes.`);
}
// console.log($events_loc.launcher.screen_saver_img_kv.length());
@@ -677,7 +685,9 @@ function handle_idle_client() {
let modal_title: string = '';
const rand_index = Math.floor(Math.random() * Object.keys($events_loc.launcher.screen_saver_img_kv).length);
console.log(rand_index);
if (log_lvl) {
console.log(`Random index = ${rand_index}`);
}
let event_file_obj = $events_loc.launcher.screen_saver_img_kv[Object.keys($events_loc.launcher.screen_saver_img_kv)[rand_index]];
@@ -686,11 +696,14 @@ function handle_idle_client() {
// $slct_trigger = 'event_file';
// $events_loc.launcher.event_file_open.open_status = 'open';
$events_sess.launcher.modal__open = event_file_obj.event_file_id_random;
if (!modal_title) {
modal_title = event_file_obj.filename;
}
$events_sess.launcher.modal__title = modal_title;
$events_sess.launcher.modal__open_event_file_id = null;
// clearInterval(idle_timer_interval);
// if (!modal_title) {
// modal_title = event_file_obj.filename;
// }
$events_sess.launcher.modal__title = event_file_obj.filename ?? '*';
$events_sess.launcher.modal__open_event_file_id = $events_slct.event_file_id;
$events_sess.launcher.modal__event_file_obj = event_file_obj;
// $events_sess.launcher.modal__img_src = `/event/file/${event_file_obj.event_file_id_random}/download`;
return true;
@@ -700,20 +713,47 @@ function handle_idle_client() {
}, $events_loc.launcher.idle_loop_period ?? 2 * 60 * 1000);
// console.log('User is no longer idle???');
} else {
console.log('Not a poster session so no screen saver.');
saver_looping = false;
return false;
}
}
onIdle(() => {
// This is called when the user has gone idle for the specified time.
// alert('USER IS IDLE');
log_lvl = 1;
if (log_lvl) {
console.log(`User has gone idle after ${($events_loc.launcher?.idle_timer / 60000).toPrecision(4)} minutes.`, $idle);
}
clearInterval(idle_timer_interval);
handle_idle_client();
});
$effect(() => {
if ($idle) {
log_lvl = 1;
console.log(`User is idle after ${$events_loc.launcher?.idle_timer} milliseconds.`);
handle_idle_client();
// log_lvl = 1;
// if (log_lvl) {
// console.log(`User has gone idle after ${($events_loc.launcher?.idle_timer / 60000).toPrecision(4)} minutes.`, $idle);
// }
// // clearInterval(idle_timer_interval);
// if (!saver_looping) {
// handle_idle_client();
// }
} else {
console.log('User is no longer idle.');
log_lvl = 0;
log_lvl = 1;
if (log_lvl) {
console.log(`User is active again after being idle. End screen saver if active.`, $idle);
}
clearInterval(idle_timer_interval);
saver_looping = false;
}
});
</script>
@@ -943,6 +983,8 @@ $effect(() => {
</div>
<!-- hover:z-20 -->
<!-- hover:scale-105 -->
<footer
id="Main-Footer"
class:hidden={$events_loc.launcher.hide__launcher_footer}
@@ -955,7 +997,8 @@ $effect(() => {
flex flex-row items-center justify-between
sm:flex-row md:items-center md:justify-between
text-xs hover:text-base
text-xs hover:sm:text-sm hover:md:text-base hover:lg:text-lg
bg-gray-200 border-t border-gray-200
dark:bg-gray-800 dark:border-gray-600
@@ -968,10 +1011,25 @@ $effect(() => {
[Help]
</div> -->
<div class="slct_location_name transition-all duration-1000">
<span class="fas fa-map-marker-alt"></span>
<div
class="slct_location_name transition-all duration-1000"
title="Location ID: {$lq__event_location_obj?.event_location_id} Name: {$lq__event_location_obj?.name} | Device ID: {$lq__event_device_obj?.event_device_id} Name: {$lq__event_device_obj?.name}"
>
<button
class=""
onclick={() => {
$ae_loc.edit_mode = !$ae_loc.edit_mode;
}}
title="Toggle Edit Mode to show location options and more"
>
<span class="sr-only">Location:</span>
<span class="fas fa-map-marker-alt"></span>
</button>
{$lq__event_location_obj?.name}
{$lq__event_device_obj?.name}
{#if $lq__event_device_obj?.name}
<span class="fas fa-laptop mx-1"></span>
{$lq__event_device_obj?.name}
{/if}
</div>
<span
@@ -994,30 +1052,34 @@ $effect(() => {
<span
class:hidden={$events_loc.launcher.app_mode != 'native'}
class="*:hover:inline px-1 rounded-md"
class="group px-1 rounded-md"
class:preset-tonal-warning={!$events_sess.launcher?.av_recording_status}
class:preset-tonal-success={$events_sess.launcher?.av_recording_status}
>
{#if $events_sess.launcher?.av_recording_status}
<span class="fas fa-video mx-1"></span>
<span class="hidden">
<span class="hidden group-hover:inline">
AV Recording Active
</span>
{:else}
<span class="fas fa-video-slash mx-1"></span>
<span class="hidden">
<span class="hidden group-hover:inline">
AV Recording Inactive
</span>
{/if}
</span>
<div class="current_datetime">
<div class="current_datetime font-mono px-2 hover:font-bold hover:bg-white transition-all">
<span class="fas fa-calendar-alt"></span>
{ae_util.iso_datetime_formatter($time,'date_full_no_year')}
<span class="fas fa-clock"></span>
{#if $events_loc.launcher?.time_hours == 12}
{ae_util.iso_datetime_formatter($time,'time_12_long')}
{:else}
{ae_util.iso_datetime_formatter($time,'time_long')}
{ae_util.iso_datetime_formatter($time,'time_long')}
{/if}
<!-- <span class="fas fa-hourglass fa-spin"></span> -->
<!-- <span class="fas fa-hourglass"></span> -->
</div>
</footer>

View File

@@ -37,7 +37,7 @@ import { kill_processes, open_local_file_v2, run_cmd, run_cmd_sync, run_osascrip
// Variables
// 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);
let ae_acct = data[$slct.account_id];
// console.log(`ae_acct = `, ae_acct);

View File

@@ -13,12 +13,12 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig } fro
<div
class="
flex flex-col gap-1 items-center justify-start
w-full max-w-md
flex flex-col gap-2 items-center justify-start
"
>
<div class="flex flex-row items-center justify-between w-full">
<div class="w-full flex flex-row items-center justify-between ">
<h2
class="text-center mb-4 text-base font-semibold text-gray-500 dark:text-gray-400"
>
@@ -27,7 +27,7 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig } fro
<button
onclick={() => ($events_loc.launcher.hide_drawer__cfg = true)}
class="pb-4 pl-4 dark:text-white"
class="btn btn-icon dark:text-white"
>
<span class="fas fa-times"></span>
<span class="sr-only">Close Config</span>
@@ -35,115 +35,183 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig } fro
</div>
<hr class="my-2 border-gray-300 dark:border-gray-600" />
<!-- <hr class="w-full my-2 border-1 border-gray-200 dark:border-gray-800 " /> -->
<section class="controller w-full">
<h3
class="text-center mb-2 text-sm font-semibold"
<section
class:preset-outlined-warning-300-700={$events_loc.launcher.show_section__controller}
class="controller w-full preset-outlined-surface-300-700 transition-all"
>
<h3
class="text-center mb-2 text-sm font-semibold"
>
<button
onclick={() => {
$events_loc.launcher.show_section__controller = !$events_loc.launcher.show_section__controller;
}}
class="btn btn-sm w-full justify-between"
>
{#if $events_loc.launcher.show_section__controller}
<span class="fas fa-chevron-down"></span>
{:else}
<span class="fas fa-chevron-right"></span>
{/if}
Controller:
{$events_loc.launcher?.controller ?? '-- not set --'}
({$events_loc.launcher.controller_group_code ?? '-- not set --'})
{#if $events_sess.launcher.ws_connect_status == 'connected'}
<span class="fas fa-sitemap m-1 text-green-700"></span>
<!-- <span class="fas fa-signal m-1"></span> -->
{:else}
<span class="fas fa-times m-1 text-red-700"></span>
{/if}
</button>
</h3>
<div
class:hidden={!$events_loc.launcher.show_section__controller}
>
<div class="flex flex-row gap-1 p-0.5">
<select
bind:value={$events_loc.launcher.controller}
class="input select"
>
<option value="local">Local Only</option>
<option value="remote">Remotely WS Controlled</option>
<option value="local_push">Local and WS Controller</option>
</select>
</div>
<div class="flex flex-row gap-1 p-0.5">
<input
bind:value={$events_loc.launcher.controller_group_code}
placeholder="Controller group code"
class="input"
ondblclick={() => {
$events_sess.launcher.controller_unlock_group_code = !$events_sess.launcher.controller_unlock_group_code;
$events_loc.launcher.ws_connect = false;
}}
readonly={!$events_sess.launcher.controller_unlock_group_code}
>
<button
onclick={() => {
$events_loc.launcher.show_section__controller = !$events_loc.launcher.show_section__controller;
$events_loc.launcher.ws_connect = !$events_loc.launcher.ws_connect;
$events_sess.launcher.controller_unlock_group_code = false;
$events_sess.launcher.controller_cmd = null,
$events_sess.launcher.controller_trigger_send = null;
}}
class="ae_btn btn_sm btn_seamless"
class="btn btn-sm hover:preset-filled-primary-500"
class:preset-tonal-warning={!$events_loc.launcher.ws_connect}
class:preset-tonal-success={$events_loc.launcher.ws_connect}
>
Controller:
{$events_loc.launcher?.controller ?? '-- not set --'}
({$events_loc.launcher.controller_group_code ?? '-- not set --'})
{#if $events_sess.launcher.ws_connect_status == 'connected'}
<span class="fas fa-sitemap m-1"></span>
{#if $events_loc.launcher.ws_connect}
<!-- <span class="fas fa-signal m-1"></span> -->
Disconnect?
{:else}
<span class="fas fa-times m-1"></span>
{/if}
{#if $events_loc.launcher.show_section__controller}
<span class="fas fa-chevron-down"></span>
{:else}
<span class="fas fa-chevron-right"></span>
<!-- <span class="fas fa-plug m-1"></span> -->
Connect?
{/if}
</button>
</h3>
<div
class:hidden={!$events_loc.launcher.show_section__controller}
>
<div class="flex flex-row gap-1 p-0.5">
<select
bind:value={$events_loc.launcher.controller}
class="select"
>
<option value="local">Local Only</option>
<option value="remote">Remotely Controlled</option>
<option value="local_push">Local and Controller</option>
</select>
</div>
<div class="flex flex-row gap-1 p-0.5">
<input
bind:value={$events_loc.launcher.controller_group_code}
placeholder="Controller group code"
class="input"
ondblclick={() => {
$events_sess.launcher.controller_unlock_group_code = !$events_sess.launcher.controller_unlock_group_code;
$events_loc.launcher.ws_connect = false;
}}
readonly={!$events_sess.launcher.controller_unlock_group_code}
>
{#if $events_loc.launcher.ws_connect}
<button
onclick={() => {
$events_loc.launcher.ws_connect = !$events_loc.launcher.ws_connect;
$events_sess.launcher.controller_unlock_group_code = false;
$events_sess.launcher.controller_cmd = null,
$events_sess.launcher.controller_trigger_send = null;
$events_sess.launcher.controller_cmd = 'ae_refresh:now';
$events_sess.launcher.controller_trigger_send = 'trigger';
}}
class="btn btn-sm hover:preset-filled-primary-500"
class:preset-tonal-warning={!$events_loc.launcher.ws_connect}
class:preset-tonal-success={$events_loc.launcher.ws_connect}
class="btn btn-sm preset-tonal-secondary border border-secondary-500 hover:preset-filled-secondary-500"
>
{#if $events_loc.launcher.ws_connect}
<!-- <span class="fas fa-signal m-1"></span> -->
Disconnect?
{:else}
<!-- <span class="fas fa-plug m-1"></span> -->
Connect?
{/if}
Send Group Reload
</button>
{#if $events_loc.launcher.ws_connect}
<button
onclick={() => {
$events_sess.launcher.controller_unlock_group_code = false;
$events_sess.launcher.controller_cmd = 'ae_refresh:now';
$events_sess.launcher.controller_trigger_send = 'trigger';
}}
class="btn btn-sm preset-tonal-secondary border border-secondary-500 hover:preset-filled-secondary-500"
>
Send Group Reload
</button>
{/if}
</div>
{/if}
</div>
</div>
</section>
<hr class="my-2 border-gray-300 dark:border-gray-600" />
<!-- <hr class="my-2 border-gray-300 dark:border-gray-600" /> -->
<section class="screen_saver w-full">
<section
class:preset-outlined-warning-300-700={$events_loc.launcher.show_section__screen_saver}
class="screen_saver w-full preset-outlined-surface-300-700 transition-all"
>
<h3
class="text-center mb-2 text-sm font-semibold w-full"
>
Screen Saver
<button
onclick={() => {
$events_loc.launcher.show_section__screen_saver = !$events_loc.launcher.show_section__screen_saver;
}}
class="btn btn-sm w-full justify-between"
>
<span>
{#if $events_loc.launcher.show_section__screen_saver}
<span class="fas fa-chevron-down"></span>
{:else}
<span class="fas fa-chevron-right"></span>
{/if}
Screen Saver
</span>
{$events_loc.launcher.idle_timer ? ($events_loc.launcher.idle_timer / 60000).toPrecision(4)
+ ' min' : '-- not set --'}
</button>
</h3>
<div
class="flex flex-col gap-1 items-center justify-start w-full"
class:hidden={!$events_loc.launcher.show_section__screen_saver}
>
<!-- Run screen saver after idle time exceeded $events_loc.launcher.idle_timer = 4 * 60 * 1000 -->
<label
class="flex flex-row gap-1 items-center justify-start"
>
<span class="w-36">Idle Time (ms):</span>
<input
type="number"
min={3000}
bind:value={$events_loc.launcher.idle_timer}
class="input input-sm w-24 text-right"
>
</label>
<!-- How often is idle checked? $events_loc.launcher.idle_cycle = 5 * 1000 -->
<label
class="flex flex-row gap-1 items-center justify-start"
>
<span class="w-36">Cycle Check (ms):</span>
<input
type="number"
min={500}
bind:value={$events_loc.launcher.idle_cycle}
class="input input-sm w-24 text-right"
>
</label>
<!-- How often the image changes? $events_loc.launcher.idle_loop_period = 1 * 60 * 1000 -->
<label
class="flex flex-row gap-1 items-center justify-start"
>
<span class="w-36">Image Change Period (ms):</span>
<input
type="number"
min={750}
bind:value={$events_loc.launcher.idle_loop_period}
class="input input-sm w-24 text-right"
>
</label>
<!-- Future options: Show caption for X seconds -->
</div>
</section>
<hr class="my-2 border-gray-300 dark:border-gray-600" />
<!-- <hr class="w-full my-2 border-1 border-gray-200 dark:border-gray-800 " /> -->
<!-- App Modes: default (browser), onsite (browser onsite), native (Electron app onsite) -->
@@ -156,7 +224,10 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig } fro
* native Electron caching and open method (download to cache, copy and then open)
* URL: new browser window
-->
<section class="app_modes w-full">
<section
class:preset-outlined-warning-300-700={$events_loc.launcher.show_section__app_modes}
class="app_modes w-full preset-outlined-surface-300-700 transition-all"
>
<h3
class="text-center mb-2 text-sm font-semibold"
>
@@ -164,15 +235,17 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig } fro
onclick={() => {
$events_loc.launcher.show_section__app_modes = !$events_loc.launcher.show_section__app_modes;
}}
class="ae_btn btn_sm btn_seamless"
class="btn btn-sm w-full justify-between"
>
App Modes:
{$events_loc.launcher.app_mode ?? '-- not set --'}
<span>
{#if $events_loc.launcher.show_section__app_modes}
<span class="fas fa-chevron-down"></span>
{:else}
<span class="fas fa-chevron-right"></span>
{/if}
App Modes
</span>
{$events_loc.launcher.app_mode ?? '-- not set --'}
</button>
</h3>
@@ -190,7 +263,7 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig } fro
// ae_event_launcher.set($events_loc.launcher);
console.log($events_loc.launcher);
}}
title="Switch to default mode"
title="Switch to default web browser mode"
>
Change to Default Mode
</button>
@@ -203,7 +276,7 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig } fro
// ae_event_launcher.set($ae_event_launcher);
console.log($events_loc.launcher);
}}
title="Switch to native mode"
title="Switch to native app mode"
>
Change to App Mode
</button>
@@ -419,18 +492,154 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig } fro
<section class="local_cfg_refresh w-full">
<section
class:preset-outlined-warning-300-700={$events_loc.launcher.show_section__local_cfg_refresh}
class="local_cfg_refresh w-full preset-outlined-surface-300-700 transition-all"
>
<h3
class="text-center mb-2 text-sm font-semibold"
>
Local Config Refresh
<button
onclick={() => {
$events_loc.launcher.show_section__local_cfg_refresh = !$events_loc.launcher.show_section__local_cfg_refresh;
}}
class="btn btn-sm w-full justify-between"
>
<span>
{#if $events_loc.launcher.show_section__local_cfg_refresh}
<span class="fas fa-chevron-down"></span>
{:else}
<span class="fas fa-chevron-right"></span>
{/if}
Other Local Config and Caches
</span>
</button>
</h3>
<!-- delete IDB tables, local storage, etc -->
<div
class="flex flex-col gap-1 items-center justify-start w-full"
class:hidden={!$events_loc.launcher.show_section__local_cfg_refresh}
>
<div class="flex flex-col gap-1 items-center justify-start w-full">
<select
class="input w-full"
onchange={event => {
const val = (event.target as HTMLSelectElement).value;
if (val && val != '') {
if (val == 'delete_idbs') {
// Delete all IDB tables
if (confirm('Are you sure you want to delete ALL IndexedDB databases? This will log you out of the app and you will need to reload the app.')) {
// continue
} else {
(event.target as HTMLSelectElement).value = '';
return false;
}
indexedDB.deleteDatabase('ae_archives_db'); // Archives module
indexedDB.deleteDatabase('ae_core_db');
indexedDB.deleteDatabase('ae_events_db'); // Events module
indexedDB.deleteDatabase('ae_journals_db'); // Journals module
indexedDB.deleteDatabase('ae_posts_db'); // Posts module
indexedDB.deleteDatabase('ae_sponsorships_db'); // Sponsorships module
alert('All IndexedDB databases deleted. Please reload the app.');
} else if (val == 'delete_idbs_events') {
// Delete Event IDB tables
if (confirm('Are you sure you want to delete ONLY the Events IndexedDB database? This will log you out of the app and you will need to reload the app.')) {
// continue
} else {
(event.target as HTMLSelectElement).value = '';
return false;
}
indexedDB.deleteDatabase('ae_events_db'); // Events module
alert('Events IndexedDB database deleted. Please reload the app.');
} else if (val == 'delete_local') {
// Delete all local config
if (confirm('Are you sure you want to delete ALL local config in localStorage? This will log you out of the app and you will need to reload the app.')) {
// continue
} else {
(event.target as HTMLSelectElement).value = '';
return false;
}
localStorage.removeItem('ae_loc');
localStorage.removeItem('ae_events_loc');
localStorage.removeItem('ae_idaa_loc');
localStorage.removeItem('ae_journals_loc');
location.reload();
} else if (val == 'delete_local_events') {
// Delete local config for Events
if (confirm('Are you sure you want to delete ONLY the Events local config in localStorage? This will log you out of the app and you will need to reload the app.')) {
// continue
} else {
(event.target as HTMLSelectElement).value = '';
return false;
}
localStorage.removeItem('ae_events_loc');
// localStorage.removeItem('ae_event_cfg_' + $lq__event_obj?.event_id);
// localStorage.removeItem('ae_event_launcher_' + $lq__event_obj?.event_id);
location.reload();
}
(event.target as HTMLSelectElement).value = '';
}
}}
>
<option value="">-- select an option --</option>
<option value="delete_idbs">Delete all IDB tables</option>
<option value="delete_idbs_events">Delete Events IDB tables</option>
<option value="delete_local">Delete all local config</option>
<option value="delete_local_events">Delete local config for Events</option>
</select>
<span class="text-xs text-gray-500 dark:text-gray-400">
The action happens when the option is selected
</span>
</div>
<div class="flex flex-row gap-1 items-center justify-center w-full">
<!-- $ae_loc.sys_menu.hide -->
<button
type="button"
onclick={() => ($ae_loc.sys_menu.hide = !$ae_loc.sys_menu.hide)}
class="btn btn-sm p-1 preset-tonal-error hover:preset-filled-error-500"
title="Show or hide the Aether system menu (global)"
>
{#if !$ae_loc.sys_menu.hide}
<span class="fas fa-times"></span>
Hide Sys Menu
{:else}
<span class="fas fa-cog"></span>
Show Sys Menu
{/if}
</button>
<!-- $ae_loc.debug_menu.hide -->
<button
type="button"
onclick={() => ($ae_loc.debug_menu.hide = !$ae_loc.debug_menu.hide)}
class="btn btn-sm p-1 preset-tonal-error hover:preset-filled-error-500"
title="Show or hide the Aether debug menu (global)"
>
{#if !$ae_loc.debug_menu.hide}
<span class="fas fa-times"></span>
Hide Debug Menu
{:else}
<span class="fas fa-bug"></span>
Show Debug Menu
{/if}
</button>
</div>
</div>
</section>
<hr class="my-2 border-gray-300 dark:border-gray-600" />
<!-- <hr class="my-2 border-gray-300 dark:border-gray-600" /> -->
<div class="text-center">
@@ -440,7 +649,16 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig } fro
class="btn btn-sm p-1 preset-tonal-error hover:preset-filled-error-500"
>
<span class="fas fa-bug"></span>
<!-- Debug -->
Debug
</button>
<button
type="button"
onclick={() => location.reload()}
class="btn btn-sm p-1 preset-tonal-secondary hover:preset-filled-secondary-500"
>
<span class="fas fa-sync-alt"></span>
Reload Page
</button>
</div>

View File

@@ -30,7 +30,7 @@ import { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_ev
// 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;
let ae_acct = data[$slct.account_id];
if (log_lvl) {
console.log(`ae_acct = `, ae_acct);

View File

@@ -503,9 +503,10 @@ max-w-max -->
onchange={() => {
$events_trigger = 'load__event_session_obj_li';
}}
title="Select to filter based on the location/room name"
>
{#if $lq__event_location_obj_li}
<option value="">Location?</option>
<option value="">Location / Room</option>
{#each $lq__event_location_obj_li as event_location_obj}
<option value={event_location_obj?.name}>{event_location_obj.name}</option>
{/each}

View File

@@ -39,7 +39,7 @@ if (browser) {
}
// 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);
let ae_acct = data[$slct.account_id];
// console.log(`ae_acct = `, ae_acct);

View File

@@ -39,7 +39,7 @@ if (browser) {
}
// 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);
let ae_acct = data[$slct.account_id];
// console.log(`ae_acct = `, ae_acct);

View File

@@ -34,7 +34,7 @@ import MyClipboard from '$lib/e_app_clipboard.svelte';
// Variables
// 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;
let ae_acct = data[$slct.account_id];
if (log_lvl) {
console.log(`ae_acct = `, ae_acct);

View File

@@ -28,7 +28,7 @@ import Reports_files from './reports_files.svelte';
// 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);
let ae_acct = data[$slct.account_id];
console.log(`ae_acct = `, ae_acct);

View File

@@ -44,7 +44,7 @@ if (browser) {
}
// 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);
let ae_acct = data[$slct.account_id];
// console.log(`ae_acct = `, ae_acct);
@@ -238,7 +238,7 @@ if (!$ae_loc.authenticated_access && $events_loc.pres_mgmt.show_content__session
</button>
</span>
<span class="grow flex flex-row flex-wrap gap-1 items-center justify-around">
<span class="grow flex flex-row flex-wrap gap-2 items-center justify-end">
<h2 class="text-xl font-bold text-center max-w-xs sm:max-w-lg md:max-w-2xl">
<!-- <span class="max-w-xs sm:max-w-lg md:max-w-2xl"> -->
{@html $lq__event_session_obj?.name ?? ae_snip.html__not_set}
@@ -247,7 +247,7 @@ if (!$ae_loc.authenticated_access && $events_loc.pres_mgmt.show_content__session
{#if !$events_loc.pres_mgmt?.hide__session_code && $lq__event_session_obj.code || $ae_loc.edit_mode}
<span
class="badge text-sm preset-tonal-surface flex flex-col gap-0.25 max-w-fit shrink"
class="badge text-sm preset-tonal-surface flex flex-col gap-0.25 max-w-fit shrink justify-self-end"
title="Session code {$lq__event_session_obj.code}"
>
<span class="text-xs text-surface-800-200">