diff --git a/debugger/coordinates.js b/debugger/coordinates.js
index b763457..648a13a 100644
--- a/debugger/coordinates.js
+++ b/debugger/coordinates.js
@@ -1,12 +1,86 @@
const cords = document.getElementById("coordinates");
+const [canvas] = document.getElementsByClassName("leaflet-tile");
+
+const key = "storage_location";
+const s = JSON.parse(localStorage.getItem(key) || JSON.stringify([0, 1000, 2]));
+const cordsArr = s;
+const url = [-1.1,-1.1,-1.1];
+let down = undefined;
+
+setInterval(() => {
+ if (url[0] !== cordsArr[0] || url[1] !== cordsArr[1] || url[2] !== cordsArr[2]) {
+ url[0] = cordsArr[0];
+ url[1] = cordsArr[1];
+ url[2] = cordsArr[2];
+ history.pushState(null, "", `/@${url[0]},${url[1]},${url[2]}`);
+ }
+}, 1000);
function updateCords(x, y) {
- cords.textContent = `(${Math.round(x)}, ${Math.round(y)})`;
+ localStorage.setItem(key, JSON.stringify([x,y, cordsArr[2]]));
+ const text = `(${Math.round(x)}, ${Math.round(y)})`;
+ if (cords.firstChild) {
+ cords.firstChild.nodeValue = text;
+ } else {
+ cords.textContent = text;
+ }
+ if (down) {
+ const size = 250;
+ const half = size / 2;
+ canvas.style.height = canvas.style.width = `${size + 4}px`;
+ const centerW = Math.round(window.innerWidth / 2) - half;
+ const centerH = Math.round(window.innerHeight / 2) - half;
+ canvas.style.left = `${centerW + ((Math.abs(x) % size) - half)}px`;
+ canvas.style.top = `${centerH + ((Math.abs(y) % size) - half)}px`;
+
+ }
}
-updateCords(0, 1000);
+updateCords(cordsArr[0], cordsArr[1]);
+
+cords.addEventListener("click", () => {
+ const cord = prompt("cords");
+ if (cord) {
+ down = undefined;
+ const [x, y] = cord.split(",");
+ cordsArr[0] = parseInt(x);
+ cordsArr[1] = parseInt(y);
+ cordsArr[2] = cordsArr[2] ?? 2;
+ updateCords(cordsArr[0], cordsArr[1]);
+
+ }
+});
window.addEventListener("mousemove", event => {
- updateCords(event.x, event.y);
+
+ if (down) {
+ updateCords(
+ down[0] - event.x,
+ down[1] - event.y
+ );
+ } else {
+ updateCords(
+ cordsArr[0] + event.x,
+ cordsArr[1] + event.y
+ );
+ }
});
+
+window.addEventListener("mousedown", event => down = [event.x, event.y]);
+window.addEventListener("mouseup", event => {
+ if (down) {
+ cordsArr[0] -= down[0] - event.x;
+ cordsArr[1] -= down[1] - event.y;
+ updateCords(cordsArr[0], cordsArr[1]);
+ down = null;
+ }
+});
+
+window.addEventListener("keypress", event => {
+ if (event.key === "+") {
+ cordsArr[2]++;
+ } else if (event.key === "-") {
+ cordsArr[2]--;
+ }
+});
\ No newline at end of file
diff --git a/debugger/index.html b/debugger/index.html
index bf9caf9..318a8d2 100644
--- a/debugger/index.html
+++ b/debugger/index.html
@@ -6,10 +6,30 @@
Pixel canvas emulator
+
-
+
+
diff --git a/debugger/poll.js b/debugger/poll.js
index cf735cf..bd1ec71 100644
--- a/debugger/poll.js
+++ b/debugger/poll.js
@@ -1,15 +1,15 @@
-(async () => {
- const file = await fetch("../dist/user-script.user.js").then((e => e.text()));
- while (true) {
- await new Promise(resolve => setTimeout(resolve), 100);
- const file2 = await fetch("../dist/user-script.user.js")
- .then((e => e.status === 200 ? e.text() : Promise.resolve(file)));
- if (file !== file2) {
- console.log(file);
- break;
- }
- }
- await new Promise(resolve => setTimeout(resolve), 1000);
- location.reload();
+// (async () => {
+// const file = await fetch("../dist/user-script.user.js").then((e => e.text()));
+// while (true) {
+// await new Promise(resolve => setTimeout(resolve), 100);
+// const file2 = await fetch("../dist/user-script.user.js")
+// .then((e => e.status === 200 ? e.text() : Promise.resolve(file)));
+// if (file !== file2) {
+// console.log(file);
+// break;
+// }
+// }
+// await new Promise(resolve => setTimeout(resolve), 1000);
+// location.reload();
-})();
\ No newline at end of file
+// })();
\ No newline at end of file