Wrapping up for the day
This commit is contained in:
Scott Idem
@@ -97,7 +97,7 @@ console.log(`AE Stores - App Local Storage Data:`, ae_app_local_data_struct);
|
||||
|
||||
// This works and uses local storage:
|
||||
export let ae_loc: Writable<key_val> = localStorageStore('ae_loc', ae_app_local_data_struct);
|
||||
console.log(`AE Stores - App Local Storage Data:`, get(ae_loc));
|
||||
// console.log(`AE Stores - App Local Storage Data:`, get(ae_loc));
|
||||
|
||||
|
||||
// This does not work yet...? Don't use.
|
||||
@@ -211,47 +211,3 @@ let slct_obj_template: key_val = {
|
||||
|
||||
// This works and uses local storage:
|
||||
export let slct: Writable<key_val> = localStorageStore('ae_slct', slct_obj_template);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// export let handle_load_ae_obj_id__site_domain = async function handle_load_ae_obj_id__site_domain({fqdn, try_cache=false}) {
|
||||
// console.log(`*** handle_load_ae_obj_id__site_domain() *** fqdn=${fqdn}`);
|
||||
|
||||
// let params = {};
|
||||
|
||||
// // ae_loc.hub.site_domain_id_qry_status = 'loading';
|
||||
// let ae_site_domain_obj_get_promise = api.get_ae_obj_id_crud({
|
||||
// api_cfg: ae_api,
|
||||
// no_account_id: true,
|
||||
// obj_type: 'site_domain',
|
||||
// obj_id: fqdn, // NOTE: This is the FQDN, not normally the ID.
|
||||
// use_alt_table: true, // NOTE: This will use the table_name_alt value instead of the table_name value in the API config.
|
||||
// use_alt_base: true, // NOTE: This will use the base_name_alt value instead of the base_name value in the API config.
|
||||
// params: params,
|
||||
// log_lvl: 2
|
||||
// })
|
||||
// .then(function (site_domain_obj_get_result) {
|
||||
// if (site_domain_obj_get_result) {
|
||||
// // slct.site_domain_obj = site_domain_obj_get_result;
|
||||
// // console.log(`site_domain object:`, get(slct).site_domain_obj);
|
||||
|
||||
// // ae_loc.account_id = $slct.site_domain_obj.account_id_random;
|
||||
// // ae_loc.site_id = $slct.site_domain_obj.site_id_random;
|
||||
// // ae_loc.site_domain_id = $slct.site_domain_obj.site_domain_id_random;
|
||||
// return site_domain_obj_get_result;
|
||||
// } else {
|
||||
// console.log('No results returned.');
|
||||
// return null;
|
||||
// }
|
||||
// })
|
||||
// .catch(function (error) {
|
||||
// console.log('No results returned or failed.', error);
|
||||
// });
|
||||
|
||||
// return ae_site_domain_obj_get_promise;
|
||||
// }
|
||||
|
||||
|
||||
169
src/lib/element_app_cfg.svelte
Normal file
169
src/lib/element_app_cfg.svelte
Normal file
@@ -0,0 +1,169 @@
|
||||
<script lang="ts">
|
||||
import { createEventDispatcher, onMount, tick } from 'svelte';
|
||||
|
||||
import { ae_util } from '$lib/ae_utils';
|
||||
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
|
||||
|
||||
let notes: null|string = null;
|
||||
let all: boolean = false;
|
||||
let trigger: null|string = null;
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
|
||||
onMount(() => {
|
||||
console.log('** Element Mounted: ** Element App Config');
|
||||
});
|
||||
|
||||
|
||||
// $: if (entered_passcode && entered_passcode.length >= 5) {
|
||||
// console.log(`entered_passcode=${entered_passcode}`);
|
||||
// handle_check_access_type_passcode();
|
||||
// }
|
||||
|
||||
// $: if (trigger && $ae_loc.access_type) {
|
||||
// console.log(`$ae_loc.access_type=${$ae_loc.access_type}`);
|
||||
|
||||
// let access_checks_results = ae_util.process_permission_checks($ae_loc.access_type);
|
||||
|
||||
// $ae_loc = {...$ae_loc, ...access_checks_results};
|
||||
// } else if (trigger) {
|
||||
// console.log(`$ae_loc.access_type=not set`);
|
||||
|
||||
// // Send an empty string to reset the permissions. This is the same as sending 'anonymous'.
|
||||
// let access_checks_results = ae_util.process_permission_checks('');
|
||||
|
||||
// $ae_loc = {...$ae_loc, ...access_checks_results};
|
||||
// }
|
||||
|
||||
|
||||
function handle_something() {
|
||||
// console.log('*** handle_something() ***');
|
||||
|
||||
}
|
||||
|
||||
function handle_clear_storage(item: null|string) {
|
||||
// console.log('*** handle_clear_storage() ***');
|
||||
// window.localStorage.setItem('access_type', 'anonymous');
|
||||
// return true;
|
||||
}
|
||||
|
||||
function dispatch_something_changed() {
|
||||
console.log('*** dispatch_something_changed() ***');
|
||||
|
||||
console.log(ae_util);
|
||||
console.log($ae_loc);
|
||||
|
||||
dispatch('access_type_changed', {
|
||||
access_type: $ae_loc.access_type
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<section id="AE-App-Cfg" class="ae_app_cfg transition duration-300 delay-150 hover:delay-300 hover:transition-all hidden-print">
|
||||
{#if $ae_loc.access_type && $ae_loc.access_type != 'anonymous'}
|
||||
{#if $ae_loc.access_type == 'super'}
|
||||
<span class="fas fa-secret"></span> Super Access
|
||||
{:else if $ae_loc.access_type == 'manager'}
|
||||
<span class="fas fa-user-shield"></span> Manager Access
|
||||
{:else if $ae_loc.access_type == 'administrator'}
|
||||
<span class="fas fa-user-ninja"></span> Administrator Access
|
||||
{:else if $ae_loc.access_type == 'trusted'}
|
||||
<span class="fas fa-user-nurse"></span> Trusted Access
|
||||
{:else if $ae_loc.access_type == 'authenticated'}
|
||||
<span class="fas fa-user-friends"></span> Authenticated Access
|
||||
{:else if $ae_loc.access_type == 'anonymous'}
|
||||
<span class="fas fa-users"></span> Anonymous Access
|
||||
{:else}
|
||||
<span class="fas fa-unlock mx-1"></span> Unknown Access
|
||||
{/if}
|
||||
|
||||
<button
|
||||
class="btn btn-sm access_type_lock_btn hover:transition-all"
|
||||
on:click={() => {
|
||||
handle_clear_access();
|
||||
}}
|
||||
title="Access mode is currently enabled/unlocked. Click to exit and lock."
|
||||
>
|
||||
<span class="fas fa-lock mx-1"></span> Lock
|
||||
</button>
|
||||
{:else}
|
||||
Not logged in
|
||||
{/if}
|
||||
</section>
|
||||
|
||||
|
||||
<style lang="postcss">
|
||||
/* BEGIN: AE's Svelte Quick Access Type component */
|
||||
#AE-App-Cfg {
|
||||
/* position: absolute; */
|
||||
position: fixed;
|
||||
/* position: relative; */
|
||||
/* position: static; */
|
||||
/* position: sticky; */
|
||||
/* top: 1em; */
|
||||
bottom: 1.5rem;
|
||||
left: 0rem;
|
||||
|
||||
padding: .5rem;
|
||||
|
||||
/* lightyellow */
|
||||
/* background-color: hsla(60,100%,90%,.30); */
|
||||
background-color: rgba(var(--color-surface-500) / .5);
|
||||
|
||||
border-top: solid thin black;
|
||||
border-left: solid thin black;
|
||||
border-bottom: solid thin black;
|
||||
border-top-left-radius: .5em;
|
||||
border-bottom-left-radius: .5em;
|
||||
|
||||
opacity: .50;
|
||||
|
||||
font-size: .75rem;
|
||||
|
||||
z-index: 5;
|
||||
|
||||
/* NOTE: transition when no longer hovering */
|
||||
transition-property: opacity, background-color;
|
||||
transition-delay: .1s;
|
||||
transition-duration: .4s;
|
||||
transition-timing-function: linear;
|
||||
}
|
||||
|
||||
#AE-App-Cfg:hover {
|
||||
/* lightyellow */
|
||||
/* background-color: hsla(60,100%,90%,.95); */
|
||||
background-color: rgba(var(--color-surface-500) / 1);
|
||||
opacity: 1;
|
||||
|
||||
/* NOTE: transition when hover starts */
|
||||
transition-property: opacity, background-color;
|
||||
/* transition-delay: .5s; */
|
||||
transition-duration: .10s;
|
||||
transition-timing-function: linear;
|
||||
}
|
||||
|
||||
/* #Access-Type .unlock_text {
|
||||
transition: width 2s, height 2s, background-color 2s, transform 2s;
|
||||
} */
|
||||
/* END: Svelte Access Type component */
|
||||
|
||||
.access_type_unlock_btn .unlock_text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.access_type_unlock_btn:hover .unlock_text {
|
||||
display: initial;
|
||||
/* outline: solid thin red; */
|
||||
}
|
||||
|
||||
.access_type .current_text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.access_type:hover .current_text {
|
||||
display: initial;
|
||||
/* outline: solid thin red; */
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user