Offline use

[dave1010]

Service worker

https://chatgpt.com/c/31780899-54e4-4039-958d-93f1cb3b9785

const { GenerateSW } = require('workbox-webpack-plugin');

CacheFirst on assets.

For the schedule, then attempt to load it from the network. Something like this:

const DATA_URL = 'https://www.emfcamp.org/schedule/2024.json';
const CACHE_NAME = 'your-cache-name-v1';

// Function to fetch from cache
async function fetchFromCache() {
    const cache = await caches.open(CACHE_NAME);
    const cachedResponse = await cache.match(DATA_URL);
    if (cachedResponse) {
        return cachedResponse.json();
    }
    return null;
}

// Function to fetch from network and update cache
async function fetchFromNetworkAndUpdateCache() {
    try {
        const response = await fetch(DATA_URL);
        if (response.ok) {
            const data = await response.json();
            const cache = await caches.open(CACHE_NAME);
            cache.put(DATA_URL, new Response(JSON.stringify(data)));
            return data;
        }
    } catch (error) {
        console.error('Network fetch failed', error);
    }
    return null;
}

// Main function to load data
async function loadData() {
    // Load data from cache first
    const cachedData = await fetchFromCache();
    if (cachedData) {
        updateUI(cachedData); // Function to update the UI with data
    }

    // Then try to fetch fresh data from the network
    const networkData = await fetchFromNetworkAndUpdateCache();
    if (networkData) {
        updateUI(networkData); // Update the UI with fresh data
    }
}

// Call the main function to load data on page load
window.addEventListener('load', () => {
    loadData();
});

// Function to update the UI with data
function updateUI(data) {
    // Implement your UI update logic here
    console.log('Data:', data);
}