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) { 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); this.display.set(state);
} }
private cmd (msg : Message) { private cmd (msg : Message) {

5
static/css/style.css
View File

@ -2,6 +2,9 @@ html, body{
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
background: black; background: black;
overflow: hidden;
min-width: 640px;
min-height: 480px;
} }
#main{ #main{
@ -42,7 +45,7 @@ html, body{
#screen .field-row{ #screen .field-row{
display: inline-block; display: inline-block;
margin-left: 20px; margin-left: 10px;
} }
#screen .field-row input { #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)}%`; document.getElementById('sequenceProgress').innerText = `Progress: ${Math.round(sequence.progress)}%`;
} }
setDisplay(state) { 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); this.display.set(state);
} }
cmd(msg) { 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 class="window-body">
<div> <div>
<ul class="tree-view" id="display"><canvas></canvas></ul> <ul class="tree-view" id="display"><canvas></canvas></ul>
<div id="screen">Screen Resolution : <div>
<span class="field-row"> <fieldset id="screenResolution">
<label for="width">Width</label> <legend>Screen</legend>
<input id="width" type="text" value="{{width}}" readonly /> <span class="field-row">
</span> <label for="width">Width</label>
<span class="field-row"> <input id="width" type="text" value="{{width}}" readonly />
<label for="height">Height</label> </span>
<input id="height" type="text" value="{{height}}" readonly /> <span class="field-row">
</span> <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>
</div> </div>
<!-- <!--
@ -55,9 +69,9 @@
<button id="start" class="sequenceCtrl" disabled>Start</button> <button id="start" class="sequenceCtrl" disabled>Start</button>
<button id="stop" class="sequenceCtrl" disabled>Stop</button> <button id="stop" class="sequenceCtrl" disabled>Stop</button>
<button id="pause" class="sequenceCtrl" disabled>Pause</button> <button id="pause" class="sequenceCtrl" disabled>Pause</button>
<button id="rewind" class="sequenceCtrl" disabled><< Frame</button> <button id="rewind" class="sequenceCtrl" disabled><<</button>
<input id="frame" value="00000" class="sequenceCtrl" readonly /> <input id="frame" value="00000" class="sequenceCtrl" disabled />
<button id="forward" class="sequenceCtrl" disabled>Frame >></button> <button id="forward" class="sequenceCtrl" disabled>>></button>
</form> </form>
</div> </div>
<div> <div>