diff --git a/package.json b/package.json index cd70c0c6a..484cfcfe8 100644 --- a/package.json +++ b/package.json @@ -152,7 +152,6 @@ "reselect": "^2.5.1", "rxjs": "^5.0.0-beta.9", "screenfull": "^3.0.0", - "serviceworker-cache-polyfill": "^4.0.0", "test-bed": "^0.5.3", "throat": "^2.0.2", "timesynchro": "^1.0.1", diff --git a/src/app/browser-support.js b/src/app/browser-support.js index 3a993fb45..2d2425560 100644 --- a/src/app/browser-support.js +++ b/src/app/browser-support.js @@ -5,8 +5,8 @@ export const SUPPORTED = [ test: () => checkUserAgent(/Firefox\/(\d+)/, 37), }, { - name: 'Chrome 42+', - test: () => checkUserAgent(/Chrome\/(\d+)\./, 42), + name: 'Chrome 54+', + test: () => checkUserAgent(/Chrome\/(\d+)\./, 54), }, { name: 'Safari 8+', diff --git a/src/app/index.js b/src/app/index.js index bf369e1e8..66b32bbfb 100644 --- a/src/app/index.js +++ b/src/app/index.js @@ -1,33 +1,28 @@ +import * as Analytics from './analytics' +import * as OptionsIO from './io/OptionsIO' +import * as ReduxState from './redux/ReduxState' import now from 'bemuse/utils/now' - -import SCENE_MANAGER from 'bemuse/scene-manager' -import React from 'react' -import TitleScene from './ui/TitleScene' -import AboutScene from './ui/AboutScene' -import ModeSelectScene from './ui/ModeSelectScene' -import ServiceWorkerRegistrationScene - from './ui/ServiceWorkerRegistrationScene' - -import { OFFICIAL_SERVER_URL } from './constants' -import { isBrowserSupported } from './browser-support' -import BrowserSupportWarningScene from './ui/BrowserSupportWarningScene' - -import { getMusicServer, getTimeSynchroServer, getInitialGrepString } - from './query-flags' -import { shouldShowAbout, shouldShowModeSelect } - from 'bemuse/devtools/query-flags' - import workerPath from 'bemuse/hacks/service-worker-url!serviceworker!./service-worker.js' +import React from 'react' +import SCENE_MANAGER from 'bemuse/scene-manager' +import { shouldShowAbout, shouldShowModeSelect } + from 'bemuse/devtools/query-flags' import { createIO, createRun } from 'impure' -import ioContext from './io/ioContext' import { withContext } from 'recompose' + +import ioContext from './io/ioContext' import store from './redux/instance' +import AboutScene from './ui/AboutScene' +import BrowserSupportWarningScene from './ui/BrowserSupportWarningScene' +import ModeSelectScene from './ui/ModeSelectScene' +import TitleScene from './ui/TitleScene' import { WarpDestination } from '../react-warp' -import * as OptionsIO from './io/OptionsIO' -import * as ReduxState from './redux/ReduxState' -import * as Analytics from './analytics' +import { isBrowserSupported } from './browser-support' +import { OFFICIAL_SERVER_URL } from './constants' +import { getMusicServer, getTimeSynchroServer, getInitialGrepString } + from './query-flags' export const runIO = createRun({ context: ioContext @@ -98,32 +93,23 @@ function getFirstScene () { } } +function shouldActivateServiceWorker () { + return ( + (location.protocol === 'https:' && location.host === 'bemuse.ninja') || + (location.hostname === 'localhost') + ) +} + function setupServiceWorker () { if (!('serviceWorker' in navigator)) return false - if (location.host !== 'bemuse.dev' && location.host !== 'bemuse.ninja') { - return false - } - if (location.protocol !== 'https:') return false - if (navigator.serviceWorker.controller) { - registerServiceWorker() - return true - } else { - var cutscene = React.createElement(ServiceWorkerRegistrationScene) - return SCENE_MANAGER.display(cutscene) - .then(function () { - return registerServiceWorker() - }) - .then(function () { - return new Promise(function () { - location.reload() - }) - }) - } + if (!shouldActivateServiceWorker()) return false + registerServiceWorker() + return true } function registerServiceWorker () { - return navigator.serviceWorker.register('/sw-loader.js?path=' + - encodeURIComponent(workerPath)) + const url = '/sw-loader.js?path=' + encodeURIComponent(workerPath) + return navigator.serviceWorker.register(url) } window.addEventListener('beforeunload', () => { diff --git a/src/app/service-worker.js b/src/app/service-worker.js index 69bd6084d..ec2eb1a68 100644 --- a/src/app/service-worker.js +++ b/src/app/service-worker.js @@ -1,10 +1,10 @@ /*global caches*/ + import version from 'bemuse/utils/version' -import 'serviceworker-cache-polyfill' function log (...args) { - console.log('[serviceworker]', ...args) + console.log('%c serviceworker %c', 'background:yellow;color:black', '', ...args) } log('I am a service worker! ' + version) @@ -17,14 +17,15 @@ var SONG_CACHE_KEY = 'songs' self.addEventListener('install', function (event) { event.waitUntil( - caches.open(SITE_CACHE_KEY).then(function (cache) { - return cache.addAll(['/']) - }) + caches.open(SITE_CACHE_KEY) + .then((cache) => cache.addAll([ '/' ])) + .then(() => self.skipWaiting()) ) }) self.addEventListener('activate', function () { - log('Service worker activated!') + log('Service worker activated! Claiming clients now!') + return self.clients.claim() }) self.addEventListener('fetch', function (event) { @@ -69,7 +70,7 @@ function cacheForever (event, cacheName) { caches.open(cacheName).then(function (cache) { return cache.match(event.request).then(function (cached) { return cached || fetch(event.request).then(function (response) { - log('[caching forever]', event.request.url) + log('Cache forever:', event.request.url) cache.put(event.request, response.clone()) return response }) @@ -83,7 +84,7 @@ function fetchThenCache (event, cacheName) { caches.open(cacheName).then(function (cache) { return fetch(event.request).then(function (response) { if (response && response.ok) { - log('[cached]', event.request.url) + log('Fetch OK:', event.request.url) cache.put(event.request, response.clone()) return response } else { @@ -102,7 +103,7 @@ function staleWhileRevalidate (event, cacheName) { return cache.match(event.request).then(function (cached) { var promise = fetch(event.request).then(function (response) { if (response && response.ok) { - log('[updated]', event.request.url) + log('Updated:', event.request.url) cache.put(event.request, response.clone()) } return response diff --git a/src/app/ui/ServiceWorkerRegistrationScene.jsx b/src/app/ui/ServiceWorkerRegistrationScene.jsx deleted file mode 100644 index 5b9d207bc..000000000 --- a/src/app/ui/ServiceWorkerRegistrationScene.jsx +++ /dev/null @@ -1,14 +0,0 @@ - -import './ServiceWorkerRegistrationScene.scss' -import React from 'react' -import Scene from 'bemuse/ui/Scene' - -export default React.createClass({ - render () { - return -
- Please wait while the service worker is being installed... -
- - } -}) diff --git a/src/app/ui/ServiceWorkerRegistrationScene.scss b/src/app/ui/ServiceWorkerRegistrationScene.scss deleted file mode 100644 index a4209f951..000000000 --- a/src/app/ui/ServiceWorkerRegistrationScene.scss +++ /dev/null @@ -1,6 +0,0 @@ - -@import "~bemuse/ui/common"; - -.ServiceWorkerRegistrationScene { - @include center-content; -} diff --git a/yarn.lock b/yarn.lock index 43666b934..070acbc55 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6362,10 +6362,6 @@ serve-static@~1.11.1: parseurl "~1.3.1" send "0.14.1" -serviceworker-cache-polyfill@^4.0.0: - version "4.0.0" - resolved "https://registry.yarnpkg.com/serviceworker-cache-polyfill/-/serviceworker-cache-polyfill-4.0.0.tgz#de19ee73bef21ab3c0740a37b33db62464babdeb" - serviceworker-loader@^0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/serviceworker-loader/-/serviceworker-loader-0.1.0.tgz#de9d8c105959773bbd2383becdc620eab9ae03e4"