Vibe seo

2026-06-25 13:46:14 -04:00
parent ccfe809609
commit fdf8e754f5
9 changed files with 118 additions and 5 deletions
@@ -1,7 +1,11 @@
@page "/cards"
@inject HttpClient Http

-<PageTitle>Card Gallery</PageTitle>
+<PageTitle>Chrono CCG - Card Gallery</PageTitle>
+
+<HeadContent>
+    <meta name="description" content="Browse and filter all Chrono CCG cards. Explore agents, spells, and more." />
+</HeadContent>

 <div class="gallery-container">
    <div class="gallery-header">
@@ -6,8 +6,13 @@
        <ImplicitUsings>enable</ImplicitUsings>
        <OverrideHtmlAssetPlaceholders>false</OverrideHtmlAssetPlaceholders>
        <StaticWebAssetsFingerprintingEnabled>false</StaticWebAssetsFingerprintingEnabled>
+        <ServiceWorkerAssetsManifest>service-worker-assets.js</ServiceWorkerAssetsManifest>
    </PropertyGroup>

+    <ItemGroup>
+        <ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
+    </ItemGroup>
+
    <ItemGroup>
        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.9"/>
        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.9" PrivateAssets="all"/>
@@ -4,8 +4,28 @@
 <head>
    <meta charset="utf-8"/>
    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
-    <title>Web</title>
+    <title>Chrono CCG - Card Gallery</title>
    <base href="/"/>
+    <meta name="description" content="Explore the full collection of Chrono CCG cards. Filter by cost, faction, and type."/>
+    <meta name="keywords" content="Chrono CCG, Reference, Card Gallery, DB"/>
+    
+    <!-- Open Graph / Facebook -->
+    <meta property="og:type" content="website"/>
+    <meta property="og:url" content="https://chronoccg.com/"/>
+    <meta property="og:title" content="Chrono CCG - Card Gallery"/>
+    <meta property="og:description" content="Explore the full collection of Chrono CCG cards. Filter by cost, faction, and type."/>
+    <meta property="og:image" content="https://chronoccg.com/favicon.png"/>
+
+    <!-- Twitter -->
+    <meta property="twitter:card" content="summary_large_image"/>
+    <meta property="twitter:url" content="https://chronoccg.com/"/>
+    <meta property="twitter:title" content="Chrono CCG - Card Gallery"/>
+    <meta property="twitter:description" content="Explore the full collection of Chrono CCG cards. Filter by cost, faction, and type."/>
+    <meta property="twitter:image" content="https://chronoccg.com/favicon.png"/>
+
+    <link href="manifest.json" rel="manifest" />
+    <link rel="apple-touch-icon" sizes="512x512" href="icon-512.png" />
+    <link rel="apple-touch-icon" sizes="192x192" href="icon-192.png" />
    <link href="https://fonts.googleapis.com" rel="preconnect"/>
    <link crossorigin href="https://fonts.gstatic.com" rel="preconnect"/>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet"/>
@@ -41,6 +61,7 @@
 </div>

 <script src="/_framework/blazor.webassembly.js"></script>
+<script>navigator.serviceWorker.register('service-worker.js');</script>
 </body>

 </html>
@@ -0,0 +1,20 @@
+{
+  "name": "Chrono CCG - Slop Reference",
+  "short_name": "cccg.sr",
+  "start_url": "./",
+  "display": "standalone",
+  "background_color": "#000000",
+  "theme_color": "#000000",
+  "icons": [
+    {
+      "src": "icon-192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "icon-512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ]
+}
@@ -0,0 +1,3 @@
+// In development, always fetch from the network and do not cache.
+// This is appropriate during development as the service worker will wake up and fetch resources from the network.
+self.addEventListener('fetch', () => { });
@@ -0,0 +1,48 @@
+// Caution! Be sure you understand the caveats before using an up-front
+// preload strategy: https://googlechrome.github.io/samples/service-worker/prefetch/
+
+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$/ ];
+
+async function onInstall(event) {
+    console.info('Service worker installing');
+
+    // 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 activated');
+
+    // 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
+        // If you need some routes to be uncached, add conditions here
+        const shouldServeIndexHtml = event.request.mode === 'navigate';
+
+        const request = shouldServeIndexHtml ? 'index.html' : event.request;
+        const cache = await caches.open(cacheName);
+        cachedResponse = await cache.match(request);
+    }
+
+    return cachedResponse || fetch(event.request);
+}