258 lines
18 KiB
HTML
258 lines
18 KiB
HTML
|
<!DOCTYPE html>
|
||
|
<html>
|
||
|
<head>
|
||
|
<meta charset="UTF-8" />
|
||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
|
<meta name="description" content="EaglercraftX 1.8 test directory HTML page" />
|
||
|
<meta name="keywords" content="eaglercraft, eaglercraftx, minecraft, 1.8, 1.8.8" />
|
||
|
<title>EaglercraftX 1.8</title>
|
||
|
<meta property="og:locale" content="en-US" />
|
||
|
<meta property="og:type" content="website" />
|
||
|
<meta property="og:title" content="EaglercraftX 1.8" />
|
||
|
<meta property="og:description" content="test directory HTML page" />
|
||
|
<link type="image/png" rel="shortcut icon" href="favicon.png" />
|
||
|
<script type="text/javascript" src="classes.js"></script>
|
||
|
<script type="text/javascript" src="fix-webm-duration.js"></script>
|
||
|
<style>
|
||
|
@font-face {
|
||
|
font-family: Aller;
|
||
|
src: url(Aller_Bd.ttf);
|
||
|
}
|
||
|
html {
|
||
|
font-family: sans-serif;
|
||
|
text-align: center;
|
||
|
}
|
||
|
|
||
|
#progresstext {
|
||
|
font-weight: bold;
|
||
|
top: 30vh;
|
||
|
position: relative;
|
||
|
font-size: 1.75vw;
|
||
|
}
|
||
|
|
||
|
#clienttitle {
|
||
|
position: relative;
|
||
|
top: 25vh;
|
||
|
font-size: 8vw;
|
||
|
font-family: Aller;
|
||
|
transition: all 0.4s;
|
||
|
}
|
||
|
|
||
|
#clientversion {
|
||
|
position: absolute;
|
||
|
top: 31vh;
|
||
|
left: 74vw;
|
||
|
font-size: 2.5vw;
|
||
|
color: gray;
|
||
|
font-family: Aller;
|
||
|
transition: all 0.4s;
|
||
|
}
|
||
|
|
||
|
#progress {
|
||
|
width: 10%;
|
||
|
height: 5.5vh;
|
||
|
display: block;
|
||
|
border-radius: 10vw;
|
||
|
background-color: black;
|
||
|
transition: all 0.5s;
|
||
|
margin-top: -2.6vh;
|
||
|
margin-left: -1.3vw;
|
||
|
}
|
||
|
|
||
|
.ratio {
|
||
|
position: relative;
|
||
|
top: 13vh;
|
||
|
font-size: 2vh;
|
||
|
font-family: Aller;
|
||
|
opacity: 0;
|
||
|
transition: opacity 0.4s;
|
||
|
}
|
||
|
|
||
|
.ratio.show {
|
||
|
opacity: 1;
|
||
|
}
|
||
|
|
||
|
#meter {
|
||
|
width: 80vw;
|
||
|
margin:auto;
|
||
|
top: 28vh;
|
||
|
height: 0.2vh;
|
||
|
position: relative;
|
||
|
border: 5px solid black;
|
||
|
border-radius: 20vw;
|
||
|
padding: 1.15vw;
|
||
|
}
|
||
|
|
||
|
#dividk {
|
||
|
background-color: white;
|
||
|
position: absolute;
|
||
|
top: 0px;
|
||
|
left: 0px;
|
||
|
width: 100vw;
|
||
|
height: 100vh;
|
||
|
}
|
||
|
#mojang {
|
||
|
position: absolute;
|
||
|
left: 50vw;
|
||
|
top: 35vh;
|
||
|
width: 50vw;
|
||
|
filter: invert(100%);
|
||
|
transform: translate(-50%);
|
||
|
opacity: 0;
|
||
|
}
|
||
|
</style>
|
||
|
|
||
|
</head>
|
||
|
<body style="margin:0px;width:100vw;height:100vh;overflow:hidden;" id="game_frame">
|
||
|
<div id = "dividk">
|
||
|
<h1 id="clienttitle">Resent Client</h1>
|
||
|
|
||
|
<img id="mojang" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDIwMDEwOTA0Ly9FTiIKICJodHRwOi8vd3d3LnczLm9yZy9UUi8yMDAxL1JFQy1TVkctMjAwMTA5MDQvRFREL3N2ZzEwLmR0ZCI+CjxzdmcgdmVyc2lvbj0iMS4wIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiB3aWR0aD0iMjI1NS4wMDAwMDBwdCIgaGVpZ2h0PSI1NzIuMDAwMDAwcHQiIHZpZXdCb3g9IjAgMCAyMjU1LjAwMDAwMCA1NzIuMDAwMDAwIgogcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pZFlNaWQgbWVldCI+Cgo8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAwMCw1NzIuMDAwMDAwKSBzY2FsZSgwLjEwMDAwMCwtMC4xMDAwMDApIgpmaWxsPSIjMDAwMDAwIiBzdHJva2U9Im5vbmUiPgo8cGF0aCBkPSJNNTc5MiA1NDIwIGMtNzU4IC03OCAtMTM1NSAtNjI1IC0xNTAxIC0xMzc1IC02NyAtMzQ2IC0xMiAtNzM0IDE1MQotMTA2MCAyMDIgLTQwNiA1NDcgLTcwNSA5NzggLTg0OSAxOTggLTY2IDI4OSAtODAgNTI1IC04MCAyMjggMCAzMDEgMTAgNDg1CjY1IDM0NiAxMDIgNjU2IDMxOSA4NzkgNjE1IDEwOSAxNDYgMjIxIDM4MSAyNjkgNTY5IDgyIDMxNiA3OCA1OTYgLTExIDkxMQotMTc3IDYxOCAtNzExIDEwODggLTEzNTIgMTE4OSAtMTE4IDE4IC0zMTkgMjUgLTQyMyAxNXogbTM2MyAtODgxIGMyNTEgLTY1CjQ2MSAtMjUyIDU2MiAtNDk5IDQ0IC0xMDcgNTcgLTE3OSA1NiAtMzEwIC0xIC0yMzcgLTg3IC00MjkgLTI2NiAtNTk2IC0zMTcKLTI5NSAtNzk4IC0yOTcgLTExMDkgLTUgLTEyMSAxMTMgLTE5MSAyMjEgLTIzNiAzNjEgLTExNSAzNTggMzMgNzQ5IDM1OSA5NTMKMTkxIDExOSA0MTcgMTUzIDYzNCA5NnoiLz4KPHBhdGggZD0iTTIwMCA1MzYwIGMtMjAgLTIwIC0yMCAtMzMgLTIwIC0xNjIwIGwwIC0xNjAxIDI1IC0yNCAyNCAtMjUgMzUwIDAKYzM2NyAwIDM5NCAzIDQwNSA0NCAzIDExIDYgNTIxIDYgMTEzMSAwIDc3MCAzIDExMjIgMTEgMTE1MCAxNCA1MiAxMDIgMTM5CjE0OCAxNDggMTkgNCA5NCA3IDE2OCA3IDE0NiAwIDE4NSAtMTAgMjM2IC01OCA2NSAtNjIgNjIgLTE0IDY3IC04MjAgbDUgLTczNAoyNCAtMTkgYzIyIC0xOCA0MyAtMTkgMzcwIC0xOSAxOTAgMCAzNTYgMyAzNjkgNiA1MyAxNSA1MiA2IDUyIDc3NCAwIDY4MCAxCjcxMiAxOSA3NDggMTEgMjAgMzIgNDkgNDggNjQgNTEgNDkgODkgNTggMjQzIDU4IDE1NyAwIDE5MiAtOSAyNDggLTYzIDcyIC02OQo2NyAzMyA2OSAtMTIzMSBsMyAtMTEzOSAyMiAtMjQgMjEgLTIzIDM1OSAwIDM1OSAwIDI0IDI1IDI1IDI0IDAgMTE4NiAwIDExODYKLTI1IDI0IGMtMjQgMjUgLTI1IDI1IC0yMzMgMjUgLTIzMSAwIC0yODAgOCAtMzY0IDYxIC0yNSAxNyAtNjYgNTEgLTkxIDc4Ci05NSAxMDEgLTExOSAxOTUgLTExNyA0NDEgMyAyMTAgMyAyMDYgLTE2IDIyNCAtMTQgMTQgLTE1NiAxNiAtMTQxNSAxNiAtMTM4NgowIC0xMzk5IDAgLTE0MTkgLTIweiIvPgo8cGF0aCBkPSJNODgzMCA1MzYwIGMtMTkgLTE5IC0yMCAtMzMgLTIwIC0zODQgbDAgLTM2NSAyNiAtMjAgYzI2IC0yMSAzMyAtMjEKODEzIC0yMSA1OTkgMCA3OTAgLTMgNzk5IC0xMiA5IC05IDEyIC0xODcgMTIgLTczOCAwIC04MjAgMyAtNzkwIC03MyAtODU2Ci0yMyAtMjAgLTUyIC00MCAtNjQgLTQ1IC0xMyAtNSAtMTk1IC05IC00MDUgLTEwIC00MjQgLTEgLTQ3MiA0IC02MTAgNjMgLTI3MgoxMTUgLTQ1OCAzNjEgLTUwOCA2NzMgLTYgMzYgLTE2IDY1IC0yNyA3MyAtMTMgOSAtMTA0IDEyIC0zNzQgMTIgLTE5NyAwIC0zNjUKLTMgLTM3NCAtNiAtMzUgLTE0IC00MiAtNTYgLTI5IC0xNzcgNjUgLTU2NyA0MTQgLTEwNTUgOTI5IC0xMjk3IDEyMSAtNTcgMjI1Ci05MiAzNzYgLTEyNyAxMTIgLTI1IDEyMSAtMjYgNTk4IC0zMCAzNjUgLTQgNDg5IC0yIDUwNiA3IDQwIDIxIDQ1IDUxIDQ1IDI2NAowIDIzMSA3IDI2NyA2OSAzNjQgNDcgNzIgMTM4IDE0NCAyMTQgMTY5IDQwIDEyIDEwNyAxOCAyODAgMjIgMjExIDYgMjMwIDcKMjQzIDI1IDEyIDE3IDE0IDE5OSAxNCAxMjA4IDAgMTE3NSAwIDExODggLTIwIDEyMDggLTIwIDIwIC0zMyAyMCAtMTIxMCAyMAotMTE3NyAwIC0xMTkwIDAgLTEyMTAgLTIweiIvPgo8cGF0aCBkPSJNMTMwOTUgNTM2OSBjLTEzMyAtMjMgLTE3OSAtMzUgLTI4NSAtNzAgLTYzNSAtMjA5IC0xMDcxIC03NzMgLTExMjAKLTE0NDkgLTEzIC0xODAgLTEzIC0xNjY5IDAgLTE3MDcgNiAtMTcgMjIgLTM1IDM2IC00MiAxNyAtNyAxMzUgLTExIDM3NSAtMTEKbDM1MCAwIDI0IDI1IDI1IDI0IDAgODQ1IGMwIDkxNCAtMSA5MDUgNTUgMTA1MiA5MSAyNDEgMzAyIDQzMiA1NjAgNTA2IDc4IDIyCjkyIDIzIDQ5MSAyMyBsNDEwIDAgNDIgLTI4IGMyMyAtMTUgNTQgLTQ2IDY5IC02OSBsMjggLTQxIDMgLTI2MCAzIC0yNTkgLTI1Ci01MyBjLTI4IC01NiAtNzggLTk4IC0xMzcgLTExNSAtMjAgLTYgLTIzMCAtMTAgLTUxMSAtMTAgLTQ2MyAwIC00NzkgLTEgLTQ5OAotMjAgLTExIC0xMSAtMjIgLTMwIC0yNSAtNDIgLTMgLTEzIC01IC0xNzggLTMgLTM2NiBsMyAtMzQ0IDI0IC0xOSBjMjIgLTE4CjQ2IC0xOSA1MDAgLTE5IDMwNSAwIDQ5MCAtNCA1MTQgLTExIDQ5IC0xMyAxMTUgLTczIDEzOCAtMTI0IDE3IC0zNiAxOSAtNzEKMTkgLTM0MyBsMCAtMzAzIDI1IC0yNCAyNCAtMjUgMzYwIDAgYzM1OCAwIDM2MCAwIDM4MSAyMiAyMCAyMiAyMCAyOCAyMCAxMjE0CjAgMTA3MCAtMiAxMTk0IC0xNiAxMjA4IC0yMyAyNCAtNDAgMjUgLTI3NCAyOCBsLTIxNSAzIC02NSAzMiBjLTk5IDQ5IC0xNjMKMTExIC0yMDcgMjAxIGwtMzggNzcgLTMgMjE1IGMtMSAxMTggLTUgMjI1IC03IDIzNyAtMTIgNTUgNCA1MyAtNTE4IDUyIC0yNjUKLTEgLTUwNCAtNSAtNTMyIC0xMHoiLz4KPHBhdGggZD0iTTE1NDMwIDUzNjAgYy0yMCAtMjAgLTIwIC0zMyAtMjAgLTE2MjAgbDAgLTE2MDEgMjUgLTI0IDI0IC0yNSAzNTEKMCBjMzQ4IDAgMzgyIDMgNDAyIDM0IDQ
|
||
|
|
||
|
<h2 id="clientversion">3.6</h2>
|
||
|
<p id="progresstext">0%</p>
|
||
|
<p class="ratio" >use <a href="./badwifi/index.html">this link</a> if your internet is bad</p>
|
||
|
<div id="meter">
|
||
|
<span style="width: 0%" id="progress"></span>
|
||
|
</div>
|
||
|
<script type="text/javascript">
|
||
|
|
||
|
let versionNum = "";
|
||
|
let hasSiteInteractionHappened = false;
|
||
|
|
||
|
document.addEventListener("click", () =>{
|
||
|
hasSiteInteractionHappened = true;
|
||
|
});
|
||
|
|
||
|
setTimeout(() => {
|
||
|
document.getElementsByClassName("ratio")[0].className = "ratio show";
|
||
|
}, 2000);
|
||
|
|
||
|
function setVersion(version){
|
||
|
document.getElementById("clientversion").innerText = version;
|
||
|
versionNum = version;
|
||
|
}
|
||
|
|
||
|
function setBarProg(event, epkSize){
|
||
|
let progress = Math.round(event.loaded/1024/1024);
|
||
|
let size = Math.round(epkSize/1024/1024);
|
||
|
document.getElementById("progress").style.width = (Math.round(progress/size*100)+3.5)+"%";
|
||
|
document.getElementById("progresstext").innerText = Math.round(event.loaded/epkSize*10000)/100 + "% " + "(" + Math.round(event.loaded/1024/1024) + "MB" + "/" + Math.round(epkSize/1024/1024) + "MB)";
|
||
|
// why would you need to set the progress text in a different function???
|
||
|
}
|
||
|
|
||
|
function die(){
|
||
|
document.getElementById( "meter" ).style.display = "none";
|
||
|
document.getElementsByClassName("ratio")[0].className = "ratio";
|
||
|
document.getElementById("progresstext").innerText = "Decompressing Assets (May take 1-2 minutes on a slow device)";
|
||
|
}
|
||
|
|
||
|
let interval;
|
||
|
|
||
|
function enable(){
|
||
|
document.getElementById("progresstext").innerText = "Click anywhere on the screen to start Resent!";
|
||
|
let title = document.getElementById("clienttitle");
|
||
|
let versionText = document.getElementById("clientversion");
|
||
|
title.style.fontSize = "10vw";
|
||
|
versionText.style.left = "81vw";
|
||
|
versionText.style.top = "31vh";
|
||
|
versionText.style.fontSize = "3.5vw";
|
||
|
interval = setInterval(() => {
|
||
|
// checks if user clicked the screen
|
||
|
enableClick();
|
||
|
}, 10);
|
||
|
}
|
||
|
|
||
|
function enableClick(){
|
||
|
if (hasSiteInteractionHappened){
|
||
|
loading();
|
||
|
// gets rid of the loop made before in enable func
|
||
|
clearInterval(interval);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function loading(){
|
||
|
let title = document.getElementById("clienttitle");
|
||
|
let versionText = document.getElementById("clientversion");
|
||
|
title.style.fontSize = "8vw";
|
||
|
versionText.style.left = "74vw";
|
||
|
versionText.style.top = "31vh";
|
||
|
versionText.style.fontSize = "2.5vw";
|
||
|
document.getElementById("progresstext").innerText = "Loading Resent "+versionNum;
|
||
|
//test
|
||
|
setTimeout(() => {
|
||
|
showMojang();
|
||
|
}, 1000);
|
||
|
}
|
||
|
|
||
|
function showMojang(){
|
||
|
document.getElementById("dividk").style.transition = "background-color 0.2s";
|
||
|
document.getElementById("dividk").style.backgroundColor = "#f0323e";
|
||
|
document.getElementById("clienttitle").style.transition = "opacity 0.2s";
|
||
|
document.getElementById("clienttitle").style.opacity = "0";
|
||
|
document.getElementById("clientversion").style.transition = "opacity 0.2s";
|
||
|
document.getElementById("clientversion").style.opacity = "0";
|
||
|
document.getElementById("mojang").style.opacity = "1";
|
||
|
document.getElementById("progresstext").style.color = "white";
|
||
|
//test
|
||
|
setTimeout(() => {
|
||
|
die2();
|
||
|
}, 1000);
|
||
|
}
|
||
|
|
||
|
function die2(){
|
||
|
document.getElementById("progresstext").style.transition = "opacity 0.4s";
|
||
|
document.getElementById("progresstext").style.opacity = "0";
|
||
|
document.getElementById("mojang").style.transition = "all 0.4s";
|
||
|
document.getElementById("mojang").style.top = "50vh";
|
||
|
document.getElementById("mojang").style.transform = "translate(-50%, -50%)";
|
||
|
setTimeout(() => {
|
||
|
document.getElementById("mojang").style.transition = "all 0.7s";
|
||
|
document.getElementById("mojang").style.width = "135vw";
|
||
|
document.getElementById("dividk").style.transition = "opacity 0.4s";
|
||
|
document.getElementById("dividk").style.opacity = "0";
|
||
|
setTimeout(() => {
|
||
|
document.getElementById("dividk").style.display = "none";
|
||
|
}, 200);
|
||
|
}, 500);
|
||
|
}
|
||
|
|
||
|
</script>
|
||
|
<doNotCopyThis-kone>
|
||
|
<script type="text/javascript">
|
||
|
// this is for testing loading animations only
|
||
|
// do not copy this script tag
|
||
|
|
||
|
|
||
|
let event = {loaded: 0};
|
||
|
setTimeout(() => {
|
||
|
setTimeout(() => {
|
||
|
event.loaded = 100000;
|
||
|
setBarProg(event, 90928854);
|
||
|
}, 500);
|
||
|
setTimeout(() => {
|
||
|
event.loaded = 21400000;
|
||
|
setBarProg(event, 90928854);
|
||
|
}, 1500);
|
||
|
setTimeout(() => {
|
||
|
event.loaded = 74900000;
|
||
|
setBarProg(event, 90928854);
|
||
|
}, 2500);
|
||
|
setTimeout(() => {
|
||
|
event.loaded = 90928854;
|
||
|
setBarProg(event, 90928854);
|
||
|
}, 3500);
|
||
|
setTimeout(() => {
|
||
|
die();
|
||
|
}, 4000);
|
||
|
setTimeout(() => {
|
||
|
enable();
|
||
|
}, 4500);
|
||
|
}, 1000);
|
||
|
|
||
|
|
||
|
</script>
|
||
|
</doNotCopyThis-kone>
|
||
|
</div>
|
||
|
</body>
|
||
|
</html>
|