const PWA_CONFIG = {

    // App config
    app: {
        // App name
        name: 'your-app-name',
        // App version
        version: 'v1',
    },

    // Service Worker config
    sw: {
        // Main service worker filepath (always root of project)
        filepath: '/sw.js',
        // Route of offline page
        offline_route: '/pwa/errors/offline/',
    },

    // Push manager config
    push: {
        // Enable/disable push notifications
        active: true,
        // Server config
        server: {
            // API public key
            public_key: 'YOURAPIPUBLICKEY',
            // Subscription API endpoint
            endpoint: '/api/push/subscription/',
        },
        // Notification config
        notification: {
            // Title of notifications from the server
            title: 'Your App Name',
            // Options object same that showNotification() options
            // (https://developer.mozilla.org/es/docs/Web/API/ServiceWorkerRegistration/showNotification)
            options: {
                // A string representing an extra content to display within the notification
                body: '',
                // he URL of an image to be used as an icon by the notification
                icon: '/pwa/icons/firefox/firefox-general-64-64.png',
                // A vibration pattern to run with the display of the notification.
                // A vibration pattern can be an array with as few as one member.
                // The values are times in milliseconds where the even indices (0, 2, 4, etc.)
                // indicate how long to vibrate and the odd indices indicate how long to pause.
                // For example [300, 100, 400] would vibrate 300ms, pause 100ms, then vibrate 400ms.
                vibrate: [100, 50, 100],
                // Arbitrary data that you want associated with the notification. This can be of any data type
                data: {
                    dateOfArrival: Date.now(),
                    primaryKey: '1',
                    clickUrl: '',
                },
            },
            // notification click event
            notificationclick: {
                // Enable/disable notification click event
                active: true,
            }
        }
    },

    // Cache config
    cache: {
        // Images cache config (png|jpg|jpeg|svg|gif)
        images: {
            // Enable/disable images caching
            active: true,
            // The maximum number of entries to cache.
            // Entries used the least will be removed as the maximum is reached.
            maxentries: 500,
            // The maximum age of an entry before it's treated as stale and removed.
            maxageseconds: 365 * 24 * 60 * 60,
        },
        // Static files cache config (js|json|css)
        statics: {
            // Enable/disable static files caching
            active: true,
            // The maximum number of entries to cache.
            // Entries used the least will be removed as the maximum is reached.
            maxentries: 500,
            // The maximum age of an entry before it's treated as stale and removed.
            maxageseconds: 365 * 24 * 60 * 60,
        },
        // Fonts cache config (eot|ttf|woff|woff2|otf)
        // with cross-origin requests example google fonts
        fonts: {
            // Enable/disable fonts caching
            active: true,
            // The maximum number of entries to cache.
            // Entries used the least will be removed as the maximum is reached.
            maxentries: 500,
            // The maximum age of an entry before it's treated as stale and removed.
            maxageseconds: 365 * 24 * 60 * 60,
        },
        routes: {
            // Force the response to come from the network
            networkonly: {
                // Enable/disable network only routes caching
                active: true,
                // Matching routes with a Regular Expression
                regex: /\/(?:login|logout)\//,
            },
	    // Resources are requested from both the cache and the network in parallel.
            // The strategy will respond with the cached version if available,
            // otherwise wait for the network response.
            // The cache is updated with the network response with each successful request.
            stalewhilerevalidate: {
                active: true,
                regex: /\/news\/.*/,
            },
	    // Network first request strategy.
            networkfirst: {
                active: true,
                regex: /.*/,
            },
	    // Cache first request strategy.
            cachefirst: {
                active: false,
                // regex: /.*/,
                // maxentries: 500,
                // maxageseconds: 365 * 24 * 60 * 60,
            },
	    // Force the response to come from the browser.
            cacheonly: {
                active: false,
                // regex: /.*/,
            },
        },
	// Add your custom service worker for load it.
        custom: {
            active: false,
            // service worker script route
	    // script: '/pwa/sw/my-custom-sw.js',
        },
    },

    // Precache config
    precache: {
        // Enable/disable precaching
        active: true,
        // Routes to
        routes: [
            '/assets/example.css',
            '/assets/example.png',
            '/assets/example.js',
        ],
    },
}

document
    .getElementById('btn-subscription')
    .addEventListener('click', () => {
    	if (
            PWA.Notification.isDefault() ||
            PWA.Notification.isGranted()
        ) {
            PWA.Push.getSubscription((subscription) => {
                if (subscription) {
                    console.log('You are now subscribed to receive Push Notifications!');
                } else {
                    PWA.Push.subscribe((r) => {
                        console.log('Congratulations! You are subscribed to receive Push Notifications!');
                    });
                }
            });
        } else {
            console.log("You've turned off Push Notifications. Allow Push Notifications in your browser settings.");
        }	
    })
;

document
    .getElementById('toggle-subscription')
    .addEventListener('change', () => {
    	if (
            PWA.Notification.isDefault() ||
            PWA.Notification.isGranted()
        ) {
            PWA.Push.getSubscription((subscription) => {
                if (subscription) {
                    PWA.Push.unsubscribe((r) => {
                        console.log('You have been unsubscribed to receive Push Notifications!');
                    });
                } else {
                    PWA.Push.subscribe((r) => {
                        console.log('You are now subscribed to receive Push Notifications!');
                    });
                }
            });
        } else {
            console.log("You've turned off Push Notifications. Allow Push Notifications in your browser settings.");
        }	
    })
;

if (PWA.Notification.isDefault()) {
    console.log('Permission for Notifications are with default status.');
} else {
    console.log('Permission for Notifications are not with default status.');
}

if (PWA.Notification.isGranted()) {
    console.log('Permission for Notifications was granted!');
} else {
    console.log('Permission for Notifications was not granted!');
}

if (PWA.Notification.isBlocked()) {
    console.log('Permission for Notifications was blocked.');
} else {
    console.log('Permission for Notifications was not blocked.');
}

if (PWA.Notification.isDenied()) {
    console.log('Permission for Notifications was denied.');
} else {
    console.log('Permission for Notifications was not denied.');
}

PWA.Notification.requestPermission((status) => {
    console.log('Notification permission status:', status);
});

var permission = PWA.Notification.getPermission();

const options = {
    body: 'Extra content to display within the notification',
    icon: '../images/touch/chrome-touch-icon-192x192.png'
};

PWA.Notification.show('Notification Title', options, sent => {
    if (sent) {
    	console.log('The Notification has been sent');
    }
});

PWA.ServiceWorker.register();

PWA.ServiceWorker.getRegistration((registration) => {
    if (registration) {
    	console.log(registration);
    } else {
       console.log('The Service Worker is not registered!');
    }
});

if (PWA.Navigator.isSupportedServiceWorker()) {
    console.log('This browser support Service Workers!');
} else {
    console.log('This browser does not support Service Workers.');
}

if (PWA.Navigator.isSupportedNotification()) {
    console.log('This browser support Notifications!');
} else {
    console.log('This browser does not support Notifications.');
}

if (PWA.Navigator.isOffline()) {
    console.log('No Internet connection!');
} else {
    console.log('You have an Internet connection!');
}

PWA.Navigator.clearCache();