525 lines
28 KiB
HTML
525 lines
28 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>go-socket debug</title>
|
|
<style>
|
|
body { font-family: monospace; background: #1a1a1a; color: #e0e0e0; margin: 20px; }
|
|
h1 { color: #aaa; font-size: 1.2em; margin-bottom: 12px; }
|
|
|
|
.config { margin-bottom: 10px; }
|
|
.config label { color: #888; }
|
|
.config input { background: #2a2a2a; color: #e0e0e0; border: 1px solid #444; padding: 4px 8px; width: 300px; }
|
|
|
|
#log-header { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
|
|
#log-header span { color: #888; font-size: 1em; }
|
|
#clear-log { background: #2a2a2a; color: #888; border: 1px solid #444; padding: 3px 10px; cursor: pointer; font-size: 0.85em; font-family: monospace; }
|
|
#log { background: #111; border: 1px solid #333; padding: 10px; height: 340px; overflow-y: auto; font-size: 0.85em; white-space: pre-wrap; word-break: break-all; margin-bottom: 14px; }
|
|
.log-ws { color: #8af; }
|
|
.log-http { color: #af8; }
|
|
.log-err { color: #f88; }
|
|
.log-info { color: #666; }
|
|
|
|
#btn-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
|
|
#btn-row button {
|
|
background: #2a2a2a; color: #ccc; border: 1px solid #444;
|
|
padding: 5px 10px; cursor: pointer; font-family: monospace; font-size: 0.8em;
|
|
}
|
|
#btn-row button:hover { background: #333; border-color: #666; }
|
|
#btn-row button.active { background: #2a3a2a; border-color: #4a4; color: #af8; }
|
|
#btn-row button.active.ws { background: #2a2a3a; border-color: #44a; color: #88f; }
|
|
#btn-row button.warn { color: #f88; }
|
|
|
|
#form-panel { display: none; background: #1e1e1e; border: 1px solid #333; padding: 12px; margin-bottom: 6px; }
|
|
#form-panel.open { display: block; }
|
|
#form-title { color: #888; font-size: 0.85em; margin-bottom: 10px; }
|
|
.form-content { display: none; }
|
|
.form-content.active { display: block; }
|
|
.field { margin-bottom: 7px; }
|
|
.field label { display: inline-block; width: 160px; color: #777; font-size: 0.88em; }
|
|
.field input { background: #2a2a2a; color: #e0e0e0; border: 1px solid #444; padding: 4px 8px; width: 260px; font-family: monospace; font-size: 0.88em; }
|
|
.hint { color: #555; font-size: 0.78em; margin-left: 5px; }
|
|
.form-actions { margin-top: 10px; display: flex; gap: 8px; align-items: center; }
|
|
button.send { background: #2a4a2a; color: #8f8; border: 1px solid #4a4; padding: 5px 16px; cursor: pointer; font-family: monospace; }
|
|
button.send:hover { background: #3a5a3a; }
|
|
button.ws-action { background: #2a2a4a; color: #88f; border: 1px solid #44a; padding: 5px 14px; cursor: pointer; font-family: monospace; }
|
|
button.ws-action:hover { background: #3a3a5a; }
|
|
button.ws-danger { background: #4a2a2a; color: #f88; border: 1px solid #a44; padding: 5px 14px; cursor: pointer; font-family: monospace; }
|
|
.ws-status { font-size: 0.82em; }
|
|
.ws-status.connected { color: #8f8; }
|
|
.ws-status.disconnected { color: #f88; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>go-socket debug</h1>
|
|
|
|
<div class="config">
|
|
<label>Base URL: </label>
|
|
<input id="baseUrl" value="http://localhost:8080">
|
|
</div>
|
|
|
|
<div id="log-header">
|
|
<span>Response Log</span>
|
|
<button id="clear-log" onclick="clearLog()">Clear</button>
|
|
</div>
|
|
<div id="log"></div>
|
|
|
|
<div id="btn-row">
|
|
<button data-form="new-user" onclick="showForm('new-user')">POST /user</button>
|
|
<button data-form="new-token" onclick="showForm('new-token')">POST /token</button>
|
|
<button data-form="new-connection" onclick="showForm('new-connection')">POST /connection</button>
|
|
<button data-form="file-upload" onclick="showForm('file-upload')">POST /file</button>
|
|
<button data-form="mod-user-profile" onclick="showForm('mod-user-profile')">PATCH /user/profile</button>
|
|
<button data-form="mod-user-avatar" onclick="showForm('mod-user-avatar')">PATCH /user/avatar</button>
|
|
<button data-form="mod-user-profilebg" onclick="showForm('mod-user-profilebg')">PATCH /user/profilebg</button>
|
|
<button data-form="mod-connection-elevate" onclick="showForm('mod-connection-elevate')">POST /connection/elevate</button>
|
|
<button data-form="mod-connection-deelevate" onclick="showForm('mod-connection-deelevate')">POST /connection/deelevate</button>
|
|
<button data-form="get-user" onclick="showForm('get-user')">GET /user</button>
|
|
<button data-form="get-connections" onclick="showForm('get-connections')">GET /connections</button>
|
|
<button data-form="get-connections-unread" onclick="showForm('get-connections-unread')">GET /connections/unreadmessages</button>
|
|
<button data-form="get-connection-messages" onclick="showForm('get-connection-messages')">GET /connection/messages</button>
|
|
<button data-form="file-download" onclick="showForm('file-download')">GET /file</button>
|
|
<button data-form="get-user-avatar" onclick="showForm('get-user-avatar')">GET /user/avatar</button>
|
|
<button data-form="get-user-profilebg" onclick="showForm('get-user-profilebg')">GET /user/profilebg</button>
|
|
<button data-form="del-user" class="warn" onclick="showForm('del-user')">DELETE /user</button>
|
|
<button data-form="del-connection" class="warn" onclick="showForm('del-connection')">DELETE /connection</button>
|
|
<button data-form="msg-user" onclick="showForm('msg-user')">POST /message</button>
|
|
<button data-form="websocket" onclick="showForm('websocket')">WS /ws</button>
|
|
</div>
|
|
|
|
<div id="form-panel">
|
|
<div id="form-title"></div>
|
|
|
|
<!-- POST /user -->
|
|
<div class="form-content" id="fc-new-user">
|
|
<div class="field"><label>username</label><input id="nu-username" placeholder="min 4 chars"></div>
|
|
<div class="field"><label>password</label><input id="nu-password" placeholder="min 8 chars"></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('new-user')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- POST /token -->
|
|
<div class="form-content" id="fc-new-token">
|
|
<div class="field"><label>username</label><input id="nt-username" placeholder="min 4 chars"></div>
|
|
<div class="field"><label>password</label><input id="nt-password" placeholder="min 8 chars"></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('new-token')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- POST /connection -->
|
|
<div class="form-content" id="fc-new-connection">
|
|
<div class="field"><label>token</label><input id="nconn-token" placeholder=""></div>
|
|
<div class="field"><label>recipient</label><input id="nconn-recipient" placeholder="UUID"></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('new-connection')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- POST /file -->
|
|
<div class="form-content" id="fc-file-upload">
|
|
<div class="field"><label>token</label><input id="fu-token" placeholder=""></div>
|
|
<div class="field"><label>connectionid</label><input id="fu-connectionid" placeholder="UUID"></div>
|
|
<div class="field"><label>file</label><input id="fu-file" type="file"></div>
|
|
<div class="form-actions"><button class="send" onclick="submitFileUpload()">Send</button></div>
|
|
</div>
|
|
|
|
<!-- PATCH /user/profile -->
|
|
<div class="form-content" id="fc-mod-user-profile">
|
|
<div class="field"><label>token</label><input id="mup-token" placeholder=""></div>
|
|
<div class="field"><label>pronouns</label><input id="mup-pronouns" placeholder="optional"></div>
|
|
<div class="field"><label>description</label><input id="mup-description" placeholder="optional"></div>
|
|
<div class="field"><label>color</label><input id="mup-color" placeholder="255,100,50 optional"><span class="hint">R,G,B</span></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('mod-user-profile')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- PATCH /user/avatar -->
|
|
<div class="form-content" id="fc-mod-user-avatar">
|
|
<div class="field"><label>token</label><input id="mua-token" placeholder=""></div>
|
|
<div class="field"><label>file</label><input id="mua-file" type="file"></div>
|
|
<div class="form-actions"><button class="send" onclick="submitAvatarUpload()">Send</button></div>
|
|
</div>
|
|
|
|
<!-- PATCH /user/profilebg -->
|
|
<div class="form-content" id="fc-mod-user-profilebg">
|
|
<div class="field"><label>token</label><input id="mpb-token" placeholder=""></div>
|
|
<div class="field"><label>file</label><input id="mpb-file" type="file"></div>
|
|
<div class="form-actions"><button class="send" onclick="submitProfileBgUpload()">Send</button></div>
|
|
</div>
|
|
|
|
<!-- POST /connection/elevate -->
|
|
<div class="form-content" id="fc-mod-connection-elevate">
|
|
<div class="field"><label>token</label><input id="mce-token" placeholder=""></div>
|
|
<div class="field"><label>connectionid</label><input id="mce-connectionid" placeholder="UUID"></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('mod-connection-elevate')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- POST /connection/deelevate -->
|
|
<div class="form-content" id="fc-mod-connection-deelevate">
|
|
<div class="field"><label>token</label><input id="mcde-token" placeholder=""></div>
|
|
<div class="field"><label>connectionid</label><input id="mcde-connectionid" placeholder="UUID"></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('mod-connection-deelevate')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- GET /user -->
|
|
<div class="form-content" id="fc-get-user">
|
|
<div class="field"><label>token</label><input id="gu-token" placeholder=""></div>
|
|
<div class="field"><label>targetid</label><input id="gu-targetid" placeholder="UUID"></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('get-user')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- GET /connections -->
|
|
<div class="form-content" id="fc-get-connections">
|
|
<div class="field"><label>token</label><input id="gconn-token" placeholder=""></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('get-connections')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- GET /connections/unreadmessages -->
|
|
<div class="form-content" id="fc-get-connections-unread">
|
|
<div class="field"><label>token</label><input id="gcur-token" placeholder=""></div>
|
|
<div class="field"><label>connections</label><input id="gcur-connections" placeholder="UUID,UUID,..."></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('get-connections-unread')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- GET /connection/messages -->
|
|
<div class="form-content" id="fc-get-connection-messages">
|
|
<div class="field"><label>token</label><input id="gcm-token" placeholder=""></div>
|
|
<div class="field"><label>connectionid</label><input id="gcm-connectionid" placeholder="UUID"></div>
|
|
<div class="field"><label>messages</label><input id="gcm-messages" placeholder="count (optional)"></div>
|
|
<div class="field"><label>before</label><input id="gcm-before" placeholder="RFC3339 (optional)"><span class="hint">e.g. 2025-01-01T00:00:00Z</span></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('get-connection-messages')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- GET /file -->
|
|
<div class="form-content" id="fc-file-download">
|
|
<div class="field"><label>token</label><input id="fd-token" placeholder=""></div>
|
|
<div class="field"><label>connectionid</label><input id="fd-connectionid" placeholder="UUID"></div>
|
|
<div class="field"><label>key</label><input id="fd-key" placeholder="returned by upload"></div>
|
|
<div class="form-actions"><button class="send" onclick="submitFileDownload()">Send</button></div>
|
|
</div>
|
|
|
|
<!-- GET /user/avatar -->
|
|
<div class="form-content" id="fc-get-user-avatar">
|
|
<div class="field"><label>token</label><input id="gua-token" placeholder=""></div>
|
|
<div class="field"><label>userid</label><input id="gua-userid" placeholder="UUID"></div>
|
|
<div class="form-actions"><button class="send" onclick="submitGetUserAvatar()">Send</button></div>
|
|
</div>
|
|
|
|
<!-- GET /user/profilebg -->
|
|
<div class="form-content" id="fc-get-user-profilebg">
|
|
<div class="field"><label>token</label><input id="gpb-token" placeholder=""></div>
|
|
<div class="field"><label>userid</label><input id="gpb-userid" placeholder="UUID"></div>
|
|
<div class="form-actions"><button class="send" onclick="submitGetUserProfileBg()">Send</button></div>
|
|
</div>
|
|
|
|
<!-- DELETE /user -->
|
|
<div class="form-content" id="fc-del-user">
|
|
<div class="field"><label>token</label><input id="du-token" placeholder=""></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('del-user')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- DELETE /connection -->
|
|
<div class="form-content" id="fc-del-connection">
|
|
<div class="field"><label>token</label><input id="dc-token" placeholder=""></div>
|
|
<div class="field"><label>connectionid</label><input id="dc-connectionid" placeholder="UUID"></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('del-connection')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- POST /message -->
|
|
<div class="form-content" id="fc-msg-user">
|
|
<div class="field"><label>token</label><input id="mu-token" placeholder=""></div>
|
|
<div class="field"><label>connectionid</label><input id="mu-connectionid" placeholder="UUID"></div>
|
|
<div class="field"><label>msgContent</label><input id="mu-msgContent" placeholder="message text (optional if file set)"></div>
|
|
<div class="field"><label>attachedFile</label><input id="mu-attachedFile" placeholder="key from POST /file (optional)"></div>
|
|
<div class="form-actions"><button class="send" onclick="submit('msg-user')">Send</button></div>
|
|
</div>
|
|
|
|
<!-- WS /ws -->
|
|
<div class="form-content" id="fc-websocket">
|
|
<div class="form-actions" style="margin-bottom:10px">
|
|
<button class="ws-action" onclick="wsConnect()">Connect</button>
|
|
<button class="ws-danger" onclick="wsDisconnect()">Disconnect</button>
|
|
<span id="ws-status" class="ws-status disconnected">disconnected</span>
|
|
</div>
|
|
<div class="field"><label>token (auth)</label><input id="ws-token" placeholder="sent as first message"></div>
|
|
<div class="form-actions" style="margin-bottom:10px">
|
|
<button class="ws-action" onclick="wsAuth()">Send Auth Token</button>
|
|
</div>
|
|
<div class="field"><label>raw message</label><input id="ws-msg" placeholder='{"key":"value"}'></div>
|
|
<div class="form-actions">
|
|
<button class="ws-action" onclick="wsSend()">Send Raw</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
let ws = null;
|
|
let activeForm = null;
|
|
let currentToken = '';
|
|
|
|
// method, path, which field ids go where
|
|
// dest: 'header' | 'body' | 'query'
|
|
const formDefs = {
|
|
'new-user': { method:'POST', path:'/user', title:'POST /user — register new user', fields:[{id:'nu-username',dest:'body',name:'username'},{id:'nu-password',dest:'body',name:'password'}] },
|
|
'new-token': { method:'POST', path:'/token', title:'POST /token — login / get token', fields:[{id:'nt-username',dest:'body',name:'username'},{id:'nt-password',dest:'body',name:'password'}] },
|
|
'new-connection': { method:'POST', path:'/connection', title:'POST /connection — send connection request', fields:[{id:'nconn-token',dest:'header',name:'token'},{id:'nconn-recipient',dest:'body',name:'recipient'}] },
|
|
'mod-user-profile': { method:'PATCH', path:'/user/profile', title:'PATCH /user/profile — update profile', fields:[{id:'mup-token',dest:'header',name:'token'},{id:'mup-pronouns',dest:'body',name:'pronouns'},{id:'mup-description',dest:'body',name:'description'},{id:'mup-color',dest:'body',name:'color'}] },
|
|
'mod-connection-elevate': { method:'POST', path:'/connection/elevate', title:'POST /connection/elevate — elevate', fields:[{id:'mce-token',dest:'header',name:'token'},{id:'mce-connectionid',dest:'body',name:'connectionid'}] },
|
|
'mod-connection-deelevate':{ method:'POST', path:'/connection/deelevate', title:'POST /connection/deelevate — de-elevate', fields:[{id:'mcde-token',dest:'header',name:'token'},{id:'mcde-connectionid',dest:'body',name:'connectionid'}] },
|
|
'get-user': { method:'GET', path:'/user', title:'GET /user — get user info', fields:[{id:'gu-token',dest:'header',name:'token'},{id:'gu-targetid',dest:'query',name:'targetid'}] },
|
|
'get-connections': { method:'GET', path:'/connections', title:'GET /connections — get connections', fields:[{id:'gconn-token',dest:'header',name:'token'}] },
|
|
'get-connections-unread': { method:'GET', path:'/connections/unreadmessages', title:'GET /connections/unreadmessages — unread counts for given connections (returns []uint32 in same order)', fields:[{id:'gcur-token',dest:'header',name:'token'},{id:'gcur-connections',dest:'query',name:'connections'}] },
|
|
'get-connection-messages': { method:'GET', path:'/connection/messages', title:'GET /connection/messages — message history', fields:[{id:'gcm-token',dest:'header',name:'token'},{id:'gcm-connectionid',dest:'query',name:'connectionid'},{id:'gcm-messages',dest:'query',name:'messages'},{id:'gcm-before',dest:'query',name:'before'}] },
|
|
'del-user': { method:'DELETE', path:'/user', title:'DELETE /user — delete own account', fields:[{id:'du-token',dest:'header',name:'token'}] },
|
|
'del-connection': { method:'DELETE', path:'/connection', title:'DELETE /connection — delete a connection', fields:[{id:'dc-token',dest:'header',name:'token'},{id:'dc-connectionid',dest:'query',name:'connectionid'}] },
|
|
'msg-user': { method:'POST', path:'/message', title:'POST /message — send direct message', fields:[{id:'mu-token',dest:'header',name:'token'},{id:'mu-connectionid',dest:'body',name:'connectionid'},{id:'mu-msgContent',dest:'body',name:'msgContent'},{id:'mu-attachedFile',dest:'body',name:'attachedFile'}] },
|
|
'mod-user-avatar': { title:'PATCH /user/avatar — set avatar image' },
|
|
'mod-user-profilebg': { title:'PATCH /user/profilebg — set profile background' },
|
|
'file-upload': { title:'POST /file — upload file (multipart)' },
|
|
'file-download': { title:'GET /file — get presigned download URL' },
|
|
'get-user-avatar': { title:'GET /user/avatar — get avatar URL' },
|
|
'get-user-profilebg': { title:'GET /user/profilebg — get profile background URL' },
|
|
'websocket': { title:'WS /ws — WebSocket connection' },
|
|
};
|
|
|
|
function autofillTokens() {
|
|
if (!currentToken) return;
|
|
document.querySelectorAll('input[id$="-token"]').forEach(el => { el.value = currentToken; });
|
|
}
|
|
|
|
function showForm(name) {
|
|
const panel = document.getElementById('form-panel');
|
|
const titleEl = document.getElementById('form-title');
|
|
const buttons = document.querySelectorAll('#btn-row button');
|
|
|
|
buttons.forEach(b => b.classList.remove('active'));
|
|
|
|
if (activeForm === name) {
|
|
panel.classList.remove('open');
|
|
document.querySelectorAll('.form-content').forEach(el => el.classList.remove('active'));
|
|
activeForm = null;
|
|
return;
|
|
}
|
|
|
|
if (activeForm) {
|
|
const prev = document.getElementById('fc-' + activeForm);
|
|
if (prev) prev.classList.remove('active');
|
|
}
|
|
|
|
activeForm = name;
|
|
const def = formDefs[name];
|
|
|
|
const btn = document.querySelector('#btn-row button[data-form="' + name + '"]');
|
|
if (btn) {
|
|
btn.classList.add('active');
|
|
if (name === 'websocket') btn.classList.add('ws');
|
|
}
|
|
|
|
titleEl.textContent = def.title;
|
|
|
|
const fc = document.getElementById('fc-' + name);
|
|
if (fc) fc.classList.add('active');
|
|
|
|
panel.classList.add('open');
|
|
autofillTokens();
|
|
}
|
|
|
|
function submit(name) {
|
|
const def = formDefs[name];
|
|
if (!def || !def.fields) return;
|
|
|
|
const headers = {};
|
|
const bodyFields = {};
|
|
const queryFields = {};
|
|
|
|
for (const f of def.fields) {
|
|
const el = document.getElementById(f.id);
|
|
const v = el ? el.value : '';
|
|
if (!v) continue;
|
|
if (f.dest === 'header') headers[f.name] = v;
|
|
else if (f.dest === 'query') queryFields[f.name] = v;
|
|
else bodyFields[f.name] = v;
|
|
}
|
|
|
|
const body = Object.keys(bodyFields).length ? new URLSearchParams(bodyFields) : null;
|
|
const query = Object.keys(queryFields).length ? queryFields : null;
|
|
apiCall(def.method, def.path, { headers, body, query });
|
|
}
|
|
|
|
function log(prefix, text, cls) {
|
|
const div = document.getElementById('log');
|
|
const ts = new Date().toTimeString().slice(0, 8);
|
|
const line = document.createElement('div');
|
|
line.className = cls;
|
|
let formatted = text;
|
|
try { formatted = JSON.stringify(JSON.parse(text), null, 2); } catch(e) {}
|
|
line.textContent = '[' + ts + '] ' + prefix + ': ' + formatted;
|
|
div.appendChild(line);
|
|
div.scrollTop = div.scrollHeight;
|
|
}
|
|
|
|
function clearLog() { document.getElementById('log').textContent = ''; }
|
|
|
|
function baseUrl() { return document.getElementById('baseUrl').value.replace(/\/$/, ''); }
|
|
|
|
async function apiCall(method, path, { headers = {}, body = null, query = null } = {}) {
|
|
let url = baseUrl() + path;
|
|
if (query) url += '?' + new URLSearchParams(query).toString();
|
|
|
|
const opts = { method, headers };
|
|
if (body) opts.body = body;
|
|
|
|
const detail = body ? body.toString() : (query ? new URLSearchParams(query).toString() : '');
|
|
log(method + ' ' + path, detail || '(no params)', 'log-info');
|
|
|
|
try {
|
|
const resp = await fetch(url, opts);
|
|
const text = await resp.text();
|
|
log('HTTP ' + resp.status, text, resp.ok ? 'log-http' : 'log-err');
|
|
|
|
if (method === 'POST' && path === '/token' && resp.ok) {
|
|
try { currentToken = JSON.parse(text).token; } catch(e) {}
|
|
autofillTokens();
|
|
wsConnectAndAuth();
|
|
}
|
|
|
|
return { ok: resp.ok, text, status: resp.status };
|
|
} catch(e) {
|
|
log('HTTP ERR', e.message, 'log-err');
|
|
return { ok: false };
|
|
}
|
|
}
|
|
|
|
function wsConnectAndAuth() {
|
|
if (ws) { wsAuth(); return; }
|
|
const url = baseUrl().replace(/^http/, 'ws') + '/ws';
|
|
log('WS', 'auto-connecting to ' + url, 'log-info');
|
|
ws = new WebSocket(url);
|
|
ws.onopen = () => { setWsStatus(true); log('WS', 'connected', 'log-ws'); wsAuth(); };
|
|
ws.onmessage = (e) => { log('WS ←', e.data, 'log-ws'); };
|
|
ws.onerror = () => { log('WS ERR', 'error', 'log-err'); };
|
|
ws.onclose = () => { setWsStatus(false); log('WS', 'disconnected', 'log-info'); ws = null; };
|
|
}
|
|
|
|
function wsConnect() {
|
|
if (ws) { log('WS', 'already connected', 'log-info'); return; }
|
|
const url = baseUrl().replace(/^http/, 'ws') + '/ws';
|
|
log('WS', 'connecting to ' + url, 'log-info');
|
|
ws = new WebSocket(url);
|
|
ws.onopen = () => { setWsStatus(true); log('WS', 'connected', 'log-ws'); };
|
|
ws.onmessage = (e) => { log('WS ←', e.data, 'log-ws'); };
|
|
ws.onerror = () => { log('WS ERR', 'error', 'log-err'); };
|
|
ws.onclose = () => { setWsStatus(false); log('WS', 'disconnected', 'log-info'); ws = null; };
|
|
}
|
|
|
|
function wsDisconnect() { if (ws) { ws.close(); ws = null; } }
|
|
|
|
function wsAuth() {
|
|
if (!ws) { log('WS', 'not connected', 'log-err'); return; }
|
|
const el = document.getElementById('ws-token');
|
|
const token = el ? el.value : currentToken;
|
|
if (!token) { log('WS', 'no token to auth with', 'log-err'); return; }
|
|
const msg = JSON.stringify({ token });
|
|
ws.send(msg);
|
|
log('WS →', msg, 'log-info');
|
|
}
|
|
|
|
function wsSend() {
|
|
if (!ws) { log('WS', 'not connected', 'log-err'); return; }
|
|
const msg = document.getElementById('ws-msg').value;
|
|
ws.send(msg);
|
|
log('WS →', msg, 'log-info');
|
|
}
|
|
|
|
function setWsStatus(connected) {
|
|
const el = document.getElementById('ws-status');
|
|
if (!el) return;
|
|
el.textContent = connected ? 'connected' : 'disconnected';
|
|
el.className = 'ws-status ' + (connected ? 'connected' : 'disconnected');
|
|
}
|
|
|
|
async function submitFileUpload() {
|
|
const token = document.getElementById('fu-token').value;
|
|
const connectionid = document.getElementById('fu-connectionid').value;
|
|
const fileInput = document.getElementById('fu-file');
|
|
if (!fileInput.files.length) { log('HTTP ERR', 'no file selected', 'log-err'); return; }
|
|
const form = new FormData();
|
|
form.append('connectionid', connectionid);
|
|
form.append('file', fileInput.files[0]);
|
|
log('POST /file', 'connectionid=' + connectionid + ' file=' + fileInput.files[0].name, 'log-info');
|
|
try {
|
|
const resp = await fetch(baseUrl() + '/file', { method: 'POST', headers: { token }, body: form });
|
|
const text = await resp.text();
|
|
log('HTTP ' + resp.status, text, resp.ok ? 'log-http' : 'log-err');
|
|
if (resp.ok) {
|
|
const keyEl = document.getElementById('fd-key');
|
|
if (keyEl) keyEl.value = text;
|
|
const dmKeyEl = document.getElementById('mu-attachedFile');
|
|
if (dmKeyEl) dmKeyEl.value = text;
|
|
}
|
|
} catch(e) { log('HTTP ERR', e.message, 'log-err'); }
|
|
}
|
|
|
|
async function submitFileDownload() {
|
|
const token = document.getElementById('fd-token').value;
|
|
const connectionid = document.getElementById('fd-connectionid').value;
|
|
const key = document.getElementById('fd-key').value;
|
|
const query = new URLSearchParams({ connectionid, key });
|
|
log('GET /file', query.toString(), 'log-info');
|
|
try {
|
|
const resp = await fetch(baseUrl() + '/file?' + query.toString(), { method: 'GET', headers: { token } });
|
|
const text = await resp.text();
|
|
log('HTTP ' + resp.status, text, resp.ok ? 'log-http' : 'log-err');
|
|
} catch(e) { log('HTTP ERR', e.message, 'log-err'); }
|
|
}
|
|
|
|
async function submitAvatarUpload() {
|
|
const token = document.getElementById('mua-token').value;
|
|
const fileInput = document.getElementById('mua-file');
|
|
if (!fileInput.files.length) { log('HTTP ERR', 'no file selected', 'log-err'); return; }
|
|
const form = new FormData();
|
|
form.append('file', fileInput.files[0]);
|
|
log('PATCH /user/avatar', 'file=' + fileInput.files[0].name, 'log-info');
|
|
try {
|
|
const resp = await fetch(baseUrl() + '/user/avatar', { method: 'PATCH', headers: { token }, body: form });
|
|
const text = await resp.text();
|
|
log('HTTP ' + resp.status, text, resp.ok ? 'log-http' : 'log-err');
|
|
} catch(e) { log('HTTP ERR', e.message, 'log-err'); }
|
|
}
|
|
|
|
async function submitProfileBgUpload() {
|
|
const token = document.getElementById('mpb-token').value;
|
|
const fileInput = document.getElementById('mpb-file');
|
|
if (!fileInput.files.length) { log('HTTP ERR', 'no file selected', 'log-err'); return; }
|
|
const form = new FormData();
|
|
form.append('file', fileInput.files[0]);
|
|
log('PATCH /user/profilebg', 'file=' + fileInput.files[0].name, 'log-info');
|
|
try {
|
|
const resp = await fetch(baseUrl() + '/user/profilebg', { method: 'PATCH', headers: { token }, body: form });
|
|
const text = await resp.text();
|
|
log('HTTP ' + resp.status, text, resp.ok ? 'log-http' : 'log-err');
|
|
} catch(e) { log('HTTP ERR', e.message, 'log-err'); }
|
|
}
|
|
|
|
async function submitGetUserAvatar() {
|
|
const token = document.getElementById('gua-token').value;
|
|
const userid = document.getElementById('gua-userid').value;
|
|
const query = new URLSearchParams({ userid });
|
|
log('GET /user/avatar', query.toString(), 'log-info');
|
|
try {
|
|
const resp = await fetch(baseUrl() + '/user/avatar?' + query.toString(), { method: 'GET', headers: { token } });
|
|
const text = await resp.text();
|
|
log('HTTP ' + resp.status, text, resp.ok ? 'log-http' : 'log-err');
|
|
} catch(e) { log('HTTP ERR', e.message, 'log-err'); }
|
|
}
|
|
|
|
async function submitGetUserProfileBg() {
|
|
const token = document.getElementById('gpb-token').value;
|
|
const userid = document.getElementById('gpb-userid').value;
|
|
const query = new URLSearchParams({ userid });
|
|
log('GET /user/profilebg', query.toString(), 'log-info');
|
|
try {
|
|
const resp = await fetch(baseUrl() + '/user/profilebg?' + query.toString(), { method: 'GET', headers: { token } });
|
|
const text = await resp.text();
|
|
log('HTTP ' + resp.status, text, resp.ok ? 'log-http' : 'log-err');
|
|
} catch(e) { log('HTTP ERR', e.message, 'log-err'); }
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|