1 files changed, 6 insertions, 118 deletions
diff --git a/frontend/ui.ts b/frontend/ui.ts
index 8ce34a4..3b223ba 100644
--- a/frontend/ui.ts
+++ b/frontend/ui.ts
@@ -1,125 +1,13 @@
-import { bangs, process_query } from "./query.ts";
+import { section_info_search, section_search } from "./search.ts";
+import { section_engine_select, section_info_start } from "./start.ts";
+import { section_submit } from "./submit.ts";
 
 export function add_page_content(engine?: string) {
     //@ts-ignore HTMLCollectionOf is an iterator
     for (const e of [...document.getElementsByTagName("section")]) e.remove()
-    if (engine) {
-        document.body.append(section_search(engine), section_info_search())
-    } else {
-        document.body.append(section_info_start(), section_engine_select())
-    }
-}
-
-function section_search(engine: string) {
-    engine = engine.toLowerCase();
-    const section = document.createElement("section")
-    section.classList.add("search")
-
-    if (document.getElementById("search-link")) {
-        // <link /> is already present, we need reload because browser wont notice otherwise
-        window.location.reload()
-    }
-    const link = document.createElement("link")
-    link.rel = "search"
-    link.id = "search-link"
-    link.type = "application/opensearchdescription+xml"
-    link.href = `/search.xml?default=${encodeURIComponent(engine)}`
-    link.title = `Fastbangs (default engine: ${engine})`
-    document.head.append(link)
-
-    const heading = document.createElement("h1")
-    heading.textContent = engine
-    bangs.then(bangs => heading.textContent = bangs[engine]?.name ?? engine)
-
-    const input = document.createElement("input")
-    input.type = "input"
-    input.addEventListener("keydown", ev => {
-        if (ev.code == "Enter") process_query(engine, input.value ?? "")
-    })
-
-    const submit = document.createElement("button")
-    submit.textContent = "Search"
-    submit.addEventListener("click", () => {
-        process_query(engine, input.value ?? "")
-    })
-
-    const search = document.createElement("div")
-    search.classList.add("bar")
-    search.append(input, submit)
-
-    section.append(heading, search)
-    return section
-}
-
-function section_engine_select() {
-    const section = document.createElement("section")
-    section.classList.add("engine-select")
-
-    const select = async (e: string) => {
-        const engine = e.toLowerCase();
-        if (!(await bangs)[engine]) return status("error", `Engine ${JSON.stringify(e)} does not exist.`)
-        window.location.hash = `#${e}`
-    }
-
-    const heading = document.createElement("h2")
-    heading.textContent = "Select a search engine"
-
-    const listing = document.createElement("ul")
-    bangs.then(bangs => {
-        for (const key in bangs) if (bangs[key]!.pinned) {
-            const li = document.createElement("li")
-            li.classList.add("pinned")
-            li.textContent = bangs[key]!.name ?? key
-            li.onclick = () => select(key)
-            listing.prepend(li)
-        }
-    })
-    const other = document.createElement("li")
-    const label = document.createElement("label")
-    label.textContent = "Select other engine by bang:"
-    const input = document.createElement("input")
-    input.type = "input"
-    input.addEventListener("keydown", ev => {
-        if (ev.code == "Enter") select(input.value)
-    })
-    const submit = document.createElement("button")
-    submit.textContent = "Select"
-    submit.addEventListener("click", () => select(input.value))
-    other.append(label, input, submit)
-    listing.append(other)
-
-    section.append(heading, listing)
-    return section
-}
-
-function section_info_search() {
-    const section = document.createElement("section")
-    section.classList.add("info")
-
-    const heading = document.createElement("h2")
-    heading.textContent = "Setup"
-
-    const info = document.createElement("p")
-    info.textContent = `To install this as the default search engine, select "Add Fastbangs" in the context-menu of the URL-bar.`
-
-    section.append(heading, info)
-    return section
-}
-
-function section_info_start() {
-    const section = document.createElement("section")
-    section.classList.add("info")
-
-    const heading = document.createElement("h1")
-    heading.textContent = "Fastbangs"
-
-    const info = document.createElement("p")
-    info.textContent = `
-        This application provides a way to (mostly) locally handle search bangs.
-        First select a default engine to use, then register this page as a search in your browser
-    `
-    section.append(heading, info)
-    return section
+    if (engine == "~submit") document.body.append(section_submit())
+    else if (engine) document.body.append(section_search(engine), section_info_search())
+    else document.body.append(section_info_start(), section_engine_select())
 }
 
 let status_el: HTMLElement