Untitled
unknown
plain_text
a year ago
5.5 kB
1
Indexable
Never
<!DOCTYPE html> <html> <head> <title>garbage editing software</title> <style> body { margin: 0; } #preview { z-index: 10; } .dataData { display: none; } #sideMenu { border: 1px solid gray; position: absolute; right: 0px; width: 400px; z-index: 3; top: 0px; bottom: 0px; } #timeline { z-index: 2; position: absolute; bottom: 0px; display: none; height: 300px; left: 0px; right: 0px; border: 1px solid gray; } .caption { z-index: 4; text-align: center; } </style> </head> <body> <video id='preview' controls></video> <br> <input type='file' oninput='loadPreview(event);' id='fileInput'> <br> <div id='timeline'> </div> <div id='sideMenu'> </div> <div id='mainCaption' class='caption'> </div> <div id='secondaryCaption' class='caption'> </div> <script> /* All videoData attributes: cutTo timestamp playSound soundId zoomIn zoomOut caption captionText captionLength clip bgMusic bgmId bgmLength bgVoiceover */ var videoData=[ ]; var cutting=false; var recording=false; var fg; function loadPreview(event) { document.getElementById('preview').src=URL.createObjectURL(event.target.files[0]); } function recordVideo() { if (recording==false) { document.getElementById('preview').removeAttribute('controls'); document.getElementById('preview').setAttribute('width', '100%'); document.getElementById('preview').setAttribute('height', '100%'); document.getElementById('fileInput').display='none'; document.getElementById('sideMenu').display='none'; document.getElementById('preview').play(); recording=true; } else { document.getElementById('preview').setAttribute('controls', 'true'); document.getElementById('preview').removeAttribute('width'); document.getElementById('preview').removeAttribute('height'); document.getElementById('fileInput').display='block'; document.getElementById('sideMenu').display='block'; recording=false; } } function videoLoop() { setInterval(function(){ var vidTimestamp=document.getElementById('preview').currentTime; for (var i=0;i<videoData.length;i++) { if (Math.round(videoData[i].tim)==vidTimestamp) { eval(videoData[i].editScript); } } parseVidData(); },1) } document.onkeydown=function(e) { if (e.code=="Backquote") { recordVideo(); } if (document.getElementById('preview').paused==false) { if (e.code=='ShiftLeft') { toggleCutting(); } if (e.code=='ShiftRight') { toggleCaption(); } parseVidData(); } } function parseVidData() { var html=` `; for (var i=0;i<videoData.length;i++) { var htmlToAdd=` <span onclick='toggleEvt(${i})' class='clickSpan' evtActive='false'>Cut ↓</span> <div class='dataData' evtActive='false'> ${videoData[i].editType} at ${videoData[i].tim} <br> EditScript: <br> <textarea class='escriptedit'>${videoData[i].editScript}</textarea> <br> <button onclick='modEScript(${i})'>Modify EditScript</button> <br> <button onclick='deleteData(${i});parseVidData();'>Delete Event</button> </div> `; html+=htmlToAdd; } document.getElementById('sideMenu').innerHTML=html; } function toggleEvt(id) { if (document.getElementsByClassName('dataData')[id].evtActive=='false') { document.getElementsByClassName('dataData')[id].evtActive='true'; document.getElementsByClassName('dataData')[id].style.display='block'; } else { document.getElementsByClassName('dataData')[id].evtActive='false' document.getElementsByClassName('dataData')[id].style.display='none'; } } function modEScript(n) { videoData[n].editScript=document.getElementsByClassName('escriptedit')[n].value; } function deleteData(i) { videoData.splice(videoData[i], 1) } // actual editing functions function toggleCutting() { var newData={}; newData.editType='Cut'; if (cutting==true) { cutting=false; newData.tim=fg; newData.editScript='cutTo('+document.getElementById('preview').currentTime+')'; videoData.push(newData); } else if (cutting==false) { cutting=true; fg=document.getElementById('preview').currentTime; } } function playSound(soundId) { } function toggleCaption() { } </script> </body> </html>