<head>
<meta charset="UTF-8">
<link rel="preconnect" href="https://css.1ink.us"/>
<link rel="preconnect" href="https://js.1ink.us"/>
<link rel="preconnect" href="https://img.1ink.us">
<link rel="preconnect" href="https://wasm.noahcohn.com"/>
<title>S*H*1*D</title>
<style>
::-webkit-scrollbar{display:none;}
#wrap{padding-top:0em;position:absolute;top:50%;left:50%;-moz-transform:translateX(-50%)translateY(-50%);-webkit-transform:translateX(-50%)translateY(-50%);transform:translateX(-50%)translateY(-50%);}
canvas{height:100vh;width:100vh;image-rendering:pixelated;}
body{background-color:black;overflow-x:hidden;overflow-y:scroll;}
</style>
</head>
<body>
<script charset="UTF-8" async src="./gui003.1ijs"></script>
<nav id="menu">
<section class="menu-section" id="menu-sections">
<br>
<div style="text-align:center;">
TIMESLIDER</div>
<br><br>
<ul class="menu-section-list">
<div id="mnu">
<div id="slideframe">
<input type="text" id="timeslider"/>
</div></div></ul></section></nav>
<main id="panel">
<script>
function opn(){
setTimeout(
function(){
document.getElementById('shut').innerHTML=2;
document.getElementById("circle").width=window.innerWidth;
document.getElementById("circle").height=window.innerHeight;
let $hg=window.innerHeight+"px";
let $md=Math.round(parseInt(window.innerWidth,10)*0.5)-(window.innerHeight*0.5);
let $hmd=Math.round(parseInt(window.innerHeight,10)*0.5)-(window.innerHeight*0.5);
document.getElementById("ihig").innerHTML=window.innerHeight;
document.getElementById("pmhig").innerHTML=window.innerHeight;
document.getElementById("iwid").innerHTML=window.innerHeight;
document.getElementById("canvas").style.top=0;
document.getElementById("wrap").style.lineheight=$hg;
document.getElementById("di").click();
},800)};
</script>
<iframe src="./bezz.1ink" style="border-width:0px;position:absolute;top:0px;left:0px;right:0px;bottom:0px;overflow:hidden;z-index:999996;display:block;overflow-y:hidden;overflow-x:hidden;pointer-events:none;" id="circle" onload="opn();" title="Circular mask"></iframe>
<input type="button" id="btn1" style="background-color:black;position:absolute;display:block;left:5%;top:50%;z-index:999997;border:5px solid #e7e7e7;border-radius:50%;"></input>
<input type="button" id="btn3" style="background-color:purple;position:absolute;display:block;left:3%;top:13%;z-index:999997;border:5px solid red;border-radius:50%;" onclick="document.getElementById('di').click();"></input>
<input type="button" id="btn" style="background-color:blue;position:absolute;display:block;left:3%;top:23%;z-index:999997;border:5px solid red;border-radius:50%;" onclick="document.getElementById('di').click();"></input>
<input type="button" id="btn2" style="background-color:white;position:absolute;display:block;left:3%;top:3%;z-index:999997;border:5px solid red;border-radius:50%;" onclick="document.getElementById('di').click();"></input>
<input type="button" id="btn9" style="background-color:tan;position:absolute;display:block;left:5%;top:3%;z-index:999997;border:5px solid red;border-radius:50%;" onclick="document.getElementById('di').click();"></input>
<input type="button" id="btn4" style="background-color:grey;position:absolute;display:block;left:3%;top:33%;z-index:999997;border:5px solid red;border-radius:50%;" onclick="document.getElementById('di').click();"></input>
<input type="button" id="btn5" style="background-color:pink;position:absolute;display:block;left:3%;top:43%;z-index:999997;border:5px solid red;border-radius:50%;" onclick="document.getElementById('di').click();"></input>
<input type="button" id="btn10" style="background-color:purple;position:absolute;display:block;left:8%;top:3%;z-index:999997;border:5px solid red;border-radius:50%;"></input>

<input type="button" id="btn6" style="background-color:yellow;position:absolute;display:block;left:3%;top:53%;z-index:999997;border:5px solid red;border-radius:50%;"></input>
<input type="button" id="btn7" style="background-color:black;position:absolute;display:block;left:3%;top:63%;z-index:999997;border:5px solid red;border-radius:50%;"></input>
<input type="button" id="btn8" style="background-color:cyan;position:absolute;display:block;left:3%;top:73%;z-index:999997;border:5px solid green;border-radius:50%;"></input>
<div class="emscripten" id="status">Wasming...</div>
<div class="emscripten">
<progress value="0" max="100" id="progress"></progress>
</div>
<input type="checkbox" id="di" hidden/>
<input type="checkbox" id="dis" hidden/>
<div hidden id="path">./Simple2D.frag</div>
<div hidden id="path2">./Simple2D.vert</div>
<div hidden id="path3">./</div>
<div hidden id="path4">./</div>
<div id="iwid" hidden></div>
<div id="ihig" hidden></div>
<div id="pmhig" hidden></div>
<div id="wid" hidden></div>
<div id="hig" hidden></div>
<div id="ihid" hidden></div>
<div id="shut" hidden>1</div>
<div id="wrap">
<div id="contain2">
<canvas class="emscripten" id="canvas"></canvas>
</div>
</div>
</main>
<script>
var statusElement=document.getElementById('status');
var progressElement=document.getElementById('progress');
var Module={preRun:[],postRun:[],print:(function(){
var element=document.getElementById('output');
if(element) element.value='';
return function(text){
if(arguments.length>1)text=Array.prototype.slice.call(arguments).join(' ');
console.log(text);
if(element){
element.value+=text+"\n";
element.scrollTop=element.scrollHeight;
}};})(),printErr:function(text){
if(arguments.length>1)text=Array.prototype.slice.call(arguments).join(' ');
if(0){
dump(text+'\n');
}else{
console.error(text);
}},canvas:(function(){
let canvas=document.getElementById('canvas');
canvas.addEventListener("webglcontextlost",function(e){
alert('WebGL context lost. You will need to reload the page.');
e.preventDefault();
},false);
return canvas;
})(),setStatus:function(text){
if(!Module.setStatus.last){
Module.setStatus.last={
time:Date.now(),text:''
};}
if(text===Module.setStatus.text){
return;
}
var m=text.match(/([^(]+)\((\d+(\.\d+)?)\/(\d+)\)/);
var now=Date.now();
if(m&&now-Date.now()<30){
return;
}
if(m){
text=m[1];
progressElement.value=parseInt(m[2],10)*100;
progressElement.max=parseInt(m[4],10)*100;
progressElement.hidden=false;
}else{
progressElement.value=null;
progressElement.max=null;
progressElement.hidden=true;
}
statusElement.innerHTML=text;
},totalDependencies:0,monitorRunDependencies:function(left){
this.totalDependencies=Math.max(this.totalDependencies,left);
Module.setStatus(left?'Preparing... ('+(this.totalDependencies-left)+'/'+this.totalDependencies+')':'All downloads complete.');
}};
Module.setStatus('Downloading...');
window.onerror=function(event){
Module.setStatus('Exception thrown,see JavaScript console');
Module.setStatus=function(text){
if(text){
Module.printErr('[post-exception status] '+text);
}};};
</script>
</body>