Signal/minetest-websockets
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Upload files to "/"

Browse source
This commit is contained in:
Signal 2025-06-01 00:47:42 +00:00
parent d060fa6ff4
commit bd95277266
1 changed files with 67 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

67
mtchat.html Normal file
View file

@ -0,0 +1,67 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="https://minecaptain.com/venture/css/all.css">
<script src="https://minecaptain.com/venture/js?js=vui-base.js|vui-elements.js|vui-ripple-buttons.js|vui-forms.js|vui-modals.js"></script>
</head>
<body>
<div id="body">
<div id="messages">
</div>
<vui-input id="input" label="Message"></vui-input>
</div>
<script>
var box = document.querySelector("#messages")
function addMessage(name, msg) {
let lastSender = box.lastElementChild?.getAttribute('sender')
if (lastSender == name) {
box.lastElementChild.insertAdjacentHTML('beforeend', `
<div style="width: 100%; border-bottom: 1px solid var(--border-color); margin-block: 10px;"></div>
<div style="margin-inline: 30px;display:flex;">
<div>${msg}</div>
<vui-popover-item style="display: block;margin: 0;margin-left: auto;" target="1747779141" data-endpoint="<span>This message was sent <vui-timestamp hint='sent-ago'>${(new Date()).getTime()}</vui-timestamp></span>"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 97.24 97.24" style="fill: none; stroke: var(--txt-muted);" width="18" height="18"><circle cx="48.62" cy="48.62" r="43.62" style="stroke-miterlimit: 10; stroke-width: 10px;"></circle><path d="m48.64,14.1v34.52c7.07,4.3,14.13,8.59,21.2,12.89" style="stroke-linejoin: round; stroke-width: 9px;"></path></svg></vui-popover-item>
</div>
`)
} else {
box.insertAdjacentHTML('beforeend', `
<div class="area" style="contain: content;" sender="${name}">
<vui-avatar img="https://belmonttechnical.com/venture/assets/gradient1.png">${name}</vui-avatar>
<div style="margin-inline: 30px;display:flex;">
<div>${msg}</div>
<vui-popover-item style="display: block;margin: 0;margin-left: auto;" target="1747779141" data-endpoint="<span>This message was sent <vui-timestamp hint='sent-ago'>${(new Date()).getTime()}</vui-timestamp></span>"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 97.24 97.24" style="fill: none; stroke: var(--txt-muted);" width="18" height="18"><circle cx="48.62" cy="48.62" r="43.62" style="stroke-miterlimit: 10; stroke-width: 10px;"></circle><path d="m48.64,14.1v34.52c7.07,4.3,14.13,8.59,21.2,12.89" style="stroke-linejoin: round; stroke-width: 9px;"></path></svg></vui-popover-item>
</div>
</div>
`)
}
}
var host = '' // Set this to the local IP address of your server, or localhost if on the same machine.
var ws = new WebSocket(`ws://${host}:8001`)
ws.onmessage = ev=>{
let data = JSON.parse(ev.data)
if (data.type == "chat") {
addMessage('#' + data.name, data.msg)
}
}
let input = document.querySelector('#input')
input.addEventListener('keyup', ev=>{
if (ev.key == "Enter") {
ws.send(JSON.stringify({type: "chat", sender: "???", msg: input.value}))
addMessage("???", input.value)
input.value = ""
}
})
</script>
</body>
</html>