Ekapp/skolehjem/public/serviceWorkerRegistration.js

//Service Worker Registration
let isSubscribed = false;
let swRegistration = null;
const applicationServerPublicKey = 'BHTLd76Yura3OIkZ52f4qh3G_i8RY3kvyOooVJXFVGle04JNW4d3JvwYQJ1JOZ9Y_uuZFsB_URqrlHQFhQ01V6M';
/*
Make sure that we support service worker :)
 */


if('serviceWorker' in navigator){
    window.addEventListener('load', () => {
        navigator.serviceWorker
        .register('/serviceWorkerCachedWebpags.js')
            .then(reg => {
                console.log("Service Worker registered")
                swRegistration = reg;

                var serviceworker;

                if (reg.installing)
                    serviceworker = reg.installing;
                else if (reg.waiting)
                    serviceworker = reg.waiting;
                else if (reg.active)
                    serviceworker = reg.active;

                initializeUI();

                if (serviceworker) {
                    console.log("sw current state", serviceworker.state);
                    if (serviceworker.state == "activated") {
                        subscribeUser();
                    }
                    else {
                        serviceworker.addEventListener("statechange", function (e) {
                            console.log("service worker statechange: ", e.target.state);
                            if (e.target.state == "activated") {
                                subscribeUser(reg);
                                initializeUI();
                            }
                        });
                    }
                }
            })
            .catch(err => console.log(`Service Worker error: ${err}`))
    });
}




Notification.requestPermission().then(function(permission){
    console.log('Notification ', permission)
});


if('caches' in window){
    console.log("The browser supports caching ")
}else {
    console.log("This browser is some junk, it dosen't support caching :(")
}



//Push Notifications
const urlB64ToUint8Array = base64String => {
    const padding = '='.repeat((4 - (base64String.length % 4)) % 4)
    const base64 = (base64String + padding).replace(/\-/g, '+').replace(/_/g, '/')
    const rawData = atob(base64)
    const outputArray = new Uint8Array(rawData.length)
    for (let i = 0; i < rawData.length; ++i) {
        outputArray[i] = rawData.charCodeAt(i)
    }
    return outputArray
}

function subscribeUser(reg) {
    const applicationServerKey = urlB64ToUint8Array(applicationServerPublicKey);
    reg.pushManager.subscribe({
        userVisibleOnly: true,
        applicationServerKey: applicationServerKey
    })
        .then(function(subscription) {
            console.log('User is subscribed.');

            updateSubscriptionOnServer(subscription);

            isSubscribed = true;

        })
        .catch(function(err) {
            console.log('Failed to subscribe the user: ', err);
        });
}


function updateSubscriptionOnServer(subscription) {
    storePushSubscription(subscription);
    console.log(JSON.stringify(subscription));
}


function initializeUI() {
    // Set the initial subscription value
    swRegistration.pushManager.getSubscription()
        .then(function(subscription) {
            isSubscribed = !(subscription === null);

            if (isSubscribed) {
                console.log('User IS subscribed.');
            } else {
                console.log('User is NOT subscribed.');
            }

        });
}


function storePushSubscription(pushSubscription) {
    const token = document.querySelector('meta[name=csrf-token]').getAttribute('content');

    fetch('/push', {
        method: 'POST',
        body: JSON.stringify(pushSubscription),
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
            'X-CSRF-Token': token
        }
    })
        .then((res) => {
            return res.json();
        })
        .then((res) => {
            console.log(res)
        })
        .catch((err) => {
            console.log(err)
        });
}