Improve translation controls

This commit is contained in:
2025-12-09 10:29:10 +01:00
parent fe915b71f4
commit d92617f82c
11 changed files with 413 additions and 52 deletions

View File

@@ -39,21 +39,21 @@
Height
<input id="asset-height" type="number" min="10" step="5" />
</label>
<label>
Rotation
<input id="asset-rotation" type="range" min="-180" max="180" step="1" />
<div class="range-value" id="rotation-display"></div>
<label class="checkbox-inline">
<input id="maintain-aspect" type="checkbox" checked />
Maintain aspect ratio
</label>
</div>
<div class="control-actions">
<button type="button" onclick="nudgeRotation(-5)" class="secondary">Rotate -5°</button>
<button type="button" onclick="nudgeRotation(5)" class="secondary">Rotate +5°</button>
<button type="button" onclick="applyTransformFromInputs()">Apply size & rotation</button>
<button type="button" onclick="nudgeRotation(-5)" class="secondary">Rotate left</button>
<button type="button" onclick="nudgeRotation(5)" class="secondary">Rotate right</button>
<button type="button" onclick="applyTransformFromInputs()">Apply size</button>
<button type="button" onclick="recenterSelectedAsset()" class="secondary">Re-center asset</button>
</div>
</div>
</div>
</section>
<section class="overlay">
<section class="overlay" id="admin-overlay">
<iframe th:src="${'https://player.twitch.tv/?channel=' + broadcaster + '&parent=localhost'}" allowfullscreen></iframe>
<canvas id="admin-canvas"></canvas>
</section>

View File

@@ -16,6 +16,24 @@
<button class="secondary" type="submit">Logout</button>
</form>
</div>
<div class="panel">
<h3>Canvas size</h3>
<p>Set the pixel dimensions for your overlay. Admins will see this aspect ratio when positioning assets.</p>
<div class="control-grid">
<label>
Width
<input id="canvas-width" type="number" min="100" step="10" />
</label>
<label>
Height
<input id="canvas-height" type="number" min="100" step="10" />
</label>
</div>
<div class="control-actions">
<button type="button" onclick="saveCanvasSettings()">Save canvas size</button>
<span id="canvas-status" class="muted"></span>
</div>
</div>
<div class="panel">
<h3>Channel admins</h3>
<p>Add trusted moderators who can upload overlay assets on your behalf.</p>