From 9d51f86b784ceb83dfe5c0530a1e638f117bcc41 Mon Sep 17 00:00:00 2001
From: Tom <emailfortomg@gmail.com>
Date: Thu, 21 Jan 2021 13:13:04 +0000
Subject: [PATCH] Allowed easy sharing of data and code in demo website

---
 docs/index.html    |  1 +
 docs/web/index.css |  5 +++++
 docs/web/index.js  | 50 ++++++++++++++++++++++++++++++++++------------
 3 files changed, 43 insertions(+), 13 deletions(-)

diff --git a/docs/index.html b/docs/index.html
index f530cd0..eb1b52e 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -12,6 +12,7 @@
     <button id="reloadBtn" class="btn">Reload</button>
     <button id="saveBtn" class="btn">Save</button>
     <button id="resetBtn" class="btn">Reset Database</button>
+    <button id="copyBtn" class="btn">Copy Link to Current Code</button>
     <select id="demoSelector" class="btn"></select>
     <p id="versionNumber">Loading Version</p>
 
diff --git a/docs/web/index.css b/docs/web/index.css
index aaea446..aa02963 100644
--- a/docs/web/index.css
+++ b/docs/web/index.css
@@ -31,6 +31,11 @@ html {
   border: 2px solid #dc3545;
 }
 
+#copyBtn {
+  background-color: #ffa500;
+  border: 2px solid #ffa500;
+}
+
 #demoSelector {
   background-color: #007bff;
   border: 2px solid #007bff;
diff --git a/docs/web/index.js b/docs/web/index.js
index 09deb67..0f65123 100644
--- a/docs/web/index.js
+++ b/docs/web/index.js
@@ -4,9 +4,14 @@ const runButton = document.getElementById("runBtn");
 const reloadButton = document.getElementById("reloadBtn");
 const saveButton = document.getElementById("saveBtn");
 const resetButton = document.getElementById("resetBtn");
+const copyButton = document.getElementById("copyBtn");
 const demoSelector = document.getElementById("demoSelector");
 const errorOutput = document.getElementById("errorOutput");
 
+function getQueryVariable(variable) {
+  return new URLSearchParams(window.location.search).get(variable);
+}
+
 function displayError(errorMsg) {
   errorOutput.innerText = errorMsg;
 }
@@ -26,16 +31,6 @@ try {
   );
 }
 
-db.default({
-  list: [1, 2, 3],
-  string: "test",
-  numbers: 123,
-  objects: {
-    property: "test property"
-  }
-});
-db.save();
-
 // Credit for JSON syntax highlighting goes to: https://stackoverflow.com/a/7220510
 function syntaxHighlight(json) {
   json = json
@@ -144,13 +139,34 @@ demoKeys.forEach(key => {
   demoSelector.appendChild(option);
 });
 
-// load first demo
-loadDemo(demoKeys[0]);
-
 demoSelector.addEventListener("change", function() {
   loadDemo(demoSelector.value);
 });
 
+
+let queryCode = getQueryVariable("code");
+if (queryCode !== "") {
+  editor.updateCode(decodeURI(queryCode));
+  demoSelector.value = "custom";
+} else {
+  loadDemo(demoKeys[0]);
+}
+
+let queryData = getQueryVariable("data");
+if (queryData !== "") {
+  db.default(decodeURI(queryCode));
+} else {
+  db.default({
+    list: [1, 2, 3],
+    string: "test",
+    numbers: 123,
+    objects: {
+      property: "test property"
+    }
+  });
+}
+db.save();
+
 async function loadVersion() {
   fetch("https://unpkg.com/stormdb/package.json")
     .then(function(response) {
@@ -166,3 +182,11 @@ async function loadVersion() {
     .catch(function(error) {});
 }
 loadVersion();
+
+// copy URL function
+copyButton.addEventListener("click", function() {
+  let url = new URL(window.location.href);
+  url.searchParams.set("code", encodeURI(editor.getCode()));
+  url.searchParams.set("data", encodeURI(db.value()));
+  navigator.clipboard.writeText(url);
+});
\ No newline at end of file