Elizabeth M Reyna, Tulane University

Elizabeth M Reyna

Senior Program Coordinator
Jones Hall 210D
504-865-5719

Biography

Elizabeth M Reyna (Liz) joined The Department of Classical Studies at Tulane University in 2011 as their Administrative Secretary. Years later, she was promoted to Executive Secretary in 2014 and Senior Program Coordinator in 2022. She also serves as the Project Manager of the Pompeii 1.14 Project, an excavation directed by colleague, Dr. Allison Emmerson.

"I love my Crazy Classicists, faculty and students alike. I am proud to call Tulane Classics my home."

Liz previously worked for Harry S. Truman College: City Colleges of Chicago, Albany Park Community Center: ESL Center, and Kumon Center: After School Math and Reading Program.

Outside of her work life, Liz strives to spread Cystic Fibrosis awareness by fundraising for The Cystic Fibrosis Foundation. Along with gardening and crafts, Liz loves to strut with the Bayou Babes down the parade route.

Awards

Elizabeth Marie Reyna, Department of Classical Studies, Tulane University
 

 

“Elizabeth Reyna, executive secretary for the Department of Classical Studies at the School of Liberal Arts, poses with Riptide. Reyna has helped to develop and transform the department’s workflow with an exceptional work ethic and management while providing joy and cheer to her colleagues, with one writing, “With her unflagging optimism, Liz brings out the best in us. Liz is a joy to be around, and she makes us all better people for knowing her.”

 

Elizabeth Marie Reyna, Tulane University Department of Classical Studies
 

 

Elizabeth Marie Reyna, or Liz, as we know her, is the winner of the 2020 SLA Staff Award. Liz came to Tulane in August 2011 as Administrative Secretary for Classical Studies. After three years of excellent service, she was promoted to Executive Secretary, the position she currently holds.

Liz has modernized the Classical Studies office workflow by digitizing documents and filing systems, and has brought our website into the new platform. With an eye for detail, Liz keeps the faculty well informed about the budget, navigates the Concur system like a pro, and manages departmental expenses and supply needs with efficiency. She even gave faculty work spaces the “Marie Kondo treatment” long before that was a cool trend.

Liz is responsible for the logistics and marketing of all department events, including the annual Dennis A. Georges Lecture in Hellenic Culture. For these events, she has developed checklists and time-lines that she revises each year as needed. Liz does more than reserve the event spaces and set up receptions, she attends the events, which means staying on campus well beyond the usual 5 pm end of the workday. Lecture coordinator last year, Emilia Oddo, offers these remarks: “On multiple occasions, I have been impressed at the positive impact that Liz has had on our speakers, who have praised her poise, her wit, her helpfulness.”

According to the department nomination letter “The most important aspect of Liz’s presence in our office is that she sparks joy.” As Allison Emmerson comments: “Liz never overreacts or creates stress. Even in a high-pressure situation, she finds ways to do whatever needs to be done without any drama. She knows how to prioritize and how to separate tasks that are important from those that are not, and she facilitates the work of the faculty so we can focus on the important things.”

Liz brings a warmth and bubbly enthusiasm to everything she does, embracing life among classicists with unparalleled gusto, referring to her faculty as the “Classy Classicists.” She has also made New Orleans her true home, dancing with the Muff-a-lottas each Mardi Gras season, and she challenges us all to do more and be better people, especially in her work for the Cystic Fibrosis Foundation. Liz truly embodies the famous phrase from Horace, Odes 1.11: carpe diem –Pluck the day, as she lives and works in the moment, not frustrated about what might be or has been.

 

