16mm
/
filmout_manager
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Start work on better layout. Abuse and modify the fieldset tag design.

This commit is contained in:
mmcwilliams 2024-08-18 09:10:37 -04:00
parent 33969f53f8
commit bc44bf4f5d
5 changed files with 47 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
browser/index.ts
View File

@ -209,8 +209,17 @@ class Client {
}
private setDisplay (state : State) {
console.dir(state);
const widthEl : HTMLInputElement = document.getElementById('displayWidth') as HTMLInputElement;
const heightEl : HTMLInputElement = document.getElementById('displayHeight') as HTMLInputElement;
widthEl.value = state.display.width as any;
heightEl.value = state.display.height as any;
widthEl.readOnly = false;
heightEl.readOnly = false;
//console.dir(state);
this.display.set(state);
}
private cmd (msg : Message) {

5
static/css/style.css
View File

@ -2,6 +2,9 @@ html, body{
margin: 0px;
padding: 0px;
background: black;
overflow: hidden;
min-width: 640px;
min-height: 480px;
}
#main{
@ -42,7 +45,7 @@ html, body{
#screen .field-row{
display: inline-block;
margin-left: 20px;
margin-left: 10px;
}
#screen .field-row input {

7
static/js/index.js
View File

@ -178,7 +178,12 @@ class Client {
document.getElementById('sequenceProgress').innerText = `Progress: ${Math.round(sequence.progress)}%`;
}
setDisplay(state) {
console.dir(state);
const widthEl = document.getElementById('displayWidth');
const heightEl = document.getElementById('displayHeight');
widthEl.value = state.display.width;
heightEl.value = state.display.height;
widthEl.readOnly = false;
heightEl.readOnly = false;
this.display.set(state);
}
cmd(msg) {

2
static/js/index.js.map
View File

File diff suppressed because one or more lines are too long

38
views/index.hbs
View File

@ -20,15 +20,29 @@
<div class="window-body">
<div>
<ul class="tree-view" id="display"><canvas></canvas></ul>
<div id="screen">Screen Resolution :
<span class="field-row">
<label for="width">Width</label>
<input id="width" type="text" value="{{width}}" readonly />
</span>
<span class="field-row">
<label for="height">Height</label>
<input id="height" type="text" value="{{height}}" readonly />
</span>
<div>
<fieldset id="screenResolution">
<legend>Screen</legend>
<span class="field-row">
<label for="width">Width</label>
<input id="width" type="text" value="{{width}}" readonly />
</span>
<span class="field-row">
<label for="height">Height</label>
<input id="height" type="text" value="{{height}}" readonly />
</span>
</fieldset>
<fieldset id="displayResolution">
<legend>Display</legend>
<span class="field-row">
<label for="displayWidth">Width</label>
<input id="displayWidth" type="text" value="0" readonly />
</span>
<span class="field-row">
<label for="displayHeight">Height</label>
<input id="displayHeight" type="text" value="0" readonly />
</span>
</fieldset>
</div>
</div>
<!--
@ -55,9 +69,9 @@
<button id="start" class="sequenceCtrl" disabled>Start</button>
<button id="stop" class="sequenceCtrl" disabled>Stop</button>
<button id="pause" class="sequenceCtrl" disabled>Pause</button>
<button id="rewind" class="sequenceCtrl" disabled><< Frame</button>
<input id="frame" value="00000" class="sequenceCtrl" readonly />
<button id="forward" class="sequenceCtrl" disabled>Frame >></button>
<button id="rewind" class="sequenceCtrl" disabled><<</button>
<input id="frame" value="00000" class="sequenceCtrl" disabled />
<button id="forward" class="sequenceCtrl" disabled>>></button>
</form>
</div>
<div>