add basic frontend modules to access the api
This commit is contained in:
parent
3a81b952c4
commit
a9a4cdbb5c
5 changed files with 157 additions and 1 deletions
63
frontend/src/gateway.js
Normal file
63
frontend/src/gateway.js
Normal file
|
@ -0,0 +1,63 @@
|
|||
import { getAuthToken, getItem } from "./storage";
|
||||
|
||||
export const GatewayPayloadType = {
|
||||
Hello: 0,
|
||||
Authenticate: 1,
|
||||
Ready: 2,
|
||||
Ping: 3,
|
||||
|
||||
ChannelCreate: 110,
|
||||
ChannelUpdate: 111,
|
||||
ChannelDelete: 112,
|
||||
|
||||
MessageCreate: 120,
|
||||
MessageUpdate: 121,
|
||||
MessageDelete: 122,
|
||||
}
|
||||
|
||||
export default {
|
||||
ws: null,
|
||||
authenticated: false,
|
||||
heartbeatInterval: null,
|
||||
user: null,
|
||||
channels: null,
|
||||
init() {
|
||||
this.ws = new WebSocket(getItem("gatewayBase"));
|
||||
this.ws.onmessage = (message) => {
|
||||
const payload = JSON.parse(message);
|
||||
|
||||
switch (payload.t) {
|
||||
case GatewayPayloadType.Hello: {
|
||||
this.send({
|
||||
t: GatewayPayloadType.Authenticate,
|
||||
d: getAuthToken()
|
||||
});
|
||||
|
||||
this.heartbeatInterval = setInterval(() => {
|
||||
this.send({
|
||||
t: GatewayPayloadType.Ping,
|
||||
d: 0
|
||||
});
|
||||
}, payload.d.pingInterval);
|
||||
break;
|
||||
}
|
||||
case GatewayPayloadType.Ready: {
|
||||
this.user = payload.d.user;
|
||||
this.channels = payload.d.channels;
|
||||
break;
|
||||
}
|
||||
}
|
||||
};
|
||||
this.ws.onclose = () => {
|
||||
this.authenticated = false;
|
||||
this.user = null;
|
||||
this.channels = null;
|
||||
if (this.heartbeatInterval) {
|
||||
clearInterval(this.heartbeatInterval);
|
||||
}
|
||||
};
|
||||
},
|
||||
send(data) {
|
||||
return this.ws.send(JSON.stringify(data));
|
||||
}
|
||||
};
|
|
@ -1,4 +1,4 @@
|
|||
import App from './App.svelte';
|
||||
import App from './components/App.svelte';
|
||||
|
||||
const app = new App({
|
||||
target: document.body
|
||||
|
|
41
frontend/src/request.js
Normal file
41
frontend/src/request.js
Normal file
|
@ -0,0 +1,41 @@
|
|||
import { getAuthToken } from "./storage";
|
||||
|
||||
export default async function(method, endpoint, auth=true, body=null) {
|
||||
const options = {
|
||||
method,
|
||||
};
|
||||
|
||||
if (body) {
|
||||
options.headers = {
|
||||
...options.headers || {},
|
||||
"Content-Type": "application/json"
|
||||
};
|
||||
}
|
||||
|
||||
if (auth) {
|
||||
const token = getAuthToken();
|
||||
if (token) {
|
||||
options.headers = {
|
||||
...options.headers || {},
|
||||
"Authorization": `Bearer ${token}`
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await fetch(endpoint, options);
|
||||
return {
|
||||
success: true,
|
||||
json: await res.json(),
|
||||
ok: res.ok,
|
||||
status: res.status
|
||||
}
|
||||
} catch (e) {
|
||||
return {
|
||||
success: false,
|
||||
json: null,
|
||||
ok: res.ok,
|
||||
status: res.status
|
||||
}
|
||||
}
|
||||
}
|
52
frontend/src/storage.js
Normal file
52
frontend/src/storage.js
Normal file
|
@ -0,0 +1,52 @@
|
|||
const defaults = {
|
||||
apiBase: `${window.location.origin}/api/v1`,
|
||||
gatewayBase: `${location.protocol === "https:" ? "wss" : "ws"}://${location.host}/gateway`
|
||||
};
|
||||
|
||||
const dummyProvider = {
|
||||
_store: {},
|
||||
getItem(key) {
|
||||
return this._store[key];
|
||||
},
|
||||
setItem(key, value) {
|
||||
this._store[key] = value;
|
||||
}
|
||||
};
|
||||
|
||||
function getProvider() {
|
||||
if (!window.localStorage || !window.localStorage.getItem || !window.localStorage.setItem) {
|
||||
return dummyProvider;
|
||||
}
|
||||
return window.localStorage;
|
||||
}
|
||||
|
||||
export function getItem(key) {
|
||||
return getProvider().getItem(key);
|
||||
}
|
||||
|
||||
export function setItem(key, value) {
|
||||
return getProvider().setItem(key, value);
|
||||
}
|
||||
|
||||
export function getAuthToken() {
|
||||
return getItem("token");
|
||||
}
|
||||
|
||||
export function setAuthToken(value) {
|
||||
return setItem("token", value);
|
||||
}
|
||||
|
||||
export function setItemIfNull(key, value) {
|
||||
const provider = getProvider();
|
||||
if (!provider.getItem(key)) {
|
||||
provider.setItem(key, value);
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
export function initStorageDefaults() {
|
||||
for (const [k, v] of Object.entries(defaults)) {
|
||||
setItemIfNull(k, v);
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue