<head>
<meta charset="utf-8">
<link rel="preconnect" href="https://js.1ink.us">
<link rel="preconnect" href="https://css.1ink.us">
<link rel="preconnect" href="https://glsl.1ink.us">
<link rel="preconnect" href="https://wasm.noahcohn.com">
<link crossorigin rel="stylesheet" charset="UTF-8" href="https://css.1ink.us/sh1.css"/>

<link rel="stylesheet" charset="UTF-8" href="./css/1inkDrop.css"/>
<title>1inkDrop</title>
</head>
<body>
<nav id="menu">
<section class="menu-section" id="menu-sections">
<br>
<div style="text-align:center;">
TIMESLIDER<br>(Seconds between video change)</div>
<br><br>
<ul class="menu-section-list">
<div id="mnu">
<div id="slideframe">
<input type="text" id="timeslider"/>
<script crossorigin src="https://js.1ink.us/slideOut.1ijs"></script>
<script crossorigin src="https://js.1ink.us/rSlider.1ijs"></script>
</div></div></ul></section></nav>
<main id="panel">
<iframe src="./bezz2.htm" style="border-top-left-radius:1.5% 2%;border-top-right-radius:1.5% 2%;border-bottom-left-radius:1.5% 2%;border-bottom-right-radius:1.5% 2%;position:fixed;border-width:0px;overflow:hidden;z-index:999996;overflow-y:hidden;overflow-x:hidden;" id="circle" title="Mask"></iframe>
<input type="checkbox" id="di" hidden/>
<input type="checkbox" id="dis" hidden/>

<div id="pmhig" hidden>0</div>
<div id="wid" hidden>0</div>
<div id="hig" hidden>0</div>
<script>
document.getElementById("wid").innerHTML=document.innerHeight;
document.getElementById("hig").innerHTML=document.innerHeight;
document.getElementById("pmhig").innerHTML=document.innerHeight;
</script>
<div id="ihid" hidden>0</div>
<div id="tim" hidden>2500</div>
<div id="shut" hidden>1</div>
<div id="isrc" hidden>./intro.mp4</div>
<div id="idur" hidden>0</div>
<div id="itim" hidden>0</div>

<input type="button" id="btn3" style="background-color:green;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:red;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="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="btn6" style="background-color:yellow;position:absolute;display:block;left:3%;top:53%;z-index:999997;border:5px solid green;border-radius:50%;"></input>
<input type="button" id="btn7" style="background-color:maroon;position:absolute;display:block;left:3%;top:63%;z-index:999997;border:5px solid green;border-radius:50%;"></input>
<input type="button" id="btn8" style="background-color:grey;position:absolute;display:block;left:13%;top:63%;z-index:999997;border:5px solid green;border-radius:50%;"></input>
<input type="button" id="btn1" style="background-color:maroon;position:absolute;display:block;left:23%;top:33%;z-index:999997;border:5px solid green;border-radius:50%;"></input>
<input type="button" id="btn11" style="background-color:red;position:absolute;display:block;left:5%;top:63%;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" hidden=1></progress>
</div>
<div id="wrap">

<div id="contain" style="z-index:999993;position:absolute;top:0px;bottom:0px;width:100vh;">
<div id="contain2">
<img src="./pm/tree.jpg" loop style="z-index:999994;height:100vh;width:100vw;position:absolute;left:0;background-color:rgba(0,0,0,1);"></img>
<canvas id="bcanvas" style="background-color:rgba(1,1,1,0);margin-left:auto;margin-right:auto;z-index:999994;position:absolute;top:0px;bottom:0px;width:100vh;height:100vh;"></canvas>
<canvas id="scanvas" style="background-color:rgba(1,1,1,0);margin-left:auto;margin-right:auto;z-index:999994;position:absolute;top:0px;bottom:0px;width:100vh;height:100vh;"></canvas>
<canvas class="emscripten" id="pcanvas" style="background-color:rgba(1,1,1,0);margin-left:auto;margin-right:auto;z-index:999995;position:absolute;top:0px;bottom:0px;width:100vh;height:100vh;"></canvas>
<canvas id="canvas" style="background-color:rgba(1,1,1,0);margin-left:auto;margin-right:auto;z-index:999995;position:absolute;top:0px;bottom:0px;width:100vh;height:100vh;"></canvas>
</div>
</div>
</div>

<div id="path">Yin.milk</div>
<div id="path2">Zylot.milk</div>
<div id="path3">Unchained.milk</div>
<div id="path4">Yin.milk</div>
<div id="ihig"></div>
<div id="iwid"></div>
<div id="shut">1</div>
</main>
<div id="vidWrapA">
<video hidden muted src="./intro.mp4" crossorigin id="mv" preload="auto" style="pointer-events:none;"></video>
</div>
<div id="vidWrapB">
<video hidden muted src="./intro.mp4" crossorigin id="ldv" preload="auto" style="pointer-events:none;"></video>
</div>
<audio crossorigin id="track" preload="auto" hidden style="pointer-events:none;"></audio>
<div>
<video hidden muted src=./intro.mp4 crossorigin playsinline id=mv preload=auto style='pointer-events:none;' />
</div>
<div>
<video hidden muted src=./intro.mp4 crossorigin playsinline id=ldv preload=auto style='pointer-events:none;' />
</div></div>
<audio crossorigin id=track preload=none hidden style='pointer-events:none;'></audio>
<script>
/*
var file1="<?php $dr='./presets';$fi=scandir($dr);$rnd=rand(3,count($fi));echo "$fi[$rnd]";?>";
file1=file1.replace("%20"," ");
file1=file1.replace("&amp;","&");
var file2="<?php $dr='./presets';$fi=scandir($dr);$rnd=rand(3,count($fi));echo "$fi[$rnd]";?>";
file2=file2.replace("%20"," ");
file2=file2.replace("&amp;","&");
var file3="<?php $dr='./presets';$fi=scandir($dr);$rnd=rand(3,count($fi));echo "$fi[$rnd]";?>";
file3=file3.replace("%20"," ");
file3=file3.replace("&amp;","&");
var file4="<?php $dr='./presets';$fi=scandir($dr);$rnd=rand(3,count($fi));echo "$fi[$rnd]";?>";
file4=file4.replace("%20"," ");
file4=file4.replace("&amp;","&");
*/
document.getElementById('path').innerHTML="./presets/xtra.milk";
document.getElementById('path2').innerHTML="./presets/shroom.milk";
document.getElementById('path3').innerHTML="./presets/shroom.milk";
document.getElementById('path4').innerHTML="./presets/xtra.milk";
document.getElementById('btn2').style="background-color:red;position:absolute;display:block;left:3%;top:3%;z-index:999997;border:5px solid green;border-radius:50%;";
document.getElementById('btn2').addEventListener('click', function(){
document.getElementById("ihig").innerHTML=window.innerHeight;
document.getElementById("circle").height=window.innerHeight;
document.getElementById("circle").width=window.innerWidth;
document.getElementById('btn3').style="background-color:green;position:absolute;display:block;left:3%;top:13%;z-index:999997;border:5px solid green;border-radius:50%;";
});
document.getElementById('btn3').addEventListener('click', function(){
document.getElementById('btn').style="background-color:blue;position:absolute;display:block;left:3%;top:23%;z-index:999997;border:5px solid green;border-radius:50%;"
});
document.getElementById('btn').addEventListener('click', function(){
document.getElementById('btn4').style="background-color:grey;position:absolute;display:block;left:3%;top:33%;z-index:999997;border:5px solid green;border-radius:50%;";
document.getElementById('btn5').style="background-color:pink;position:absolute;display:block;left:3%;top:43%;z-index:999997;border:5px solid green;border-radius:50%;";
document.getElementById('btn6').style="background-color:yellow;position:absolute;display:block;left:3%;top:53%;z-index:999997;border:5px solid green;border-radius:50%;";
document.getElementById('btn7').style="background-color:maroon;position:absolute;display:block;left:3%;top:63%;z-index:999997;border:5px solid green;border-radius:50%;";
});
document.getElementById('btn6').addEventListener('click', function(){
let midl=Math.round((window.innerWidth*0.5)-(window.innerHeight*0.5));
document.getElementById("contain2").style="background-color:rgba(1,1,1,0);pointer-events:none;z-index:999993;height:"+window.innerHeight+"px;width:"+window.innerHeight+"px;position:absolute;top:0px;left:"+midl+"px;";
document.getElementById("pcanvas").style="position:absolute;left:0;top:0;background-color:rgba(1,1,1,0);z-index:999995;image-rendering:pixelated;width:"+window.innerHeight+"px;height:"+window.innerHeight+"px;";
document.getElementById("canvas").style="position:absolute;left:0;top:0;background-color:rgba(1,1,1,0);z-index:999995;image-rendering:pixelated;width:"+window.innerHeight+"px;height:"+window.innerHeight+"px;";
});
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(){
var canvas=document.getElementById('pcanvas');
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])*100;
progressElement.max=parseInt(m[4])*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>
<script charset="utf-8" src="https://wasm.noahcohn.com/b3hd/m0-001.1ijs"></script>