Add form for new form

author: Mark Powers <mark@marks.kitchen> 2023-01-30 22:26:19 -0600
committer: Mark Powers <mark@marks.kitchen> 2023-01-30 22:27:26 -0600
commit: ad11ec7f93dca356748cb6c8bc49313a7ee7c3d7 (patch)
tree: 72418f494cd4b405cecdd5e6fbd539781e0c30e0 /index.html
parent: b6c0e7dbc3b618ecca2449c4395ce857649521cf (diff)
1 files changed, 0 insertions, 247 deletions
diff --git a/index.html b/index.html
deleted file mode 100644
index 83136dc..0000000
--- a/index.html
+++ /dev/null
@@ -1,247 +0,0 @@
-<html>
-  <head>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <style>
-      p {
-        #margin-top: 0;
-        #margin-bottom: 0;
-      }
-      label.number, label.text {
-        margin-right: 1rem;
-      }
-      label.multi-label {
-        padding: 1rem;
-        border: 1px solid #3366ff;
-      }
-      input[type="checkbox"].multi-checkbox {
-        display: none;
-      }
-      input[type="checkbox"] {
-        height: 2rem;
-        width: 2rem;
-      }
-      input:checked + label{
-        background-color: #99ccff;
-      }
-      input[type="number"] {
-        height: 3rem;
-      }
-      input[type="range"] {
-        width: 60%;
-      }
-      input[type="text"] {
-        height: 3rem;
-      }
-      .prompt {
-        margin-bottom: 2rem;
-      }
-      textarea {
-        width: 80ch;
-        height: 5rem;
-      }
-      button {
-        padding: 1rem;
-        border: 1px solid #3366ff;
-      }
-    </style>
-  </head>
-  <body>
-    <nav></nav>
-    <div class="main">
-      <div id="books"></div>
-      <div id="prompts"></div>
-      <div><button onclick="on_submit()">Submit</button></div>
-      <script>
-        function insert_multiple_select(prompt, prompt_id, items){
-          let root_el = document.getElementById("prompts")
-          let wrapper_el = document.createElement("div")
-          wrapper_el.setAttribute("class", "prompt multiple_select")
-
-          let prompt_text_el = document.createElement("p")
-          prompt_text_el.innerHTML = prompt
-          wrapper_el.appendChild(prompt_text_el)
-          items.forEach(item => {
-            let checkbox_el = document.createElement("input")
-            checkbox_el.setAttribute("id", prompt_id+"__"+item["id"])
-            checkbox_el.setAttribute("type", "checkbox")
-            checkbox_el.setAttribute("class", "multi-checkbox")
-            wrapper_el.appendChild(checkbox_el)
-
-            let item_label = document.createElement("label")
-            item_label.setAttribute("for", prompt_id+"__"+item["id"])
-            item_label.setAttribute("class", "multi-label")
-            item_label.innerHTML = item["display"]
-            wrapper_el.appendChild(item_label)
-          })
-          root_el.appendChild(wrapper_el)
-        }
-        function insert_input(prompt, prompt_id, class_name, type){
-          let root_el = document.getElementById("prompts")
-          let wrapper_el = document.createElement("div")
-          wrapper_el.setAttribute("class", "prompt")
-
-          let item_label = document.createElement("label")
-          item_label.setAttribute("for", prompt_id)
-          item_label.setAttribute("class", class_name)
-          item_label.innerHTML = prompt
-
-          let input_el = document.createElement("input")
-          input_el.setAttribute("id", prompt_id)
-          input_el.setAttribute("type", type)
-          wrapper_el.appendChild(item_label)
-          wrapper_el.appendChild(input_el)
-          root_el.appendChild(wrapper_el)
-
-          return input_el
-        }
-        function insert_number(prompt, prompt_id){
-          insert_input(prompt, prompt_id, "number", "number")
-        }
-        function insert_text(prompt, prompt_id){
-          insert_input(prompt, prompt_id, "text", "text")
-        }
-        function insert_range(prompt, prompt_id, min, max){
-          let input_el = insert_input(prompt, prompt_id, "number", "range")
-          input_el.setAttribute("min", min)
-          input_el.setAttribute("max", max)
-          input_el.setAttribute("value", Math.floor((max+min)/2))
-
-          let checkbox_el = document.createElement("input")
-          checkbox_el.setAttribute("id", prompt_id+"_checkbox")
-          checkbox_el.setAttribute("type", "checkbox")
-          input_el.parentElement.insertBefore(checkbox_el, input_el)
-        }
-        function insert_textarea(prompt, prompt_id){
-          let root_el = document.getElementById("prompts")
-          let wrapper_el = document.createElement("div")
-          wrapper_el.setAttribute("class", "prompt")
-
-          let item_label = document.createElement("label")
-          item_label.setAttribute("for", prompt_id)
-          item_label.setAttribute("class", "number")
-          item_label.innerHTML = prompt
-
-          let input_el = document.createElement("textarea")
-          input_el.setAttribute("id", prompt_id)
-
-          let label_wrapper = document.createElement("div")
-          label_wrapper.appendChild(item_label)
-          wrapper_el.appendChild(label_wrapper)
-          wrapper_el.appendChild(input_el)
-          root_el.appendChild(wrapper_el)
-        }
-        function insert_book(title){
-          let safe_id = title.replace(/\s/g, '');
-
-          let item_label = document.createElement("label")
-          item_label.setAttribute("for", safe_id)
-          item_label.setAttribute("class", "number")
-          item_label.innerHTML = title
-
-          let input_el = document.createElement("input")
-          input_el.setAttribute("id", safe_id)
-          input_el.setAttribute("type", "number")
-          input_el.setAttribute("placeholder", "pages")
-
-          let item_complete_label = document.createElement("label")
-          item_complete_label.setAttribute("for", safe_id+"_complete")
-          item_complete_label.innerHTML = "Completed?"
-
-          let input_complete_el = document.createElement("input")
-          input_complete_el.setAttribute("id", safe_id+"_complete")
-          input_complete_el.setAttribute("type", "checkbox")
-
-          let wrapper_el = document.createElement("div")
-          wrapper_el.setAttribute("class", "prompt")
-          wrapper_el.appendChild(item_label)
-          wrapper_el.appendChild(input_el)
-          wrapper_el.appendChild(item_complete_label)
-          wrapper_el.appendChild(input_complete_el)
-
-          let root_el = document.getElementById("books")
-          root_el.appendChild(wrapper_el)
-        }
-        function item(i){
-          return {"id": i, "display": i}
-        }
-        async function enqueue_data(path, payload, do_alert=false){
-          payload["timestamp"] =  Date.now()
-          await fetch(path, {method: "POST", body: JSON.stringify(payload)})
-          if(do_alert){
-            alert("saved!")
-          }
-        }
-        function submit_geolocation(){
-          navigator.geolocation.getCurrentPosition(function(pos){
-            enqueue_data("/submit_payload", {
-              "geoposition": {
-                "latitude": pos.coords.latitude,
-                "longitude": pos.coords.longitude
-              }
-            })
-          });
-        }
-        function on_submit(){
-          let payload = {}
-          document.querySelectorAll("#prompts input[type=checkbox].multi-checkbox").forEach(el => {
-            let p = el.id.split("__", 2)
-            if(!(p[0] in payload)){
-              payload[p[0]] = {}
-            }
-            payload[p[0]][p[1]] = el.checked
-          })
-          document.querySelectorAll("#prompts input[type=number]").forEach(el => {
-            payload[el.id] = el.value
-          })
-          document.querySelectorAll("#prompts input[type=checkbox]:checked + input[type=range]").forEach(el => {
-            payload[el.id] = el.value
-          })
-          document.querySelectorAll("#prompts textarea").forEach(el => {
-            payload[el.id] = el.value
-          })
-          payload["books"] = []
-          document.querySelectorAll("#books .prompt").forEach(el => {
-            if(el.childNodes[1].value){
-              book = {
-                  "title": el.childNodes[0].innerHTML,
-                  "pages": el.childNodes[1].value,
-                  "complete": el.childNodes[3].checked
-              }
-              payload["books"].push(book)
-            }
-          })
-          console.log(payload["books"])
-          enqueue_data("/submit_payload", payload, do_alert=true)
-          submit_geolocation()
-        }
-        window.onload = function(){
-          fetch("/forms").then(res => res.json()).then(data => {
-            data.forEach(form => {
-              switch(form["type"]) {
-                case "multiple_select":
-                  insert_multiple_select(form["prompt"], form["prompt_id"], form["extra"])
-                  break;
-                case "number":
-                  insert_number(form["prompt"], form["prompt_id"])
-                  break;
-                case "range":
-                  insert_range(
-                    form["prompt"], form["prompt_id"], form["extra"]["min"], form["extra"]["max"])
-                  break;
-                case "textarea":
-                  insert_textarea(form["prompt"], form["prompt_id"])
-                  break;
-                case "text":
-                  insert_text(form["prompt"], form["prompt_id"])
-                  break;
-              }
-            })
-          })
-          fetch("/books").then(res => res.json()).then(data => {
-            data.forEach(book => insert_book(book))
-          })
-        }
-      </script>
-    </div>
-  </body>
-</html>
author	Mark Powers <mark@marks.kitchen>	2023-01-30 22:26:19 -0600
committer	Mark Powers <mark@marks.kitchen>	2023-01-30 22:27:26 -0600
commit	ad11ec7f93dca356748cb6c8bc49313a7ee7c3d7 (patch)
tree	72418f494cd4b405cecdd5e6fbd539781e0c30e0 /index.html
parent	b6c0e7dbc3b618ecca2449c4395ce857649521cf (diff)