about summary refs log tree commit diff
path: root/kittybox-rs/src/frontend/onboarding.js
diff options
context:
space:
mode:
authorVika <vika@fireburn.ru>2022-05-24 17:18:30 +0300
committerVika <vika@fireburn.ru>2022-05-24 17:18:30 +0300
commit5610a5f0bf1a9df02bd3d5b55e2cdebef2440360 (patch)
tree8394bcf1dcc204043d7adeb8dde2e2746977606e /kittybox-rs/src/frontend/onboarding.js
parent2f93873122b47e42f7ee1c38f1f04d052a63599c (diff)
flake.nix: reorganize
 - Kittybox's source code is moved to a subfolder
   - This improves build caching by Nix since it doesn't take changes
     to other files into account
 - Package and test definitions were spun into separate files
   - This makes my flake.nix much easier to navigate
   - This also makes it somewhat possible to use without flakes (but
     it is still not easy, so use flakes!)
 - Some attributes were moved in compliance with Nix 2.8's changes to
   flake schema
Diffstat (limited to 'kittybox-rs/src/frontend/onboarding.js')
-rw-r--r--kittybox-rs/src/frontend/onboarding.js87
1 files changed, 87 insertions, 0 deletions
diff --git a/kittybox-rs/src/frontend/onboarding.js b/kittybox-rs/src/frontend/onboarding.js
new file mode 100644
index 0000000..7f9aa32
--- /dev/null
+++ b/kittybox-rs/src/frontend/onboarding.js
@@ -0,0 +1,87 @@
+const firstOnboardingCard = "intro";
+
+function switchOnboardingCard(card) {
+    Array.from(document.querySelectorAll("form.onboarding > fieldset")).map(node => {
+        if (node.id == card) {
+            node.style.display = "block";
+        } else {
+            node.style.display = "none";
+        }
+    });
+
+    Array.from(document.querySelectorAll("form.onboarding > ul#progressbar > li")).map(node => {
+        if (node.id == card) {
+            node.classList.add("active")
+        } else {
+            node.classList.remove("active")
+        }
+    })
+};
+
+window.kittybox_onboarding = {
+    switchOnboardingCard
+};
+
+document.querySelector("form.onboarding > ul#progressbar").style.display = "";
+switchOnboardingCard(firstOnboardingCard);
+
+function switchCardOnClick(event) {
+    switchOnboardingCard(event.target.dataset.card)
+}
+
+function multiInputAddMore(event) {
+    let parent = event.target.parentElement;
+    let template = event.target.parentElement.querySelector("template").content.cloneNode(true);
+    parent.prepend(template);
+}
+
+Array.from(document.querySelectorAll("form.onboarding > fieldset button.switch_card")).map(button => {
+    button.addEventListener("click", switchCardOnClick)
+})
+
+Array.from(document.querySelectorAll("form.onboarding > fieldset div.multi_input > button.add_more")).map(button => {
+    button.addEventListener("click", multiInputAddMore)
+    multiInputAddMore({ target: button });
+})
+
+const form = document.querySelector("form.onboarding");
+console.log(form);
+form.onsubmit = async (event) => {
+    console.log(event);
+    event.preventDefault();
+    const form = event.target;
+    const json = {
+        user: {
+            type: ["h-card"],
+            properties: {
+                name: [form.querySelector("#hcard_name").value],
+                pronoun: Array.from(form.querySelectorAll("#hcard_pronouns")).map(input => input.value).filter(i => i != ""),
+                url: Array.from(form.querySelectorAll("#hcard_url")).map(input => input.value).filter(i => i != ""),
+                note: [form.querySelector("#hcard_note").value]
+            }
+        },
+        first_post: {
+            type: ["h-entry"],
+            properties: {
+                content: [form.querySelector("#first_post_content").value]
+            }
+        },
+        blog_name: form.querySelector("#blog_name").value,
+        feeds: Array.from(form.querySelectorAll(".multi_input#custom_feeds > fieldset.feed")).map(form => {
+            return {
+                name: form.querySelector("#feed_name").value,
+                slug: form.querySelector("#feed_slug").value
+            }
+        }).filter(feed => feed.name == "" || feed.slug == "")
+    };
+
+    await fetch("/", {
+        method: "POST",
+        body: JSON.stringify(json),
+        headers: { "Content-Type": "application/json" }
+    }).then(response => {
+        if (response.status == 201) {
+            window.location.href = window.location.href;
+        }
+    })
+}
\ No newline at end of file