Research

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tulane Community Hurricane Prep Hub</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <!-- Leaflet CSS for mapping -->
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin=""/>
    <style>
        body {
            font-family: 'Inter', sans-serif;
        }
        .tab-content {
            display: none;
        }
        .tab-content.active {
            display: block;
        }
        /* Tulane Green Color */
        .tulane-green { color: rgb(0, 103, 71); }
        .bg-tulane-green { background-color: rgb(0, 103, 71); }
        .border-tulane-green { border-color: rgb(0, 103, 71); }
        
        .tab.active {
            border-bottom-color: rgb(0, 103, 71);
            color: rgb(0, 103, 71);
        }
        #map {
            height: 500px;
            width: 100%;
            border-radius: 0.5rem;
        }
    </style>
</head>
<body class="bg-gray-100 text-gray-800">

    <div class="container mx-auto p-4 md:p-8 max-w-6xl">
        <header class="text-center mb-8">
            <h1 class="text-4xl md:text-5xl font-bold tulane-green">Tulane Community Prep Hub</h1>
            <p class="text-gray-600 mt-2">Your all-in-one guide to staying safe during a hurricane.</p>
        </header>

        <!-- Home Page Content -->
        <div id="home-content" class="bg-white p-8 rounded-lg shadow-md mb-8 text-center">
            <h2 class="text-3xl font-bold tulane-green mb-4">Welcome to Your Prep Hub</h2>
            <p class="text-lg text-gray-700 max-w-3xl mx-auto">
                This site is a comprehensive resource to help the Tulane community prepare for, endure, and recover from a hurricane. Use the checklists below to track your progress for evacuating, securing your workspace and home, and returning safely. Stay informed with real-time weather alerts, lodging information, and route guidance.
            </p>
        </div>


        <!-- Tabs Navigation -->
        <div class="mb-8 border-b border-gray-200">
            <nav class="flex flex-col items-center -mb-px" aria-label="Tabs">
                <!-- First Row -->
                <div class="flex justify-center flex-wrap">
                    <button class="tab text-lg font-medium py-4 px-6 border-b-2 border-transparent hover:border-gray-300 hover:text-gray-600 flex-shrink-0" data-tab="evacuation-list">
                        <i class="fas fa-person-running mr-2"></i>Evacuation List
                    </button>
                    <button class="tab text-lg font-medium py-4 px-6 border-b-2 border-transparent hover:border-gray-300 hover:text-gray-600 flex-shrink-0" data-tab="workspace">
                        <i class="fas fa-briefcase mr-2"></i>Secure Workspace
                    </button>
                    <button class="tab text-lg font-medium py-4 px-6 border-b-2 border-transparent hover:border-gray-300 hover:text-gray-600 flex-shrink-0" data-tab="lock-down">
                        <i class="fas fa-house-lock mr-2"></i>Lock Down Home
                    </button>
                </div>
                <!-- Second Row -->
                <div class="flex justify-center flex-wrap">
                    <button class="tab text-lg font-medium py-4 px-6 border-b-2 border-transparent hover:border-gray-300 hover:text-gray-600 flex-shrink-0" data-tab="weather">
                        <i class="fas fa-cloud-sun-rain mr-2"></i>Weather
                    </button>
                    <button class="tab text-lg font-medium py-4 px-6 border-b-2 border-transparent hover:border-gray-300 hover:text-gray-600 flex-shrink-0" data-tab="lodging">
                        <i class="fas fa-hotel mr-2"></i>Lodging
                    </button>
                    <button class="tab text-lg font-medium py-4 px-6 border-b-2 border-transparent hover:border-gray-300 hover:text-gray-600 flex-shrink-0" data-tab="routes">
                        <i class="fas fa-road mr-2"></i>Routes
                    </button>
                     <button class="tab text-lg font-medium py-4 px-6 border-b-2 border-transparent hover:border-gray-300 hover:text-gray-600 flex-shrink-0" data-tab="re-entry-list">
                        <i class="fas fa-house-circle-check mr-2"></i>Safe Re-entry
                    </button>
                </div>
            </nav>
        </div>

        <!-- Tab Content -->
        <main id="main-content" class="hidden">
            <!-- Evacuation List -->
            <div id="evacuation-list" class="tab-content">
                <div class="bg-white p-6 rounded-lg shadow-md">
                    <button class="return-home-btn float-right text-blue-500 hover:text-blue-700 font-semibold"><i class="fas fa-home mr-2"></i>Return to Home</button>
                    <h2 class="text-2xl font-bold mb-4">Evacuation Kit Checklist</h2>
                    <p class="mb-6 text-gray-600">Ensure you have these essentials packed and ready to go.</p>
                    <div id="evacuation-checklist" class="space-y-4"></div>
                </div>
            </div>
            
            <!-- Secure Workspace -->
            <div id="workspace" class="tab-content">
                <div class="bg-white p-6 rounded-lg shadow-md">
                    <button class="return-home-btn float-right text-blue-500 hover:text-blue-700 font-semibold"><i class="fas fa-home mr-2"></i>Return to Home</button>
                    <h2 class="text-2xl font-bold mb-4">Secure Your Workspace</h2>
                    <p class="mb-6 text-gray-600">Take these steps to protect your office or workspace.</p>
                    <div id="workspace-checklist" class="space-y-4"></div>
                </div>
            </div>

            <!-- Lock Down Home -->
            <div id="lock-down" class="tab-content">
                <div class="bg-white p-6 rounded-lg shadow-md">
                    <button class="return-home-btn float-right text-blue-500 hover:text-blue-700 font-semibold"><i class="fas fa-home mr-2"></i>Return to Home</button>
                    <h2 class="text-2xl font-bold mb-4">Home Lockdown Checklist</h2>
                    <p class="mb-6 text-gray-600">Secure your home to minimize potential damage.</p>
                    <div id="lockdown-checklist" class="space-y-4"></div>
                </div>
            </div>

            <!-- Weather Tracker -->
            <div id="weather" class="tab-content">
                <div class="bg-white p-6 rounded-lg shadow-md">
                    <button class="return-home-btn float-right text-blue-500 hover:text-blue-700 font-semibold"><i class="fas fa-home mr-2"></i>Return to Home</button>
                    <h2 class="text-2xl font-bold mb-4">Live Weather Alerts</h2>
                    <p class="mb-6 text-gray-600">Fetching active tropical storm and hurricane alerts from the National Weather Service.</p>
                    <div id="weather-alerts-container" class="space-y-4">
                        <!-- Weather alerts will be injected here -->
                    </div>
                </div>
            </div>

            <!-- Lodging Options -->
            <div id="lodging" class="tab-content">
                 <div class="bg-white p-6 rounded-lg shadow-md">
                    <button class="return-home-btn float-right text-blue-500 hover:text-blue-700 font-semibold"><i class="fas fa-home mr-2"></i>Return to Home</button>
                    <h2 class="text-2xl font-bold mb-4">Evacuation Lodging Search</h2>
                    <p class="mb-6 text-gray-600">Use this tool to find potential lodging options. This is a simulation and does not reflect live availability.</p>
                    <form id="lodging-search-form" class="flex flex-col sm:flex-row gap-4 mb-6">
                        <input type="text" id="city-search-input" placeholder="Enter an evacuation city (e.g., Houston)" class="flex-grow p-3 border border-gray-300 rounded-md focus:ring-2 focus:ring-tulane-green focus:outline-none">
                        <button type="submit" class="bg-tulane-green text-white font-semibold py-3 px-6 rounded-md hover:opacity-90 transition-opacity">
                            <i class="fas fa-search mr-2"></i>Search
                        </button>
                    </form>
                    <div id="lodging-results-container">
                        <p class="text-center text-gray-500">Enter a city to see simulated hotel results.</p>
                    </div>
                </div>
            </div>

            <!-- Road Closures -->
            <div id="routes" class="tab-content">
                 <div class="bg-white p-6 rounded-lg shadow-md">
                    <button class="return-home-btn float-right text-blue-500 hover:text-blue-700 font-semibold"><i class="fas fa-home mr-2"></i>Return to Home</button>
                    <h2 class="text-2xl font-bold mb-4">Evacuation Routes</h2>
                    <p class="mb-6 text-gray-600">This map shows a sample evacuation route from New Orleans. This is for demonstration purposes only.</p>
                    <div id="map" data-initialized="false"></div>
                </div>
            </div>

            <!-- Safe Re-entry List -->
            <div id="re-entry-list" class="tab-content">
                <div class="bg-white p-6 rounded-lg shadow-md">
                    <button class="return-home-btn float-right text-blue-500 hover:text-blue-700 font-semibold"><i class="fas fa-home mr-2"></i>Return to Home</button>
                    <h2 class="text-2xl font-bold mb-4">Safe Re-entry Checklist</h2>
                    <p class="mb-6 text-gray-600">Follow these steps to ensure your safety when returning home after the storm.</p>
                    <div id="re-entry-checklist" class="space-y-4"></div>
                </div>
            </div>
        </main>

        <footer class="text-center mt-12">
            <p class="text-gray-500">Stay safe and prepared. Your User ID (for data persistence): <span id="userId" class="font-mono"></span></p>
        </footer>
    </div>

    <!-- Leaflet JS for mapping -->
    <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
    
    <script type="module">
        import { initializeApp } from "https://www.gstatic.com/firebasejs/11.6.1/firebase-app.js";
        import { getAuth, signInAnonymously, onAuthStateChanged, signInWithCustomToken } from "https://www.gstatic.com/firebasejs/11.6.1/firebase-auth.js";
        import { getFirestore, doc, setDoc, onSnapshot } from "https://www.gstatic.com/firebasejs/11.6.1/firebase-firestore.js";

        const firebaseConfig = typeof __firebase_config !== 'undefined' ? JSON.parse(__firebase_config) : { apiKey: "YOUR_API_KEY", authDomain: "YOUR_AUTH_DOMAIN", projectId: "YOUR_PROJECT_ID" };
        const appId = typeof __app_id !== 'undefined' ? __app_id : 'hurricane-prep-default';
        const initialAuthToken = typeof __initial_auth_token !== 'undefined' ? __initial_auth_token : null;
        
        const app = initializeApp(firebaseConfig);
        const auth = getAuth(app);
        const db = getFirestore(app);

        let userId = null;
        let map = null;

        const evacuationItems = [
            { id: 'water', text: 'Water (1 gallon per person per day)', category: 'Basics' },
            { id: 'food', text: 'Non-perishable food (3-day supply)', category: 'Basics' },
            { id: 'flashlight', text: 'Flashlight and extra batteries', category: 'Basics' },
            { id: 'first-aid', text: 'First-aid kit', category: 'Basics' },
            { id: 'medications', text: 'Prescription medications', category: 'Health' },
            { id: 'documents', text: 'Important documents in a waterproof bag', category: 'Personal' },
            { id: 'cash', text: 'Cash or traveler\'s checks', category: 'Personal' },
            { id: 'radio', text: 'NOAA Weather Radio', category: 'Basics' },
            { id: 'phone', text: 'Charged cell phone with backup battery', category: 'Communication' },
            { id: 'pet-supplies', text: 'Pet supplies', category: 'Pets' },
        ];

        const workspaceItems = [
            { id: 'secure-loose', text: 'Secure loose items' },
            { id: 'move-electronics', text: 'Move all items, especially electronics, away from windows' },
            { id: 'lift-equipment', text: 'Lift equipment off the floor, if possible' },
            { id: 'cover-items', text: 'Cover anything you can\'t move with plastic sheeting and tape it down' },
            { id: 'lock-doors', text: 'Close and lock all doors, windows, and filing cabinets' },
            { id: 'backup-computer', text: 'Back up your computer' },
            { id: 'unplug-all', text: 'Unplug everything' },
        ];

        const lockdownItems = [
            { id: 'yard-debris', text: 'Clear yard of potential projectiles' },
            { id: 'gutters', text: 'Clean out gutters and downspouts' },
            { id: 'propane', text: 'Secure propane tanks' },
            { id: 'freezer', text: 'Set freezer/refrigerator to coldest setting' },
            { id: 'unplug', text: 'Unplug sensitive electronics' },
            { id: 'valuables', text: 'Move valuables to a higher floor' },
            { id: 'secure-windows', text: 'Secure windows and doors with shutters, plywood, or impact-resistant coverings'},
            { id: 'trim-branches', text: 'Trim dead or weak tree branches near the house and power lines'},
            { id: 'fuel-vehicles', text: 'Fuel all vehicles and generators'},
            { id: 'pool-prep', text: 'For pools: Super-chlorinate, turn off power, remove all loose items, and consider partially draining (consult pool professional)'},
        ];
        
        const reEntryItems = [
            { id: 'official-clearance', text: 'Wait for official clearance' },
            { id: 'power-lines', text: 'Watch for downed power lines' },
            { id: 'gas-leaks', text: 'Check for gas leaks' },
            { id: 'structural-damage', text: 'Inspect for structural damage' },
            { id: 'floodwaters', text: 'Avoid floodwaters' },
            { id: 'protective-gear', text: 'Use protective gear' },
        ];

        const DOM = {
            homeContent: document.getElementById('home-content'),
            mainContent: document.getElementById('main-content'),
            tabs: document.querySelectorAll('.tab'),
            tabContents: document.querySelectorAll('.tab-content'),
            returnHomeBtns: document.querySelectorAll('.return-home-btn'),
            evacuationChecklist: document.getElementById('evacuation-checklist'),
            workspaceChecklist: document.getElementById('workspace-checklist'),
            lockdownChecklist: document.getElementById('lockdown-checklist'),
            reEntryChecklist: document.getElementById('re-entry-checklist'),
            userIdSpan: document.getElementById('userId'),
            weatherContainer: document.getElementById('weather-alerts-container'),
            lodgingForm: document.getElementById('lodging-search-form'),
            lodgingInput: document.getElementById('city-search-input'),
            lodgingResults: document.getElementById('lodging-results-container'),
            mapContainer: document.getElementById('map'),
        };

        async function saveChecklistState(listId, state) {
            if (!userId) return;
            const docRef = doc(db, "artifacts", appId, "users", userId, "checklists", listId);
            try {
                await setDoc(docRef, { checkedItems: state });
            } catch (error) {
                console.error("Error saving checklist state: ", error);
            }
        }

        function listenToChecklistState(listId, items, container) {
            if (!userId || !container) return;
            const docRef = doc(db, "artifacts", appId, "users", userId, "checklists", listId);
            onSnapshot(docRef, (docSnap) => {
                const checkedItems = docSnap.exists() ? docSnap.data().checkedItems || [] : [];
                renderChecklist(container, items, listId, checkedItems);
            });
        }

        function renderChecklist(container, items, listId, checkedItems = []) {
            if (!container) return; // Guard against null container
            container.innerHTML = '';
            items.forEach(item => {
                const isChecked = checkedItems.includes(item.id);
                const itemEl = document.createElement('div');
                itemEl.className = `flex items-center p-3 bg-gray-50 rounded-md transition-all duration-200 ${isChecked ? 'bg-green-100 text-gray-500' : ''}`;
                itemEl.innerHTML = `
                    <input id="${listId}-${item.id}" type="checkbox" ${isChecked ? 'checked' : ''} class="h-5 w-5 rounded border-gray-300 text-green-600 focus:ring-green-500 cursor-pointer">
                    <label for="${listId}-${item.id}" class="ml-3 block text-md ${isChecked ? 'line-through' : ''} flex-1 cursor-pointer">${item.text}</label>
                `;
                container.appendChild(itemEl);
                itemEl.querySelector('input[type="checkbox"]').addEventListener('change', () => {
                    const currentState = Array.from(container.querySelectorAll('input:checked')).map(cb => cb.id.split('-')[1]);
                    saveChecklistState(listId, currentState);
                });
            });
        }

        function showLoading(container, message) {
            container.innerHTML = `
                <div class="text-center py-8">
                    <i class="fas fa-spinner fa-spin text-4xl tulane-green"></i>
                    <p class="mt-4 text-lg text-gray-500">${message}</p>
                </div>`;
        }
        
        async function fetchWeatherAlerts() {
            showLoading(DOM.weatherContainer, 'Fetching live alerts...');
            const alertTypes = ['Hurricane%20Warning', 'Hurricane%20Watch', 'Tropical%20Storm%20Warning', 'Tropical%20Storm%20Watch'].join(',');
            const url = `https://api.weather.gov/alerts/active?event=${alertTypes}`;
            try {
                const response = await fetch(url, { headers: { 'User-Agent': '(tulane.edu, student.project@tulane.edu)' } });
                if (!response.ok) throw new Error(`NWS API Error: ${response.status}`);
                const data = await response.json();
                renderWeatherAlerts(data.features);
            } catch (error) {
                console.error("Failed to fetch weather alerts:", error);
                DOM.weatherContainer.innerHTML = `<p class="text-center text-red-500">Could not load weather alerts. Please try again later.</p>`;
            }
        }

        function renderWeatherAlerts(alerts) {
            DOM.weatherContainer.innerHTML = '';
            if (alerts.length === 0) {
                DOM.weatherContainer.innerHTML = `<p class="text-center text-green-600 font-semibold">No active hurricane or tropical storm alerts for the US at this time.</p>`;
                return;
            }
            alerts.forEach(alert => {
                const { event, headline, description, areaDesc } = alert.properties;
                const card = document.createElement('div');
                card.className = 'border border-red-200 bg-red-50 rounded-lg p-4 shadow-sm';
                card.innerHTML = `
                    <h3 class="font-bold text-xl text-red-800">${event}</h3>
                    <p class="text-red-700 font-semibold my-1">${headline}</p>
                    <p class="text-sm text-gray-600 mt-2"><strong>Affected Areas:</strong> ${areaDesc.replace(/;/g, ', ')}</p>
                `;
                DOM.weatherContainer.appendChild(card);
            });
        }
        
        function handleLodgingSearch(event) {
            event.preventDefault();
            const city = DOM.lodgingInput.value.trim();
            if (!city) {
                DOM.lodgingResults.innerHTML = `<p class="text-center text-red-500">Please enter a city name.</p>`;
                return;
            }
            showLoading(DOM.lodgingResults, `Searching for hotels in ${city}...`);
            setTimeout(() => {
                renderFakeLodging(city);
            }, 1500); // Simulate network delay
        }

        function renderFakeLodging(city) {
            DOM.lodgingResults.innerHTML = '<div class="space-y-4"></div>';
            const resultsContainer = DOM.lodgingResults.querySelector('div');
            const hotelTypes = ['Inn', 'Suites', 'Hotel & Spa', 'Motor Lodge', 'Plaza'];
            const chains = ['Evacuee', 'Traveler\'s', 'Safe Haven', 'Storm Shield', 'Route'];
            for (let i = 0; i < 5; i++) {
                const name = `${chains[Math.floor(Math.random() * chains.length)]} ${hotelTypes[Math.floor(Math.random() * hotelTypes.length)]}`;
                const price = (Math.random() * 200 + 99).toFixed(2);
                const rating = (Math.random() * 1.5 + 3.5).toFixed(1);
                const card = document.createElement('div');
                card.className = 'border border-gray-200 rounded-lg p-4 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4';
                card.innerHTML = `
                    <div>
                        <h4 class="font-bold text-lg">${name}</h4>
                        <p class="text-gray-600">${rating} <i class="fas fa-star text-yellow-500"></i> | <span class="font-semibold text-green-700">$${price}</span> / night</p>
                    </div>
                    <a href="#" class="bg-green-500 text-white font-semibold py-2 px-4 rounded-md hover:bg-green-600 transition-colors whitespace-nowrap">Book Now</a>
                `;
                resultsContainer.appendChild(card);
            }
        }

        function initMap() {
            if (DOM.mapContainer.dataset.initialized === 'true') return;
            const newOrleans = [29.9511, -90.0715];
            map = L.map('map').setView(newOrleans, 8);
            L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
            }).addTo(map);

            const tulaneMarker = L.marker(newOrleans).addTo(map)
                .bindPopup('<b>Tulane University</b><br>Starting Point.')
                .openPopup();
            
            const houston = [29.7604, -95.3698];
            const routeLatLngs = [newOrleans, houston];
            
            const routeLine = L.polyline(routeLatLngs, {color: 'rgb(0, 103, 71)', weight: 5}).addTo(map);
            map.fitBounds(routeLine.getBounds().pad(0.1));

            DOM.mapContainer.dataset.initialized = 'true';
        }

        function returnToHome() {
            DOM.mainContent.classList.add('hidden');
            DOM.homeContent.style.display = 'block';
            DOM.tabs.forEach(t => t.classList.remove('active'));
            DOM.tabContents.forEach(content => {
                content.classList.remove('active');
            });
        }
        
        DOM.tabs.forEach(tab => {
            tab.addEventListener('click', () => {
                DOM.homeContent.style.display = 'none';
                DOM.mainContent.classList.remove('hidden');

                DOM.tabs.forEach(t => t.classList.remove('active'));
                tab.classList.add('active');
                const target = tab.getAttribute('data-tab');
                DOM.tabContents.forEach(content => {
                    content.classList.remove('active');
                    if (content.id === target) {
                        content.classList.add('active');
                    }
                });

                if (target === 'weather' && !DOM.weatherContainer.hasChildNodes()) {
                    fetchWeatherAlerts();
                }

                if (target === 'routes') {
                    setTimeout(() => initMap(), 10);
                }
            });
        });

        DOM.returnHomeBtns.forEach(btn => {
            btn.addEventListener('click', returnToHome);
        });
        
        onAuthStateChanged(auth, (user) => {
            if (user) {
                userId = user.uid;
                DOM.userIdSpan.textContent = userId;
                listenToChecklistState('evacuation', evacuationItems, DOM.evacuationChecklist);
                listenToChecklistState('workspace', workspaceItems, DOM.workspaceChecklist);
                listenToChecklistState('lockdown', lockdownItems, DOM.lockdownChecklist);
                listenToChecklistState('re-entry', reEntryItems, DOM.reEntryChecklist);
            } else {
                DOM.userIdSpan.textContent = "Not signed in";
                renderChecklist(DOM.evacuationChecklist, evacuationItems, 'evacuation');
                renderChecklist(DOM.workspaceChecklist, workspaceItems, 'workspace');
                renderChecklist(DOM.lockdownChecklist, lockdownItems, 'lockdown');
                renderChecklist(DOM.reEntryChecklist, reEntryItems, 're-entry');
            }
        });

        async function authenticateUser() {
            try {
                if (initialAuthToken) {
                    await signInWithCustomToken(auth, initialAuthToken);
                } else {
                    await signInAnonymously(auth);
                }
            } catch (error) {
                console.error("Authentication failed:", error);
                if (error.code === 'auth/invalid-custom-token') {
                    try {
                        await signInAnonymously(auth);
                    } catch (anonError) {
                        console.error("Anonymous sign-in also failed:", anonError);
                    }
                }
            }
        }
        
        // Initializations
        DOM.lodgingForm.addEventListener('submit', handleLodgingSearch);
        authenticateUser();

    </script>
</body>
</html>