Skip to content

procon2tool as PWA #18

@exasky

Description

@exasky

First of all, thank you for this awesome tool, waiting for Windows/Steam full support.

I cloned your project and add PWA support. Couldn't push on your repo so can't make a PR
Here's my code:

procon2tool/index.html L1149

<script>
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker.register('sw.js');
    }
</script>

sw.js

const CACHE_NAME = 'procon2tool-cache-v1';
const FILES_TO_CACHE = ['./index.html', './manifest.json', './icons/128x128%402x.png', './icons/1024x1024.png'];

// Install
self.addEventListener('install', (event) => {
  event.waitUntil(caches.open(CACHE_NAME).then((cache) => cache.addAll(FILES_TO_CACHE)));
  self.skipWaiting();
});

// Activate
self.addEventListener('activate', (event) => {
  event.waitUntil(
    caches.keys().then((keys) => Promise.all(keys.map((k) => (k !== CACHE_NAME ? caches.delete(k) : null))))
  );
  self.clients.claim();
});

// Fetch
self.addEventListener('fetch', (event) => {
  event.respondWith(caches.match(event.request).then((resp) => resp || fetch(event.request)));
});

manifest.json

{
  "name": "ProCon 2 Tool",
  "short_name": "ProCon2",
  "start_url": "/procon2tool/",
  "scope": "/procon2tool/",
  "display": "standalone",
  "background_color": "#000000",
  "theme_color": "#000000",
  "icons": [
    {
      "src": "/procon2tool/icons/128x128%402x.png",
      "sizes": "256x256",
      "type": "image/png"
    },
    {
      "src": "/procon2tool/icons/1024x1024.png",
      "sizes": "1024x1024",
      "type": "image/png"
    }
  ]
}

Icons:

128x128@2x.png
Image
1024x1024.png
Image

Can't upload the ICO

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions