space fixes

main
jerl 2024-04-15 22:23:14 -07:00
parent bf895466da
commit dff6a281c1
2 changed files with 40 additions and 19 deletions

View File

@ -33,15 +33,18 @@ function save(span) {
}); });
} }
function add(x, y, scale = 1) { function add(s) {
let span = document.createElement('span'); let span = document.createElement('span');
span.classList.add('span'); span.classList.add('span');
if (s.id)
span.id = 'span' + s.id;
span.innerText = s.content;
span.contentEditable = true; span.contentEditable = true;
span.spellcheck = false; span.spellcheck = false;
span.scale = scale; span.scale = s.scale;
span.style.left = `${x}px`; span.style.left = `${s.x}px`;
span.style.top = `${y}px`; span.style.top = `${s.y}px`;
span.style.transform = `translate(-50%, -50%) scale(${scale})`; span.style.transform = `translate(-50%, -50%) scale(${s.scale})`;
span.onkeydown = function(event) { span.onkeydown = function(event) {
if (event.key === 'Enter' && !event.getModifierState('Shift')) { if (event.key === 'Enter' && !event.getModifierState('Shift')) {
event.preventDefault(); event.preventDefault();
@ -89,6 +92,21 @@ function add(x, y, scale = 1) {
return span; return span;
} }
window.socket.on('span', msg => {
if (msg.thread !== spaceId)
return;
let span = document.getElementById('span' + msg.id);
if (span) {
span.innerText = msg.content;
span.x = msg.x;
span.y = msg.y;
span.scale = msg.scale;
span.style.transform = `translate(-50%, -50%) scale(${msg.scale})`;
}
else
add(msg);
});
export default function loadSpace() { export default function loadSpace() {
if (!space) { if (!space) {
space = document.getElementById('space'); space = document.getElementById('space');
@ -102,7 +120,12 @@ export default function loadSpace() {
editing = null; editing = null;
return; return;
} }
editing = add(event.offsetX + space.scrollLeft, event.offsetY + space.scrollTop); editing = add({
x: event.offsetX + space.scrollLeft,
y: event.offsetY + space.scrollTop,
scale: 1,
content: ''
});
editing.focus(); editing.focus();
}; };
} }
@ -113,10 +136,7 @@ export default function loadSpace() {
window.emit('get_space', { thread: window.threadId }, msg => { window.emit('get_space', { thread: window.threadId }, msg => {
if (!msg.success) if (!msg.success)
console.log('get space failed: ' + msg.message); console.log('get space failed: ' + msg.message);
for (const span of msg.spans) { for (const span of msg.spans)
let el = add(span.x, span.y, span.scale); add(span);
el.innerText = span.content;
el.id = 'span' + span.id;
}
}); });
}; };

View File

@ -47,14 +47,15 @@ const save_span = async (msg, respond, socket, io) => {
if (permissions.rows.length > 0 || members.includes(username)) { if (permissions.rows.length > 0 || members.includes(username)) {
const sockets = io.cache[username]; const sockets = io.cache[username];
for (let s of sockets) { for (let s of sockets) {
io.to(s).emit('span', { if (s !== socket.id)
id, io.to(s).emit('span', {
thread: msg.thread, id,
content: msg.content, thread: msg.thread,
x: msg.x, content: msg.content,
y: msg.y, x: msg.x,
scale: msg.scale y: msg.y,
}); scale: msg.scale
});
} }
} }
} }