From b7d4e5c4686bc8aac41d832567190002542a1743 Mon Sep 17 00:00:00 2001 From: Vika Date: Thu, 29 Sep 2022 22:39:28 +0300 Subject: companion-lite: port to TypeScript --- kittybox-rs/companion-lite/src/main.ts | 85 ++++++++++++++++++++++++++++++++++ 1 file changed, 85 insertions(+) create mode 100644 kittybox-rs/companion-lite/src/main.ts (limited to 'kittybox-rs/companion-lite/src/main.ts') diff --git a/kittybox-rs/companion-lite/src/main.ts b/kittybox-rs/companion-lite/src/main.ts new file mode 100644 index 0000000..d593188 --- /dev/null +++ b/kittybox-rs/companion-lite/src/main.ts @@ -0,0 +1,85 @@ +import { query_channels, submit, MicropubChannel, MF2 } from "./micropub_api.js"; + +function get_token() { + return (form.elements.namedItem("access_token") as HTMLInputElement).value +} + +const form = document.getElementById("micropub") as HTMLFormElement; +const channel_select_radio = document.getElementById("select_channels") as HTMLInputElement; + +channel_select_radio.onclick = async () => { + const channels = await query_channels(form.action, get_token()) + if (channels !== undefined) { + populate_channel_list(channels) + } +} + +const no_channel_radio = document.getElementById("no_channel") as HTMLInputElement; +no_channel_radio.onclick = () => { + (document.getElementById("channels") as HTMLElement).style.display = "none"; + const channel_list = document.getElementById("channels_target") as HTMLElement + channel_list.innerHTML = ""; +} + +function construct_body(form: HTMLFormElement): MF2 { + let content = (form.elements.namedItem("content") as HTMLInputElement).value; + let name: string | undefined = (form.elements.namedItem("name") as HTMLInputElement).value || undefined; + let category: string[] = (form.elements.namedItem("category") as HTMLInputElement).value + .split(",") + .map(val => val.trim()); + + let channel: string[] | undefined = undefined; + let channel_select = (form.elements.namedItem("channel_select") as HTMLInputElement).value; + if (channel_select) { + let channel_selector = form.elements.namedItem("channel"); + if (channel_selector instanceof RadioNodeList) { + channel = (Array.from(channel_selector) as HTMLInputElement[]) + .map(i => i.checked ? i.value : false) + .filter(i => i) as string[]; + } else if (channel_selector instanceof HTMLInputElement) { + channel = [channel_selector.value] + } + } + return { + type: ["h-entry"], + properties: { + content: [content], + name: name ? [name] : undefined, + category: category.length ? category : undefined, + channel: channel ? channel : undefined + } + } +} + +function populate_channel_list(channels: MicropubChannel[]) { + (document.getElementById("channels") as HTMLElement).style.display = "block"; + const channel_list = document.getElementById("channels_target") as HTMLElement; + channel_list.innerHTML = ""; + channels.forEach((channel) => { + const template = (document.getElementById("channel_selector") as HTMLTemplateElement).content.cloneNode(true) as HTMLElement; + const input = template.querySelector("input") as HTMLInputElement; + const label = template.querySelector("label") as HTMLLabelElement; + input.id = `channel_selector_option_${channel.uid}` + input.value = channel.uid + label.htmlFor = input.id + label.innerHTML = `${channel.name}` + + channel_list.appendChild(template) + }) +} + +form.onsubmit = async (event) => { + event.preventDefault() + const mf2 = construct_body(form); + console.log(JSON.stringify(mf2)); + try { + submit(form.action, get_token(), mf2) + } catch (e) { + // TODO show errors to user + + return + } + form.clear() +} + +(document.getElementById("authorized") as HTMLElement).style.display = "block"; -- cgit 1.4.1