aboutsummaryrefslogtreecommitdiffstats
path: root/grapher/pl
diff options
context:
space:
mode:
authoralyx <alyx@aleteoryx.me>2022-02-06 16:09:29 +0000
committerAleteoryx <alyx@aleteoryx.me>2022-02-06 16:09:29 +0000
commitfb1876db725b1d96d3fb58d2a597a12e36ca7b39 (patch)
treee3fe932f2ba848dbb6b3f2f13816aead257a4d6a /grapher/pl
parent21bc06407c450a3ae5643d5462c452ec92b3d782 (diff)
downloadRRCUtils-fb1876db725b1d96d3fb58d2a597a12e36ca7b39.tar.gz
RRCUtils-fb1876db725b1d96d3fb58d2a597a12e36ca7b39.tar.bz2
RRCUtils-fb1876db725b1d96d3fb58d2a597a12e36ca7b39.zip
permalinking is fully operational
Diffstat (limited to 'grapher/pl')
-rw-r--r--grapher/pl/index.html20
-rw-r--r--grapher/pl/script.js40
-rw-r--r--grapher/pl/style.css60
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