Update index.html

index.html

@@ -23,17 +23,7 @@
             <div class="image-preview">
                 <canvas id="image-canvas"></canvas>
             </div>
-            <div class="action-buttons">
-    <button id="reset-btn" class="btn"><i class="fas fa-undo"></i> リセット</button>
-    <button id="apply-btn" class="btn primary"><i class="fas fa-check"></i> 適用</button>
-    <button id="download-btn" class="btn"><i class="fas fa-download"></i> ダウンロード</button>
-</div>
-
-<!-- 読み込みアニメーション用の要素を追加 -->
-<div id="loading-overlay" class="loading-overlay">
-    <div class="loading-spinner"></div>
-    <div class="loading-text">処理中...</div>
-</div>
+            
             <div class="controls">
                 <div class="control-group">
                     <h3><i class="fas fa-sliders-h"></i> 基本調整</h3>
@@ -57,37 +47,19 @@
                 <div class="control-group">
                     <h3><i class="fas fa-adjust"></i> トーン調整</h3>
                     <div class="slider-control">
-                        <label>シャドウ</label>
+                        <label>シャドウ補正</label>
                         <input type="range" id="shadows" min="-100" max="100" value="0">
                         <span id="shadows-value">0</span>
                     </div>
                     <div class="slider-control">
-                        <label>ハイライト</label>
+                        <label>ハイライト補正</label>
                         <input type="range" id="highlights" min="-100" max="100" value="0">
                         <span id="highlights-value">0</span>
                     </div>
                 </div>
                 
                 <div class="control-group">
-                    <h3><i class="fas fa-palette"></i> HSL調整</h3>
-                    <div class="hsl-controls">
-                        <div class="hsl-slider">
-                            <label>色相 (赤)</label>
-                            <input type="range" id="hue-red" min="-100" max="100" value="0">
-                        </div>
-                        <div class="hsl-slider">
-                            <label>色相 (緑)</label>
-                            <input type="range" id="hue-green" min="-100" max="100" value="0">
-                        </div>
-                        <div class="hsl-slider">
-                            <label>色相 (青)</label>
-                            <input type="range" id="hue-blue" min="-100" max="100" value="0">
-                        </div>
-                    </div>
-                </div>
-                
-                <div class="control-group">
-                    <h3><i class="fas fa-project-diagram"></i> RGBカーブ</h3>
+                    <h3><i class="fas fa-project-diagram"></i> チャンネルカーブ</h3>
                     <div class="curve-controls">
                         <div class="curve-container">
                             <canvas id="red-curve" width="200" height="200"></canvas>
@@ -101,13 +73,27 @@
                             <canvas id="blue-curve" width="200" height="200"></canvas>
                             <label>青チャンネル</label>
                         </div>
+                        <div class="curve-container">
+                            <canvas id="luminance-curve" width="200" height="200"></canvas>
+                            <label>輝度カーブ</label>
+                        </div>
                     </div>
                 </div>
                 
+                <div class="action-buttons">
+                    <button id="reset-btn" class="btn"><i class="fas fa-undo"></i> リセット</button>
+                    <button id="apply-btn" class="btn primary"><i class="fas fa-check"></i> 適用</button>
+                    <button id="download-btn" class="btn"><i class="fas fa-download"></i> ダウンロード</button>
+                </div>
             </div>
         </div>
     </div>
 
+    <div id="loading-overlay" class="loading-overlay">
+        <div class="loading-spinner"></div>
+        <div class="loading-text">処理中...</div>
+    </div>
+
     <script src="https://cdnjs.cloudflare.com/ajax/libs/camanjs/4.1.2/caman.full.min.js"></script>
     <script src="script.js"></script>
 </body>