<!--
TODOs:
Move Google sign-in/out buttons, and make it clear when you're not signed in.
Move "Reset" and "Manual Link" options in here.
Clean up the Options/Input header, move parts of it into a hidden "Advanced" menu.
Create a cleaner player-only version of the page, or find a way to make it a version of this one via URL switch.
-->
<!DOCTYPE html>
< html lang = "en-US" >
< head >
< meta charset = "utf-8" >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >
< title > Thrimbletrimmer Goes Forth< / title >
< meta name = "description" content = "" >
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
< meta name = "google-signin-client_id" content = "345276493482-r84m2giavk10glnmqna0lbq8e1hdaus0.apps.googleusercontent.com" >
< link href = "/thrimbletrimmer/plugins/video.js/dist/video-js.min.css" rel = "stylesheet" >
< link href = "/thrimbletrimmer/plugins/videojs-hls-quality-selector/dist/videojs-hls-quality-selector.css" rel = "stylesheet" >
< link href = "/thrimbletrimmer/plugins/videojs-trimming-controls/dist/videojs-trimming-controls.css" rel = "stylesheet" >
< link href = "https://fonts.googleapis.com/icon?family=Material+Icons" rel = "stylesheet" >
<!-- <script src="https://code.jquery.com/jquery - 3.3.1.min.js" integrity="sha256 - FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> -->
< script src = "/thrimbletrimmer/plugins/video.js/dist/video.min.js" > < / script >
< script src = "/thrimbletrimmer/plugins/videojs-contrib-quality-levels/dist/videojs-contrib-quality-levels.min.js" > < / script >
< script src = "/thrimbletrimmer/plugins/videojs-hls-quality-selector/dist/videojs-hls-quality-selector.min.js" > < / script >
< script src = "/thrimbletrimmer/plugins/videojs-trimming-controls/dist/videojs-trimming-controls.js" > < / script >
< script src = "https://apis.google.com/js/platform.js?onload=onGLoad" async defer > < / script >
< link href = "/thrimbletrimmer/styles/style.css" rel = "stylesheet" >
< / head >
< body >
< div style = "max-width:1280px;margin:auto;padding-top:25px;" >
< table id = "wubloaderInputTable" >
< tr >
< th > Stream< / th >
< th > Start Time< / th >
< th > End Time< / th >
< th > < / th >
< / tr >
< tr >
< td > < input id = "StreamName" value = "desertbus" / > < / td >
< td > < input id = "StreamStart" style = "display:none;" class = "UTCTimeInput" value = "" / > < input id = "BusTimeStart" class = "BusTimeInput" value = "0:00" / > < / td >
< td > < input id = "StreamEnd" style = "display:none;" class = "UTCTimeInput" value = "" / > < input id = "BusTimeEnd" class = "BusTimeInput" value = "1:00" / > < / td >
< td > < input type = "button" value = "Load Playlist" onclick = "loadPlaylist()" / > < / td >
< / tr >
< tr >
< td > < / td >
< td > < / td >
< td >
< input type = "radio" id = "BusTimeToggleUTC" name = "BusTimeToggle" value = "UTC" onclick = "toggleTimeInput(this.value)" > UTC
< input type = "radio" id = "BusTimeToggleBus" name = "BusTimeToggle" value = "BUSTIME" onclick = "toggleTimeInput(this.value)" checked = "checked" > Bustime
< / td >
< td > < a id = "AdvancedOptionsButton" href = "JavaScript:toggleHiddenPane('wubloaderAdvancedInputTable');" > Advanced Submit Options< / a > < / td >
< / tr >
< / table >
< table id = "wubloaderAdvancedInputTable" style = "display:none;" >
< tr >
< td > < a href = "#" onclick = "window.open('/files');" > Streams< / a > < / td >
< td > < a href = "#" onclick = "window.open('/files/' + document.getElementById('StreamName').value + '/source', '_blank');" > Hours< / a > < / td >
< / tr >
< tr > < td > Allow Holes: < / td > < td > < input id = "AllowHoles" type = "checkbox" / > < / td > < / tr >
< tr > < td > Quality Level: < / td > < td > < select id = "qualityLevel" > < / select > < / td > < / tr >
< tr > < td > Upload Location: < / td > < td > < select id = "uploadLocation" > < / select > < / td > < / tr >
< tr > < td > Uploader Whitelist: < / td > < td > < input id = "uploaderWhitelist" title = "Uploader Whitelist" / > < / td > < / tr >
< tr >
< td > ThrimShim ID:< / td >
< td > < input id = "hiddenSubmissionID" value = "" / > < / td >
< td > < input type = "button" value = "Load Event" onclick = "window.location.search = '?id='+document.getElementById('hiddenSubmissionID').value" / > < / td >
< / tr >
< / table >
< div id = "EditorContainer" >
< video id = "my-player" class = "video-js" controls preload = "auto" style = "display:none" >
< p class = "vjs-no-js" > To view this video please enable JavaScript, and consider upgrading to a web browser that < a href = "http://videojs.com/html5-video-support/" target = "_blank" > supports HTML5 video< / a > < / p >
< / video >
< / div >
< div id = "EditorDetailsPane" >
< div >
Title: < br / >
< input type = "text" id = "VideoTitlePrefix" value = "DB2019 - " disabled >
< input type = "text" id = "VideoTitle" value = "" maxlength = "82" / >
< / div >
< div >
Description:< br / >
< textarea id = "VideoDescription" > < / textarea >
< / div >
< input type = "button" id = "SubmitButton" value = "Submit" onclick = "thrimbletrimmerSubmit('EDITED')" / >
< input type = "button" id = "DraftButton" value = "Save Draft" onclick = "thrimbletrimmerSubmit('UNEDITED')" / >
< input type = "button" id = "DownloadButton" value = "Download" onclick = "thrimbletrimmerDownload()" / >
< a href = "/thrimbletrimmer/dashboard.html" > Go To Dashboard< / a > |
< a id = "ManualLinkButton" href = "JavaScript:toggleHiddenPane('ManualLinkPane');" > Manual Link< / a > |
< a id = "ResetButton" href = "JavaScript:thrimbletrimmerResetLink();" > Reset Edits< / a >
< a id = "HelpButton" style = "float:right;" href = "JavaScript:toggleHiddenPane('HelpPane');" > Help< / a >
< a id = "UltrawideButton" style = "float:right;margin-right:10px;" href = "JavaScript:toggleUltrawide();" > Ultrawide< / a >
< / div >
< div id = "ManualLinkPane" style = "display:none" >
< input id = "ManualLink" / > < input type = "button" id = "ManualButton" onclick = "thrimbletrimmerManualLink()" value = "Set Link" / >
< / div >
< div id = "HelpPane" style = "display:none;" >
< ul >
< li > J/K/L - Back 10 seconds, Play/Pause, Advance 10 seconds< / li >
< li > LeftArrow/RightArrow - Back 5 seconds, Advance 5 seconds< / li >
< li > ,/. - Back 0.1 seconds, Advance 0.1 seconds< / li >
< li > I/O - Set start of trim at playhead, set end of trim at playhead< / li >
< li > 0-9 - Jump to 0% - 90% through the video.< / li >
< / ul >
< / div >
< / div >
< iframe id = "outputFile" style = "display:none;" > < / iframe >
< script src = "/thrimbletrimmer/scripts/playerSetup.js" > < / script >
< script src = "/thrimbletrimmer/scripts/keyboardShortcuts.js" > < / script >
< script src = "/thrimbletrimmer/scripts/IO.js" > < / script >
< script > pageSetup ( ) ; < / script >
< script >
function toggleHiddenPane(paneID) {
var pane = document.getElementById(paneID);
pane.style.display = (pane.style.display === "none") ? "block":"none";
}
function toggleUltrawide() {
var body = document.getElementsByTagName("Body")[0];
body.classList.contains("ultrawide") ? body.classList.remove("ultrawide"):body.classList.add("ultrawide");
}
function toggleTimeInput(toggleInput) {
if(toggleInput == "UTC") {
setStreamRange();
document.getElementById("BusTimeStart").style.display = "none";
document.getElementById("BusTimeEnd").style.display = "none";
document.getElementById("StreamStart").style.display = "";
document.getElementById("StreamEnd").style.display = "";
} else {
setBustimeRange();
document.getElementById("StreamStart").style.display = "none";
document.getElementById("StreamEnd").style.display = "none";
document.getElementById("BusTimeStart").style.display = "";
document.getElementById("BusTimeEnd").style.display = "";
}
}
< / script >
< div class = "g-signin2" data-onsuccess = "onSignIn" > < / div >
< a href = "#" onclick = "signOut();" > Sign out< / a >
< script >
var user;
function onSignIn(googleUser) {
user = googleUser;
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
console.log('ID Token: ' + googleUser.getAuthResponse().id_token);
}
function signOut() {
user = null;
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
console.log('User signed out.');
});
}
< / script >
< / body >
< / html >
