diff --git a/assets/images/grid.png b/assets/images/grid.png deleted file mode 100644 index 34e5f03..0000000 Binary files a/assets/images/grid.png and /dev/null differ diff --git a/assets/scripts/KaplayMap/map.js b/assets/scripts/KaplayMap/map.js index 386293e..4dbaa4a 100644 --- a/assets/scripts/KaplayMap/map.js +++ b/assets/scripts/KaplayMap/map.js @@ -210,27 +210,6 @@ export class KaplayMap { this.events.dispatchEvent(event); } - initGrid() { - const grid = this.kp.loadSprite(null, "/assets/images/grid.png"); - - this.kp.onDraw(() => { - this.kp.drawSprite({ - sprite: grid, - tiled: true, - opacity: 0.25, - width: this.kp.width() + 200, - height: this.kp.height() + 200, - anchor: "center", - pos: this.kp.vec2( - Math.floor(this.kp.camPos().x / 100) * 100 + 0.5, - Math.floor(this.kp.camPos().y / 100) * 100 + 0.5 - ), - }); - }); - - return grid; - } - clearMouseMode() { this.lastReleaseTime = null; this.lastReleasePos = null; diff --git a/assets/scripts/KaplayMap/mapper.js b/assets/scripts/KaplayMap/mapper.js index d578bfd..605174b 100644 --- a/assets/scripts/KaplayMap/mapper.js +++ b/assets/scripts/KaplayMap/mapper.js @@ -45,6 +45,12 @@ export class EventMapperManager { // Init + __initFloor() { + const allFloors = Array.from(this.getAllFocusObject("floor").keys()); + + location.hash = allFloors[0]; + } + async load() { this.uimanager.setLoading(true); @@ -68,6 +74,8 @@ export class EventMapperManager { window.addEventListener("hashchange", () => this.hashchange()); + this.__initFloor(); + await this.hashchange(); this.uimanager.setLoading(false); diff --git a/assets/scripts/script.js b/assets/scripts/script.js index 71d4c1a..f1d712c 100644 --- a/assets/scripts/script.js +++ b/assets/scripts/script.js @@ -22,7 +22,22 @@ const kaplaymap = new KaplayMap(kp, {}); const eventmappermanager = new EventMapperManager(kaplaymap, mapUi); async function main() { - kaplaymap.initGrid(); + const grid = kp.loadSprite(null, "/files/images/grid.png"); + + kp.onDraw(() => { + kp.drawSprite({ + sprite: grid, + tiled: true, + opacity: 0.25, + width: kp.width() + 200, + height: kp.height() + 200, + anchor: "center", + pos: kp.vec2( + Math.floor(kp.camPos().x / 100) * 100 + 0.5, + Math.floor(kp.camPos().y / 100) * 100 + 0.5 + ), + }); + }); await eventmappermanager.load(); } diff --git a/assets/styles/style.css b/assets/styles/style.css index e1a7635..be20c35 100644 --- a/assets/styles/style.css +++ b/assets/styles/style.css @@ -1,6 +1,10 @@ @import url("./components.css"); @import url("./elements.css"); +@keyframes load { + to { transform: rotate(1turn) } +} + body, html { margin: 0; height: 100%; diff --git a/package-lock.json b/package-lock.json index 0b6b594..e5e7cd5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,12 +10,29 @@ "license": "MIT", "dependencies": { "express": "^4.19.2", + "http-proxy-middleware": "^3.0.0", "https": "^1.0.0" }, "devDependencies": { "nodemon": "^3.1.1" } }, + "node_modules/@types/http-proxy": { + "version": "1.17.14", + "resolved": "https://registry.npmjs.org/@types/http-proxy/-/http-proxy-1.17.14.tgz", + "integrity": "sha512-SSrD0c1OQzlFX7pGu1eXxSEjemej64aaNPRhhVYUGqXh0BtldAAx37MG8btcumvpgKyZp1F5Gn3JkktdxiFv6w==", + "dependencies": { + "@types/node": "*" + } + }, + "node_modules/@types/node": { + "version": "20.14.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.14.2.tgz", + "integrity": "sha512-xyu6WAMVwv6AKFLB+e/7ySZVr/0zLCzOa7rSpq6jNwpqOrUbcACDWC+53d4n2QHOnDou0fbIsg8wZu/sxrnI4Q==", + "dependencies": { + "undici-types": "~5.26.4" + } + }, "node_modules/accepts": { "version": "1.3.8", "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz", @@ -101,7 +118,6 @@ "version": "3.0.3", "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz", "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", - "dev": true, "dependencies": { "fill-range": "^7.1.1" }, @@ -283,6 +299,11 @@ "node": ">= 0.6" } }, + "node_modules/eventemitter3": { + "version": "4.0.7", + "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz", + "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==" + }, "node_modules/express": { "version": "4.19.2", "resolved": "https://registry.npmjs.org/express/-/express-4.19.2.tgz", @@ -328,7 +349,6 @@ "version": "7.1.1", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", - "dev": true, "dependencies": { "to-regex-range": "^5.0.1" }, @@ -353,6 +373,25 @@ "node": ">= 0.8" } }, + "node_modules/follow-redirects": { + "version": "1.15.6", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz", + "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==", + "funding": [ + { + "type": "individual", + "url": "https://github.com/sponsors/RubenVerborgh" + } + ], + "engines": { + "node": ">=4.0" + }, + "peerDependenciesMeta": { + "debug": { + "optional": true + } + } + }, "node_modules/forwarded": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz", @@ -500,6 +539,56 @@ "node": ">= 0.8" } }, + "node_modules/http-proxy": { + "version": "1.18.1", + "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz", + "integrity": "sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==", + "dependencies": { + "eventemitter3": "^4.0.0", + "follow-redirects": "^1.0.0", + "requires-port": "^1.0.0" + }, + "engines": { + "node": ">=8.0.0" + } + }, + "node_modules/http-proxy-middleware": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-3.0.0.tgz", + "integrity": "sha512-36AV1fIaI2cWRzHo+rbcxhe3M3jUDCNzc4D5zRl57sEWRAxdXYtw7FSQKYY6PDKssiAKjLYypbssHk+xs/kMXw==", + "dependencies": { + "@types/http-proxy": "^1.17.10", + "debug": "^4.3.4", + "http-proxy": "^1.18.1", + "is-glob": "^4.0.1", + "is-plain-obj": "^3.0.0", + "micromatch": "^4.0.5" + }, + "engines": { + "node": "^14.15.0 || ^16.10.0 || >=18.0.0" + } + }, + "node_modules/http-proxy-middleware/node_modules/debug": { + "version": "4.3.5", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.5.tgz", + "integrity": "sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==", + "dependencies": { + "ms": "2.1.2" + }, + "engines": { + "node": ">=6.0" + }, + "peerDependenciesMeta": { + "supports-color": { + "optional": true + } + } + }, + "node_modules/http-proxy-middleware/node_modules/ms": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", + "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==" + }, "node_modules/https": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/https/-/https-1.0.0.tgz", @@ -551,7 +640,6 @@ "version": "2.1.1", "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", - "dev": true, "engines": { "node": ">=0.10.0" } @@ -560,7 +648,6 @@ "version": "4.0.3", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", - "dev": true, "dependencies": { "is-extglob": "^2.1.1" }, @@ -572,11 +659,21 @@ "version": "7.0.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", - "dev": true, "engines": { "node": ">=0.12.0" } }, + "node_modules/is-plain-obj": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-3.0.0.tgz", + "integrity": "sha512-gwsOE28k+23GP1B6vFl1oVh/WOzmawBrKwo5Ev6wMKzPkaXaCDIQKzLnvsA42DRlbVTWorkgTKIviAKCWkfUwA==", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/media-typer": { "version": "0.3.0", "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", @@ -598,6 +695,18 @@ "node": ">= 0.6" } }, + "node_modules/micromatch": { + "version": "4.0.7", + "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz", + "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==", + "dependencies": { + "braces": "^3.0.3", + "picomatch": "^2.3.1" + }, + "engines": { + "node": ">=8.6" + } + }, "node_modules/mime": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz", @@ -749,7 +858,6 @@ "version": "2.3.1", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", - "dev": true, "engines": { "node": ">=8.6" }, @@ -823,6 +931,11 @@ "node": ">=8.10.0" } }, + "node_modules/requires-port": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz", + "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==" + }, "node_modules/safe-buffer": { "version": "5.2.1", "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz", @@ -975,7 +1088,6 @@ "version": "5.0.1", "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", - "dev": true, "dependencies": { "is-number": "^7.0.0" }, @@ -1018,6 +1130,11 @@ "integrity": "sha512-WxONCrssBM8TSPRqN5EmsjVrsv4A8X12J4ArBiiayv3DyyG3ZlIg6yysuuSYdZsVz3TKcTg2fd//Ujd4CHV1iA==", "dev": true }, + "node_modules/undici-types": { + "version": "5.26.5", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", + "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==" + }, "node_modules/unpipe": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz", diff --git a/package.json b/package.json index 2540068..53a2141 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ "license": "MIT", "dependencies": { "express": "^4.19.2", + "http-proxy-middleware": "^3.0.0", "https": "^1.0.0" }, "devDependencies": { diff --git a/pages/index.html b/pages/index.html index cb7099d..9262358 100644 --- a/pages/index.html +++ b/pages/index.html @@ -10,6 +10,10 @@ rel="stylesheet" href="/assets/styles/style.css" /> + @@ -84,5 +88,6 @@ + diff --git a/scripts/server.js b/scripts/server.js index 9aa9663..32c73e0 100644 --- a/scripts/server.js +++ b/scripts/server.js @@ -1,4 +1,5 @@ import express from 'express'; +import { createProxyMiddleware } from 'http-proxy-middleware'; import config from "../eventmapper_config.json" with { type: "json" }; @@ -9,11 +10,15 @@ app.use("/assets", express.static('assets')); app.use("/", express.static('pages')); app.use("/dataServer", express.static('data')); // Example data file-server -app.use("/files", express.static('files')); // Example file file-server +app.use("/fileServer", express.static('files')); // Example file file-server + +app.use("/files", createProxyMiddleware({ + target: config.files_url +})); app.get('/data/:lang/events/:floor', async (req, res) => { // Get events - let eventsReq = await fetch(new URL(`events/${req.params.floor}.json`, config.data_url)); + let eventsReq = await fetch(new URL(`./events/${req.params.floor}.json`, config.data_url)); let events; if (eventsReq.ok) events = await eventsReq.json(); @@ -39,7 +44,7 @@ app.get('/data/:lang/events/:floor', async (req, res) => { app.get('/data/:lang/events/', async (req, res) => { // Get floors - let floorsReq = await fetch(new URL("floors.json", config.data_url)); + let floorsReq = await fetch(new URL("./floors.json", config.data_url)); let floors; if (floorsReq.ok) floors = await floorsReq.json(); @@ -49,7 +54,7 @@ app.get('/data/:lang/events/', async (req, res) => { let allEvents = []; await Promise.allSettled(floors.map(async (curFloor) => { - let eventsReq = await fetch(new URL(`events/${curFloor.id}.json`, config.data_url)); + let eventsReq = await fetch(new URL(`./events/${curFloor.id}.json`, config.data_url)); let events; if (eventsReq.ok) events = await eventsReq.json(); @@ -78,7 +83,7 @@ app.get('/data/:lang/events/', async (req, res) => { app.get('/data/:lang/floors', async (req, res) => { // Get floors - let floorsReq = await fetch(new URL("floors.json", config.data_url)); + let floorsReq = await fetch(new URL("./floors.json", config.data_url)); let floors; if (floorsReq.ok) floors = await floorsReq.json();