Add text type

2 files changed, 37 insertions, 47 deletions

diff --git a/index.html b/index.html
index 64490b3..fe2fe46 100644
--- a/index.html
+++ b/index.html
@@ -6,7 +6,7 @@
         #margin-top: 0;
         #margin-bottom: 0;
       }
-      label.number {
+      label.number, label.text {
         margin-right: 1rem;
       }
       label.multi-label {
@@ -29,6 +29,9 @@
       input[type="range"] {
         width: 60%;
       }
+      input[type="text"] {
+        height: 3rem;
+      }
       .prompt {
         margin-bottom: 2rem;
       }
@@ -72,47 +75,36 @@
           })
           root_el.appendChild(wrapper_el)
         }
-        function insert_number(prompt, prompt_id){
+        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", "number")
+          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", "number")
+          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 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 checkbox_el = document.createElement("input")
-          checkbox_el.setAttribute("id", prompt_id+"_checkbox")
-          checkbox_el.setAttribute("type", "checkbox")
-
-          let input_el = document.createElement("input")
-          input_el.setAttribute("id", prompt_id)
-          input_el.setAttribute("type", "range")
+          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))
-          wrapper_el.appendChild(item_label)
-          wrapper_el.appendChild(checkbox_el)
-          wrapper_el.appendChild(input_el)
-          root_el.appendChild(wrapper_el)
         }
         function insert_textarea(prompt, prompt_id){
           let root_el = document.getElementById("prompts")
@@ -219,25 +211,27 @@
         }
         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;
-		}
-	    })
+            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))
           })
diff --git a/server.py b/server.py
index d970860..be69c04 100644
--- a/server.py
+++ b/server.py
@@ -61,12 +61,8 @@ class TrackerHTTPRequestHandler(BaseHTTPRequestHandler):
                 self.end_headers()
                 self.wfile.write(json.dumps(items).encode("utf-8"))
         elif u.path == "/forms":
-            # multiple_select, prompt, prompt_id, items [{id, display}]
-            # number, prompt, prompt_id
-            # range, prompt, prompt_id, min, max
-            # textarea, prompt, prompt_id
             with conn.cursor() as cur:
-                cur.execute("SELECT type, prompt, prompt_id, extra FROM form")
+                cur.execute("SELECT type, prompt, prompt_id, extra FROM form ORDER BY id")
                 items = []
                 for row in cur:
                     items.append({