Fix: system bar hide logic for iframe and menu param overrides (IDAA embed reliability)
This commit is contained in:
Scott Idem
620
src/lib/app_components/e_app_sys_menu_legacy.svelte
Normal file
620
src/lib/app_components/e_app_sys_menu_legacy.svelte
Normal file
@@ -0,0 +1,620 @@
|
||||
<script lang="ts">
|
||||
// *** Import Svelte specific
|
||||
// import { tick } from 'svelte';
|
||||
// import { goto, invalidateAll } from '$app/navigation';
|
||||
|
||||
// *** Import other supporting libraries
|
||||
import {
|
||||
// ArrowBigRight,
|
||||
// Bug,
|
||||
CircleX,
|
||||
// Eye, EyeOff,
|
||||
// Key,
|
||||
// LogIn, LogOut, LockKeyhole,
|
||||
// Mail, MailCheck,
|
||||
Menu,
|
||||
// RefreshCw, RefreshCcwDot,
|
||||
ShieldEllipsis,
|
||||
ShieldMinus,
|
||||
ShieldPlus,
|
||||
ShieldUser,
|
||||
ToggleLeft,
|
||||
ToggleRight,
|
||||
User,
|
||||
UserCheck,
|
||||
UserCog,
|
||||
Wand2,
|
||||
X
|
||||
} from '@lucide/svelte';
|
||||
|
||||
// *** Import Aether specific variables and functions
|
||||
// import { ae_util } from '$lib/ae_utils/ae_utils';
|
||||
import {
|
||||
ae_loc,
|
||||
ae_sess,
|
||||
ae_api,
|
||||
slct,
|
||||
slct_trigger
|
||||
} from '$lib/stores/ae_stores';
|
||||
|
||||
import Element_access_type from '$lib/app_components/e_app_access_type.svelte';
|
||||
import Element_app_cfg from '$lib/app_components/e_app_cfg.svelte';
|
||||
import Element_sign_in_out from '$lib/app_components/e_app_sign_in_out.svelte';
|
||||
import Element_theme from '$lib/app_components/e_app_theme.svelte';
|
||||
|
||||
// *** Setup Svelte properties
|
||||
interface Props {
|
||||
log_lvl?: number;
|
||||
data: any;
|
||||
hide?: null | boolean;
|
||||
expand?: boolean;
|
||||
}
|
||||
|
||||
let {
|
||||
log_lvl = $bindable(0),
|
||||
data = null,
|
||||
hide = $bindable(false),
|
||||
expand = $bindable(false)
|
||||
}: Props = $props();
|
||||
|
||||
let trigger_clear_access: null | boolean = $state(null);
|
||||
</script>
|
||||
|
||||
<!-- App System Menu -->
|
||||
<!-- min-h-full
|
||||
max-h-max
|
||||
min-w-full
|
||||
max-w-max -->
|
||||
<!-- <section
|
||||
class="
|
||||
ae_app__menu
|
||||
hidden-print
|
||||
flex flex-col
|
||||
items-end justify-center
|
||||
gap-1
|
||||
absolute right-0 bottom-16
|
||||
hover:bottom-6
|
||||
bg-white dark:bg-gray-800
|
||||
border border-transparent
|
||||
hover:border hover:border-gray-200 hover:dark:border-gray-700
|
||||
rounded-lg
|
||||
p-2
|
||||
*:hover:inline
|
||||
opacity-40
|
||||
hover:opacity-100
|
||||
duration-50 delay-1000 hover:delay-100 hover:ease-out
|
||||
transition hover:transition-all
|
||||
z-10 hover:z-20
|
||||
"
|
||||
class:hidden={!expand_btn}
|
||||
> -->
|
||||
<!-- && !expand -->
|
||||
<!-- !$ae_loc
|
||||
?.sys_menu?.expand_btn -->
|
||||
<!-- bg-blue-100/60 dark:bg-blue-800/50 -->
|
||||
<!-- class:hover:border-transparent={!expand} -->
|
||||
<!-- mx-1 my-2 -->
|
||||
<!-- We need to be able to hide the menu button in certain situations. Mainly iframes. -->
|
||||
<section
|
||||
class="
|
||||
ae_app__sys_menu
|
||||
|
||||
hidden-print
|
||||
md:text-md
|
||||
lg:text-md xl:text-md absolute
|
||||
|
||||
right-0
|
||||
bottom-6
|
||||
|
||||
z-50
|
||||
flex
|
||||
|
||||
w-min max-w-md flex-col-reverse
|
||||
items-end justify-center
|
||||
|
||||
gap-1 rounded-lg border-2 border-blue-300/20 bg-blue-200/90 text-sm
|
||||
|
||||
opacity-90
|
||||
|
||||
transition-all delay-500
|
||||
duration-500 ease-in-out
|
||||
hover:border-blue-500/20 hover:opacity-100
|
||||
|
||||
hover:delay-200
|
||||
hover:duration-200 sm:text-sm
|
||||
2xl:text-lg dark:border-blue-700/20
|
||||
hover:dark:border-blue-500/20
|
||||
"
|
||||
class:top-0={expand && (1 as any) == 3}
|
||||
class:opacity-100={expand}
|
||||
class:w-full={expand}
|
||||
class:hidden={hide}
|
||||
class:border-transparent={!expand}
|
||||
class:bg-transparent={!expand}>
|
||||
<!-- class:hidden={!expand} -->
|
||||
<!-- class:preset-filled-warning-100-900={expand} -->
|
||||
<div
|
||||
class:opacity-50={!expand}
|
||||
class:opacity-100={expand}
|
||||
class:light:bg-blue-500={expand}
|
||||
class:dark:bg-blue-500={expand}
|
||||
class="
|
||||
hidden-print
|
||||
light:bg-blue-200/10 relative flex w-full
|
||||
flex-col
|
||||
|
||||
items-end
|
||||
justify-end
|
||||
|
||||
gap-1
|
||||
|
||||
overflow-y-auto
|
||||
p-1
|
||||
transition-all
|
||||
|
||||
delay-1000
|
||||
|
||||
duration-200
|
||||
ease-in-out hover:opacity-100
|
||||
hover:delay-500 hover:duration-200
|
||||
dark:bg-blue-800/10
|
||||
"
|
||||
title="
|
||||
ID: {$ae_loc?.person_id ?? '-- not set --'} / {$ae_loc?.user_id ??
|
||||
'-- not set --'}
|
||||
Name: {$ae_loc?.person?.full_name ?? '-- not set --'}
|
||||
Username: {$ae_loc?.user?.username ?? '-- not set --'}
|
||||
Email: {$ae_loc?.user?.email ?? '-- not set --'}
|
||||
Access Type: {$ae_loc?.access_type ?? '-- not set --'}
|
||||
">
|
||||
{#if $ae_loc?.person_id}
|
||||
<div
|
||||
class="group flex w-full flex-row items-center justify-end gap-1 transition-all">
|
||||
<User size="1em" class="mx-1 inline-block text-gray-500" />
|
||||
<span class:hidden={!expand} class="group-hover:inline-block">
|
||||
{$ae_loc?.person?.informal_name ??
|
||||
$ae_loc?.person?.given_name}
|
||||
</span>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if $ae_loc?.user_id}
|
||||
<!-- This is currently not set to show if not expanded. Saving space. -->
|
||||
<div
|
||||
class:hidden={!expand}
|
||||
class="group flex w-full flex-row items-center justify-end gap-1 transition-all">
|
||||
<ShieldUser
|
||||
size="1em"
|
||||
class="mx-1 inline-block text-gray-500" />
|
||||
<span class:hidden={!expand} class="group-hover:inline-block">
|
||||
{$ae_loc?.user?.username ?? '-- not set --'}
|
||||
</span>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div
|
||||
class="group flex w-full flex-row items-center justify-end gap-1 transition-all">
|
||||
{#if $ae_loc.access_type && $ae_loc.access_type != 'anonymous'}
|
||||
<span
|
||||
class="group flex flex-row-reverse gap-1 text-base"
|
||||
title={`Current access type/level: ${$ae_loc.access_type}`}>
|
||||
<!-- <span class="fas fa-unlock mx-1"></span> -->
|
||||
<!-- <ShieldPlus class="inline-block" /> -->
|
||||
|
||||
{#if $ae_loc.access_type == 'super'}
|
||||
<Wand2 size="1em" class="m-1 inline-block" />
|
||||
<span
|
||||
class:hidden={!expand}
|
||||
class="hidden group-hover:inline-block">Super</span>
|
||||
{:else if $ae_loc.access_type == 'manager'}
|
||||
<ShieldUser size="1em" class="m-1 inline-block" />
|
||||
<span
|
||||
class:hidden={!expand}
|
||||
class="hidden group-hover:inline-block"
|
||||
>Manager</span>
|
||||
{:else if $ae_loc.access_type == 'administrator'}
|
||||
<UserCog size="1em" class="m-1 inline-block" />
|
||||
<span
|
||||
class:hidden={!expand}
|
||||
class="hidden group-hover:inline-block"
|
||||
>Administrator</span>
|
||||
{:else if $ae_loc.access_type == 'trusted'}
|
||||
<UserCheck size="1em" class="m-1 inline-block" />
|
||||
<span
|
||||
class:hidden={!expand}
|
||||
class="hidden group-hover:inline-block"
|
||||
>Trusted Access</span>
|
||||
{:else if $ae_loc.access_type == 'public'}
|
||||
Public
|
||||
<span
|
||||
class:hidden={!expand}
|
||||
class="hidden group-hover:inline-block"
|
||||
>Access</span>
|
||||
{:else if $ae_loc.access_type == 'authenticated'}
|
||||
Authenticated
|
||||
<span
|
||||
class:hidden={!expand}
|
||||
class="hidden group-hover:inline-block"
|
||||
>Access</span>
|
||||
{:else if $ae_loc.access_type == 'anonymous'}
|
||||
Anonymous Access
|
||||
{:else}
|
||||
Unknown Access
|
||||
{/if}
|
||||
</span>
|
||||
|
||||
{#if $ae_loc?.user_access_type && $ae_loc?.access_type == $ae_loc?.user_access_type}
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
// handle_clear_access();
|
||||
// trigger_clear_access = true;
|
||||
// $ae_loc.app_cfg.show_element__passcode_input = !$ae_loc.app_cfg.show_element__passcode_input;
|
||||
|
||||
if (!expand) {
|
||||
expand = true;
|
||||
$ae_sess.sys_menu.expand = true;
|
||||
$ae_loc.sys_menu.hide_access_type = false;
|
||||
$ae_loc.sys_menu.expand_access_type = true;
|
||||
// $ae_loc.sys_menu.expand_btn = false;
|
||||
// $ae_loc.app_cfg.show_element__access_type = true;
|
||||
// $ae_loc.app_cfg.show_element__passcode_input = true;
|
||||
} else {
|
||||
// expand = true;
|
||||
// $ae_loc.sys_menu.expand = false;
|
||||
$ae_loc.sys_menu.hide_access_type = false;
|
||||
$ae_loc.sys_menu.expand_access_type = true;
|
||||
|
||||
// $ae_loc.sys_menu.expand_btn = true;
|
||||
}
|
||||
}}
|
||||
class="btn btn-sm variant-outline-surface hover:variant-ghost-warning group text-xs transition-all"
|
||||
title={`Current user access level: "${$ae_loc.user_access_type}". Click use passcode for a different access level.`}>
|
||||
<!-- <span class="fas fa-lock mx-1"></span> -->
|
||||
<!-- <ShieldMinus /> -->
|
||||
<ShieldEllipsis size="2em" class="inline-block" />
|
||||
<span class="hidden group-hover:inline-block"
|
||||
>Passcode?</span>
|
||||
</button>
|
||||
{:else}
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
trigger_clear_access = true;
|
||||
|
||||
if (expand) {
|
||||
$ae_loc.sys_menu.hide_access_type = false;
|
||||
// $ae_loc.sys_menu.expand_access_type = false;
|
||||
expand = false;
|
||||
|
||||
// $ae_loc.sys_menu.expand = true;
|
||||
// $ae_loc.sys_menu.expand_btn = false;
|
||||
$ae_loc.app_cfg.show_element__access_type = true;
|
||||
$ae_sess.app_cfg.show_element__passcode_input = true;
|
||||
|
||||
// await tick();
|
||||
// console.log('Layout button click: Focus on passcode input!');
|
||||
// /** @type {HTMLElement | null} */
|
||||
// const to_focus = document.getElementById('access_passcode_input');
|
||||
// to_focus?.focus();
|
||||
} else {
|
||||
$ae_loc.sys_menu.hide_access_type = false;
|
||||
$ae_loc.sys_menu.expand_access_type = true;
|
||||
// $ae_loc.sys_menu.expand = false;
|
||||
// $ae_loc.sys_menu.expand_btn = true;
|
||||
}
|
||||
}}
|
||||
class="
|
||||
btn btn-sm variant-outline-surface
|
||||
hover:variant-ghost-warning
|
||||
group flex-row-reverse
|
||||
text-xs transition-all
|
||||
"
|
||||
title={`Current access level: "${$ae_loc.access_type}". Click to clear the temporary access level.`}>
|
||||
<!-- <span class="fas fa-lock mx-1"></span> Lock? -->
|
||||
<ShieldMinus class="inline-block" />
|
||||
<span class="hidden group-hover:inline-block">
|
||||
Clear?
|
||||
</span>
|
||||
</button>
|
||||
{/if}
|
||||
{:else}
|
||||
<button
|
||||
type="button"
|
||||
onclick={async () => {
|
||||
expand = true;
|
||||
$ae_sess.sys_menu.expand = true;
|
||||
$ae_loc.sys_menu.hide_access_type = false;
|
||||
$ae_loc.sys_menu.expand_access_type = true;
|
||||
|
||||
$ae_sess.app_cfg.show_element__passcode_input = true;
|
||||
$ae_sess.sys_menu.focus_passcode_input = true;
|
||||
|
||||
// $ae_loc.sys_menu.expand = true;
|
||||
// $ae_loc.sys_menu.expand_btn = false;
|
||||
// $ae_loc.app_cfg.show_element__access_type = true;
|
||||
// $ae_loc.app_cfg.show_element__passcode_input = true;
|
||||
// await tick();
|
||||
console.log(
|
||||
'Layout button click: Focus on passcode input!'
|
||||
);
|
||||
/** @type {HTMLElement | null} */
|
||||
const to_focus = document.getElementById(
|
||||
'access_passcode_input'
|
||||
);
|
||||
to_focus?.focus();
|
||||
}}
|
||||
class="
|
||||
btn btn-sm variant-outline-surface
|
||||
hover:variant-ghost-success
|
||||
group flex-row-reverse
|
||||
text-xs transition-all
|
||||
"
|
||||
title="Anonymous public access is currently set. You must Sign In or use a passcode to change your access level.">
|
||||
<!-- <span class="fas fa-lock mx-1 lock_icon"></span> -->
|
||||
<!-- <span class="">Unlock?</span> -->
|
||||
<ShieldUser class="inline-block" />
|
||||
<span class="hidden group-hover:inline-block">Auth?</span>
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
{#if $ae_loc.edit_mode}
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
$ae_loc.edit_mode = false;
|
||||
// dispatch_edit_mode_changed();
|
||||
}}
|
||||
class="
|
||||
btn btn-base preset-tonal-warning
|
||||
preset-outlined-warning-800-200
|
||||
hover:preset-tonal-success
|
||||
group
|
||||
w-full max-w-fit
|
||||
min-w-22 gap-1 text-sm transition-all
|
||||
md:min-w-30
|
||||
"
|
||||
title="Click to turn off edit mode. Edit mode is currently on.">
|
||||
<ToggleRight size="1em" class="m-1 inline-block" />
|
||||
<span class="text-xs">Edit</span>
|
||||
<span
|
||||
class="hidden group-hover:inline-block group-hover:text-xs">
|
||||
Off
|
||||
</span>
|
||||
</button>
|
||||
{:else if $ae_loc.authenticated_access}
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
$ae_loc.edit_mode = true;
|
||||
// dispatch_edit_mode_changed();
|
||||
}}
|
||||
class="
|
||||
btn btn-base preset-tonal-surface
|
||||
preset-outlined-warning-400-600
|
||||
hover:preset-tonal-warning
|
||||
group
|
||||
w-full max-w-fit
|
||||
min-w-22 gap-1 text-sm transition-all
|
||||
md:min-w-30
|
||||
"
|
||||
title="Click to torn on/enable edit mode. Edit mode is currently off/disabled.">
|
||||
<ToggleLeft size="1em" class="m-1 inline-block" />
|
||||
<span class="text-xs">Edit</span>
|
||||
<span
|
||||
class="hidden group-hover:inline-block group-hover:text-xs">
|
||||
On?
|
||||
</span>
|
||||
</button>
|
||||
{/if}
|
||||
|
||||
<!-- Font Size Cycler: default → larger → smaller → default -->
|
||||
<button
|
||||
type="button"
|
||||
class:w-full={expand}
|
||||
class="
|
||||
btn btn-base preset-tonal-surface
|
||||
hover:preset-tonal-primary
|
||||
group
|
||||
w-full max-w-fit
|
||||
min-w-22 px-1 py-1 text-sm
|
||||
transition-all md:min-w-30
|
||||
"
|
||||
title="Cycle font size: default → larger → smaller"
|
||||
onclick={() => {
|
||||
const mode = $ae_loc.font_size_mode;
|
||||
if (!mode || mode === 'default') {
|
||||
$ae_loc.font_size_mode = 'larger';
|
||||
} else if (mode === 'larger') {
|
||||
$ae_loc.font_size_mode = 'smaller';
|
||||
} else {
|
||||
$ae_loc.font_size_mode = 'default';
|
||||
}
|
||||
}}>
|
||||
{#if !$ae_loc.font_size_mode || $ae_loc.font_size_mode === 'default'}
|
||||
<span class="text-sm leading-none font-bold">A</span>
|
||||
<span class="hidden text-xs group-hover:inline-block"
|
||||
>Font: Normal</span>
|
||||
{:else if $ae_loc.font_size_mode === 'larger'}
|
||||
<span class="text-base leading-none font-bold">A+</span>
|
||||
<span class="hidden text-xs group-hover:inline-block"
|
||||
>Font: Larger</span>
|
||||
{:else}
|
||||
<span class="text-xs leading-none font-bold">A−</span>
|
||||
<span class="hidden text-xs group-hover:inline-block"
|
||||
>Font: Smaller</span>
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
<!-- <div> -->
|
||||
<!-- class:visible={expand} -->
|
||||
<!-- class:invisible={!expand} -->
|
||||
<!-- class:hover:visible={true} -->
|
||||
<!-- invisible -->
|
||||
<button
|
||||
type="button"
|
||||
class:w-full={expand}
|
||||
class="
|
||||
btn btn-base preset-filled-tertiary-400-600
|
||||
preset-outlined-tertiary-400-600
|
||||
hover:preset-filled-success
|
||||
active:preset-filled-success group
|
||||
w-full max-w-fit
|
||||
min-w-22 px-1 py-1 text-sm
|
||||
transition-all md:min-w-30
|
||||
"
|
||||
title="Show/Hide the system menu"
|
||||
onclick={async () => {
|
||||
if (!expand) {
|
||||
expand = true;
|
||||
$ae_sess.sys_menu.expand = true;
|
||||
|
||||
// $ae_loc.sys_menu.expand = true;
|
||||
// $ae_loc.sys_menu.expand_btn = false;
|
||||
$ae_loc.app_cfg.show_element__access_type = true;
|
||||
|
||||
if ($ae_loc?.access_type == 'anonymous') {
|
||||
$ae_sess.sys_menu.focus_passcode_input = true;
|
||||
// $ae_sess.app_cfg.show_element__passcode_input = true;
|
||||
} else {
|
||||
// $ae_sess.app_cfg.show_element__passcode_input = false;
|
||||
$ae_loc.sys_menu.expand_user = false; // Not in use yet
|
||||
$ae_sess.show__sign_in_out__fields = false;
|
||||
}
|
||||
// $ae_loc.app_cfg.show_element__passcode_input = true;
|
||||
// await tick();
|
||||
// console.log('Layout button click: Focus on passcode input!');
|
||||
// /** @type {HTMLElement | null} */
|
||||
// const to_focus = document.getElementById('access_passcode_input');
|
||||
// to_focus?.focus();
|
||||
} else {
|
||||
expand = false;
|
||||
$ae_sess.sys_menu.expand = false;
|
||||
// $ae_loc.sys_menu.expand = false;
|
||||
// $ae_loc.sys_menu.expand_btn = true;
|
||||
// $ae_loc.app_cfg.show_element__passcode_input = false;
|
||||
}
|
||||
// $ae_loc.sys_menu.expand_btn = !expand_btn;
|
||||
}}>
|
||||
<!-- <span class=""> -->
|
||||
{#if expand}
|
||||
<CircleX class="m-1 inline-block" />
|
||||
{:else}
|
||||
<Menu class="m-1 inline-block" />
|
||||
{/if}
|
||||
<span class="hidden text-xs group-hover:inline-block"> Menu </span>
|
||||
<!-- </span> -->
|
||||
</button>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
|
||||
<!-- Show menu on right side of page -->
|
||||
<!-- min-h-96 -->
|
||||
<!-- absolute right-0 bottom-10 -->
|
||||
<!-- opacity-50 -->
|
||||
<!-- hover:opacity-100 -->
|
||||
<!-- bg-white dark:bg-gray-800 -->
|
||||
<div
|
||||
class:preset-filled-warning-200-800={expand}
|
||||
class:hidden={!expand}
|
||||
class="
|
||||
ae_app__sys_menu
|
||||
|
||||
hidden-print
|
||||
z-20 flex
|
||||
min-w-48
|
||||
flex-col
|
||||
items-end
|
||||
|
||||
justify-end
|
||||
|
||||
gap-2 rounded-lg
|
||||
|
||||
border border-gray-200 bg-white
|
||||
px-1
|
||||
py-2 transition-all
|
||||
|
||||
delay-1000
|
||||
duration-100 ease-in-out
|
||||
hover:z-30 hover:delay-100
|
||||
hover:duration-200
|
||||
|
||||
dark:border-gray-700 dark:bg-gray-800
|
||||
">
|
||||
<button
|
||||
type="button"
|
||||
class:w-full={expand}
|
||||
class="
|
||||
btn btn-sm
|
||||
preset-filled-tertiary-400-600
|
||||
preset-outlined-tertiary-400-600
|
||||
hover:preset-filled-success active:preset-filled-success
|
||||
group px-6
|
||||
py-1 transition-all
|
||||
"
|
||||
title="Show/Hide the system menu"
|
||||
onclick={() => {
|
||||
if (!expand) {
|
||||
expand = true;
|
||||
$ae_sess.sys_menu.expand = true;
|
||||
// $ae_loc.sys_menu.expand_btn = false;
|
||||
// $ae_loc.sys_menu.expand_access_type = true;
|
||||
|
||||
// $ae_sess.app_cfg.show_element__passcode_input = true;
|
||||
$ae_sess.sys_menu.focus_passcode_input = true;
|
||||
} else {
|
||||
$ae_sess.sys_menu.expand = false;
|
||||
$ae_loc.sys_menu.expand_user = false; // Not in use yet
|
||||
$ae_sess.show__sign_in_out__fields = false;
|
||||
// $ae_loc.sys_menu.expand_btn = true;
|
||||
}
|
||||
// $ae_loc.sys_menu.expand_btn = !expand_btn;
|
||||
// $ae_loc.sys_menu.expand = !expand;
|
||||
}}>
|
||||
{#if expand}
|
||||
<CircleX class="m-1 inline-block" />
|
||||
<span class="hidden group-hover:inline-block"> Hide Menu </span>
|
||||
{:else}
|
||||
<Menu class="m-1 inline-block" />
|
||||
<span class="hidden group-hover:inline-block"> Menu </span>
|
||||
{/if}
|
||||
</button>
|
||||
|
||||
<!-- {#if $ae_loc?.app_cfg?.show_element__cfg} -->
|
||||
<span class:hidden={!$ae_loc.edit_mode}>
|
||||
<Element_app_cfg
|
||||
hide={$ae_loc.sys_menu.hide_app_cfg}
|
||||
expand={$ae_loc.sys_menu.expand_app_cfg} />
|
||||
</span>
|
||||
<span class:hidden={!$ae_loc.edit_mode}>
|
||||
<Element_theme
|
||||
hide={$ae_loc.sys_menu.hide_app_cfg}
|
||||
expand={$ae_loc.sys_menu.expand_app_cfg}
|
||||
set_theme_mode={true}
|
||||
set_theme_name={true} />
|
||||
</span>
|
||||
<!-- {/if} -->
|
||||
|
||||
{#if $ae_loc?.app_cfg?.show_element__sign_in_out}
|
||||
<!-- hide={$ae_loc.sys_menu.hide_user} -->
|
||||
<!-- expand={$ae_loc.sys_menu.expand_user} -->
|
||||
<Element_sign_in_out
|
||||
{data}
|
||||
hidden={$ae_loc.iframe ||
|
||||
!$ae_loc.app_cfg?.show_element__sign_in_out} />
|
||||
{/if}
|
||||
|
||||
{#if !$ae_loc?.sys_menu?.hide_access_type && !$ae_loc?.iframe}
|
||||
<!-- hidden={$ae_loc?.iframe && !$ae_loc?.trusted_access && !expand} -->
|
||||
<Element_access_type
|
||||
bind:hide={$ae_loc.sys_menu.hide_access_type}
|
||||
bind:focus_input={$ae_sess.sys_menu.focus_passcode_input}
|
||||
bind:expand={$ae_loc.sys_menu.expand_access_type}
|
||||
bind:show_passcode_input={
|
||||
$ae_sess.app_cfg.show_element__passcode_input
|
||||
}
|
||||
bind:trigger_clear_access />
|
||||
{/if}
|
||||
</div>
|
||||
</section>
|
||||
Reference in New Issue
Block a user