<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>mcopy</title> <link href="./css/bootstrap.min.css" rel="stylesheet"> <link href="./css/font-awesome.min.css" rel="stylesheet"> <link href="./css/w2ui-1.4.3.min.css" rel="stylesheet"> <link href="./css/effeckt.css" rel="stylesheet"> <link href="./css/codemirror.min.css" rel="stylesheet"> <link href="./css/monokai.css" rel="stylesheet"> <link href="./css/app.css" rel="stylesheet"> </head> <body onload="init();"> <nav id="toolbar"></nav> <div id="screens"> <div id="sequencer" class="screen" style="display: block;"> <div id="counters"> <div class="cam"> <label>CAMERA</label> <input type="number" id="seq_cam_count" class="count" value="00000" onchange="gui.counterFormat(this, mcopy.state.camera.pos);" onblur="gui.updateCam(this);" /> </div> <div class="proj"> <label>PROJECTOR</label> <input type="number" id="seq_proj_count" class="count" value="00000" onchange="gui.counterFormat(this, mcopy.state.projector.pos);" onblur="gui.updateProj(this);" /> </div> </div> <div id="seq_scroll"> <div id="sequence"> <div id="cam_forward" class="row" y="0"></div> <div id="proj_forward" class="row" y="1"></div> <div id="cam_backward" class="row spacer" y="0"></div> <div id="proj_backward" class="row" y="1"></div> <div id="light_set" class="row spacer"></div> <div id="numbers" class="row"></div> </div> <div id="seq_labels"> <div><span>CAM </span><i class="fa fa-plus"></i></div> <div><span>PRO </span><i class="fa fa-plus"></i></div> <div class="spacer"><span>CAM </span><i class="fa fa-minus"></i></div> <div><span>PRO </span><i class="fa fa-minus"></i></div> <div class="spacer"><span>LIGHT</span></div> </div> </div> <div id="actions"> <button id="seq_run" onclick="seq.init();">RUN</button> <button id="seq_stop" onclick="seq.stop(true);">STOP</button> <button id="seq_clear" onclick="gui.grid.clear();">CLEAR</button> <button id="seq_plus24" onclick="gui.grid.plus_24();">+ 24</button> <button id="seq_mscript" onclick="gui.mscript.generate(mcopy.state.sequence.arr);">TO SCRIPT</button> <input id="seq_scroll_state" type="number" min="0" value="00000" /> </div> <div id="seq_stats"> <div class="seq_count"># of steps: <span>0</span></div> <div class="timing">To complete: <span>0 ms</span></div> <div class="cam_end">Camera end: <span>00000</span></div> <div class="proj_end">Projector end: <span>00000</span></div> </div> <div id="seq_loop"> <h3>LOOPS</h3> <input type="number" min="1" id="seq_loop" value="00001" onchange="this.value = gui.fmtZero(this.value, 6); gui.grid.loopChange(this);"/> <div id="loop_current"></div> </div> </div> <div id="script" class="screen"> <textarea id="editor"></textarea> <footer id="console"> <textarea>> </textarea> </footer> </div> <div id="controls" class="screen"> <div id="counters_2"> <div class="cam"> <label>CAMERA</label> <input type="number" id="seq_cam_count_2" class="count" value="00000" onchange="gui.counterFormat(this, mcopy.state.camera.pos);" onblur="gui.updateCam(this);" /> </div> <div class="proj"> <label>PROJECTOR</label> <input type="number" id="seq_proj_count_2" class="count" value="00000" onchange="gui.counterFormat(this, mcopy.state.projector.pos);" onblur="gui.updateProj(this);" /> </div> </div> <footer> <div id="log"></div> </footer> </div> <div id="light" class="screen"> <div id="colors-tabs"></div> <div id="colors-content"> <div id="kelvin-page" class="colors-page" style="display: block;"> <h3>TEMPERATURE</h3> <input id="kelvin" type="number" min="0" max="20000" value="0" /> <h4>KELVIN</h4> <div id="kelvin-slider"> <div id="kelvin-scale"></div> <div id="kelvin-pos"></div> <div id="kelvin-preview"> rgb(0, 0, 0) </div> </div> </div> <div id="cmy-page" class="colors-page"> <div id="dial-c" class="dial-wrapper"> <div class="dial-container dial-container1"> <div class="dial-wedge"></div> </div> <div class="dial-container dial-container2"> <div class="dial-wedge"></div> </div> <div class="dial-marker dial-start"></div> <div class="dial-marker dial-end"></div> <input type="number" value="1.00" step="0.01" min="0.00" max="1.00" /> </div> <div id="dial-m" class="dial-wrapper"> <div class="dial-container dial-container1"> <div class="dial-wedge"></div> </div> <div class="dial-container dial-container2"> <div class="dial-wedge"></div> </div> <div class="dial-marker dial-start"></div> <div class="dial-marker dial-end"></div> <input type="number" value="1.00" step="0.01" min="0.00" max="1.00" /> </div> <div id="dial-y" class="dial-wrapper"> <div class="dial-container dial-container1"> <div class="dial-wedge"></div> </div> <div class="dial-container dial-container2"> <div class="dial-wedge"></div> </div> <div class="dial-marker dial-start"></div> <div class="dial-marker dial-end"></div> <input type="number" value="1.00" step="0.01" min="0.00" max="1.00" /> </div> <div id="dial-k" class="dial-wrapper"> <div class="dial-container-bg"></div> <div class="dial-container dial-container1"> <div class="dial-wedge"></div> </div> <div class="dial-container dial-container2"> <div class="dial-wedge"></div> </div> <div class="dial-marker dial-start"></div> <div class="dial-marker dial-end"></div> <input type="number" value="1.00" step="0.01" min="0.00" max="1.00" /> </div> <div id="cmy-preview"> rgb(0, 0, 0) </div> </div> <div id="rgb-page" class="colors-page"> <input id="rgb" value="rgb(0, 0, 0)" /> </div> </div> <div id="light-status"> <h3>LIGHT STATUS</h3> <div> <form> <span>R</span><input type="text" value="0" readonly /><br /> <span>G</span><input type="text" value="0" readonly /><br /> <span>B</span><input type="text" value="0" readonly /> </form> <div id="color"></div> </div> <div id="preview-wrap"> <h4><span>PREVIEW</span></h4> <input type="checkbox" name="preview" id="preview" class="effeckt-ckbox-ios7" /> </div> </div> <footer id="light-swatches"> <div id="new-swatch"> <i class="fa fa-plus"></i> </div> </footer> </div> </div> <div id="overlay" onclick="gui.overlay(false);gui.spinner(false);"></div> <div id="spinner"></div> <script src="./js/app.js"></script> </body> </html>