horoli/behind_glass
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement patterned glass and maximum-depth distance controls

Browse Source 
Add gobang surface refraction and shared photo/depth distance adjustment. Compare V2 Small and Base at input 770 with maximum-depth masks and pixel diagnostics. Record browser QA and update runtime dependencies and model notices.
This commit is contained in:
horoli
2026-10-06 14:33:47 +09:00
parent 619d980098
commit 71c8d3b7ff
82 changed files with 1602 additions and 1103 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+30 -7
View File
@@ -38,12 +38,17 @@
<option value="dog4">멍멍이 4 · 벤치 위 갈색 닥스훈트</option>
</select></label>
<button id="sample">선택한 테스트 사진 불러오기</button>
<p id="region-fixed-note" class="control-note">Ref1 기준 · 색면 단순화 1 · 굴절 1 (고정)</p>
<label>유리 패턴<select id="mosaic-style">
<option value="2" selected>고방유리 · 표면 굴절</option>
<option value="0">Ref1 옵션 2 · 사각 색면</option>
<option value="1">기존 촘촘 유리</option>
</select></label>
<p id="region-fixed-note" class="control-note">고방유리 · 표면 요철에 따른 굴절 · 색면 처리 없음</p>
<label>Grid Size <output id="gridOut">13</output>
<input id="grid-size" type="range" min="10" max="24" step="1" value="13">
<label>Grid Size <output id="gridOut">20</output>
<input id="grid-size" type="range" min="10" max="24" step="1" value="20">
</label>
<small class="control-help">큰 얼굴 12–16 · 작은 얼굴/여러 마리 20–24</small>
<small class="control-help">고방유리 20–24 · 큰 셀 비교 12–16</small>
<div id="gloss-controls" class="core-optics">
<label>셀 굴곡 (−1 오목 · +1 볼록) <output id="curvatureOut">1.00</output>
<input id="curvature" type="range" min="-1" max="1" step="0.01" value="1">
@@ -53,6 +58,10 @@
<input id="gloss-strength" type="range" min="0" max="0.4" step="0.01" value="0.30">
</label>
</div>
<label>사진–유리 거리 <output id="photoGlassDistanceOut">0%</output>
<input id="photo-glass-distance" type="range" min="0" max="100" step="1" value="0">
</label>
<small class="control-help">최대 depth 표면 기준 · 0% 가까움 · 100% 멀어짐</small>
<label>Camera Offset <output id="cameraOut">0.50</output>
<input id="camera-offset" type="range" min="0" max="0.9" step="0.01" value="0.5">
</label>
@@ -79,6 +88,23 @@
<details>
<summary>개발 비교</summary>
<div class="details-content">
<label>AI 깊이 모델<select id="ai-depth-model">
<option value="small">V2 Small · 상업적 사용 가능</option>
<option value="base">V2 Base · 비상업적 테스트</option>
</select></label>
<small class="control-note">모델을 선택한 뒤 AI 깊이 생성을 누르세요 · 입력 770</small>
<details id="depth-inspection">
<summary>최대 깊이 영역 확인</summary>
<p class="control-note">모델 최대 1: 분홍 · 8비트 depth=1: 청록 · 모델 depth≥0.99: 노랑</p>
<canvas id="depth-inspection-canvas" aria-label="최대 깊이 영역 · 사진을 클릭해 값 확인"></canvas>
<pre id="depth-inspection-summary">사진과 깊이를 불러오세요.</pre>
<div class="depth-coordinates">
<label>픽셀 X<input id="depth-inspection-x" type="number" min="0" value="0"></label>
<label>픽셀 Y<input id="depth-inspection-y" type="number" min="0" value="0"></label>
</div>
<pre id="depth-inspection-point"></pre>
<small class="control-note">1은 사진별 정규화 최댓값이며 실제 거리나 코 검출 결과가 아닙니다. 간격은 깊이맵 기준 장면 단위입니다.</small>
</details>
<label class="upload">동영상 선택<input id="video" type="file" accept="video/mp4,video/webm"></label>
<label class="upload">Depth 이미지 선택<input id="depth-image" type="file" accept="image/png,image/webp"></label>
<label>View Mode<select id="view-mode">
@@ -87,9 +113,6 @@
<label>Glass<select id="effect">
<option value="mosaic">Mosaic</option><option value="reeded">Reeded</option><option value="frosted">Frosted</option>
</select></label>
<label>Mosaic 스타일<select id="mosaic-style">
<option value="0">조각 유리</option><option value="1">촘촘 유리</option>
</select></label>
<label>Depth Scale <output id="depthOut">0.25</output>
<input id="depth-scale" type="range" min="0" max="0.4" step="0.01" value="0.25">
</label>