Update index.html

index.html

@@ -71,14 +71,24 @@
   const volumeInput = document.getElementById('volumeInput');
   const loopCheckbox = document.getElementById('loopCheckbox');
 
-  // Web Audio APIの設定
+  // Web Audio APIの初期化
   const audioContext = new (window.AudioContext || window.webkitAudioContext)();
   const gainNode = audioContext.createGain();
   const sourceNode = audioContext.createMediaElementSource(video);
   sourceNode.connect(gainNode);
   gainNode.connect(audioContext.destination);
 
-  // 再生速度の更新
+  // 音量更新
+  function updateVolume(value) {
+    const volume = parseFloat(value);
+    volumeInput.value = volume;
+    volumeRange.value = volume;
+
+    // 音量は0から1を超えて設定可能（100までで対応）
+    gainNode.gain.value = volume / 100;
+  }
+
+  // 再生速度更新
   function updatePlaybackRate(value) {
     const speed = parseFloat(value);
     speedInput.value = speed;
@@ -86,16 +96,7 @@
     video.playbackRate = speed;
   }
 
-  // 音量の更新
-  function updateVolume(value) {
-    const volume = parseFloat(value);
-    volumeInput.value = volume;
-    volumeRange.value = volume;
-    // GainNodeの音量設定（1.0以上）
-    gainNode.gain.value = volume / 100;  // 0〜1の範囲として設定
-  }
-
-  // イベントリスナーの設定
+  // イベントリスナー
   ['input', 'change', 'mouseup'].forEach(eventName => {
     speedRange.addEventListener(eventName, () => {
       updatePlaybackRate(speedRange.value);
@@ -117,7 +118,6 @@
     video.loop = loopCheckbox.checked;
   });
 
-  // 全画面モード
   function goFullscreen() {
     if (video.requestFullscreen) {
       video.requestFullscreen();
@@ -128,7 +128,6 @@
     }
   }
 
-  // メタデータの読み込み後に初期設定
   video.addEventListener('loadedmetadata', () => {
     updatePlaybackRate(speedRange.value);
     updateVolume(volumeRange.value);