diff --git a/assets/web/index.html b/assets/web/index.html
index 04dca6e..5eab126 100644
--- a/assets/web/index.html
+++ b/assets/web/index.html
@@ -9,6 +9,7 @@
var mapOffsetX = 0.0;
var mapOffsetY = 0.0;
var draggedToken = { token: null, offX: 0, offY: 0 };
+ var draggedDiv = { div: null, offX: 0, offY: 0 };
function init() {
let view = document.getElementById('game-view');
@@ -40,6 +41,8 @@
document.body.onclick = (e) => {
document.getElementById('msg-context-menu').style.display = 'none';
}
+ document.body.onmousemove = onMoveableDivDrag;
+ document.body.onmouseup = onMoveableDivMouseUp;
// TODO: Remove when done dev-ing
tavern.onmessage({ text: 'test', id: 1, source: 'rusty', character: 'bart' });
}
@@ -150,7 +153,7 @@
}
function onGameMouseMove(event) {
if(event.buttons == 2) {
- // middle click
+ // right click
let map = document.getElementById('map');
let mult = event.ctrlKey ? 2.0 : 1.0;
mapOffsetX += event.movementX * mult;
@@ -203,7 +206,7 @@
holder.appendChild(row);
}
}
- document.getElementById('dice-roll-title').innerText = action.display_name ?? action.display;
+ document.getElementById('dice-roll-title').innerText = action.display_name ?? action.name;
document.getElementById('dice-roll-popup').style.display = 'flex';
}
function rollPopup() {
@@ -239,6 +242,30 @@
console.log(rolls);
tavern.action_result(holder.action.name, 'Louise', [], rolls);
}
+ function onMoveableDivMouseDown(e, id) {
+ if(e.buttons == 1) {
+ let div = document.getElementById(id);
+ let rect = div.getBoundingClientRect();
+ draggedDiv.div = div;
+ draggedDiv.offX = e.clientX - rect.x;
+ draggedDiv.offY = e.clientY - rect.y;
+
+ }
+ }
+ function onMoveableDivDrag(e) {
+ if(draggedDiv.div) {
+ draggedDiv.div.style.right = '';
+ draggedDiv.div.style.top = `${e.clientY - draggedDiv.offY}px`;
+ draggedDiv.div.style.left = `${e.clientX - draggedDiv.offX}px`;
+ }
+ }
+ function onMoveableDivMouseUp(e, id) {
+ draggedDiv.div = null;
+ }
+ function showHideDiv(id) {
+ let div = document.getElementById(id);
+ div.style.display = div.style.display == 'none' ? 'flex' : 'none';
+ }