153 lines
3.9 KiB
HTML
153 lines
3.9 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>LZK Extreme Cheats sus moment (Impostor Amogus)</title>
|
||
|
|
<meta charset="UTF-8" />
|
||
|
|
<link rel="icon" type="image/x-icon" href="https://nsfw.cringe-studios.com/sus.png">
|
||
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
|
|
<link href="https://fonts.googleapis.com/css2?family=Courier+Prime&display=swap" rel="stylesheet">
|
||
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
|
||
|
|
<style>
|
||
|
|
html {
|
||
|
|
font-family: 'Courier Prime', monospace;
|
||
|
|
}
|
||
|
|
|
||
|
|
table, th, td{
|
||
|
|
border: 1px solid;
|
||
|
|
border-collapse: collapse;
|
||
|
|
padding: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
table {
|
||
|
|
background-color: lightgray;
|
||
|
|
}
|
||
|
|
|
||
|
|
tr:nth-child(odd) {
|
||
|
|
background-color: rgb(172, 172, 172);
|
||
|
|
}
|
||
|
|
|
||
|
|
tr:nth-child(even) {
|
||
|
|
background-color: rgb(220, 220, 220);
|
||
|
|
}
|
||
|
|
|
||
|
|
th, td {
|
||
|
|
width: 50%;
|
||
|
|
}
|
||
|
|
|
||
|
|
body {
|
||
|
|
margin: 0;
|
||
|
|
grid-template-rows: min-content 1fr;
|
||
|
|
max-height: calc(100vh - 20px);
|
||
|
|
display: grid;
|
||
|
|
overflow: hidden;
|
||
|
|
padding: 10px;
|
||
|
|
row-gap: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#sussus {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
max-height: 100%;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
overflow-y: scroll;
|
||
|
|
}
|
||
|
|
|
||
|
|
input {
|
||
|
|
font-size: 1.5em;
|
||
|
|
display: block;
|
||
|
|
font-family: 'Courier Prime', monospace;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<input type="text" placeholder="Search for question" id="query" autocomplete="off"></input>
|
||
|
|
<div id="sussus">
|
||
|
|
<table>
|
||
|
|
<thead>
|
||
|
|
<tr><th>QUESTIONS</th><th>ANSWERS</th></tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
<!-- DYNAMIC CONTENT -->
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
<script defer>
|
||
|
|
let tbody = document.getElementsByTagName("tbody")[0];
|
||
|
|
|
||
|
|
async function loadStuff() {
|
||
|
|
let questionsAndAnswrsArray = await $.getJSON("https://cringe-studios.com/lzk/questions.json");
|
||
|
|
|
||
|
|
for(let q in questionsAndAnswrsArray) {
|
||
|
|
let tr = document.createElement("tr");
|
||
|
|
let td = document.createElement("td");
|
||
|
|
td.innerText = q;
|
||
|
|
td.style.padding = "20px";
|
||
|
|
tr.appendChild(td);
|
||
|
|
let td2 = document.createElement("td");
|
||
|
|
|
||
|
|
let theAnswr = questionsAndAnswrsArray[q];
|
||
|
|
if(Array.isArray(theAnswr)) {
|
||
|
|
let ul = document.createElement("ul");
|
||
|
|
for(let answr of theAnswr) {
|
||
|
|
let li = document.createElement("li");
|
||
|
|
li.innerText = answr;
|
||
|
|
ul.appendChild(li);
|
||
|
|
}
|
||
|
|
td2.appendChild(ul);
|
||
|
|
}else if(typeof theAnswr == "object") {
|
||
|
|
let dl = document.createElement("dl");
|
||
|
|
for(let key in theAnswr) {
|
||
|
|
let dt = document.createElement("dt");
|
||
|
|
dt.innerText = key;
|
||
|
|
dl.appendChild(dt);
|
||
|
|
let dd = document.createElement("dd");
|
||
|
|
dd.innerText = theAnswr[key];
|
||
|
|
dl.appendChild(dd);
|
||
|
|
}
|
||
|
|
td2.appendChild(dl);
|
||
|
|
}else{
|
||
|
|
if(theAnswr.startsWith("lonk:")) {
|
||
|
|
let a = document.createElement("a");
|
||
|
|
a.href = theAnswr.substring(5);
|
||
|
|
a.setAttribute("download", "");
|
||
|
|
a.innerText = theAnswr.substring(5);
|
||
|
|
td2.appendChild(a);
|
||
|
|
}else {
|
||
|
|
td2.innerText = theAnswr;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
tr.appendChild(td2);
|
||
|
|
tbody.appendChild(tr);
|
||
|
|
}
|
||
|
|
|
||
|
|
let elements = document.getElementsByTagName("tr");
|
||
|
|
for(let i = 0; i < elements.length; i++){
|
||
|
|
elements[i].onclick = function(e){
|
||
|
|
if(elements[i].style.backgroundColor == "limegreen"){
|
||
|
|
elements[i].style.backgroundColor = "orangered";
|
||
|
|
}else if(elements[i].style.backgroundColor == "orangered"){
|
||
|
|
elements[i].style.backgroundColor = null;
|
||
|
|
}else {
|
||
|
|
elements[i].style.backgroundColor = "limegreen";
|
||
|
|
};
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
let query = document.getElementById("query");
|
||
|
|
query.oninput = event => {
|
||
|
|
for(let tr of tbody.children) {
|
||
|
|
if(tr.innerText.toLowerCase().includes(query.value.toLowerCase())) {
|
||
|
|
tr.style.display = "table-row";
|
||
|
|
}else {
|
||
|
|
tr.style.display = "none";
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
loadStuff();
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|