300 enable offline usage

AudioCuesheetEditor/AudioCuesheetEditor.csproj

@@ -11,6 +11,7 @@
 	<IncludeSourceRevisionInInformationalVersion>false</IncludeSourceRevisionInInformationalVersion>
 	<PublishTrimmed>true</PublishTrimmed>
 	<RunAOTCompilation>true</RunAOTCompilation>
+	<ServiceWorkerAssetsManifest>service-worker-assets.js</ServiceWorkerAssetsManifest>
   </PropertyGroup>
 
   <ItemGroup>
@@ -111,5 +112,9 @@
     <PackageReference Include="Toolbelt.Blazor.HotKeys2" Version="4.1.0.1" />
     <PackageReference Include="z440.atl.core" Version="5.25.0" />
   </ItemGroup>
+
+  <ItemGroup>
+	<ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
+  </ItemGroup>
 
 </Project>

AudioCuesheetEditor/Data/Services/MusicBrainzDataProvider.cs

@@ -45,7 +45,7 @@ public class MusicBrainzDataProvider
 
         public async Task<IReadOnlyCollection<MusicBrainzArtist>> SearchArtistAsync(String searchString)
         {
-            List<MusicBrainzArtist> artistSearchResult = new();
+            List<MusicBrainzArtist> artistSearchResult = [];
             if (String.IsNullOrEmpty(searchString) == false)
             {
                 using var query = new Query(Application, ApplicationVersion, ProjectUrl);
@@ -57,7 +57,7 @@ public async Task<IReadOnlyCollection<MusicBrainzArtist>> SearchArtistAsync(Stri
 
         public async Task<IReadOnlyCollection<MusicBrainzTrack>> SearchTitleAsync(String searchString, String? artist = null)
         {
-            List<MusicBrainzTrack> titleSearchResult = new();
+            List<MusicBrainzTrack> titleSearchResult = [];
             if (String.IsNullOrEmpty(searchString) == false)
             {
                 using var query = new Query(Application, ApplicationVersion, ProjectUrl);

AudioCuesheetEditor/wwwroot/index.html

@@ -6,6 +6,10 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
     <title>AudioCuesheetEditor</title>
     <base href="/" />
+    <link href="manifest.webmanifest" rel="manifest" />
+    <!--Icons taken from open_icon_library-full\icons\png\256x256\mimetypes\tango-style\application-x-cue.png-->
+    <link rel="apple-touch-icon" sizes="512x512" href="icon-512.png" />
+    <link rel="apple-touch-icon" sizes="192x192" href="icon-192.png" />
     <link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
     <link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />
     <link href="css/app.css" rel="stylesheet" />
@@ -52,6 +56,7 @@
         <a class="dismiss">🗙</a>
     </div>
     <script src="_framework/blazor.webassembly.js"></script>
+    <script>navigator.serviceWorker.register('service-worker.js');</script>
     <script src="scripts/bootstrap.bundle.min.js"></script>
     <script src="scripts/fix-webm-duration.js"></script>
     <script src="scripts/library.js"></script>

AudioCuesheetEditor/wwwroot/manifest.webmanifest

@@ -0,0 +1,22 @@
+{
+  "name": "AudioCuesheetEditor",
+  "short_name": "AudioCuesheetEditor",
+  "id": "./",
+  "start_url": "./",
+  "display": "standalone",
+  "background_color": "#ffffff",
+  "theme_color": "#03173d",
+  "prefer_related_applications": false,
+  "icons": [
+    {
+      "src": "icon-512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    },
+    {
+      "src": "icon-192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    }
+  ]
+}

AudioCuesheetEditor/wwwroot/service-worker.js

@@ -0,0 +1,4 @@
+// In development, always fetch from the network and do not enable offline support.
+// This is because caching would make development more difficult (changes would not
+// be reflected on the first load after each change).
+self.addEventListener('fetch', () => { });

AudioCuesheetEditor/wwwroot/service-worker.published.js

@@ -0,0 +1,55 @@
+// Caution! Be sure you understand the caveats before publishing an application with
+// offline support. See https://aka.ms/blazor-offline-considerations
+
+self.importScripts('./service-worker-assets.js');
+self.addEventListener('install', event => event.waitUntil(onInstall(event)));
+self.addEventListener('activate', event => event.waitUntil(onActivate(event)));
+self.addEventListener('fetch', event => event.respondWith(onFetch(event)));
+
+const cacheNamePrefix = 'offline-cache-';
+const cacheName = `${cacheNamePrefix}${self.assetsManifest.version}`;
+const offlineAssetsInclude = [ /\.dll$/, /\.pdb$/, /\.wasm/, /\.html/, /\.js$/, /\.json$/, /\.css$/, /\.woff$/, /\.png$/, /\.jpe?g$/, /\.gif$/, /\.ico$/, /\.blat$/, /\.dat$/ ];
+const offlineAssetsExclude = [ /^service-worker\.js$/ ];
+
+// Replace with your base path if you are hosting on a subfolder. Ensure there is a trailing '/'.
+const base = "/";
+const baseUrl = new URL(base, self.origin);
+const manifestUrlList = self.assetsManifest.assets.map(asset => new URL(asset.url, baseUrl).href);
+
+async function onInstall(event) {
+    console.info('Service worker: Install');
+
+    // Fetch and cache all matching items from the assets manifest
+    const assetsRequests = self.assetsManifest.assets
+        .filter(asset => offlineAssetsInclude.some(pattern => pattern.test(asset.url)))
+        .filter(asset => !offlineAssetsExclude.some(pattern => pattern.test(asset.url)))
+        .map(asset => new Request(asset.url, { integrity: asset.hash, cache: 'no-cache' }));
+    await caches.open(cacheName).then(cache => cache.addAll(assetsRequests));
+}
+
+async function onActivate(event) {
+    console.info('Service worker: Activate');
+
+    // Delete unused caches
+    const cacheKeys = await caches.keys();
+    await Promise.all(cacheKeys
+        .filter(key => key.startsWith(cacheNamePrefix) && key !== cacheName)
+        .map(key => caches.delete(key)));
+}
+
+async function onFetch(event) {
+    let cachedResponse = null;
+    if (event.request.method === 'GET') {
+        // For all navigation requests, try to serve index.html from cache,
+        // unless that request is for an offline resource.
+        // If you need some URLs to be server-rendered, edit the following check to exclude those URLs
+        const shouldServeIndexHtml = event.request.mode === 'navigate'
+            && !manifestUrlList.some(url => url === event.request.url);
+
+        const request = shouldServeIndexHtml ? 'index.html' : event.request;
+        const cache = await caches.open(cacheName);
+        cachedResponse = await cache.match(request);
+    }
+
+    return cachedResponse || fetch(event.request);
+}