Update index.html

index.html

@@ -753,10 +753,52 @@ document.addEventListener('DOMContentLoaded', function() {
     <div class="settings">
       
     <h2>サービスワーカー設定</h2>
+      <div class="setting-item">
+        <label><input type="checkbox" id="sw-video" checked> 動画ファイル (/v.mp4)</label>
+    </div>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-t-video" checked> 動画ファイル (/t/v.mp4)</label>
+    </div><br>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-piano" checked> ピアノ音声 (/p.mp3)</label>
+    </div>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-soprano" checked> ソプラノ音声 (/s.mp3)</label>
+    </div>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-alto" checked> アルト音声 (/a.mp3)</label>
+    </div>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-tenor" checked> テノール音声 (/t.mp3)</label>
+    </div>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-combined" checked> 全体音声 (/k.mp3)</label>
+    </div><br>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-t-piano" checked> ピアノ音声 (/t/p.mp3)</label>
+    </div>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-t-soprano" checked> ソプラノ音声 (/t/s.mp3)</label>
+    </div>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-t-alto" checked> アルト音声 (/t/a.mp3)</label>
+    </div>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-t-tenor" checked> テノール音声 (/t/t.mp3)</label>
+    </div>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-t-combined" checked> 全体音声 (/t/k.mp3)</label>
+    </div><br>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-index" checked> インデックスファイル (/index.html)</label>
+    </div>
+    <div class="setting-item">
+        <label><input type="checkbox" id="sw-root" checked> ルートファイル (/)</label>
+    </div>
     <button class="combine-button" id="sw-register-btn">登録を開始</button>
     <div class="combine-status" id="sw-status"></div>
       <script>
-        document.getElementById('sw-register-btn').addEventListener('click', async () => {
+document.getElementById('sw-register-btn').addEventListener('click', async () => {
   const statusElem = document.getElementById('sw-status');
 
   function updateStatus(message) {
@@ -779,35 +821,68 @@ document.addEventListener('DOMContentLoaded', function() {
     updateStatus('既存のService Workerをアンレジスター中...');
 
     const registrations = await navigator.serviceWorker.getRegistrations();
-    if (registrations.length === 0) {
-      updateStatus('登録されているService Workerはありません。');
-    } else {
-      for (const registration of registrations) {
-        try {
-          const success = await registration.unregister();
-          if (success) {
-            updateStatus('Service Workerをアンレジスターしました。');
-          } else {
-            updateStatus('Service Workerのアンレジスターに失敗しました。');
-          }
-        } catch (unregErr) {
-          updateError('Service Workerのアンレジスター中に例外が発生しました。', unregErr);
-          return;
-        }
+    for (const registration of registrations) {
+      try {
+        await registration.unregister();
+        updateStatus('Service Workerをアンレジスターしました。');
+      } catch (unregErr) {
+        updateError('Service Workerのアンレジスター中に例外が発生しました。', unregErr);
+        return;
       }
     }
 
     updateStatus('アンレジスター完了。新しいService Workerを登録中...');
 
-    // 少し待機してから新しいSWを登録
     setTimeout(async () => {
       try {
         const newRegistration = await navigator.serviceWorker.register('/sw.js');
         updateStatus('Service Workerが正常に登録されました。\n登録範囲: ' + newRegistration.scope);
+
+        // チェックボックスの状態からファイルリストを作成
+        const fileMap = {
+          'sw-video': '/v.mp4',
+          'sw-t-video': '/t/v.mp4',
+          'sw-piano': '/p.mp3',
+          'sw-soprano': '/s.mp3',
+          'sw-alto': '/a.mp3',
+          'sw-tenor': '/t.mp3',
+          'sw-combined': '/k.mp3',
+          'sw-t-piano': '/t/p.mp3',
+          'sw-t-soprano': '/t/s.mp3',
+          'sw-t-alto': '/t/a.mp3',
+          'sw-t-tenor': '/t/t.mp3',
+          'sw-t-combined': '/t/k.mp3',
+          'sw-index': '/index.html',
+          'sw-root': '/',
+        };
+
+        // チェックされているものだけ抽出
+        const filesToCache = [];
+        const checkboxStates = {};
+        for (const [id, url] of Object.entries(fileMap)) {
+          const checkbox = document.getElementById(id);
+          if (!checkbox) continue;
+          checkboxStates[id] = checkbox.checked;
+          if (checkbox.checked) {
+            filesToCache.push(url);
+          }
+        }
+
+        // SWがコントロール中ならメッセージ送信
+        if (navigator.serviceWorker.controller) {
+          navigator.serviceWorker.controller.postMessage({
+            type: 'CACHE_FILES',
+            files: filesToCache,
+            checkboxStates: checkboxStates,
+          });
+          updateStatus('キャッシュ更新のメッセージをサービスワーカーに送信しました。');
+        } else {
+          updateStatus('サービスワーカーがコントロール中ではありません。キャッシュ更新メッセージは送信できません。');
+        }
       } catch (regErr) {
         updateError('Service Workerの登録に失敗しました。', regErr);
       }
-    }, 300);
+    }, 500);
   } catch (err) {
     updateError('Service Workerの処理中に致命的なエラーが発生しました。', err);
   }