3 files changed, 120 insertions, 0 deletions
diff --git a/grapher/pl/index.html b/grapher/pl/index.html
new file mode 100644
index 0000000..3dc7119
--- /dev/null
+++ b/grapher/pl/index.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0">
+		<title>Permalinked Graph</title>
+
+	  <link crossorigin href="style.css" rel="stylesheet" type="text/css" />
+
+	  <link crossorigin href="script.js" rel="preload" as="script"/>
+	  <link crossorigin href="style.css" rel="preload" as="style"/>	
+
+	
+		<script crossorigin src="script.js"></script>
+	</head>
+	<body>
+		<div id="header"><span><b>By: <i><span id="author"></span></i></b></span><a href="../" id="linker">Open in Editor</a></div>
+		<iframe src="../" id="frame"></iframe>
+	</body>
+</html>
+\ No newline at end of file
diff --git a/grapher/pl/script.js b/grapher/pl/script.js
new file mode 100644
index 0000000..c47a636
--- /dev/null
+++ b/grapher/pl/script.js
@@ -0,0 +1,40 @@
+window.addEventListener('load', async e => {
+	const frame  = document.getElementById('frame');
+	const author = document.getElementById('author');
+	const linker = document.getElementById('linker');
+	
+	linker.target = window.location.hash.substr(1);
+	
+	const graph = await (await fetch(`https://graphpl.aleteoryx.me/load/${window.location.hash.substr(1)}`)).json()
+	if (frame.contentWindow.document.readyState != 'complete')
+		await new Promise((res, rej) => frame.contentWindow.addEventListener('load', e => {res();}));
+	
+	author.innerText = graph.author ? graph.author : [
+		"a ghost",
+		"nobody",
+		"thine mother",
+		"god's mistake",
+		"the zodiac killer",
+		"tyleo, secretly",
+		"someone else",
+		"Danny Elfman",
+		"a rat in a cage",
+		"viewers like you"
+		][Math.round(Math.random() * 10)];
+
+	frame.contentWindow.postMessage({type: 'lock'});
+	frame.contentWindow.postMessage({type: 'loadGraph', graph: graph});
+
+	linker.addEventListener('click', e => {
+		let newwin = window.open('', window.location.hash.substr(1));
+		window.onmessage = ({data}) => {
+			console.log(data.type);
+			if(data.type == 'grapherLoaded') {
+				newwin.postMessage({type: 'loadGraph', graph: graph});
+				newwin.name = '';
+				window.onmessage = null;
+			}
+		}
+	})
+
+})
+\ No newline at end of file
diff --git a/grapher/pl/style.css b/grapher/pl/style.css
new file mode 100644
index 0000000..7ac40df
--- /dev/null
+++ b/grapher/pl/style.css
@@ -0,0 +1,60 @@
+@import url('https://fonts.googleapis.com/css2?family=Raleway&display=swap');
+
+html {
+	--foreforeground: #3788ae;
+	--foreground: #082f41;
+	--background: #03141c;
+	color: white;
+	background: var(--background);
+	/*padding: 1cm;*/
+	font-size: 12pt;
+	font-family: 'Raleway', sans-serif;
+	height: 100%;
+}
+
+body {
+	margin: 0;
+	height: 100vw;
+	overflow: hidden;
+}
+
+#frame {
+	margin:0;
+	padding:0;
+	width: 100vw;
+	height: calc(100vw - 3cm);
+	position: relative;
+	border:none;
+}
+
+#header {
+	margin:0;
+	width: 100vw;
+	height: 3cm;
+	background: var(--background);
+	position: relative;
+}
+#header > span {
+	font-size: 2cm;
+	position: absolute;
+	top: calc(50% - 1.35cm);
+	bottom: calc(50% - 1.35cm);
+	left: 0.5cm;
+}
+#header > span #author {
+	color: var(--foreforeground);	
+}
+#header > a {
+	position: absolute;
+	background: var(--foreground);
+	font-size: 1cm;
+	padding: 1rem;
+	padding-bottom: 0;
+	color: white;
+	text-decoration: none;
+	border-radius: 1rem;
+	height: 1.5cm;
+	top: 0.5cm;
+	bottom: 0.75cm;
+	right: 0.75cm;
+}
+\ No newline at end of file