diff --git a/.gitignore b/.gitignore index d7e7bca..8de4bf4 100644 --- a/.gitignore +++ b/.gitignore @@ -3,4 +3,4 @@ frontend/dist/*.js frontend/.js underbbs underbbs-cli -__debug_* \ No newline at end of file +__debug_* diff --git a/README.md b/README.md index 2cba867..7e7365e 100644 --- a/README.md +++ b/README.md @@ -22,13 +22,24 @@ adapters receive commands via a quartzgun web API and send data back on their sh requirements are -- go 1.22 -- any recent nodejs that can do `typescript` and `webpack` 5 +- go 1.22 (for the backend) +- any recent nodejs that can do `typescript` and `webpack` 5 (for the frontend) from the project root: -1. `./build.sh front` +1. `./build.sh front` (if you will use the web components) 2. `./build.sh server` -3. `./underbbs` +3. `./underbbs` or `./underbbs-cli ADAPTER ACTION ARGS...` -visit `http://localhost:9090/app` \ No newline at end of file +## integrating + +### with the API and web components + +1. fill `Settings._instance` with adapter settings; these will mostly be authentication data (`SettingsElement` illustrates this) +2. instantiate whatever components you want on your page with their `data-gateway` and `data-target` appropriately set; further docs to come on these +3. call `DatagramSocket.connect(GATEWAY)` where `GATEWAY` is the domain of the `underbbs` API. `SettingsElement`'s connect button does this for you. + +### with the CLI + +1. Call the CLI directly from the serverside or locally +2. Process any output to your preference diff --git a/build.sh b/build.sh index 6c0902a..22033a5 100755 --- a/build.sh +++ b/build.sh @@ -21,6 +21,7 @@ case "$1" in server) go mod tidy go build + cp underbbs underbbs-cli ;; *) echo "usage: ${0} " diff --git a/frontend/dist/index.html b/frontend/dist/index.html deleted file mode 100644 index c54eb2b..0000000 --- a/frontend/dist/index.html +++ /dev/null @@ -1,29 +0,0 @@ - - - - - underBBS test - - - - - - - -
-
-
settings
-
timeline-select
-
timeline
-
-
-
profile
-
honks
-
-
- - - diff --git a/frontend/ts/index.ts b/frontend/ts/index.ts deleted file mode 100644 index 43c0424..0000000 --- a/frontend/ts/index.ts +++ /dev/null @@ -1,52 +0,0 @@ -import util from "./util" -import {AdapterState, AdapterData} from "./adapter"; -import {Message, Attachment, Author} from "./message" -import {Settings} from "./settings" -import { MessageElement } from "./message-element" -import { SettingsElement } from "./settings-element" -import { ProfileElement } from "./profile-element" -import { AuthorMessagesElement } from "./author-messages-element" -import { TimelineElement } from "./timeline-element" -import { TimelineFilterElement } from "./timeline-filter-element" -import {DatagramSocket} from "./websocket" - -function main() { - const saveData = localStorage.getItem("underbbs_settings"); - Settings._instance = saveData ? JSON.parse(saveData) : new Settings(); - - customElements.define("underbbs-message", MessageElement); - customElements.define("underbbs-settings", SettingsElement); - customElements.define("underbbs-profile", ProfileElement); - customElements.define("underbbs-author-messages", AuthorMessagesElement); - customElements.define("underbbs-timeline", TimelineElement); - customElements.define("underbbs-timeline-filter", TimelineFilterElement); - - util._("closeErr", util.closeErr); - - let settingsParent = util.$("settings_parent"); - if (settingsParent) { - settingsParent.innerHTML = `` - } - - let profileParent = util.$("profile_parent"); - if (profileParent) { - profileParent.innerHTML = "" - } - - let honksParent = util.$("honks_parent"); - if (honksParent) { - honksParent.innerHTML = ""; - } - - let timelineParent = util.$("timeline_parent"); - if (timelineParent) { - timelineParent.innerHTML = ""; - } - - let timelineSelectParent = util.$("timeline_filter_parent"); - if (timelineSelectParent) { - timelineSelectParent.innerHTML = ""; - } -} - -main(); diff --git a/frontend/ts/settings-element.ts b/frontend/ts/settings-element.ts index d9d4c46..38e4773 100644 --- a/frontend/ts/settings-element.ts +++ b/frontend/ts/settings-element.ts @@ -4,15 +4,17 @@ import {Settings} from "./settings" export class SettingsElement extends HTMLElement { - static observedAttributes = [ "data-adapters" ] + static observedAttributes = [ "data-adapters", "data-gateway" ] private _adapters: string[] = []; + private _gateway: string = ""; constructor() { super(); } connectedCallback() { + this._gateway = this.getAttribute("data-gateway") ?? ""; } attributeChangedCallback(attr: string, prev: string, next: string) { @@ -49,7 +51,7 @@ export class SettingsElement extends HTMLElement { } let connect = util.$("settings_connect_btn"); if (connect) { - connect.addEventListener("click", DatagramSocket.connect, false); + connect.addEventListener("click", ()=>{DatagramSocket.connect(this._gateway)}, false); } } } diff --git a/frontend/ts/websocket.ts b/frontend/ts/websocket.ts index a03274e..3686a50 100644 --- a/frontend/ts/websocket.ts +++ b/frontend/ts/websocket.ts @@ -2,11 +2,17 @@ import util from "./util" import {AdapterState, AdapterData} from "./adapter"; import {Message, Attachment, Author} from "./message" import {Settings} from "./settings" - +import {SettingsElement} from "./settings-element" +import {AuthorMessagesElement} from "./author-messages-element" +import {ProfileElement} from "./profile-element" +import {MessageElement} from "./message-element" +import {TimelineElement} from "./timeline-element" +import {TimelineFilterElement} from "./timeline-filter-element" export class DatagramSocket { public static skey: string | null = null; public static conn: WebSocket | null; + private static _gateway: string = "" private static onOpen(e: Event) { @@ -14,12 +20,16 @@ export class DatagramSocket { console.log(JSON.stringify(e)); } + private static gatewayWithScheme(): string { + return location.protocol + "//" + DatagramSocket._gateway + } + private static onMsg(e: MessageEvent) { const data = JSON.parse(e.data); console.log(data); if (data.key) { DatagramSocket.skey = data.key; - util.authorizedFetch("POST", "/api/adapters", JSON.stringify(Settings._instance.adapters)) + util.authorizedFetch("POST", DatagramSocket.gatewayWithScheme() + "/api/adapters", JSON.stringify(Settings._instance.adapters)) .then(r=> { if (r.ok) { // iterate through any components which might want to fetch data @@ -89,9 +99,17 @@ export class DatagramSocket { } } - static connect(): void { + static connect(gateway: string): void { + DatagramSocket._gateway = gateway; + const wsProto = location.protocol == "https:" ? "wss" : "ws"; - const _conn = new WebSocket(`${wsProto}://${location.host}/subscribe`, "underbbs"); + let wsUrl = "" + if (!gateway) { + wsUrl = `${wsProto}://${location.host}/subscribe`; + } else { + wsUrl = wsProto + "://" + gateway + "/subscribe" + } + const _conn = new WebSocket(wsUrl, "underbbs"); _conn.addEventListener("open", DatagramSocket.onOpen); _conn.addEventListener("message", DatagramSocket.onMsg); @@ -104,3 +122,19 @@ export class DatagramSocket { } } +function init() { + const saveData = localStorage.getItem("underbbs_settings"); + Settings._instance = saveData ? JSON.parse(saveData) : new Settings(); + + customElements.define("underbbs-message", MessageElement); + customElements.define("underbbs-settings", SettingsElement); + customElements.define("underbbs-profile", ProfileElement); + customElements.define("underbbs-author-messages", AuthorMessagesElement); + customElements.define("underbbs-timeline", TimelineElement); + customElements.define("underbbs-timeline-filter", TimelineFilterElement); + + console.log("underbbs initialized!") +} + +init(); + diff --git a/server/server.go b/server/server.go index 2bc65ed..ad76344 100644 --- a/server/server.go +++ b/server/server.go @@ -60,7 +60,8 @@ func (self *BBSServer) ServeHTTP(w http.ResponseWriter, r *http.Request) { func (self *BBSServer) subscribeHandler(w http.ResponseWriter, r *http.Request) { c, err := websocket.Accept(w, r, &websocket.AcceptOptions{ - Subprotocols: []string{}, + Subprotocols: []string{}, + OriginPatterns: []string{"*"}, }) if err != nil { self.logf("%v", err) diff --git a/webpack.config.js b/webpack.config.js index 4388bc8..b98893b 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -4,9 +4,10 @@ module.exports = { mode: 'production', context: path.resolve(__dirname, 'frontend', '.js'), entry: { - main: './index.js', + underbbs: './websocket.js', }, output: { + iife: false, filename: '[name].js', path: path.resolve(__dirname, 'frontend', 'dist'), },