diff --git a/src/lib/element_qr_scanner backup.svelte b/src/lib/element_qr_scanner backup.svelte
deleted file mode 100644
index 8b8446d5..00000000
--- a/src/lib/element_qr_scanner backup.svelte	
+++ /dev/null
@@ -1,543 +0,0 @@
-<script lang="ts">
-// *** Import Svelte core
-import { createEventDispatcher, onDestroy, onMount } from 'svelte';
-// import 'html5-qrcode';
-import {Html5Qrcode, Html5QrcodeScannerState, Html5QrcodeSupportedFormats} from 'html5-qrcode';
-
-// *** Import Aether core variables and functions
-import { api } from '$lib/api';
-import { ae_api } from '$lib/ae_stores';
-
-// *** Import Aether core components
-// import Element_input from './element_input.svelte';
-// import ae from '/element_input.svelte';
-// import Input_element from '/element_input.svelte';
-
-// *** Import Aether module variables and functions
-
-// *** Import Aether module components
-
-// *** Export/Exposed variables and functions for component
-export let start_qr_scanner: boolean = true;
-export let show_pause_btn: boolean = false; // pause and resume buttons
-export let show_qr_manual_text_entry_option: boolean = false;
-export let show_qr_manual_badge_id_entry_option: boolean = false;
-export let show_qr_scan_result: boolean = true;
-
-export let qr_fps = 15;
-export let qr_viewfinder_width = 275; // 275 seems good... Need to not let the this be larger than the container which changes based on the width of the screen/window.
-export let qr_facing_mode = 'environment'; // environment, user, { exact: 'environment'}, { exact: 'user'}
-
-// *** Set initial variables
-let scanning_status: string = 'not_started';
-let qr_scan_result: null|string = null;
-let qr_found_text: null|string = null;
-let qr_entered_text: null|string = null;
-let qr_entered_badge_id: null|string = null;
-let show_qr_manual_entry: null|boolean = null;
-let disable_submit_badge_id_btn: boolean = true;
-
-let user_media_status = 'not_requested';
-
-
-// let max_results: number = 50;
-
-const dispatch = createEventDispatcher();
-
-let html5_qr_code: any|null|string = null;
-// let html5_qr_code = new Html5Qrcode(
-//     'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-// );
-
-// let qr_scan_cfg = { fps: 10, qrbox: 400 }; // default was 250 and using 300 when 600px
-let qr_scan_cfg = { fps: qr_fps, qrbox: qr_viewfinder_width }; // 275 seems good... Need to not let the this be larger than the container which changes based on the width of the screen/window.
-
-// let mounted = false;
-
-
-onMount(() => {
-    console.log('** Element Mounted: ** QR Scanner');
-
-    // NOTE: We only want to trigger the scanning to start after the page has fully loaded.
-    navigator.mediaDevices.getUserMedia({video: true})
-    .then(successCallback, errorCallback);
-
-    // NOTE: This can only be done after the page has fully loaded.
-    // if (start_qr_scanner) {
-    //     handle_start_qr_scanning();
-    // }
-});
-
-
-onDestroy(async () => {
-    console.log('** Element Destroyed: ** QR Scanner');
-
-    qr_scan_result = null;
-    qr_found_text = null;
-
-    await handle_stop_qr_scanning();
-});
-
-
-var successCallback = function(error: any) {
-    console.log('Camera access allowed');
-    user_media_status = 'allowed';
-
-    // let subject = 'Camera Access Allowed';
-    // let message = error;
-    // send_init_confirm_email(subject, message);
-
-    dispatch('qr_camera', {
-        status: 'allowed',
-    });
-
-    // NOTE: This can only be done after the page has fully loaded.
-    if (start_qr_scanner) {
-        handle_start_qr_scanning();
-    }
-};
-var errorCallback = function(error: any) {
-    if (error.name == 'NotAllowedError') {
-        console.log('Camera access not allowed!');
-        user_media_status = 'denied';
-
-        // let subject = 'Camera Access Denied';
-        // let message = error;
-        // send_init_confirm_email(subject, message);
-
-        dispatch('qr_camera', {
-            status: 'denied',
-        });
-    }
-};
-
-
-// $: if (mounted && start_qr_scanner) {
-//     console.log('START QR SCANNING');
-//     handle_start_qr_scanning();
-// } else if (mounted && !start_qr_scanner) {
-//     console.log('STOP QR SCANNING');
-//     handle_stop_qr_scanning();
-// }
-
-
-async function handle_start_qr_scanning() {
-    console.log('*** handle_start_qr_scanning() ***');
-
-    if (user_media_status == 'denied') {
-        console.log('Camera access not allowed!');
-        return;
-    } else if (user_media_status == 'not_requested') {
-        console.log('Camera access not requested yet!');
-        return;
-    }
-
-    qr_scan_result = null;
-    qr_found_text = null;
-
-    if (html5_qr_code) {
-        console.log('html5_qr_code object found. Clearing and creating new Html5Qrcode...');
-        // html5_qr_code.clear();
-        // document.getElementById('qr_scanner_viewfinder').classList.remove('d_none');
-
-        html5_qr_code = new Html5Qrcode(
-            'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-        );
-    } else {
-        console.log('html5_qr_code not found. Creating new Html5Qrcode...');
-        html5_qr_code = new Html5Qrcode(
-            'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-        );
-    }
-
-    if (html5_qr_code.getState() == Html5QrcodeScannerState.NOT_STARTED) {
-        // console.log('Scanner is not started');
-
-        return await html5_qr_code.start({ facingMode: qr_facing_mode }, qr_scan_cfg, handle_qr_scan_success, handle_qr_scan_error)
-        .then((ignore: any) => {
-            console.log('Scanning has started');
-            scanning_status = 'scanning';
-
-            // let subject = 'QR Scanning Started';
-            // let message = ignore;
-            // send_init_confirm_email(subject, message);
-
-            return true;
-        }).catch((err) => {
-            console.log('There was an error while trying to start the QR scanner');
-            scanning_status = 'start_error';
-
-            let subject = 'QR Scanning Start Error';
-            let message = err;
-            send_init_confirm_email(subject, message);
-
-            return false;
-        });
-
-
-    } else {
-        console.log('Scanner is already started');
-        return;
-    }
-
-
-}
-
-
-function handle_pause_qr_scanning() {
-    if (html5_qr_code && html5_qr_code.getState() != Html5QrcodeScannerState.SCANNING) {
-        console.log('Scanner is not scanning!');
-        return;
-    }
-
-    html5_qr_code.pause();
-    scanning_status = 'paused';
-}
-
-function handle_resume_qr_scanning() {
-    if (html5_qr_code && html5_qr_code.getState() != Html5QrcodeScannerState.PAUSED) {
-        console.log('Scanner is not paused!');
-        return;
-    }
-
-    document.getElementById('qr_scanner_viewfinder').classList.remove('d_none');
-    html5_qr_code.resume();
-    scanning_status = 'scanning';
-}
-
-
-async function handle_stop_qr_scanning() {
-    start_qr_scanner = false;
-
-    if (!html5_qr_code) {
-        console.log('html5_qr_code object found. Nothing to stop?');
-        return false;
-    }
-
-    let state = html5_qr_code.getState();
-    console.log('html5_qr_code state:', state);
-
-    if (state == Html5QrcodeScannerState.NOT_STARTED) {
-        console.log('Scanner is not started');
-        return;
-    }
-
-    if (state == Html5QrcodeScannerState.PAUSED || state == Html5QrcodeScannerState.SCANNING) {
-        console.log('Scanner is not started');
-        await html5_qr_code.stop()
-        scanning_status = 'not_started';
-        return;
-    }
-
-    await html5_qr_code.clear();
-    return true;
-
-    // html5_qr_code.pause();
-
-    // return html5_qr_code.stop()
-    // .then((ignore) => {
-    //     console.log('Scanning has stopped');
-    //     // document.getElementById('qr_scanner_viewfinder').classList.add('d_none');
-    //     scanning_status = 'not_started';
-    // }).then((ignore) => {
-    //     // html5_qr_code = null;
-    //     // html5_qr_code.clear();
-    // }).catch((err) => {
-    //     console.log('There was an error while trying to stop the scanning');
-    //     return false;
-    // });
-
-    // html5_qr_code = null;
-}
-
-
-// Callback function for QrcodeSuccessCallback (decodedText: string, result: Html5QrcodeResult)
-function handle_qr_scan_success(decoded_text, decoded_result) {
-    console.log('*** handle_qr_scan_success() ***');
-
-    console.log(`QR scanned = ${decoded_text}`, decoded_result);
-
-    qr_scan_result = decoded_text; // NOTE: decoded_result is not currently used by html5-qrcode
-    qr_found_text = decoded_text;
-
-    dispatch('qr_scan_result', {
-        result: qr_scan_result, // This text will need to be parsed to get more info.
-        text: qr_found_text, // This text will need to be parsed to get more info.
-        entry_method: 'QR',
-    });
-
-    // handle_pause_qr_scanning();
-    handle_stop_qr_scanning();
-}
-
-
-// Callback function for QrcodeErrorCallback (errorMessage: string, error: Html5QrcodeError)
-// NOTE: Most of the time this is normal and not an actual error. It just did not find something to scan.
-function handle_qr_scan_error(qr_error_message, qr_code_error) {
-    // console.log('*** handle_qr_scan_error() ***');
-
-    if (qr_code_error.type) {
-        console.log(`Error scanning code = ${qr_error_message}`, qr_code_error);
-        return;
-    }
-}
-
-
-$: if ( qr_entered_badge_id && qr_entered_badge_id.length >= 11 && qr_entered_badge_id && qr_entered_badge_id.length <= 14) {
-    disable_submit_badge_id_btn = false;
-} else {
-    disable_submit_badge_id_btn = true;
-}
-
-
-function handle_qr_manual_entry() {
-    console.log('*** handle_qr_manual_entry() ***');
-
-    if (qr_entered_text) {
-        console.log(`QR entered text = ${qr_entered_text}`);
-    } else if (qr_entered_badge_id) {
-        console.log(`QR entered badge ID = ${qr_entered_badge_id}`);
-        qr_entered_text = `OBJ:ot:event_badge,oi:${qr_entered_badge_id}`;
-        console.log(`Parse to proper QR badge ID = ${qr_entered_text}`);
-    }
-
-    // html5_qr_code.stop().then((ignore) => {
-    //     console.log('Scanning has stopped');
-    //     document.getElementById('qr_scanner_viewfinder').classList.add('d_none');
-    // }).catch((err) => {
-    //     console.log('There was an error while trying to stop the scanning');
-    // });
-
-    qr_scan_result = qr_entered_text;
-
-    dispatch('qr_scan_result', {
-        result: qr_scan_result,
-        entry_method: 'manual',
-    });
-
-    qr_scan_result = null;
-    qr_entered_text = null;
-}
-
-
-
-
-
-function send_init_confirm_email(subject, message) {
-    console.log(`*** send_init_confirm_email() *** ${subject}`);
-
-    let to_email = 'scott.idem+skdev@oneskyit.com';
-
-    // let origin_url = encodeURI(`${data.url.origin}`);
-
-    let full_subject = `${subject} Aether QR Scanner Debugging`;
-
-    let body_html = `
-    <div>Scott,
-    <p>This is an automatic debug email from the Aether QR scanner.</p>
-    </div>
-
-    <br>
-
-    <div>
-    Message:<br>
-    <pre>
-    ${JSON.stringify(message)}
-    </pre>
-    </div>
-    `;
-
-    api.send_email({
-        api_cfg: $ae_api,
-        from_email: 'noreply+ae_qr_debug@oneskyit.com',
-        from_name: 'AE QR Debug',
-        to_email: to_email,
-        subject: full_subject,
-        body_html: body_html,
-    });
-}
-
-
-</script>
-
-
-<section
-    class="ae_element qr_scanner border-2 border-slate-500/10 space-y-2 flex flex-col gap-1 justify-center items-center min-w-full max-w-full"
-    class:not_started={scanning_status == 'not_started'}
-    class:paused={scanning_status == 'paused'}
-    class:scanning={scanning_status == 'scanning'}
-    >
-
-    <!-- <header>
-        <h2>QR Scanner</h2>
-    </header> -->
-
-    <!-- <fieldset class=""> -->
-        <!-- <legend class="d_none">QR Scanner:</legend> -->
-
-        <div
-            class="ae_container qr_scanning_container"
-            >
-            <div
-                class="ae_options m-1"
-                >
-            {#if scanning_status == 'not_started' }
-                    <button on:click={handle_start_qr_scanning} class="btn btn-lg preset-tonal-primary btn_start"><span class="fas fa-qrcode mx-1"></span> Start Scanning</button>
-                    <span class="loading-text">
-                        Scanning stopped
-                    </span>
-            {:else if scanning_status == 'paused' && show_pause_btn}
-                    <button on:click={handle_resume_qr_scanning} class="btn btn-md preset-tonal-primary btn_resume"><span class="fas fa-play"></span> Resume</button>
-                    <span>Scanning paused</span>
-            {:else if scanning_status == 'scanning'}
-                    <button on:click={handle_stop_qr_scanning} class="btn btn-md preset-tonal-secondary btn_stop">
-                        <span class="fas fa-crosshairs fa-spin opacity-50 m-1"></span>
-                        <!-- <span class="fas fa-stop-circle m-1"></span> -->
-                        Stop
-                    </button>
-                    {#if show_pause_btn}
-                        <button on:click={handle_pause_qr_scanning} class="btn btn-lg preset-tonal-secondary btn_pause"><span class="fas fa-pause-circle"></span> Pause</button>
-                    {/if}
-                    <!-- <span>Scanning for QR code...</span> -->
-                    <!-- <div class="modal-loading"> -->
-                        <!-- <span class="fas fa-crosshairs fa-spin opacity-50"></span> -->
-                        <span class="loading-text">
-                            Scanning for QR code...
-                        </span>
-                    <!-- </div> -->
-            {/if}
-            </div>
-
-            <div id="qr_scanner_viewfinder" class="qr_scanner_viewfinder grow flex flex-col justify-center items-center" style=""></div> <!-- width: 600px -->
-        </div>
-
-        {#if show_qr_manual_text_entry_option}
-        <div class="ae_container qr_manual_entry text_entry">
-            {#if show_qr_manual_entry}
-                <label for="entered_text" class="">Enter text</label>
-                <input type="text" name="entered_text" id="entered_text" bind:value="{qr_entered_text}">
-                <button on:click={handle_qr_manual_entry} class="btn btn-md preset-tonal-warning"><span class="fas fa-paper-plane"></span> Submit Text</button>
-
-
-                <div class="search_by_text">
-                    <input type='text' placeholder="Name or Email" label="Name or Email" value={search_query_str} focus={true} on:oninput={handle_oninput_search_query_str} />
-                </div>
-
-            {:else}
-                <button on:click={() => show_qr_manual_entry=true} class="btn btn-md preset-tonal-warning"><span class="fas fa-keyboard"></span> Enter Text</button>
-            {/if}
-        </div>
-        {/if}
-
-        {#if show_qr_manual_badge_id_entry_option}
-        <div class="ae_container qr_manual_entry badge_id_entry">
-            {#if show_qr_manual_entry}
-                <form on:submit|preventDefault={() => handle_qr_manual_entry} class="flex">
-
-                    <!-- <label for="entered_badge_id" class="">Enter badge ID</label>
-                    <input type="text" name="entered_badge_id" id="entered_badge_id" bind:value="{qr_entered_badge_id}"> -->
-
-                    <input
-                        bind:value="{qr_entered_badge_id}"
-                        type="text"
-                        name="entered_badge_id"
-                        id="entered_badge_id"
-                        required
-                        placeholder="Enter Badge ID"
-                        class="input max-w-52"
-                        />
-
-                    <button
-                        type="submit"
-                        on:click={handle_qr_manual_entry}
-                        disabled={disable_submit_badge_id_btn}
-                        class="btn btn-md preset-tonal-primary border border-primary-500 m-1"
-                        class:btn_default={disable_submit_badge_id_btn}
-                        class:btn_primary={!disable_submit_badge_id_btn}
-                        >
-                        <span class="fas fa-paper-plane mx-1"></span> Submit Badge ID
-                    </button>
-
-                </form>
-            {:else}
-            <button on:click={() => show_qr_manual_entry=true} class="btn btn-md preset-tonal-secondary m-1"><span class="fas fa-keyboard mx-1"></span> Enter Badge ID</button>
-            {/if}
-        </div>
-        {/if}
-
-        {#if show_qr_scan_result && qr_scan_result}
-        <div class="ae_container qr_scan_result">
-            <span class="label">Raw Result:</span>
-            <span id="qr_scan_result_value" class="value">{qr_scan_result}</span>
-        </div>
-        {/if}
-    <!-- </fieldset> -->
-
-</section>
-
-
-<style>
-.not_started {
-    background-color: hsla(0, 100%, 75%, 0.3);
-    border-color: hsla(0, 100%, 75%, 0.6);
-}
-.paused {
-    background-color: hsla(60, 100%, 75%, 0.3);
-    border-color: hsla(60, 100%, 75%, 0.6);
-}
-.scanning {
-    background-color: hsla(120, 100%, 75%, 0.3);
-    border-color: hsla(120, 100%, 75%, 0.6);
-}
-
-
-.qr_scanner {
-    /* outline: solid thin pink; */
-
-    max-width: 100vw;
-
-    /* overflow-x: scroll; */
-
-    display: flex;
-    flex-direction: column;
-    /* flex-wrap: wrap; */
-
-    justify-content: flex-start;
-    align-items: center; /* center */
-    align-content: stretch;
-}
-
-.ae_element.qr_scanner div.qr_scanner_viewfinder {
-    /* max-width: 100vw; */
-    /* contain: content; */
-    /* contain: contain; */
-}
-
-.qr_scanner .qr_scanner_viewfinder {
-    /* outline: dashed medium blue; */
-    min-width: 400px;
-
-    width: 100%;
-    /* max-width: 100%; */
-    max-width: 500px;
-    /* max-width: 100vw; */
-    /* outline: solid thin red; */
-
-    contain: contain;
-    overflow-x: scroll;
-}
-
-@media (max-width: 767px) {
-    .qr_scanner .qr_scanner_viewfinder {
-        /* outline: dashed medium red; */
-        min-width: 80vw;
-        /* width: 100%; */
-        /* max-width: 100%; */
-        /* max-width: 450px; */
-        max-width: 100vw;
-
-        margin: 0;
-        padding: 0;
-    }
-}
-</style>
diff --git a/src/lib/element_qr_scanner backup_2.svelte b/src/lib/element_qr_scanner backup_2.svelte
deleted file mode 100644
index 56f5dfbd..00000000
--- a/src/lib/element_qr_scanner backup_2.svelte	
+++ /dev/null
@@ -1,683 +0,0 @@
-<script lang="ts">
-// *** Import Svelte core
-import { createEventDispatcher, onDestroy, onMount } from 'svelte';
-// import 'html5-qrcode';
-import {Html5Qrcode, Html5QrcodeScannerState, Html5QrcodeSupportedFormats} from 'html5-qrcode';
-
-// *** Import Aether core variables and functions
-import { api } from '$lib/api';
-import { ae_api } from '$lib/ae_stores';
-
-
-// *** Import Aether core components
-// import Element_input from './element_input.svelte';
-// import ae from '/element_input.svelte';
-// import Input_element from '/element_input.svelte';
-
-// *** Import Aether module variables and functions
-
-// *** Import Aether module components
-
-// *** Export/Exposed variables and functions for component
-export let start_qr_scanner: boolean = true;
-export let show_pause_btn: boolean = false; // pause and resume buttons
-export let show_qr_manual_text_entry_option: boolean = false;
-export let show_qr_manual_badge_id_entry_option: boolean = false;
-export let show_qr_scan_result: boolean = true;
-
-export let qr_fps = 10;
-export let qr_viewfinder_width = 275; // 275 seems good... Need to not let the this be larger than the container which changes based on the width of the screen/window.
-export let qr_facing_mode = 'environment'; // environment, user, { exact: 'environment'}, { exact: 'user'}
-
-// *** Set initial variables
-let scanning_status: string = 'not_started';
-let qr_scan_result: null|string = null;
-let qr_found_text: null|string = null;
-let qr_entered_text: null|string = null;
-let qr_entered_badge_id: null|string = null;
-let show_qr_manual_entry: null|boolean = null;
-let disable_submit_badge_id_btn: boolean = true;
-
-let user_media_status = 'not_requested';
-
-let debug_comment: string = 'Debugging QR Scanner';
-let debug_info: any;
-
-
-// let max_results: number = 50;
-
-const dispatch = createEventDispatcher();
-
-let html5_qr_code: any|null|string = null;
-// let html5_qr_code = new Html5Qrcode(
-//     'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-// );
-
-// let qr_scan_cfg = { fps: 10, qrbox: 400 }; // default was 250 and using 300 when 600px
-// let qr_scan_cfg = { fps: qr_fps, qrbox: qr_viewfinder_width }; // 275 seems good... Need to not let the this be larger than the container which changes based on the width of the screen/window.
-let qr_scan_cfg = {};
-
-// let mounted = false;
-
-
-onMount(() => {
-    console.log('** Element Mounted: ** QR Scanner');
-
-
-    console.log('** Element Mounted: ** QR Scanner - getUserMedia');
-    var constraints = {
-        video: false,
-        audio: false
-    }
-
-    navigator.mediaDevices.getUserMedia(constraints)
-    .then(get_user_media_success, get_user_media_error);
-
-    // navigator.mediaDevices.getUserMedia(constraints)
-    // .then(get_user_media_success, get_user_media_error)
-    // .catch(function(err) {
-    //     //log to console first
-    //     console.log(err); /* handle the error */
-    //     if (err.name == "NotFoundError" || err.name == "DevicesNotFoundError") {
-    //         //required track is missing
-    //     } else if (err.name == "NotReadableError" || err.name == "TrackStartError") {
-    //         //webcam or mic are already in use
-    //     } else if (err.name == "OverconstrainedError" || err.name == "ConstraintNotSatisfiedError") {
-    //         //constraints can not be satisfied by avb. devices
-    //     } else if (err.name == "NotAllowedError" || err.name == "PermissionDeniedError") {
-    //         //permission denied in browser
-    //     } else if (err.name == "TypeError" || err.name == "TypeError") {
-    //         //empty constraints object
-    //     } else {
-    //         //other errors
-    //     }
-    // });
-
-
-
-
-    // navigator.mediaDevices.getUserMedia({video: true})
-    // .then(get_user_media_success, get_user_media_error);
-
-    // console.log('** Element Mounted: ** QR Scanner - setTimeout 750ms then getUserMedia');
-
-    // Wait 250ms for everything to fully load
-    // setTimeout(() => {
-    //     console.log('** Element Mounted: ** QR Scanner - inside setTimeout 750ms');
-
-    //     navigator.mediaDevices.getUserMedia({video: true})
-    //     .then(get_user_media_success, get_user_media_error);
-
-    // }, 750);
-    // console.log('** Element Mounted: ** QR Scanner - setTimeout end 750ms');
-
-    // NOTE: This can only be done after the page has fully loaded.
-    // if (start_qr_scanner) {
-    //     handle_start_qr_scanning();
-    // }
-
-
-});
-
-
-onDestroy(async () => {
-    console.log('** Element Destroyed: ** QR Scanner');
-
-    qr_scan_result = null;
-    qr_found_text = null;
-
-    await handle_stop_qr_scanning();
-});
-
-
-var get_user_media_success = function(error: any) {
-    console.log('Camera access allowed');
-    user_media_status = 'allowed';
-
-    debug_comment = 'Camera Access Allowed';
-    debug_info = JSON.stringify(error);
-
-    // if (html5_qr_code) {
-    //     console.log('html5_qr_code object found. Clearing and creating new Html5Qrcode...');
-    //     debug_info = 'html5_qr_code object found. Clearing and creating new Html5Qrcode...';
-    //     html5_qr_code.clear();
-    //     // document.getElementById('qr_scanner_viewfinder').classList.remove('d_none');
-    // } else {
-    //     console.log('html5_qr_code not found. Creating new Html5Qrcode...');
-    //     debug_info = 'html5_qr_code not found. Creating new Html5Qrcode...';
-    // }
-
-    html5_qr_code = new Html5Qrcode(
-        'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-    );
-
-    debug_comment = 'Html5Qrcode created';
-    debug_info = 'new Html5Qrcode for element id=qr_scanner_viewfinder QR_CODE';
-
-    if (start_qr_scanner) {
-        // console.log('** Element Mounted: ** QR Scanner - getUserMedia in setTimeout');
-        setTimeout(() => {
-            console.log('** Element Mounted: ** QR Scanner - setTimeout');
-            console.log('Ready to start QR scanning!');
-            debug_info = 'Ready to start QR scanning!';
-            handle_start_qr_scanning();
-        }, 2500);
-        // console.log('** Element Mounted: ** QR Scanner - setTimeout end');
-
-
-    }
-
-    // let subject = 'Camera Access Allowed';
-    // let message = error;
-    // send_init_confirm_email(subject, message);
-
-    console.log('Dispatching qr_camera');
-    debug_info = 'Dispatching qr_camera';
-
-    dispatch('qr_camera', {
-        status: 'allowed',
-    });
-
-    // NOTE: This can only be done after the page has fully loaded.
-    // if (start_qr_scanner) {
-    //     handle_start_qr_scanning();
-    // }
-};
-
-var get_user_media_error = function(error: any) {
-    if (error.name == 'NotAllowedError') {
-        console.log('Camera access not allowed!');
-        user_media_status = 'denied';
-
-        debug_comment = 'Camera Access Denied';
-        debug_info = JSON.stringify(error);
-        // alert('Error trying to start camera');
-        // alert(error);
-
-        let subject = 'Camera Access Denied';
-        let message = error;
-        send_init_confirm_email(subject, message);
-
-        dispatch('qr_camera', {
-            status: 'denied',
-        });
-    }
-};
-
-// $: if (start_qr_scanner && user_media_status == 'allowed' && (scanning_status == 'not_started' || scanning_status == 'paused')) {
-//     console.log('START QR SCANNING');
-//     handle_start_qr_scanning();
-// } else {
-//     // console.log('STOP QR SCANNING');
-//     // handle_stop_qr_scanning();
-// }
-
-
-// $: if (mounted && start_qr_scanner) {
-//     console.log('START QR SCANNING');
-//     handle_start_qr_scanning();
-// } else if (mounted && !start_qr_scanner) {
-//     console.log('STOP QR SCANNING');
-//     handle_stop_qr_scanning();
-// }
-
-
-async function handle_start_qr_scanning() {
-    console.log('*** handle_start_qr_scanning() ***');
-
-    if (user_media_status == 'denied') {
-        console.log('Camera access not allowed!');
-        return;
-    } else if (user_media_status == 'not_requested') {
-        console.log('Camera access not requested yet!');
-        return;
-    } else if (user_media_status == 'allowed') {
-        console.log('Camera access allowed!');
-        debug_info = 'Camera access allowed!';
-    } else {
-        console.log('Camera access status unknown! This should not happen?');
-        debug_info = 'Camera access status unknown! This should not happen?';
-        return;
-    }
-
-    qr_scan_result = null;
-    qr_found_text = null;
-
-
-    debug_comment = 'Starting QR Scanning...';
-
-    // if (html5_qr_code) {
-    //     console.log('html5_qr_code object found. Clearing and creating new Html5Qrcode...');
-    //     debug_info = 'html5_qr_code object found. Clearing and creating new Html5Qrcode...';
-    //     html5_qr_code.clear();
-    //     // document.getElementById('qr_scanner_viewfinder').classList.remove('d_none');
-
-    //     html5_qr_code = new Html5Qrcode(
-    //         'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-    //     );
-    // } else {
-    //     console.log('html5_qr_code not found. Creating new Html5Qrcode...');
-    //     debug_info = 'html5_qr_code not found. Creating new Html5Qrcode...';
-
-    //     html5_qr_code = new Html5Qrcode(
-    //         'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-    //     );
-    // }
-
-    debug_info = 'Check the state and start if not started...';
-
-    let current_state = await html5_qr_code.getState()
-
-    if (current_state == Html5QrcodeScannerState.NOT_STARTED) {
-        // console.log('Scanner is not started');
-        debug_info = 'Waiting... Scanner is not started';
-        setTimeout(() => {
-        debug_info = 'Waited long enough! Starting for real!';
-        html5_qr_code.start({ facingMode: qr_facing_mode }, qr_scan_cfg, handle_qr_scan_success, handle_qr_scan_error)
-        .then((ignore: any) => {
-            console.log('Scanning has started');
-            scanning_status = 'scanning';
-
-            debug_info = 'Scanning has started';
-
-            // let subject = 'QR Scanning Started';
-            // let message = ignore;
-            // send_init_confirm_email(subject, message);
-
-            return true;
-        }).catch((err) => {
-            console.log('There was an error while trying to start the QR scanner');
-            scanning_status = 'start_error';
-
-            debug_comment = 'Error starting scanner after getState() NOT_STARTED';
-            debug_info = 'Error starting scanner: ' + JSON.stringify(err);
-
-
-            // let subject = 'QR Scanning Start Error';
-            // let message = err;
-            // send_init_confirm_email(subject, message);
-
-            // Error getting userMedia, error = NotReadableError: Could not start video source
-
-            return false;
-        });
-
-        }, 750);
-        debug_info = 'Waiting...?';
-
-
-    } else {
-        console.log('Scanner is already started');
-        debug_info = 'Scanner is already started';
-        return;
-    }
-
-
-}
-
-
-function handle_pause_qr_scanning() {
-    if (html5_qr_code && html5_qr_code.getState() != Html5QrcodeScannerState.SCANNING) {
-        console.log('Scanner is not scanning!');
-        return;
-    }
-
-    html5_qr_code.pause();
-    scanning_status = 'paused';
-}
-
-function handle_resume_qr_scanning() {
-    if (html5_qr_code && html5_qr_code.getState() != Html5QrcodeScannerState.PAUSED) {
-        console.log('Scanner is not paused!');
-        return;
-    }
-
-    document.getElementById('qr_scanner_viewfinder').classList.remove('d_none');
-    html5_qr_code.resume();
-    scanning_status = 'scanning';
-}
-
-
-async function handle_stop_qr_scanning() {
-    start_qr_scanner = false;
-
-    if (!html5_qr_code) {
-        console.log('html5_qr_code object found. Nothing to stop?');
-        return false;
-    }
-
-    let state = html5_qr_code.getState();
-    console.log('html5_qr_code state:', state);
-
-    if (state == Html5QrcodeScannerState.NOT_STARTED) {
-        console.log('Scanner is not started');
-        return;
-    }
-
-    if (state == Html5QrcodeScannerState.PAUSED || state == Html5QrcodeScannerState.SCANNING) {
-        console.log('Scanner is not started');
-        await html5_qr_code.stop()
-        scanning_status = 'not_started';
-        return;
-    }
-
-    await html5_qr_code.clear();
-    return true;
-
-    // html5_qr_code.pause();
-
-    // return html5_qr_code.stop()
-    // .then((ignore) => {
-    //     console.log('Scanning has stopped');
-    //     // document.getElementById('qr_scanner_viewfinder').classList.add('d_none');
-    //     scanning_status = 'not_started';
-    // }).then((ignore) => {
-    //     // html5_qr_code = null;
-    //     // html5_qr_code.clear();
-    // }).catch((err) => {
-    //     console.log('There was an error while trying to stop the scanning');
-    //     return false;
-    // });
-
-    // html5_qr_code = null;
-}
-
-
-// Callback function for QrcodeSuccessCallback (decodedText: string, result: Html5QrcodeResult)
-function handle_qr_scan_success(decoded_text, decoded_result) {
-    console.log('*** handle_qr_scan_success() ***');
-
-    console.log(`QR scanned = ${decoded_text}`, decoded_result);
-
-    qr_scan_result = decoded_text; // NOTE: decoded_result is not currently used by html5-qrcode
-    qr_found_text = decoded_text;
-
-    dispatch('qr_scan_result', {
-        result: qr_scan_result, // This text will need to be parsed to get more info.
-        text: qr_found_text, // This text will need to be parsed to get more info.
-        entry_method: 'QR',
-    });
-
-    // handle_pause_qr_scanning();
-    handle_stop_qr_scanning();
-}
-
-
-// Callback function for QrcodeErrorCallback (errorMessage: string, error: Html5QrcodeError)
-// NOTE: Most of the time this is normal and not an actual error. It just did not find something to scan.
-function handle_qr_scan_error(qr_error_message, qr_code_error) {
-    // console.log('*** handle_qr_scan_error() ***');
-
-    if (qr_code_error.type) {
-        console.log(`Error scanning code = ${qr_error_message}`, qr_code_error);
-        return;
-    }
-}
-
-
-$: if ( qr_entered_badge_id && qr_entered_badge_id.length >= 11 && qr_entered_badge_id && qr_entered_badge_id.length <= 14) {
-    disable_submit_badge_id_btn = false;
-} else {
-    disable_submit_badge_id_btn = true;
-}
-
-
-function handle_qr_manual_entry() {
-    console.log('*** handle_qr_manual_entry() ***');
-
-    if (qr_entered_text) {
-        console.log(`QR entered text = ${qr_entered_text}`);
-    } else if (qr_entered_badge_id) {
-        console.log(`QR entered badge ID = ${qr_entered_badge_id}`);
-        qr_entered_text = `OBJ:ot:event_badge,oi:${qr_entered_badge_id}`;
-        console.log(`Parse to proper QR badge ID = ${qr_entered_text}`);
-    }
-
-    // html5_qr_code.stop().then((ignore) => {
-    //     console.log('Scanning has stopped');
-    //     document.getElementById('qr_scanner_viewfinder').classList.add('d_none');
-    // }).catch((err) => {
-    //     console.log('There was an error while trying to stop the scanning');
-    // });
-
-    qr_scan_result = qr_entered_text;
-
-    dispatch('qr_scan_result', {
-        result: qr_scan_result,
-        entry_method: 'manual',
-    });
-
-    qr_scan_result = null;
-    qr_entered_text = null;
-}
-
-
-
-
-
-function send_init_confirm_email(subject, message) {
-    console.log(`*** send_init_confirm_email() *** ${subject}`);
-
-    let to_email = 'scott.idem+skdev@oneskyit.com';
-
-    // let origin_url = encodeURI(`${data.url.origin}`);
-
-    let full_subject = `${subject} Aether QR Scanner Debugging`;
-
-    let body_html = `
-    <div>Scott,
-    <p>This is an automatic debug email from the Aether QR scanner.</p>
-    </div>
-
-    <br>
-
-    <div>
-    Message:<br>
-    <pre>
-    ${JSON.stringify(message)}
-    </pre>
-    </div>
-    `;
-
-    api.send_email({
-        api_cfg: $ae_api,
-        from_email: 'noreply+ae_qr_debug@oneskyit.com',
-        from_name: 'AE QR Debug',
-        to_email: to_email,
-        subject: full_subject,
-        body_html: body_html,
-    });
-}
-
-
-</script>
-
-
-<section
-    class="ae_element qr_scanner border-2 border-slate-500/10 space-y-2 flex flex-col gap-1 justify-center items-center min-w-full max-w-full"
-    class:not_started={scanning_status == 'not_started'}
-    class:paused={scanning_status == 'paused'}
-    class:scanning={scanning_status == 'scanning'}
-    >
-
-    <!-- <header>
-        <h2>QR Scanner</h2>
-    </header> -->
-
-    <!-- <fieldset class=""> -->
-        <!-- <legend class="d_none">QR Scanner:</legend> -->
-
-        <div
-            class="ae_container qr_scanning_container"
-            >
-            <div
-                class="ae_options m-1"
-                >
-            {#if scanning_status == 'not_started' }
-                    <button on:click={handle_start_qr_scanning} class="btn btn-lg preset-tonal-primary btn_start"><span class="fas fa-qrcode mx-1"></span> Start Scanning</button>
-                    <span class="loading-text">
-                        Scanning stopped
-                    </span>
-            {:else if scanning_status == 'paused' && show_pause_btn}
-                    <button on:click={handle_resume_qr_scanning} class="btn btn-md preset-tonal-primary btn_resume"><span class="fas fa-play"></span> Resume</button>
-                    <span>Scanning paused</span>
-            {:else if scanning_status == 'scanning'}
-                    <button on:click={handle_stop_qr_scanning} class="btn btn-md preset-tonal-secondary btn_stop">
-                        <span class="fas fa-crosshairs fa-spin opacity-50 m-1"></span>
-                        <!-- <span class="fas fa-stop-circle m-1"></span> -->
-                        Stop
-                    </button>
-                    {#if show_pause_btn}
-                        <button on:click={handle_pause_qr_scanning} class="btn btn-lg preset-tonal-secondary btn_pause"><span class="fas fa-pause-circle"></span> Pause</button>
-                    {/if}
-                    <!-- <span>Scanning for QR code...</span> -->
-                    <!-- <div class="modal-loading"> -->
-                        <!-- <span class="fas fa-crosshairs fa-spin opacity-50"></span> -->
-                        <span class="loading-text">
-                            Scanning for QR code...
-                        </span>
-                    <!-- </div> -->
-            {/if}
-            </div>
-
-            <div id="qr_scanner_viewfinder" class="qr_scanner_viewfinder grow flex flex-col justify-center items-center" style=""></div> <!-- width: 600px -->
-        </div>
-
-        {#if show_qr_manual_text_entry_option}
-        <div class="ae_container qr_manual_entry text_entry">
-            {#if show_qr_manual_entry}
-                <label for="entered_text" class="">Enter text</label>
-                <input type="text" name="entered_text" id="entered_text" bind:value="{qr_entered_text}">
-                <button on:click={handle_qr_manual_entry} class="btn btn-md preset-tonal-warning"><span class="fas fa-paper-plane"></span> Submit Text</button>
-
-
-                <div class="search_by_text">
-                    <input type='text' placeholder="Name or Email" label="Name or Email" value={search_query_str} focus={true} on:oninput={handle_oninput_search_query_str} />
-                </div>
-
-            {:else}
-                <button on:click={() => show_qr_manual_entry=true} class="btn btn-md preset-tonal-warning"><span class="fas fa-keyboard"></span> Enter Text</button>
-            {/if}
-        </div>
-        {/if}
-
-        {#if show_qr_manual_badge_id_entry_option}
-        <div class="ae_container qr_manual_entry badge_id_entry">
-            {#if show_qr_manual_entry}
-                <form on:submit|preventDefault={() => handle_qr_manual_entry} class="flex">
-
-                    <!-- <label for="entered_badge_id" class="">Enter badge ID</label>
-                    <input type="text" name="entered_badge_id" id="entered_badge_id" bind:value="{qr_entered_badge_id}"> -->
-
-                    <input
-                        bind:value="{qr_entered_badge_id}"
-                        type="text"
-                        name="entered_badge_id"
-                        id="entered_badge_id"
-                        required
-                        placeholder="Enter Badge ID"
-                        class="input max-w-52"
-                        />
-
-                    <button
-                        type="submit"
-                        on:click={handle_qr_manual_entry}
-                        disabled={disable_submit_badge_id_btn}
-                        class="btn btn-md preset-tonal-primary border border-primary-500 m-1"
-                        class:btn_default={disable_submit_badge_id_btn}
-                        class:btn_primary={!disable_submit_badge_id_btn}
-                        >
-                        <span class="fas fa-paper-plane mx-1"></span> Submit Badge ID
-                    </button>
-
-                </form>
-            {:else}
-            <button on:click={() => show_qr_manual_entry=true} class="btn btn-md preset-tonal-secondary m-1"><span class="fas fa-keyboard mx-1"></span> Enter Badge ID</button>
-            {/if}
-        </div>
-        {/if}
-
-        {#if show_qr_scan_result && qr_scan_result}
-        <div class="ae_container qr_scan_result">
-            <span class="label">Raw Result:</span>
-            <span id="qr_scan_result_value" class="value">{qr_scan_result}</span>
-        </div>
-        {/if}
-
-        {debug_comment ?? 'Debugging QR Scanner'}
-        {#if debug_info}
-        <div class="ae_container debug_info">
-            <span class="label">Debug Info:</span>
-            <span class="value">{debug_info}</span>
-        </div>
-        {/if}
-    <!-- </fieldset> -->
-
-</section>
-
-
-<style>
-.not_started {
-    background-color: hsla(0, 100%, 75%, 0.3);
-    border-color: hsla(0, 100%, 75%, 0.6);
-}
-.paused {
-    background-color: hsla(60, 100%, 75%, 0.3);
-    border-color: hsla(60, 100%, 75%, 0.6);
-}
-.scanning {
-    background-color: hsla(120, 100%, 75%, 0.3);
-    border-color: hsla(120, 100%, 75%, 0.6);
-}
-
-
-.qr_scanner {
-    /* outline: solid thin pink; */
-
-    max-width: 100vw;
-
-    /* overflow-x: scroll; */
-
-    display: flex;
-    flex-direction: column;
-    /* flex-wrap: wrap; */
-
-    justify-content: flex-start;
-    align-items: center; /* center */
-    align-content: stretch;
-}
-
-.ae_element.qr_scanner div.qr_scanner_viewfinder {
-    /* max-width: 100vw; */
-    /* contain: content; */
-    /* contain: contain; */
-}
-
-.qr_scanner .qr_scanner_viewfinder {
-    /* outline: dashed medium blue; */
-    min-width: 400px;
-
-    width: 100%;
-    /* max-width: 100%; */
-    max-width: 500px;
-    /* max-width: 100vw; */
-    /* outline: solid thin red; */
-
-    contain: contain;
-    overflow-x: scroll;
-}
-
-@media (max-width: 767px) {
-    .qr_scanner .qr_scanner_viewfinder {
-        /* outline: dashed medium red; */
-        min-width: 80vw;
-        /* width: 100%; */
-        /* max-width: 100%; */
-        /* max-width: 450px; */
-        max-width: 100vw;
-
-        margin: 0;
-        padding: 0;
-    }
-}
-</style>
diff --git a/src/lib/element_qr_scanner.svelte b/src/lib/element_qr_scanner.svelte
deleted file mode 100644
index adbe2171..00000000
--- a/src/lib/element_qr_scanner.svelte
+++ /dev/null
@@ -1,641 +0,0 @@
-<script lang="ts">
-// *** Import Svelte core
-import { createEventDispatcher, onDestroy, onMount } from 'svelte';
-// import 'html5-qrcode';
-import {Html5Qrcode, Html5QrcodeScannerState, Html5QrcodeSupportedFormats} from 'html5-qrcode';
-
-// *** Import Aether core variables and functions
-import { api } from '$lib/api';
-import { ae_api } from '$lib/ae_stores';
-
-
-// *** Import Aether core components
-// import Element_input from './element_input.svelte';
-// import ae from '/element_input.svelte';
-// import Input_element from '/element_input.svelte';
-
-// *** Import Aether module variables and functions
-
-// *** Import Aether module components
-
-// *** Export/Exposed variables and functions for component
-export let start_qr_scanner: boolean = true;
-export let show_pause_btn: boolean = false; // pause and resume buttons
-export let show_qr_manual_text_entry_option: boolean = false;
-export let show_qr_manual_badge_id_entry_option: boolean = false;
-export let show_qr_scan_result: boolean = true;
-
-export let qr_fps = 10;
-export let qr_viewfinder_width = 275; // 275 seems good... Need to not let the this be larger than the container which changes based on the width of the screen/window.
-export let qr_facing_mode = 'environment'; // environment, user, { exact: 'environment'}, { exact: 'user'}
-
-// *** Set initial variables
-let scanning_status: string = 'not_started';
-let qr_scan_result: null|string = null;
-let qr_found_text: null|string = null;
-let qr_entered_text: null|string = null;
-let qr_entered_badge_id: null|string = null;
-let show_qr_manual_entry: null|boolean = null;
-let disable_submit_badge_id_btn: boolean = true;
-
-let user_media_status = 'not_requested';
-
-let debug_comment: string = 'Debugging QR Scanner';
-let debug_info: any;
-
-
-// let max_results: number = 50;
-
-const dispatch = createEventDispatcher();
-
-let html5_qr_code: any|null|string = null;
-// let html5_qr_code = new Html5Qrcode(
-//     'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-// );
-
-// let qr_scan_cfg = { fps: 10, qrbox: 400 }; // default was 250 and using 300 when 600px
-let qr_scan_cfg = { fps: qr_fps, qrbox: qr_viewfinder_width }; // 275 seems good... Need to not let the this be larger than the container which changes based on the width of the screen/window.
-
-// let mounted = false;
-
-
-onMount(() => {
-    console.log('** Element Mounted: ** QR Scanner');
-
-    // Wait 250ms for everything to fully load
-    // setTimeout(() => {
-        // console.log('** Element Mounted: ** QR Scanner - setTimeout');
-
-        // NOTE: We only want to trigger the scanning to start after the page has fully loaded.
-        navigator.mediaDevices.getUserMedia({video: true})
-        .then(successCallback, errorCallback);
-        console.log('** Element Mounted: ** QR Scanner - getUserMedia in setTimeout');
-        // mounted = true;
-    // }, 750);
-    // console.log('** Element Mounted: ** QR Scanner - setTimeout end');
-
-    // NOTE: This can only be done after the page has fully loaded.
-    // if (start_qr_scanner) {
-    //     handle_start_qr_scanning();
-    // }
-
-
-});
-
-
-onDestroy(async () => {
-    console.log('** Element Destroyed: ** QR Scanner');
-
-    qr_scan_result = null;
-    qr_found_text = null;
-
-    await handle_stop_qr_scanning();
-});
-
-
-var successCallback = function(error: any) {
-    console.log('Camera access allowed');
-    user_media_status = 'allowed';
-
-    debug_comment = 'Camera Access Allowed';
-    debug_info = JSON.stringify(error);
-
-    if (html5_qr_code) {
-        console.log('html5_qr_code object found. Clearing and creating new Html5Qrcode...');
-        debug_info = 'html5_qr_code object found. Clearing and creating new Html5Qrcode...';
-        html5_qr_code.clear();
-        // document.getElementById('qr_scanner_viewfinder').classList.remove('d_none');
-    } else {
-        console.log('html5_qr_code not found. Creating new Html5Qrcode...');
-        debug_info = 'html5_qr_code not found. Creating new Html5Qrcode...';
-    }
-
-    html5_qr_code = new Html5Qrcode(
-        'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-    );
-
-    debug_info = 'new Html5Qrcode for element id=qr_scanner_viewfinder';
-
-
-    if (start_qr_scanner) {
-        console.log('Ready to start QR scanning!');
-        debug_info = 'Ready to start QR scanning!';
-        handle_start_qr_scanning();
-    }
-
-    // let subject = 'Camera Access Allowed';
-    // let message = error;
-    // send_init_confirm_email(subject, message);
-
-    console.log('Dispatching qr_camera');
-    debug_info = 'Dispatching qr_camera';
-
-    dispatch('qr_camera', {
-        status: 'allowed',
-    });
-
-    // NOTE: This can only be done after the page has fully loaded.
-    // if (start_qr_scanner) {
-    //     handle_start_qr_scanning();
-    // }
-};
-
-var errorCallback = function(error: any) {
-    if (error.name == 'NotAllowedError') {
-        console.log('Camera access not allowed!');
-        user_media_status = 'denied';
-
-        debug_comment = 'Camera Access Denied';
-        debug_info = JSON.stringify(error);
-        // alert('Error trying to start camera');
-        // alert(error);
-
-        let subject = 'Camera Access Denied';
-        let message = error;
-        send_init_confirm_email(subject, message);
-
-        dispatch('qr_camera', {
-            status: 'denied',
-        });
-    }
-};
-
-// $: if (start_qr_scanner && user_media_status == 'allowed' && (scanning_status == 'not_started' || scanning_status == 'paused')) {
-//     console.log('START QR SCANNING');
-//     handle_start_qr_scanning();
-// } else {
-//     // console.log('STOP QR SCANNING');
-//     // handle_stop_qr_scanning();
-// }
-
-
-// $: if (mounted && start_qr_scanner) {
-//     console.log('START QR SCANNING');
-//     handle_start_qr_scanning();
-// } else if (mounted && !start_qr_scanner) {
-//     console.log('STOP QR SCANNING');
-//     handle_stop_qr_scanning();
-// }
-
-
-async function handle_start_qr_scanning() {
-    console.log('*** handle_start_qr_scanning() ***');
-
-    if (user_media_status == 'denied') {
-        console.log('Camera access not allowed!');
-        return;
-    } else if (user_media_status == 'not_requested') {
-        console.log('Camera access not requested yet!');
-        return;
-    } else if (user_media_status == 'allowed') {
-        console.log('Camera access allowed!');
-        debug_info = 'Camera access allowed!';
-    } else {
-        console.log('Camera access status unknown! This should not happen?');
-        debug_info = 'Camera access status unknown! This should not happen?';
-        return;
-    }
-
-    qr_scan_result = null;
-    qr_found_text = null;
-
-
-    debug_comment = 'Starting QR Scanning...';
-
-    // if (html5_qr_code) {
-    //     console.log('html5_qr_code object found. Clearing and creating new Html5Qrcode...');
-    //     debug_info = 'html5_qr_code object found. Clearing and creating new Html5Qrcode...';
-    //     html5_qr_code.clear();
-    //     // document.getElementById('qr_scanner_viewfinder').classList.remove('d_none');
-
-    //     html5_qr_code = new Html5Qrcode(
-    //         'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-    //     );
-    // } else {
-    //     console.log('html5_qr_code not found. Creating new Html5Qrcode...');
-    //     debug_info = 'html5_qr_code not found. Creating new Html5Qrcode...';
-
-    //     html5_qr_code = new Html5Qrcode(
-    //         'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-    //     );
-    // }
-
-    debug_info = 'Check the state and start if not started...';
-
-    let current_state = await html5_qr_code.getState()
-
-    if (current_state == Html5QrcodeScannerState.NOT_STARTED) {
-        // console.log('Scanner is not started');
-
-        return await html5_qr_code.start({ facingMode: qr_facing_mode }, qr_scan_cfg, handle_qr_scan_success, handle_qr_scan_error)
-        .then((ignore: any) => {
-            console.log('Scanning has started');
-            scanning_status = 'scanning';
-
-            debug_info = 'Scanning has started';
-
-            // let subject = 'QR Scanning Started';
-            // let message = ignore;
-            // send_init_confirm_email(subject, message);
-
-            return true;
-        }).catch((err) => {
-            console.log('There was an error while trying to start the QR scanner');
-            scanning_status = 'start_error';
-
-            debug_info = 'Error starting scanner: ' + JSON.stringify(err);
-
-
-            // let subject = 'QR Scanning Start Error';
-            // let message = err;
-            // send_init_confirm_email(subject, message);
-
-            // Error getting userMedia, error = NotReadableError: Could not start video source
-
-            return false;
-        });
-
-
-    } else {
-        console.log('Scanner is already started');
-        debug_info = 'Scanner is already started';
-        return;
-    }
-
-
-}
-
-
-function handle_pause_qr_scanning() {
-    if (html5_qr_code && html5_qr_code.getState() != Html5QrcodeScannerState.SCANNING) {
-        console.log('Scanner is not scanning!');
-        return;
-    }
-
-    html5_qr_code.pause();
-    scanning_status = 'paused';
-}
-
-function handle_resume_qr_scanning() {
-    if (html5_qr_code && html5_qr_code.getState() != Html5QrcodeScannerState.PAUSED) {
-        console.log('Scanner is not paused!');
-        return;
-    }
-
-    document.getElementById('qr_scanner_viewfinder').classList.remove('d_none');
-    html5_qr_code.resume();
-    scanning_status = 'scanning';
-}
-
-
-async function handle_stop_qr_scanning() {
-    start_qr_scanner = false;
-
-    if (!html5_qr_code) {
-        console.log('html5_qr_code object found. Nothing to stop?');
-        return false;
-    }
-
-    let state = html5_qr_code.getState();
-    console.log('html5_qr_code state:', state);
-
-    if (state == Html5QrcodeScannerState.NOT_STARTED) {
-        console.log('Scanner is not started');
-        return;
-    }
-
-    if (state == Html5QrcodeScannerState.PAUSED || state == Html5QrcodeScannerState.SCANNING) {
-        console.log('Scanner is not started');
-        await html5_qr_code.stop()
-        scanning_status = 'not_started';
-        return;
-    }
-
-    await html5_qr_code.clear();
-    return true;
-
-    // html5_qr_code.pause();
-
-    // return html5_qr_code.stop()
-    // .then((ignore) => {
-    //     console.log('Scanning has stopped');
-    //     // document.getElementById('qr_scanner_viewfinder').classList.add('d_none');
-    //     scanning_status = 'not_started';
-    // }).then((ignore) => {
-    //     // html5_qr_code = null;
-    //     // html5_qr_code.clear();
-    // }).catch((err) => {
-    //     console.log('There was an error while trying to stop the scanning');
-    //     return false;
-    // });
-
-    // html5_qr_code = null;
-}
-
-
-// Callback function for QrcodeSuccessCallback (decodedText: string, result: Html5QrcodeResult)
-function handle_qr_scan_success(decoded_text, decoded_result) {
-    console.log('*** handle_qr_scan_success() ***');
-
-    console.log(`QR scanned = ${decoded_text}`, decoded_result);
-
-    qr_scan_result = decoded_text; // NOTE: decoded_result is not currently used by html5-qrcode
-    qr_found_text = decoded_text;
-
-    dispatch('qr_scan_result', {
-        result: qr_scan_result, // This text will need to be parsed to get more info.
-        text: qr_found_text, // This text will need to be parsed to get more info.
-        entry_method: 'QR',
-    });
-
-    // handle_pause_qr_scanning();
-    handle_stop_qr_scanning();
-}
-
-
-// Callback function for QrcodeErrorCallback (errorMessage: string, error: Html5QrcodeError)
-// NOTE: Most of the time this is normal and not an actual error. It just did not find something to scan.
-function handle_qr_scan_error(qr_error_message, qr_code_error) {
-    // console.log('*** handle_qr_scan_error() ***');
-
-    if (qr_code_error.type) {
-        console.log(`Error scanning code = ${qr_error_message}`, qr_code_error);
-        return;
-    }
-}
-
-
-$: if ( qr_entered_badge_id && qr_entered_badge_id.length >= 11 && qr_entered_badge_id && qr_entered_badge_id.length <= 14) {
-    disable_submit_badge_id_btn = false;
-} else {
-    disable_submit_badge_id_btn = true;
-}
-
-
-function handle_qr_manual_entry() {
-    console.log('*** handle_qr_manual_entry() ***');
-
-    if (qr_entered_text) {
-        console.log(`QR entered text = ${qr_entered_text}`);
-    } else if (qr_entered_badge_id) {
-        console.log(`QR entered badge ID = ${qr_entered_badge_id}`);
-        qr_entered_text = `OBJ:ot:event_badge,oi:${qr_entered_badge_id}`;
-        console.log(`Parse to proper QR badge ID = ${qr_entered_text}`);
-    }
-
-    // html5_qr_code.stop().then((ignore) => {
-    //     console.log('Scanning has stopped');
-    //     document.getElementById('qr_scanner_viewfinder').classList.add('d_none');
-    // }).catch((err) => {
-    //     console.log('There was an error while trying to stop the scanning');
-    // });
-
-    qr_scan_result = qr_entered_text;
-
-    dispatch('qr_scan_result', {
-        result: qr_scan_result,
-        entry_method: 'manual',
-    });
-
-    qr_scan_result = null;
-    qr_entered_text = null;
-}
-
-
-
-
-
-function send_init_confirm_email(subject, message) {
-    console.log(`*** send_init_confirm_email() *** ${subject}`);
-
-    let to_email = 'scott.idem+skdev@oneskyit.com';
-
-    // let origin_url = encodeURI(`${data.url.origin}`);
-
-    let full_subject = `${subject} Aether QR Scanner Debugging`;
-
-    let body_html = `
-    <div>Scott,
-    <p>This is an automatic debug email from the Aether QR scanner.</p>
-    </div>
-
-    <br>
-
-    <div>
-    Message:<br>
-    <pre>
-    ${JSON.stringify(message)}
-    </pre>
-    </div>
-    `;
-
-    api.send_email({
-        api_cfg: $ae_api,
-        from_email: 'noreply+ae_qr_debug@oneskyit.com',
-        from_name: 'AE QR Debug',
-        to_email: to_email,
-        subject: full_subject,
-        body_html: body_html,
-    });
-}
-
-
-</script>
-
-
-<section
-    class="ae_element qr_scanner border-2 border-slate-500/10 space-y-2 flex flex-col gap-1 justify-center items-center min-w-full max-w-full"
-    class:not_started={scanning_status == 'not_started'}
-    class:paused={scanning_status == 'paused'}
-    class:scanning={scanning_status == 'scanning'}
-    >
-
-    <!-- <header>
-        <h2>QR Scanner</h2>
-    </header> -->
-
-    <!-- <fieldset class=""> -->
-        <!-- <legend class="d_none">QR Scanner:</legend> -->
-
-        <div
-            class="ae_container qr_scanning_container"
-            >
-            <div
-            class="ae_options flex flex-row justify-center items-center gap-1 m-1"
-                >
-            {#if scanning_status == 'not_started' }
-                    <button on:click={handle_start_qr_scanning} class="btn btn-lg preset-tonal-primary btn_start"><span class="fas fa-qrcode mx-1"></span> Start Scanning</button>
-                    <span class="loading-text">
-                        Scanning stopped
-                    </span>
-            {:else if scanning_status == 'paused' && show_pause_btn}
-                    <button on:click={handle_resume_qr_scanning} class="btn btn-md preset-tonal-primary btn_resume"><span class="fas fa-play"></span> Resume</button>
-                    <span>Scanning paused</span>
-            {:else if scanning_status == 'scanning'}
-                    <button on:click={handle_stop_qr_scanning} class="btn btn-md preset-tonal-secondary btn_stop">
-                        <span class="fas fa-crosshairs fa-spin opacity-50 m-1"></span>
-                        <!-- <span class="fas fa-stop-circle m-1"></span> -->
-                        Stop
-                    </button>
-                    {#if show_pause_btn}
-                        <button on:click={handle_pause_qr_scanning} class="btn btn-lg preset-tonal-secondary btn_pause"><span class="fas fa-pause-circle"></span> Pause</button>
-                    {/if}
-                    <!-- <span>Scanning for QR code...</span> -->
-                    <!-- <div class="modal-loading"> -->
-                        <!-- <span class="fas fa-crosshairs fa-spin opacity-50"></span> -->
-                        <span class="loading-text">
-                            Scanning for QR code...
-                        </span>
-                    <!-- </div> -->
-            {/if}
-            </div>
-
-            <div id="qr_scanner_viewfinder" class="qr_scanner_viewfinder grow flex flex-col justify-center items-center" style=""></div> <!-- width: 600px -->
-        </div>
-
-        {#if show_qr_manual_text_entry_option}
-        <div class="ae_container qr_manual_entry text_entry">
-            {#if show_qr_manual_entry}
-                <label for="entered_text" class="">Enter text</label>
-                <input type="text" name="entered_text" id="entered_text" bind:value="{qr_entered_text}">
-                <button on:click={handle_qr_manual_entry} class="btn btn-md preset-tonal-warning"><span class="fas fa-paper-plane"></span> Submit Text</button>
-
-
-                <div class="search_by_text">
-                    <input type='text' placeholder="Name or Email" label="Name or Email" value={search_query_str} focus={true} on:oninput={handle_oninput_search_query_str} />
-                </div>
-
-            {:else}
-                <button on:click={() => show_qr_manual_entry=true} class="btn btn-md preset-tonal-warning"><span class="fas fa-keyboard"></span> Enter Text</button>
-            {/if}
-        </div>
-        {/if}
-
-        {#if show_qr_manual_badge_id_entry_option}
-        <div class="ae_container qr_manual_entry badge_id_entry">
-            {#if show_qr_manual_entry}
-                <form on:submit|preventDefault={() => handle_qr_manual_entry} class="flex">
-
-                    <!-- <label for="entered_badge_id" class="">Enter badge ID</label>
-                    <input type="text" name="entered_badge_id" id="entered_badge_id" bind:value="{qr_entered_badge_id}"> -->
-
-                    <input
-                        bind:value="{qr_entered_badge_id}"
-                        type="text"
-                        name="entered_badge_id"
-                        id="entered_badge_id"
-                        required
-                        placeholder="Enter Badge ID"
-                        class="input max-w-52"
-                        />
-
-                    <button
-                        type="submit"
-                        on:click={handle_qr_manual_entry}
-                        disabled={disable_submit_badge_id_btn}
-                        class="btn btn-md preset-tonal-primary border border-primary-500 m-1"
-                        class:btn_default={disable_submit_badge_id_btn}
-                        class:btn_primary={!disable_submit_badge_id_btn}
-                        >
-                        <span class="fas fa-paper-plane mx-1"></span> Submit Badge ID
-                    </button>
-
-                </form>
-            {:else}
-            <button on:click={() =>
-                {
-                handle_stop_qr_scanning();
-                show_qr_manual_entry=true;
-                }}
-                class="btn btn-md preset-tonal-secondary m-1"
-                >
-                <span class="fas fa-keyboard mx-1"></span> Enter Badge ID
-            </button>
-            {/if}
-        </div>
-        {/if}
-
-        {#if show_qr_scan_result && qr_scan_result}
-        <div class="ae_container qr_scan_result">
-            <span class="label">Raw Result:</span>
-            <span id="qr_scan_result_value" class="value">{qr_scan_result}</span>
-        </div>
-        {/if}
-
-        <!-- {debug_comment ?? 'Debugging QR Scanner'}
-        {#if debug_info}
-        <div class="ae_container debug_info">
-            <span class="label">Debug Info:</span>
-            <span class="value">{debug_info}</span>
-        </div>
-        {/if} -->
-    <!-- </fieldset> -->
-
-</section>
-
-
-<style>
-.not_started {
-    background-color: hsla(0, 100%, 75%, 0.3);
-    border-color: hsla(0, 100%, 75%, 0.6);
-}
-.paused {
-    background-color: hsla(60, 100%, 75%, 0.3);
-    border-color: hsla(60, 100%, 75%, 0.6);
-}
-.scanning {
-    background-color: hsla(120, 100%, 75%, 0.3);
-    border-color: hsla(120, 100%, 75%, 0.6);
-}
-
-
-.qr_scanner {
-    /* outline: solid thin pink; */
-
-    max-width: 100vw;
-
-    /* overflow-x: scroll; */
-
-    display: flex;
-    flex-direction: column;
-    /* flex-wrap: wrap; */
-
-    justify-content: flex-start;
-    align-items: center; /* center */
-    align-content: stretch;
-}
-
-.ae_element.qr_scanner div.qr_scanner_viewfinder {
-    /* max-width: 100vw; */
-    /* contain: content; */
-    /* contain: contain; */
-}
-
-.qr_scanner .qr_scanner_viewfinder {
-    /* outline: dashed medium blue; */
-    min-width: 400px;
-
-    width: 100%;
-    /* max-width: 100%; */
-    max-width: 500px;
-    /* max-width: 100vw; */
-    /* outline: solid thin red; */
-
-    contain: contain;
-    overflow-x: scroll;
-}
-
-@media (max-width: 767px) {
-    .qr_scanner .qr_scanner_viewfinder {
-        /* outline: dashed medium red; */
-        min-width: 80vw;
-        /* width: 100%; */
-        /* max-width: 100%; */
-        /* max-width: 450px; */
-        max-width: 100vw;
-
-        margin: 0;
-        padding: 0;
-    }
-}
-</style>
diff --git a/src/lib/element_qr_scanner_dev.svelte b/src/lib/element_qr_scanner_dev.svelte
deleted file mode 100644
index fea62385..00000000
--- a/src/lib/element_qr_scanner_dev.svelte
+++ /dev/null
@@ -1,670 +0,0 @@
-<script lang="ts">
-// *** Import Svelte core
-import { createEventDispatcher, onDestroy, onMount } from 'svelte';
-// import 'html5-qrcode';
-import {Html5Qrcode, Html5QrcodeScannerState, Html5QrcodeSupportedFormats} from 'html5-qrcode';
-
-// *** Import Aether core variables and functions
-import { api } from '$lib/api';
-import { ae_api } from '$lib/ae_stores';
-
-// *** Import Aether core components
-// import Element_input from './element_input.svelte';
-// import ae from '/element_input.svelte';
-// import Input_element from '/element_input.svelte';
-
-// *** Import Aether module variables and functions
-
-// *** Import Aether module components
-
-// *** Export/Exposed variables and functions for component
-export let start_qr_scanner: boolean = true;
-export let show_pause_btn: boolean = false; // pause and resume buttons
-export let show_qr_manual_text_entry_option: boolean = false;
-export let show_qr_manual_badge_id_entry_option: boolean = false;
-export let show_qr_scan_result: boolean = true;
-
-export let qr_fps = 10;
-export let qr_viewfinder_width = 275; // 275 seems good... Need to not let the this be larger than the container which changes based on the width of the screen/window.
-export let qr_facing_mode = 'environment'; // environment, user, { exact: 'environment'}, { exact: 'user'}
-
-// *** Set initial variables
-let scanning_status: string = 'not_started';
-let qr_scan_result: null|string = null;
-let qr_found_text: null|string = null;
-let qr_entered_text: null|string = null;
-let qr_entered_badge_id: null|string = null;
-let show_qr_manual_entry: null|boolean = null;
-let disable_submit_badge_id_btn: boolean = true;
-
-let user_media_status = 'not_requested';
-
-let debug_comment: string = 'Debugging QR Scanner';
-let debug_info: any;
-
-let html5_qr_code: any|null|string = null;
-
-// let qr_scan_cfg = { fps: 10, qrbox: 400 }; // default was 250 and using 300 when 600px
-let qr_scan_cfg = { fps: qr_fps, qrbox: qr_viewfinder_width }; // 275 seems good... Need to not let the this be larger than the container which changes based on the width of the screen/window.
-
-
-// const html5QrCode = new Html5Qrcode(
-//     'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-// );
-
-
-onMount(() => {
-    console.log('** Element Mounted: ** QR Scanner');
-
-    // html5_qr_code = new Html5Qrcode(
-    //     'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-    // );
-
-
-    // navigator.mediaDevices.getUserMedia({video: true})
-    // .then(get_user_media_success, get_user_media_error);
-    // console.log('** Element Mounted: ** QR Scanner - getUserMedia in setTimeout');
-});
-
-
-onDestroy(async () => {
-    console.log('** Element Destroyed: ** QR Scanner');
-
-    qr_scan_result = null;
-    qr_found_text = null;
-
-    await handle_stop_qr_scanning();
-});
-
-
-var get_user_media_success = function(error: any) {
-    console.log('Camera access allowed');
-    user_media_status = 'allowed';
-
-    debug_comment = 'Camera Access Allowed';
-    debug_info = JSON.stringify(error);
-
-    if (html5_qr_code) {
-        console.log('html5_qr_code object found. Clearing and creating new Html5Qrcode...');
-        debug_info = 'html5_qr_code object found. Clearing and creating new Html5Qrcode...';
-        html5_qr_code.clear();
-        // document.getElementById('qr_scanner_viewfinder').classList.remove('d_none');
-    } else {
-        console.log('html5_qr_code not found. Creating new Html5Qrcode...');
-        debug_info = 'html5_qr_code not found. Creating new Html5Qrcode...';
-
-        html5_qr_code = new Html5Qrcode(
-            'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-        );
-    }
-
-    // html5_qr_code = new Html5Qrcode(
-    //     'qr_scanner_viewfinder', { formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ] }
-    // );
-
-    debug_info = 'new Html5Qrcode for element id=qr_scanner_viewfinder';
-
-    if (start_qr_scanner && 1==2) {
-        console.log('Ready to start QR scanning! (after x500ms)');
-        debug_comment = 'Starting QR after 500ms...';
-        debug_info = 'Ready to start QR scanning! (after 2500ms)';
-        setTimeout(() => {
-            console.log('Inside QR scanning timeout after x500ms...');
-            // handle_start_qr_scanning();
-            handle_start_qr_scanning_trust();
-        }, 2500);
-        console.log('Started QR scanning after x500ms...');
-    }
-
-    // let subject = 'Camera Access Allowed';
-    // let message = error;
-    // send_init_confirm_email(subject, message);
-
-    // console.log('Dispatching qr_camera');
-    // debug_info = 'Dispatching qr_camera';
-
-    // dispatch('qr_camera', {
-    //     status: 'allowed',
-    // });
-
-    // NOTE: This can only be done after the page has fully loaded.
-    // if (start_qr_scanner) {
-    //     handle_start_qr_scanning();
-    // }
-};
-
-var get_user_media_error = function(error: any) {
-    if (error.name == 'NotAllowedError') {
-        console.log('Camera access not allowed!');
-        user_media_status = 'denied';
-
-        debug_comment = 'Camera Access Denied';
-        debug_info = JSON.stringify(error);
-        // alert('Error trying to start camera');
-        // alert(error);
-
-        let subject = 'Camera Access Denied';
-        let message = error;
-        send_init_confirm_email(subject, message);
-
-        // dispatch('qr_camera', {
-        //     status: 'denied',
-        // });
-    }
-};
-
-// $: if (start_qr_scanner && user_media_status == 'allowed' && (scanning_status == 'not_started' || scanning_status == 'paused')) {
-//     console.log('START QR SCANNING');
-//     handle_start_qr_scanning();
-// } else {
-//     // console.log('STOP QR SCANNING');
-//     // handle_stop_qr_scanning();
-// }
-
-
-// $: if (mounted && start_qr_scanner) {
-//     console.log('START QR SCANNING');
-//     handle_start_qr_scanning();
-// } else if (mounted && !start_qr_scanner) {
-//     console.log('STOP QR SCANNING');
-//     handle_stop_qr_scanning();
-// }
-
-async function handle_start_qr_scanning_trust() {
-    console.log('*** handle_start_qr_scanning_trust() ***');
-
-    qr_scan_result = null;
-    qr_found_text = null;
-
-    debug_comment = 'Starting trusting QR scanning...';
-
-    debug_info = 'Just start!';
-    await html5_qr_code.clear();
-    html5_qr_code.start({ facingMode: qr_facing_mode }, qr_scan_cfg, handle_qr_scan_success, handle_qr_scan_error)
-    .then((ignore: any) => {
-        console.log('Scanning has started');
-        scanning_status = 'scanning';
-
-        debug_info = 'Scanning has started';
-
-        // let subject = 'QR Scanning Started';
-        // let message = ignore;
-        // send_init_confirm_email(subject, message);
-
-        return true;
-    }).catch((err) => {
-        console.log('There was an error while trying to start the QR scanner');
-        scanning_status = 'start_error';
-
-        debug_info = 'Error starting scanner: ' + JSON.stringify(err);
-
-
-        // let subject = 'QR Scanning Start Error';
-        // let message = err;
-        // send_init_confirm_email(subject, message);
-
-        // Error getting userMedia, error = NotReadableError: Could not start video source
-
-        return false;
-    });
-
-    return true;
-}
-
-
-async function handle_start_qr_scanning() {
-    console.log('*** handle_start_qr_scanning() ***');
-
-    if (user_media_status == 'denied') {
-        console.log('Camera access not allowed!');
-        return;
-    } else if (user_media_status == 'not_requested') {
-        console.log('Camera access not requested yet!');
-        return;
-    } else if (user_media_status == 'allowed') {
-        console.log('Camera access allowed!');
-        debug_info = 'Camera access allowed!';
-    } else {
-        console.log('Camera access status unknown! This should not happen?');
-        debug_info = 'Camera access status unknown! This should not happen?';
-        return;
-    }
-
-    qr_scan_result = null;
-    qr_found_text = null;
-
-
-    debug_comment = 'Starting QR Scanning...';
-
-    debug_info = 'Check the state and start if not started...';
-
-    let current_state = await html5_qr_code.getState()
-
-    if (current_state == Html5QrcodeScannerState.NOT_STARTED) {
-        // console.log('Scanner is not started');
-
-        return await html5_qr_code.start({ facingMode: qr_facing_mode }, qr_scan_cfg, handle_qr_scan_success, handle_qr_scan_error)
-        .then((ignore: any) => {
-            console.log('Scanning has started');
-            scanning_status = 'scanning';
-
-            debug_info = 'Scanning has started';
-
-            // let subject = 'QR Scanning Started';
-            // let message = ignore;
-            // send_init_confirm_email(subject, message);
-
-            return true;
-        }).catch((err) => {
-            console.log('There was an error while trying to start the QR scanner');
-            scanning_status = 'start_error';
-
-            debug_info = 'Error starting scanner: ' + JSON.stringify(err);
-
-
-            // let subject = 'QR Scanning Start Error';
-            // let message = err;
-            // send_init_confirm_email(subject, message);
-
-            // Error getting userMedia, error = NotReadableError: Could not start video source
-
-            return false;
-        });
-
-
-    } else {
-        console.log('Scanner is already started');
-        debug_info = 'Scanner is already started';
-        return;
-    }
-
-
-}
-
-
-function handle_pause_qr_scanning() {
-    if (html5_qr_code && html5_qr_code.getState() != Html5QrcodeScannerState.SCANNING) {
-        console.log('Scanner is not scanning!');
-        return;
-    }
-
-    html5_qr_code.pause();
-    scanning_status = 'paused';
-}
-
-function handle_resume_qr_scanning() {
-    if (html5_qr_code && html5_qr_code.getState() != Html5QrcodeScannerState.PAUSED) {
-        console.log('Scanner is not paused!');
-        return;
-    }
-
-    html5_qr_code.resume();
-    scanning_status = 'scanning';
-}
-
-
-async function handle_stop_qr_scanning() {
-    start_qr_scanner = false;
-
-    if (!html5_qr_code) {
-        console.log('html5_qr_code object found. Nothing to stop?');
-        return false;
-    }
-
-    await html5_qr_code.stop();
-
-    // let state = html5_qr_code.getState();
-    // console.log('html5_qr_code state:', state);
-
-    // if (state == Html5QrcodeScannerState.NOT_STARTED) {
-    //     console.log('Scanner is not started');
-    //     return;
-    // }
-
-    // if (state == Html5QrcodeScannerState.PAUSED || state == Html5QrcodeScannerState.SCANNING) {
-    //     console.log('Scanner is not started');
-    //     await html5_qr_code.stop();
-    //     scanning_status = 'not_started';
-    //     return;
-    // }
-
-    await html5_qr_code.clear();
-    return true;
-
-    // html5_qr_code.pause();
-
-    // return html5_qr_code.stop()
-    // .then((ignore) => {
-    //     console.log('Scanning has stopped');
-    //     // document.getElementById('qr_scanner_viewfinder').classList.add('d_none');
-    //     scanning_status = 'not_started';
-    // }).then((ignore) => {
-    //     // html5_qr_code = null;
-    //     // html5_qr_code.clear();
-    // }).catch((err) => {
-    //     console.log('There was an error while trying to stop the scanning');
-    //     return false;
-    // });
-
-    // html5_qr_code = null;
-}
-
-
-// Callback function for QrcodeSuccessCallback (decodedText: string, result: Html5QrcodeResult)
-function handle_qr_scan_success(decoded_text, decoded_result) {
-    console.log('*** handle_qr_scan_success() ***');
-
-    console.log(`QR scanned = ${decoded_text}`, decoded_result);
-
-    qr_scan_result = decoded_text; // NOTE: decoded_result is not currently used by html5-qrcode
-    qr_found_text = decoded_text;
-
-    dispatch('qr_scan_result', {
-        result: qr_scan_result, // This text will need to be parsed to get more info.
-        text: qr_found_text, // This text will need to be parsed to get more info.
-        entry_method: 'QR',
-    });
-
-    // handle_pause_qr_scanning();
-    handle_stop_qr_scanning();
-}
-
-
-// Callback function for QrcodeErrorCallback (errorMessage: string, error: Html5QrcodeError)
-// NOTE: Most of the time this is normal and not an actual error. It just did not find something to scan.
-function handle_qr_scan_error(qr_error_message, qr_code_error) {
-    // console.log('*** handle_qr_scan_error() ***');
-
-    if (qr_code_error.type) {
-        console.log(`Error scanning code = ${qr_error_message}`, qr_code_error);
-        return;
-    }
-}
-
-
-$: if ( qr_entered_badge_id && qr_entered_badge_id.length >= 11 && qr_entered_badge_id && qr_entered_badge_id.length <= 14) {
-    disable_submit_badge_id_btn = false;
-} else {
-    disable_submit_badge_id_btn = true;
-}
-
-
-function handle_qr_manual_entry() {
-    console.log('*** handle_qr_manual_entry() ***');
-
-    if (qr_entered_text) {
-        console.log(`QR entered text = ${qr_entered_text}`);
-    } else if (qr_entered_badge_id) {
-        console.log(`QR entered badge ID = ${qr_entered_badge_id}`);
-        qr_entered_text = `OBJ:ot:event_badge,oi:${qr_entered_badge_id}`;
-        console.log(`Parse to proper QR badge ID = ${qr_entered_text}`);
-    }
-
-    // html5_qr_code.stop().then((ignore) => {
-    //     console.log('Scanning has stopped');
-    //     document.getElementById('qr_scanner_viewfinder').classList.add('d_none');
-    // }).catch((err) => {
-    //     console.log('There was an error while trying to stop the scanning');
-    // });
-
-    qr_scan_result = qr_entered_text;
-
-    dispatch('qr_scan_result', {
-        result: qr_scan_result,
-        entry_method: 'manual',
-    });
-
-    qr_scan_result = null;
-    qr_entered_text = null;
-}
-
-
-
-
-
-function send_init_confirm_email(subject, message) {
-    console.log(`*** send_init_confirm_email() *** ${subject}`);
-
-    let to_email = 'scott.idem+skdev@oneskyit.com';
-
-    // let origin_url = encodeURI(`${data.url.origin}`);
-
-    let full_subject = `${subject} Aether QR Scanner Debugging`;
-
-    let body_html = `
-    <div>Scott,
-    <p>This is an automatic debug email from the Aether QR scanner.</p>
-    </div>
-
-    <br>
-
-    <div>
-    Message:<br>
-    <pre>
-    ${JSON.stringify(message)}
-    </pre>
-    </div>
-    `;
-
-    api.send_email({
-        api_cfg: $ae_api,
-        from_email: 'noreply+ae_qr_debug@oneskyit.com',
-        from_name: 'AE QR Debug',
-        to_email: to_email,
-        subject: full_subject,
-        body_html: body_html,
-    });
-}
-
-
-</script>
-
-
-<section
-    class="ae_element qr_scanner border-2 border-slate-500/10 space-y-2 flex flex-col gap-1 justify-center items-center min-w-full max-w-full"
-    class:not_started={scanning_status == 'not_started'}
-    class:paused={scanning_status == 'paused'}
-    class:scanning={scanning_status == 'scanning'}
-    >
-
-    <!-- <header>
-        <h2>QR Scanner</h2>
-    </header> -->
-
-    <!-- <fieldset class=""> -->
-        <!-- <legend class="d_none">QR Scanner:</legend> -->
-
-        <div
-            class="ae_container qr_scanning_container"
-            >
-            <div
-                class="ae_options flex flex-row gap-1 m-1"
-                >
-
-            <button
-                type="button"
-                on:click={ () => {
-                    navigator.mediaDevices.getUserMedia({video: true})
-                    .then(get_user_media_success, get_user_media_error);
-                }}
-                class="ae_btn__allow_camera btn btn-sm preset-tonal-primary"
-                >
-                <span class="fas fa-camera mx-1"></span>
-                Allow Camera Access
-            </button>
-
-            <button
-                type="button"
-                on:click={ () => {
-                    handle_start_qr_scanning_trust();
-                    // Select back camera or fail with `OverconstrainedError`.
-                    // html5_qr_code.start({ facingMode: { exact: "environment"} }, config, qrCodeSuccessCallback);
-                }}
-                class="ae_btn__start btn btn-sm preset-tonal-primary"
-                >
-                <span class="fas fa-qrcode mx-1"></span>
-                Start Scanning
-            </button>
-
-            <button
-                on:click={ () => {
-                    // Select back camera or fail with `OverconstrainedError`.
-                    html5_qr_code.start({ facingMode: { exact: "environment"} }, config, qrCodeSuccessCallback);
-                }}
-                class="ae_btn__resume btn btn-sm preset-tonal-primary">
-                <span class="fas fa-play"></span>
-                Resume
-            </button>
-
-            <button
-                on:click={handle_stop_qr_scanning}
-                class="ae_btn__stop btn btn-sm preset-tonal-secondary"
-                >
-                <span class="fas fa-crosshairs fa-spin opacity-50 m-1"></span>
-                <!-- <span class="fas fa-stop-circle m-1"></span> -->
-                Stop
-            </button>
-
-            </div>
-
-            <div id="qr_scanner_viewfinder" class="qr_scanner_viewfinder grow flex flex-col justify-center items-center" style=""></div> <!-- width: 600px -->
-        </div>
-
-        {#if show_qr_manual_text_entry_option}
-        <div class="ae_container qr_manual_entry text_entry">
-            {#if show_qr_manual_entry}
-                <label for="entered_text" class="">Enter text</label>
-                <input type="text" name="entered_text" id="entered_text" bind:value="{qr_entered_text}">
-                <button on:click={handle_qr_manual_entry} class="btn btn-md preset-tonal-warning"><span class="fas fa-paper-plane"></span> Submit Text</button>
-
-
-                <div class="search_by_text">
-                    <input type='text' placeholder="Name or Email" label="Name or Email" value={search_query_str} focus={true} on:oninput={handle_oninput_search_query_str} />
-                </div>
-
-            {:else}
-                <button on:click={() => show_qr_manual_entry=true} class="btn btn-md preset-tonal-warning"><span class="fas fa-keyboard"></span> Enter Text</button>
-            {/if}
-        </div>
-        {/if}
-
-        {#if show_qr_manual_badge_id_entry_option}
-        <div class="ae_container qr_manual_entry badge_id_entry">
-            {#if show_qr_manual_entry}
-                <form on:submit|preventDefault={() => handle_qr_manual_entry} class="flex">
-
-                    <!-- <label for="entered_badge_id" class="">Enter badge ID</label>
-                    <input type="text" name="entered_badge_id" id="entered_badge_id" bind:value="{qr_entered_badge_id}"> -->
-
-                    <input
-                        bind:value="{qr_entered_badge_id}"
-                        type="text"
-                        name="entered_badge_id"
-                        id="entered_badge_id"
-                        required
-                        placeholder="Enter Badge ID"
-                        class="input max-w-52"
-                        />
-
-                    <button
-                        type="submit"
-                        on:click={handle_qr_manual_entry}
-                        disabled={disable_submit_badge_id_btn}
-                        class="btn btn-md preset-tonal-primary border border-primary-500 m-1"
-                        class:btn_default={disable_submit_badge_id_btn}
-                        class:btn_primary={!disable_submit_badge_id_btn}
-                        >
-                        <span class="fas fa-paper-plane mx-1"></span> Submit Badge ID
-                    </button>
-
-                </form>
-            {:else}
-            <button on:click={() => show_qr_manual_entry=true} class="btn btn-md preset-tonal-secondary m-1"><span class="fas fa-keyboard mx-1"></span> Enter Badge ID</button>
-            {/if}
-        </div>
-        {/if}
-
-        {#if show_qr_scan_result && qr_scan_result}
-        <div class="ae_container qr_scan_result">
-            <span class="label">Raw Result:</span>
-            <span id="qr_scan_result_value" class="value">{qr_scan_result}</span>
-        </div>
-        {/if}
-
-        {debug_comment ?? 'Debugging QR Scanner'}
-        {#if debug_info}
-        <div class="ae_container debug_info">
-            <span class="label">Debug Info:</span>
-            <span class="value">{debug_info}</span>
-        </div>
-        {/if}
-    <!-- </fieldset> -->
-
-</section>
-
-
-<style>
-.not_started {
-    background-color: hsla(0, 100%, 75%, 0.3);
-    border-color: hsla(0, 100%, 75%, 0.6);
-}
-.paused {
-    background-color: hsla(60, 100%, 75%, 0.3);
-    border-color: hsla(60, 100%, 75%, 0.6);
-}
-.scanning {
-    background-color: hsla(120, 100%, 75%, 0.3);
-    border-color: hsla(120, 100%, 75%, 0.6);
-}
-
-
-.qr_scanner {
-    /* outline: solid thin pink; */
-
-    max-width: 100vw;
-
-    /* overflow-x: scroll; */
-
-    display: flex;
-    flex-direction: column;
-    /* flex-wrap: wrap; */
-
-    justify-content: flex-start;
-    align-items: center; /* center */
-    align-content: stretch;
-}
-
-.ae_element.qr_scanner div.qr_scanner_viewfinder {
-    /* max-width: 100vw; */
-    /* contain: content; */
-    /* contain: contain; */
-}
-
-.qr_scanner .qr_scanner_viewfinder {
-    /* outline: dashed medium blue; */
-    min-width: 400px;
-
-    width: 100%;
-    /* max-width: 100%; */
-    max-width: 500px;
-    /* max-width: 100vw; */
-    /* outline: solid thin red; */
-
-    contain: contain;
-    overflow-x: scroll;
-}
-
-@media (max-width: 767px) {
-    .qr_scanner .qr_scanner_viewfinder {
-        /* outline: dashed medium red; */
-        min-width: 80vw;
-        /* width: 100%; */
-        /* max-width: 100%; */
-        /* max-width: 450px; */
-        max-width: 100vw;
-
-        margin: 0;
-        padding: 0;
-    }
-}
-</style>
diff --git a/src/lib/old_e_app_codemirror.svelte b/src/lib/old_e_app_codemirror.svelte
deleted file mode 100644
index 5944a4d4..00000000
--- a/src/lib/old_e_app_codemirror.svelte
+++ /dev/null
@@ -1,140 +0,0 @@
-<script lang="ts">
-// *** Import Svelte version 5 specific
-import { browser } from '$app/environment';
-
-// BEGIN: CodeMirror
-
-import {basicSetup} from "codemirror";
-import { EditorView, keymap, placeholder as placeholderExt } from "@codemirror/view";
-
-import { EditorState, StateEffect, type Extension } from "@codemirror/state";
-import { indentWithTab } from "@codemirror/commands";
-
-import {
-        defaultHighlightStyle, syntaxHighlighting, indentOnInput,
-        bracketMatching, foldGutter, foldKeymap
-    } from "@codemirror/language";
-import { indentUnit, type LanguageSupport } from "@codemirror/language";
-import {languages} from "@codemirror/language-data"
-import { css } from "@codemirror/lang-css";
-import { html } from "@codemirror/lang-html";
-import {javascript} from "@codemirror/lang-javascript";
-import {markdown} from "@codemirror/lang-markdown";
-import { oneDark } from "@codemirror/theme-one-dark";
-
-// END: CodeMirror
-
-
-interface Props {
-    log_lvl?: number;
-    content: string; // Actual text content to be displayed in the editor
-    classes: string;
-    basic: boolean;
-    useTab: boolean;
-    tabSize: number;
-}
-
-let {
-    log_lvl = 0,
-    content = 'TEST content for CodeMirror',
-    classes = '',
-    basic = true,
-    useTab = true,
-    tabSize = 4,
-}: Props = $props();
-
-let state_extensions = [
-        // ...get_base_extensions(basic, useTab, tabSize, lineWrapping, placeholder, editable, readonly, lang),
-        // ...get_theme(theme, styles),
-        basicSetup,
-        keymap.of([indentWithTab]),
-        javascript(),
-        markdown({codeLanguages: languages})
-        // ...extensions,
-    ];
-
-let editor_view: EditorView;
-let element: HTMLElement|undefined = $state();
-
-if (browser) {
-    // editor_view = create_editor_view();
-
-
-    let test_view = new EditorView({
-        doc: "Hello\n\n```javascript\nlet x = 'y'\n```",
-        extensions: [
-            basicSetup,
-            markdown({codeLanguages: languages})
-        ],
-        parent: document.getElementById('codemirror-view') ?? element,
-        state: EditorState.create({
-            doc: "Hello\n\n```javascript\nlet x = 'y'\n```",
-            extensions: [
-                basicSetup,
-                markdown({codeLanguages: languages})
-            ],
-        }),
-    })
-}
-
-function create_editor_view(): EditorView {
-    return new EditorView({
-        doc: content,
-        extensions: [basicSetup, javascript()],
-        // parent: element,
-        parent: document.getElementById('codemirror-view') ?? element,
-        state: create_editor_state(content),
-    });
-}
-
- function create_editor_state(value: string | null | undefined): EditorState {
-    return EditorState.create({
-        doc: value ?? undefined,
-        extensions: state_extensions,
-    });
-}
-
-function update(value: string | null | undefined): void {
-    if (first_update) {
-        first_update = false;
-        return;
-    }
-
-    if (update_from_state) {
-        update_from_state = false;
-        return;
-    }
-
-    update_from_prop = true;
-
-    editor_view.setState(create_editor_state(value));
-
-    update_from_prop = false;
-}
-
-
- function handle_change(): void {
-    const new_value = editor_view.state.doc.toString();
-    if (new_value === content) return;
-
-    update_from_state = true;
-
-    content = new_value;
-}
-</script>
-
-
-
-{#if browser}
-    <!-- <div class="codemirror-wrapper {classes}" bind:this={element} ></div> -->
-    <div id="codemirror-view" class="codemirror-wrapper {classes}" ></div>
-{:else}
-    <div class="scm-waiting {classes}">
-        <div class="scm-waiting__loading scm-loading">
-            <!-- <div class="scm-loading__spinner" /> -->
-            <p class="scm-loading__text">Loading editor...</p>
-        </div>
-
-        <pre class="scm-pre cm-editor">{content}</pre>
-    </div>
-{/if}
\ No newline at end of file
diff --git a/src/lib/old_e_app_codemirror_sv4.svelte b/src/lib/old_e_app_codemirror_sv4.svelte
deleted file mode 100644
index 5b90f5d9..00000000
--- a/src/lib/old_e_app_codemirror_sv4.svelte
+++ /dev/null
@@ -1,226 +0,0 @@
-<script lang="ts" context="module">
-    export type ThemeSpec = Record<string, StyleSpec>;
-    export type StyleSpec = {
-        [propOrSelector: string]: string | number | StyleSpec | null;
-    };
-</script>
-
-<script lang="ts">
-    import { createEventDispatcher, onDestroy, onMount } from "svelte";
-    import { basicSetup } from "codemirror";
-    import { EditorView, keymap, placeholder as placeholderExt } from "@codemirror/view";
-    import { EditorState, StateEffect, type Extension } from "@codemirror/state";
-    import { indentWithTab } from "@codemirror/commands";
-    import { indentUnit, type LanguageSupport } from "@codemirror/language";
-    import { debounce } from "./util";
-
-    let classes = "";
-    export { classes as class };
-    export let value: string | null | undefined = "";
-
-    export let basic = true;
-    export let lang: LanguageSupport | null | undefined = undefined;
-    export let theme: Extension | null | undefined = undefined;
-    export let extensions: Extension[] = [];
-
-    export let useTab = true;
-    export let tabSize = 2;
-
-    export let styles: ThemeSpec | null | undefined = undefined;
-    export let lineWrapping = false;
-    export let editable = true;
-    export let readonly = false;
-    export let placeholder: string | HTMLElement | null | undefined = undefined;
-
-    export let nodebounce = false;
-
-    const is_browser = typeof window !== "undefined";
-    const dispatch = createEventDispatcher<{ change: string, ready: EditorView, reconfigure: EditorView }>();
-
-    let element: HTMLDivElement;
-    let view: EditorView;
-
-    let update_from_prop = false;
-    let update_from_state = false;
-    let first_config = true;
-    let first_update = true;
-
-    $: state_extensions = [
-        ...get_base_extensions(basic, useTab, tabSize, lineWrapping, placeholder, editable, readonly, lang),
-        ...get_theme(theme, styles),
-        ...extensions,
-    ];
-
-    $: view && update(value);
-    $: view && state_extensions && reconfigure();
-
-    $: on_change = nodebounce ? handle_change : debounce(handle_change, 300);
-
-    onMount(() => {
-        view = create_editor_view();
-        dispatch('ready', view);
-    });
-    onDestroy(() => view?.destroy());
-
-    function create_editor_view(): EditorView {
-        return new EditorView({
-            parent: element,
-            state: create_editor_state(value),
-            dispatch(transaction) {
-                view.update([transaction]);
-
-                if (!update_from_prop && transaction.docChanged) {
-                    on_change();
-                }
-            },
-        });
-    }
-
-    function reconfigure(): void {
-        if (first_config) {
-            first_config = false;
-            return;
-        }
-
-        view.dispatch({
-            effects: StateEffect.reconfigure.of(state_extensions),
-        });
-
-        dispatch('reconfigure', view);
-    }
-
-    function update(value: string | null | undefined): void {
-        if (first_update) {
-            first_update = false;
-            return;
-        }
-
-        if (update_from_state) {
-            update_from_state = false;
-            return;
-        }
-
-        update_from_prop = true;
-
-        view.setState(create_editor_state(value));
-
-        update_from_prop = false;
-    }
-
-    function handle_change(): void {
-        const new_value = view.state.doc.toString();
-        if (new_value === value) return;
-
-        update_from_state = true;
-
-        value = new_value;
-        dispatch("change", value);
-    }
-
-    function create_editor_state(value: string | null | undefined): EditorState {
-        return EditorState.create({
-            doc: value ?? undefined,
-            extensions: state_extensions,
-        });
-    }
-
-    function get_base_extensions(
-        basic: boolean,
-        useTab: boolean,
-        tabSize: number,
-        lineWrapping: boolean,
-        placeholder: string | HTMLElement | null | undefined,
-        editable: boolean,
-        readonly: boolean,
-        lang: LanguageSupport | null | undefined
-    ): Extension[] {
-        const extensions: Extension[] = [
-            indentUnit.of(" ".repeat(tabSize)),
-            EditorView.editable.of(editable),
-            EditorState.readOnly.of(readonly),
-        ];
-
-        if (basic) extensions.push(basicSetup);
-        if (useTab) extensions.push(keymap.of([indentWithTab]));
-        if (placeholder) extensions.push(placeholderExt(placeholder));
-        if (lang) extensions.push(lang);
-        if (lineWrapping) extensions.push(EditorView.lineWrapping);
-
-        return extensions;
-    }
-
-    function get_theme(theme: Extension | null | undefined, styles: ThemeSpec | null | undefined): Extension[] {
-        const extensions: Extension[] = [];
-        if (styles) extensions.push(EditorView.theme(styles));
-        if (theme) extensions.push(theme);
-        return extensions;
-    }
-</script>
-
-{#if is_browser}
-    <div class="codemirror-wrapper {classes}" bind:this={element}></div>
-{:else}
-    <div class="scm-waiting {classes}">
-        <div class="scm-waiting__loading scm-loading">
-            <div class="scm-loading__spinner"></div>
-            <p class="scm-loading__text">Loading editor...</p>
-        </div>
-
-        <pre class="scm-pre cm-editor">{value}</pre>
-    </div>
-{/if}
-
-<style>
-    .codemirror-wrapper :global(.cm-focused) {
-        outline: none;
-    }
-
-    .scm-waiting {
-        position: relative;
-    }
-    .scm-waiting__loading {
-        position: absolute;
-        top: 0;
-        left: 0;
-        bottom: 0;
-        right: 0;
-        background-color: rgba(255, 255, 255, 0.5);
-    }
-
-    .scm-loading {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-    }
-    .scm-loading__spinner {
-        width: 1rem;
-        height: 1rem;
-        border-radius: 100%;
-        border: solid 2px #000;
-        border-top-color: transparent;
-        margin-right: 0.75rem;
-        animation: spin 1s linear infinite;
-    }
-    .scm-loading__text {
-        font-family: sans-serif;
-    }
-    .scm-pre {
-        font-size: 0.85rem;
-        font-family: monospace;
-        tab-size: 2;
-        -moz-tab-size: 2;
-        resize: none;
-        pointer-events: none;
-        user-select: none;
-        overflow: auto;
-    }
-
-    @keyframes spin {
-        0% {
-            transform: rotate(0deg);
-        }
-        100% {
-            transform: rotate(360deg);
-        }
-    }
-</style>
\ No newline at end of file