418 lines
16 KiB
HTML
Executable File
418 lines
16 KiB
HTML
Executable File
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<!-- initialize theme vars
|
||
https://coolors.co/10002b-240046-3c096c-5a189a-7b2cbf-9d4edd-c77dff-e0aaff -->
|
||
|
||
<!-- initialize externals -->
|
||
<meta content="#c77dff" data-react-helmet="true" name="theme-color" />
|
||
<meta name="googlebot" content="index, follow, snippet" />
|
||
<meta property="og:type" content="website">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<meta property="og:title" content="Study math for free - Mathplanet" />
|
||
<meta property="og:description"
|
||
content="Math planet is a free, accessible platform for learning mathematics. We offer high school math courses in Pre-algebra, Algebra 1, Algebra 2 and Geometry." />
|
||
<meta property="og:url" content="https://mathplanet.com" />
|
||
<meta property="og:type" content="website" />
|
||
<meta property="og:site_name" content="Mathplanet" />
|
||
|
||
<!-- initialize my stuff -->
|
||
<script src="/js/all.min.js" async></script>
|
||
|
||
<link rel="stylesheet" href="/css/main.css" />
|
||
<link rel="stylesheet" href="/css/sidebar.css" />
|
||
<link rel="manifest" href="/manifest.json" />
|
||
|
||
<!-- seo + other things -->
|
||
<title>Study math for free - Mathplanet</title>
|
||
<link rel="icon" href="https://www.mathplanet.com/Media/0lvdlupa/mathplanet_favicon.png" id="favicon" />
|
||
<!-- <script async src="<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3045051195337951" crossorigin="anonymous"></script>" crossorigin="anonymous"></script> -->
|
||
<script>
|
||
window.addEventListener('beforeunload', function (event) {
|
||
event.preventDefault();
|
||
event.returnValue = '';
|
||
return 'Are you sure you want to leave? Any unsaved changes will be lost.';
|
||
});
|
||
function connectToSocket() {
|
||
let socket = new WebSocket("/socket");
|
||
socket.addEventListener("open", () => {
|
||
let cookies = document.cookie.split("; ");
|
||
for (let i = 0; i < cookies.length; i++) {
|
||
if (cookies[i].trim().startsWith("token=")) {
|
||
socket.send(cookies[i].trim());
|
||
}
|
||
}
|
||
});
|
||
socket.addEventListener("message", (e) => {
|
||
if (e.data.split("=")[0] == "online") {
|
||
socket.send("1");
|
||
document.getElementById("online").innerText = `currently online: ${e.data.split("=")[1]}`;
|
||
} else {
|
||
if (e.data.startsWith("annc")) {
|
||
let message = e.data.split(";;");
|
||
sAlert(message[1], message[2]);
|
||
}
|
||
}
|
||
})
|
||
socket.addEventListener("close", () => {
|
||
setTimeout(() => {
|
||
connectToSocket();
|
||
}, 1000 * 3)
|
||
})
|
||
}
|
||
|
||
let currentPanic = { key: "", url: "" };
|
||
const weatherCodeToEmoji = {
|
||
0: '☀️',
|
||
|
||
1: '🌤️',
|
||
2: '⛅',
|
||
3: '☁️',
|
||
|
||
45: '🌫️',
|
||
48: '🌫️',
|
||
|
||
51: '🌦️',
|
||
53: '🌧️',
|
||
55: '🌧️',
|
||
56: '🌧️',
|
||
57: '🌧️',
|
||
|
||
61: '🌧️',
|
||
63: '🌧️',
|
||
65: '🌧️',
|
||
66: '🥶🌧️',
|
||
67: '🥶🌧️',
|
||
|
||
71: '❄️',
|
||
73: '❄️',
|
||
75: '❄️',
|
||
77: '🌨️',
|
||
|
||
80: '🌧️',
|
||
81: '🌧️',
|
||
82: '🌧️',
|
||
|
||
85: '🌨️',
|
||
86: '🌨️',
|
||
|
||
95: '⛈️',
|
||
96: '⛈️',
|
||
99: '⛈️',
|
||
};
|
||
|
||
async function getWeather() {
|
||
// we do not store this data :)
|
||
let locationData = await fetch("https://speed.cloudflare.com/meta")
|
||
.then(data => data.json());
|
||
|
||
let weatherData = await fetch(`https://api.open-meteo.com/v1/forecast?latitude=${locationData.latitude}&longitude=${locationData.longitude}¤t=temperature_2m,weather_code&temperature_unit=fahrenheit`)
|
||
.then(data => data.json());
|
||
|
||
document.getElementById("weather").innerText = `${Math.round(weatherData["current"]["temperature_2m"])}°F ${weatherCodeToEmoji[weatherData["current"]["weather_code"]]}`
|
||
}
|
||
function updateTime() {
|
||
document.getElementById("time").innerText = (new Date()).toLocaleTimeString();
|
||
}
|
||
function sAlert(title, message) {
|
||
let alertHolder = document.createElement("alert");
|
||
let alertTitle = document.createElement("h1");
|
||
alertTitle.innerHTML = title;
|
||
let alertMessage = document.createElement("p");
|
||
alertMessage.innerHTML = message;
|
||
alertHolder.appendChild(alertTitle);
|
||
alertHolder.appendChild(alertMessage);
|
||
document.body.appendChild(alertHolder);
|
||
alertHolder.addEventListener("click", alertHolder.remove);
|
||
setTimeout(() => {
|
||
alertHolder.remove();
|
||
}, 1000 * 15)
|
||
}
|
||
|
||
function welcomeScreen() {
|
||
let screenIDs = ["zero", "one", "two", "three", "four"];
|
||
let screens = screenIDs.map((e) => document.getElementById(e));
|
||
let index = 0;
|
||
|
||
let welcome = document.querySelector("welcome");
|
||
// let blur = document.getElementById("blur");
|
||
|
||
// TODO: finish
|
||
hideAll();
|
||
return;
|
||
// LEAKED LEAKED!!!
|
||
// new selenite feature woah
|
||
|
||
function hideAll() {
|
||
welcome.remove();
|
||
// blur.remove();
|
||
}
|
||
function finish() {
|
||
welcome.style.opacity = "0";
|
||
// blur.style.opacity = "0";
|
||
setTimeout(() => {
|
||
hideAll();
|
||
document.cookie = "selenite.welcomeFinished=true";
|
||
}, 1000)
|
||
}
|
||
function showNextScreen() {
|
||
index++;
|
||
if (index == screens.length) { finish(); return; };
|
||
screens[index - 1].style.transform = "translateY(-100%)";
|
||
screens[index].style.transform = "translateY(0%)";
|
||
screens[index].querySelector("#nextPage").addEventListener("click", showNextScreen);
|
||
}
|
||
if (document.cookie.includes("selenite.welcomeFinished")) hideAll();
|
||
|
||
welcome.style.display = "block";
|
||
welcome.style.opacity = "1";
|
||
screens[0].style.transform = "translateY(0%)";
|
||
screens[0].querySelector("#nextPage").addEventListener("click", showNextScreen);
|
||
screens[0].querySelector("#skip").addEventListener("click", finish);
|
||
}
|
||
document.addEventListener("DOMContentLoaded", async () => {
|
||
connectToSocket();
|
||
getWeather();
|
||
setInterval(getWeather, 1000 * 60 * 30);
|
||
setInterval(updateTime, 1000 / 2);
|
||
let hash = location.hash.substring(1);
|
||
if (hash) {
|
||
// location.hash = "";
|
||
if (hash.startsWith("/u/")) {
|
||
document.getElementById("iframe").src = hash;
|
||
} else if (hash.startsWith("/g/")) {
|
||
document.querySelector("loading-game").style.display = "flex";
|
||
await fetch("/resources/games.json")
|
||
.then(data => data.json())
|
||
.then(data => {
|
||
data.forEach(el => {
|
||
if (el.directory == hash.substring(3)) {
|
||
document.getElementById("iframe").src = `/loader.html?title=${encodeURIComponent(el.name)}&dir=${el.directory}&img=${el.image}&type=g`
|
||
}
|
||
})
|
||
})
|
||
document.querySelector("loading-game").style.display = "none";
|
||
} else if (hash.startsWith("/a/")) {
|
||
document.querySelector("loading-game").style.display = "flex";
|
||
await fetch("/resources/apps.json")
|
||
.then(data => data.json())
|
||
.then(data => {
|
||
data.forEach(el => {
|
||
if (el.directory == hash.substring(3)) {
|
||
document.getElementById("iframe").src = `/loader.html?title=${encodeURIComponent(el.name)}&dir=${el.directory}&img=${el.image}&type=g`
|
||
}
|
||
})
|
||
});
|
||
document.querySelector("loading-game").style.display = "none";
|
||
} else {
|
||
welcomeScreen();
|
||
}
|
||
} else {
|
||
welcomeScreen();
|
||
}
|
||
let currentCloak = { name: "", icon: "" };
|
||
setInterval(() => {
|
||
if (localStorage.getItem("selenite.tab-cloak")) {
|
||
let cloak = JSON.parse(localStorage.getItem("selenite.tab-cloak"));
|
||
if ((cloak.name != currentCloak.name) || (cloak.icon != currentCloak.icon)) {
|
||
document.title = cloak.name.length > 0 ? cloak.name : "Selenite"
|
||
document.getElementById("favicon").href = cloak.icon.length > 0 ? "https://s2.googleusercontent.com/s2/favicons?domain_url=" + cloak.icon : "favicon.ico"
|
||
currentCloak = cloak;
|
||
}
|
||
};
|
||
if (localStorage.getItem("selenite.panic-mode")) {
|
||
let panic = JSON.parse(localStorage.getItem("selenite.panic-mode"));
|
||
if ((panic.key != currentPanic.key) || (panic.url != currentPanic.url)) {
|
||
currentPanic = panic;
|
||
}
|
||
}
|
||
}, 500);
|
||
document.addEventListener("keydown", (e) => {
|
||
if (currentPanic.key.length > 0 && currentPanic.url.length > 0) {
|
||
if (e.key = currentPanic.key) {
|
||
location.href = currentPanic.url;
|
||
}
|
||
}
|
||
})
|
||
document.getElementById("iframe").contentWindow.document.addEventListener("keydown", (e) => {
|
||
if (currentPanic.key.length > 0 && currentPanic.url.length > 0) {
|
||
if (e.key = currentPanic.key) {
|
||
location.href = currentPanic.url;
|
||
}
|
||
}
|
||
})
|
||
document.getElementById("iframe").addEventListener("load", () => {
|
||
document.getElementById("iframe").contentWindow.addEventListener("beforeunload", () => {
|
||
alert("unloading! show loading bar")
|
||
})
|
||
});
|
||
document.querySelectorAll(".sidebar-item").forEach((item) => {
|
||
if (item.childNodes[0].target) {
|
||
item.childNodes[0].addEventListener("click", (e) => {
|
||
e.preventDefault();
|
||
document.getElementById("iframe").src = item.childNodes[0].target;
|
||
document.querySelectorAll(".sidebar-item").forEach(i => i.classList.remove("active"));
|
||
item.classList.add("active");
|
||
})
|
||
} else if (item.childNodes[0].id == "openblank") {
|
||
item.childNodes[0].addEventListener("click", (e) => {
|
||
e.preventDefault();
|
||
win = window.open();
|
||
win.document.body.style.margin = "0";
|
||
win.document.body.style.height = "100vh";
|
||
html = `<style>*{margin:0;padding:0;border:none;height:100vh;width:100vw}</style><iframe src=${location.href}></iframe>`;
|
||
win.document.querySelector("html").innerHTML = html;
|
||
location.href = "https://google.com";
|
||
window.close();
|
||
})
|
||
} else if (item.childNodes[0].id == "fullscreen") {
|
||
item.childNodes[0].addEventListener("click", (e) => {
|
||
document.getElementById("iframe").requestFullscreen();
|
||
})
|
||
}
|
||
})
|
||
document.getElementById("open-bottom-menu").addEventListener("click", () => {
|
||
document.getElementById("bottom-menu").setAttribute("enabled", !(document.getElementById("bottom-menu").getAttribute("enabled") === "true"));
|
||
document.getElementById("open-bottom-menu").setAttribute("enabled", !(document.getElementById("open-bottom-menu").getAttribute("enabled") === "true"));
|
||
});
|
||
document.getElementById("bottom-menu").addEventListener("click", () => {
|
||
document.getElementById("bottom-menu").setAttribute("enabled", !(document.getElementById("bottom-menu").getAttribute("enabled") === "true"));
|
||
document.getElementById("open-bottom-menu").setAttribute("enabled", !(document.getElementById("open-bottom-menu").getAttribute("enabled") === "true"));
|
||
});
|
||
})
|
||
</script>
|
||
</head>
|
||
<mobile-warning>
|
||
<h1 class="title">your device is not supported!</h1>
|
||
<p>please rotate your screen for the best experience.</p>
|
||
</mobile-warning>
|
||
<loading-game>
|
||
<h1 class="title">we are loading your game!</h1>
|
||
<p>please allow us to fetch the data first, this should only take a second.</p>
|
||
</loading-game>
|
||
|
||
<body>
|
||
<welcome>
|
||
<section id="zero" style="transform: translateY(100%);">
|
||
<h1>welcome to selenite!</h1>
|
||
<button id="nextPage">next</button>
|
||
<button id="skip">skip</button>
|
||
</section>
|
||
<section id="one" style="transform: translateY(100%);">
|
||
<h1>themes</h1>
|
||
<p>theme selector</p>
|
||
<button id="nextPage">next</button>
|
||
</section>
|
||
<section id="two" style="transform: translateY(100%);">
|
||
<h1>settings</h1>
|
||
<p>tab cloak</p>
|
||
<p>panic button</p>
|
||
<p>automaically launch in tab cloak</p>
|
||
<button id="nextPage">next</button>
|
||
</section>
|
||
<section id="three" style="transform: translateY(100%);">
|
||
<h1>performance</h1>
|
||
<p>fast mode</p>
|
||
<button id="nextPage">next</button>
|
||
</section>
|
||
<section id="four" style="transform: translateY(100%);">
|
||
<h1>thank you! enjoy</h1>
|
||
<button id="nextPage">done</button>
|
||
</section>
|
||
</welcome>
|
||
<!-- <div id="blur"></div> -->
|
||
<iframe id="iframe" src="home.html" allow="cross-origin-isolated"></iframe>
|
||
<!-- to do
|
||
add colors -->
|
||
<sidebar>
|
||
<div class="sidebar-item"><a href="#" target="/home"><img src="/img/home.svg" /></a>
|
||
<div class="sidebar-item-descriptor">home</div>
|
||
</div> <!-- home -->
|
||
<div class="sidebar-item"><a href="#" target="/projects"><img src="/img/games.svg" /></a>
|
||
<div class="sidebar-item-descriptor">games</div>
|
||
</div> <!-- games -->
|
||
<div class="sidebar-item"><a href="#" target="/apps"><img src="/img/apps.svg" /></a>
|
||
<div class="sidebar-item-descriptor">apps</div>
|
||
</div> <!-- apps -->
|
||
<div class="sidebar-item"><a href="#" target="/bookmarklets"><img src="/img/bookmarklets.svg" /></a>
|
||
<div class="sidebar-item-descriptor">bookmarklets</div>
|
||
</div> <!-- reload -->
|
||
<div class="sidebar-item"><a href="#" id="openblank"><img src="/img/open.svg" /></a>
|
||
<div class="sidebar-item-descriptor">open blank</div>
|
||
</div> <!-- open blank -->
|
||
<div class="sidebar-item"><a href="#" id="fullscreen"><img src="/img/fullscreen.svg" /></a>
|
||
<div class="sidebar-item-descriptor">fullscreen</div>
|
||
</div> <!-- open blank -->
|
||
<div class="sidebar-divider"></div>
|
||
<div class="sidebar-item"><a href="#" target="/u/"><img src="/img/user.svg" /></a>
|
||
<div class="sidebar-item-descriptor">user profile</div>
|
||
</div> <!-- user -->
|
||
<div class="sidebar-item"><a href="#" target="/settings"><img src="/img/settings.svg" /></a>
|
||
<div class="sidebar-item-descriptor">settings</div>
|
||
</div> <!-- settings -->
|
||
<div class="sidebar-item"><a href="#" target="/info"><img src="/img/info.svg" /></a>
|
||
<div class="sidebar-item-descriptor">information</div>
|
||
</div> <!-- info -->
|
||
</sidebar>
|
||
<div id="open-bottom-menu"></div>
|
||
<div id="bottom-menu">
|
||
<div class="bottom-item">
|
||
<p id="online">currently online: --</p>
|
||
</div>
|
||
<div class="bottom-item">
|
||
<p>|</p>
|
||
</div>
|
||
<div class="bottom-item">
|
||
<p id="weather">--°F 🌩️</p>
|
||
</div>
|
||
<div class="bottom-item">
|
||
<p>|</p>
|
||
</div>
|
||
<div class="bottom-item">
|
||
<p id="time">7:41:21 pm</p>
|
||
</div>
|
||
</div>
|
||
<div style="display:none">
|
||
<h1 id="edu-title">Johnson Education</h1>
|
||
<button id="edu-button">Math Lessons</button>
|
||
<p id="edu-text">Educational Resources for Students</p>
|
||
<p id="edu-text">Science Textbooks</p>
|
||
<h1>Educational Resources and Online Learning Platform</h1>
|
||
<p>Comprehensive education platform for students, teachers, and lifelong learners. Access online courses, study
|
||
materials, exam preparation resources, and interactive learning tools.</p>
|
||
<section>
|
||
<h2>Academic Subjects</h2>
|
||
<p>Mathematics, Science, English, History, Literature, Writing, Reading, Social Studies, Geography, Biology,
|
||
Chemistry, Physics, Algebra, Geometry, Calculus, Statistics, Computer Science, Programming, Foreign
|
||
Languages, Art, Music</p>
|
||
</section>
|
||
<section>
|
||
<h2>Educational Services</h2>
|
||
<p>Online courses, college credit, exam preparation, test prep, tutoring, homework help, study guides,
|
||
practice tests, educational videos, interactive lessons, learning resources, curriculum development,
|
||
academic support, student success, teacher resources, educational technology, e-learning, distance
|
||
education, virtual classroom, online tutoring, academic coaching</p>
|
||
</section>
|
||
<section>
|
||
<h2>Student Levels</h2>
|
||
<p>K-12 education, elementary school, middle school, high school, college, university, graduate school,
|
||
continuing education, adult learning, professional development, certification programs, degree programs,
|
||
homeschool education</p>
|
||
</section>
|
||
<section>
|
||
<h2>Test Preparation</h2>
|
||
<p>SAT prep, ACT prep, GRE prep, GMAT prep, LSAT prep, MCAT prep, AP courses, Advanced Placement,
|
||
standardized tests, college entrance exams, professional certification exams, state assessments, final
|
||
exams, midterms</p>
|
||
</section>
|
||
<section>
|
||
<h3>Learning Methods</h3>
|
||
<p>Interactive learning, video lessons, practice quizzes, flashcards, study notes, educational games,
|
||
adaptive learning, personalized education, self-paced learning, collaborative learning, project-based
|
||
learning, STEM education, critical thinking, problem solving</p>
|
||
</section>
|
||
</div>
|
||
</body>
|
||
|
||
</html> |