Refactor finished
This commit is contained in:
parent
a0f1f8b33e
commit
2b9dff2983
11 changed files with 641 additions and 309 deletions
|
|
@ -1,44 +1,57 @@
|
|||
export class EventManager {
|
||||
map;
|
||||
ui;
|
||||
gameobj;
|
||||
floormanager;
|
||||
mainmanager;
|
||||
|
||||
events = new Map([]);
|
||||
#currentEvent = "";
|
||||
#events = new Map([]);
|
||||
|
||||
constructor(map, ui, gameobj) {
|
||||
this.map = map;
|
||||
this.ui = ui;
|
||||
this.ui.eventmanager = this;
|
||||
this.gameobj = gameobj;
|
||||
}
|
||||
constructor() {}
|
||||
|
||||
async getEvents(lang, floor) {
|
||||
let allEventsReqSend = fetch(`/data/${lang}/events/${floor}`);
|
||||
async getEvents() {
|
||||
const currentLocalization = this.mainmanager.getCurrentLangCode();
|
||||
const currentFloor = this.mainmanager.getCurrentFocus("floor");
|
||||
|
||||
this.ui.setLoading(true);
|
||||
let allEventsReqSend = fetch(
|
||||
`/data/${currentLocalization}/events/${currentFloor}`
|
||||
);
|
||||
|
||||
let allEventsReq = await allEventsReqSend;
|
||||
let allEvents;
|
||||
if (allEventsReq.ok) allEvents = await allEventsReq.json();
|
||||
|
||||
this.events.clear();
|
||||
this.#events.clear();
|
||||
|
||||
allEvents.forEach((event) => this.events.set(event.id, event));
|
||||
|
||||
this.ui.setLoading(false);
|
||||
allEvents.forEach((event) => this.#events.set(event.id, event));
|
||||
}
|
||||
|
||||
setCurrentEvent(id) {
|
||||
if (id == null) this.#currentEvent = id;
|
||||
if (id == null) this.mainmanager.setCurrentFocus("event", id);
|
||||
else {
|
||||
const event = this.events.get(id);
|
||||
if (event != null) this.#currentEvent = event;
|
||||
const event = this.#events.get(id);
|
||||
if (event != null) this.mainmanager.setCurrentFocus("event", id);
|
||||
else throw "Event does not exist";
|
||||
}
|
||||
}
|
||||
|
||||
get currentRoomEvents() {
|
||||
const currentFocus = this.mainmanager.getCurrentFocus("room");
|
||||
let currentFloorRooms = new Map([]);
|
||||
this.#events.forEach((v, k) => {
|
||||
if (k.startsWith(currentFocus)) currentFloorRooms.set(k, v);
|
||||
});
|
||||
return currentFloorRooms;
|
||||
}
|
||||
|
||||
get allEvents() {
|
||||
return this.#events;
|
||||
}
|
||||
|
||||
get currentEventId() {
|
||||
return this.mainmanager.getCurrentFocus("event");
|
||||
}
|
||||
|
||||
get currentEvent() {
|
||||
return this.#currentEvent;
|
||||
const currentEvent = this.#events.get(
|
||||
this.mainmanager.getCurrentFocus("event")
|
||||
);
|
||||
return currentEvent;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,45 +1,34 @@
|
|||
export class FloorManager {
|
||||
map;
|
||||
ui;
|
||||
gameobj;
|
||||
events;
|
||||
mainmanager;
|
||||
|
||||
floors = new Map([]);
|
||||
rooms = new Map([]);
|
||||
#currentFloor = "";
|
||||
#currentRoom = "";
|
||||
#floors = new Map([]);
|
||||
#rooms = new Map([]);
|
||||
|
||||
constructor(map, ui, gameobj, events) {
|
||||
this.map = map;
|
||||
this.ui = ui;
|
||||
this.ui.floormanager = this;
|
||||
this.gameobj = gameobj;
|
||||
this.events = events;
|
||||
this.events.floormanager = this;
|
||||
}
|
||||
constructor() {}
|
||||
|
||||
async getFloors(lang) {
|
||||
let allFloorsReqSend = fetch(`/data/${lang}/map`);
|
||||
async getFloors() {
|
||||
const currentLocalization = this.mainmanager.getCurrentLangCode();
|
||||
|
||||
this.ui.setLoading(true);
|
||||
let allFloorsReqSend = fetch(`/data/${currentLocalization}/floors`);
|
||||
|
||||
let allFloorsReq = await allFloorsReqSend;
|
||||
let allFloors;
|
||||
if (allFloorsReq.ok) allFloors = await allFloorsReq.json();
|
||||
|
||||
allFloors.forEach((floor) => this.floors.set(floor.id, floor));
|
||||
|
||||
this.ui.setLoading(false);
|
||||
allFloors.forEach((floor) => this.#floors.set(floor.id, floor));
|
||||
}
|
||||
|
||||
async getRooms(lang, floor) {
|
||||
const curRoom = this.rooms.get(id);
|
||||
async getRooms() {
|
||||
const currentLocalization = this.mainmanager.getCurrentLangCode();
|
||||
const currentFloor = this.mainmanager.getCurrentFocus("floor");
|
||||
|
||||
const curRoom = this.#rooms.get(currentFloor);
|
||||
|
||||
if (curRoom != null) return curRoom;
|
||||
|
||||
let allRoomsReqSend = fetch(`/data/${lang}/map/${floor}`);
|
||||
|
||||
this.ui.setLoading(true);
|
||||
let allRoomsReqSend = fetch(
|
||||
`/data/${currentLocalization}/rooms/${currentFloor}`
|
||||
);
|
||||
|
||||
let allRoomsReq = await allRoomsReqSend;
|
||||
let allRooms;
|
||||
|
|
@ -48,29 +37,58 @@ export class FloorManager {
|
|||
const roomMap = new Map([]);
|
||||
allRooms.forEach((room) => roomMap.set(room.id, room));
|
||||
|
||||
this.rooms.set(floor, roomMap);
|
||||
|
||||
this.ui.setLoading(false);
|
||||
this.#rooms.set(currentFloor, roomMap);
|
||||
}
|
||||
|
||||
setCurrentFloor(id) {
|
||||
const floor = this.floors.get(id);
|
||||
if (floor != null) this.#currentFloor = id;
|
||||
const floor = this.#floors.get(id);
|
||||
if (floor != null) this.mainmanager.setCurrentFocus("floor", id);
|
||||
else throw "Floor does not exist";
|
||||
}
|
||||
|
||||
get allFloors() {
|
||||
return this.#floors;
|
||||
}
|
||||
|
||||
get currentFloorId() {
|
||||
return this.mainmanager.getCurrentFocus("floor");
|
||||
}
|
||||
|
||||
get currentFloor() {
|
||||
return this.#currentFloor;
|
||||
const currentFloor = this.#floors.get(
|
||||
this.mainmanager.getCurrentFocus("floor")
|
||||
);
|
||||
return currentFloor;
|
||||
}
|
||||
|
||||
get currentFloorRooms() {
|
||||
const currentFloorRooms = this.#rooms.get(
|
||||
this.mainmanager.getCurrentFocus("floor")
|
||||
);
|
||||
return currentFloorRooms;
|
||||
}
|
||||
|
||||
setCurrentRoom(id) {
|
||||
if (id == null) this.#currentRoom = id;
|
||||
if (id == null) this.mainmanager.setCurrentFocus("room", id);
|
||||
else {
|
||||
const room = this.rooms.get(this.#currentFloor).get(room);
|
||||
if (room != null) this.#currentRoom = id;
|
||||
const room = this.currentFloorRooms.get(id);
|
||||
if (room != null) this.mainmanager.setCurrentFocus("room", id);
|
||||
else throw "Room does not exist";
|
||||
}
|
||||
}
|
||||
|
||||
get allRooms() {
|
||||
return this.#rooms;
|
||||
}
|
||||
|
||||
get currentRoomId() {
|
||||
return this.mainmanager.getCurrentFocus("room");
|
||||
}
|
||||
|
||||
get currentRoom() {
|
||||
return this.#currentRoom;
|
||||
const currentFloor = this.currentFloorRooms.get(
|
||||
this.mainmanager.getCurrentFocus("room")
|
||||
);
|
||||
return currentFloor;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,23 +5,23 @@ export class GameObjManager {
|
|||
};
|
||||
map;
|
||||
|
||||
mainmanager;
|
||||
|
||||
floorObject;
|
||||
roomObjects = new Map([]);
|
||||
|
||||
constructor(map) {
|
||||
constructor(map, opts) {
|
||||
this.map = map;
|
||||
}
|
||||
|
||||
generateFloor(opts) {
|
||||
this.opts = {
|
||||
...this.opts,
|
||||
opts,
|
||||
};
|
||||
}
|
||||
|
||||
generateFloor() {
|
||||
if (this.floorObject) this.floorObject.destroy();
|
||||
|
||||
// const currentFloor = this.floormanager.floors.get(
|
||||
// this.floormanager.currentFloor
|
||||
// );
|
||||
const currentFloor = this.mainmanager.getCurrentFocusObject("floor");
|
||||
|
||||
const polygon = new this.map.kp.Polygon(
|
||||
currentFloor.poly.map(([x, y]) => this.map.kp.vec2(x, y))
|
||||
|
|
@ -31,7 +31,6 @@ export class GameObjManager {
|
|||
this.map.kp.polygon(polygon.pts),
|
||||
this.map.kp.outline(1, this.map.kp.BLACK),
|
||||
this.map.kp.color(this.map.kp.Color.fromHex("303030")),
|
||||
// this.map.kp.area(),
|
||||
this.map.kp.pos(),
|
||||
this.map.kp.z(5),
|
||||
]);
|
||||
|
|
@ -57,11 +56,6 @@ export class GameObjManager {
|
|||
});
|
||||
|
||||
this.map.kp.add(this.floorObject);
|
||||
|
||||
this.map.zoomToAbs(
|
||||
this.map.opts.minZoomLevel + this.opts.floorMinZoom,
|
||||
bounds.center()
|
||||
);
|
||||
}
|
||||
|
||||
zoomToFloor() {
|
||||
|
|
@ -91,9 +85,7 @@ export class GameObjManager {
|
|||
this.roomObjects.clear();
|
||||
}
|
||||
|
||||
// const currentRooms = this.floormanager.rooms.get(
|
||||
// this.floormanager.currentFloor
|
||||
// );
|
||||
const currentRooms = this.mainmanager.getAllFocusObject("room");
|
||||
|
||||
currentRooms.forEach((room) => {
|
||||
const polygon = new this.map.kp.Polygon(
|
||||
|
|
@ -138,7 +130,7 @@ export class GameObjManager {
|
|||
obj.startClickPosition &&
|
||||
obj.startClickPosition.dist(endClickPosition) < obj.clickForgiveness
|
||||
) {
|
||||
// this.floormanager.setCurrentRoom(room.id);
|
||||
window.location.hash = room.id;
|
||||
}
|
||||
obj.color = this.map.kp.Color.fromHex("505050");
|
||||
this.map.clearMouseMode();
|
||||
|
|
|
|||
|
|
@ -1,17 +1,17 @@
|
|||
import localization from "./localization.js";
|
||||
|
||||
export class LangManager {
|
||||
lang;
|
||||
#lang;
|
||||
|
||||
constructor(lang) {
|
||||
this.lang = lang;
|
||||
this.#lang = lang;
|
||||
}
|
||||
|
||||
getCurrentLocalization() {
|
||||
return localization.get(this.lang);
|
||||
get currentLocalization() {
|
||||
return localization.get(this.#lang);
|
||||
}
|
||||
|
||||
getLangCode() {
|
||||
return this.lang;
|
||||
get langCode() {
|
||||
return this.#lang;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -33,6 +33,9 @@ export class KaplayMap {
|
|||
startFingerCenterPos = null;
|
||||
startFingerZoomLevel = null;
|
||||
|
||||
// Map event listener
|
||||
events;
|
||||
|
||||
constructor(kp, opts) {
|
||||
this.kp = kp;
|
||||
this.opts = {
|
||||
|
|
@ -40,8 +43,11 @@ export class KaplayMap {
|
|||
...opts,
|
||||
};
|
||||
|
||||
this.events = new EventTarget();
|
||||
|
||||
this.zoomLevel_NoTween = this.opts.minZoomLevel;
|
||||
this.kp.camPos(0);
|
||||
this.camBounds = new this.kp.Rect(this.kp.vec2(-1), 2, 2);
|
||||
|
||||
this.kp.onScroll((delta) => {
|
||||
const scrollDist = -delta.y / 120;
|
||||
|
|
@ -198,6 +204,12 @@ export class KaplayMap {
|
|||
});
|
||||
}
|
||||
|
||||
dispatchEvent(eventName, data) {
|
||||
const event = new CustomEvent(eventName, { detail: data });
|
||||
|
||||
this.events.dispatchEvent(event);
|
||||
}
|
||||
|
||||
initGrid() {
|
||||
const grid = this.kp.loadSprite(null, "/assets/images/grid.png");
|
||||
|
||||
|
|
@ -210,7 +222,7 @@ export class KaplayMap {
|
|||
height: this.kp.height() + 200,
|
||||
anchor: "center",
|
||||
pos: this.kp.vec2(
|
||||
Math.floor(this.kp.camPos().x / 100) * 100 + 50.5,
|
||||
Math.floor(this.kp.camPos().x / 100) * 100 + 0.5,
|
||||
Math.floor(this.kp.camPos().y / 100) * 100 + 0.5
|
||||
),
|
||||
});
|
||||
|
|
@ -268,13 +280,28 @@ export class KaplayMap {
|
|||
return this.#zoomLevel;
|
||||
}
|
||||
|
||||
zoomIn() {
|
||||
this.zoomLevel += 1;
|
||||
}
|
||||
|
||||
zoomOut() {
|
||||
this.zoomLevel -= 1;
|
||||
}
|
||||
|
||||
set zoomLevel(newZoom) {
|
||||
const cameraZoom = this.kp.camScale().y;
|
||||
|
||||
let addLinear = newZoom;
|
||||
|
||||
if (addLinear < this.opts.minZoomLevel) addLinear = this.opts.minZoomLevel;
|
||||
if (addLinear > this.opts.maxZoomLevel) addLinear = this.opts.maxZoomLevel;
|
||||
if (addLinear <= this.opts.minZoomLevel) {
|
||||
addLinear = this.opts.minZoomLevel;
|
||||
this.dispatchEvent("zoomMin");
|
||||
} else if (addLinear >= this.opts.maxZoomLevel) {
|
||||
addLinear = this.opts.maxZoomLevel;
|
||||
this.dispatchEvent("zoomMax");
|
||||
} else {
|
||||
this.dispatchEvent("zoom");
|
||||
}
|
||||
|
||||
let linearToLog = Math.pow(2, addLinear);
|
||||
this.#zoomLevel = addLinear;
|
||||
|
|
@ -298,8 +325,15 @@ export class KaplayMap {
|
|||
set zoomLevel_NoTween(newZoom) {
|
||||
let addLinear = newZoom;
|
||||
|
||||
if (addLinear < this.opts.minZoomLevel) addLinear = this.opts.minZoomLevel;
|
||||
if (addLinear > this.opts.maxZoomLevel) addLinear = this.opts.maxZoomLevel;
|
||||
if (addLinear <= this.opts.minZoomLevel) {
|
||||
addLinear = this.opts.minZoomLevel;
|
||||
this.dispatchEvent("zoomMin");
|
||||
} else if (addLinear >= this.opts.maxZoomLevel) {
|
||||
addLinear = this.opts.maxZoomLevel;
|
||||
this.dispatchEvent("zoomMax");
|
||||
} else {
|
||||
this.dispatchEvent("zoom");
|
||||
}
|
||||
|
||||
let linearToLog = Math.pow(2, addLinear);
|
||||
this.#zoomLevel = addLinear;
|
||||
307
assets/scripts/KaplayMap/mapper.js
Normal file
307
assets/scripts/KaplayMap/mapper.js
Normal file
|
|
@ -0,0 +1,307 @@
|
|||
import { EventManager } from "./events.js";
|
||||
import { FloorManager } from "./floors.js";
|
||||
import { GameObjManager } from "./gameobj.js";
|
||||
import { LangManager } from "./lang.js";
|
||||
import { UIManager } from "./ui.js";
|
||||
|
||||
export class EventMapperManager {
|
||||
#currentFocus = [null, null, null];
|
||||
|
||||
map;
|
||||
langmanager;
|
||||
eventmanager;
|
||||
floormanager;
|
||||
uimanager;
|
||||
gameobjmanager;
|
||||
|
||||
constructor(map, mapUi) {
|
||||
this.map = map;
|
||||
|
||||
this.langmanager = new LangManager("en-US");
|
||||
this.langmanager.mainmanager = this;
|
||||
|
||||
this.eventmanager = new EventManager();
|
||||
this.eventmanager.mainmanager = this;
|
||||
|
||||
this.floormanager = new FloorManager();
|
||||
this.floormanager.mainmanager = this;
|
||||
|
||||
this.uimanager = new UIManager(mapUi);
|
||||
this.uimanager.mainmanager = this;
|
||||
|
||||
this.gameobjmanager = new GameObjManager(this.map, {});
|
||||
this.gameobjmanager.mainmanager = this;
|
||||
}
|
||||
|
||||
// Init
|
||||
|
||||
async load() {
|
||||
this.uimanager.setLoading(true);
|
||||
|
||||
await this.floormanager.getFloors();
|
||||
|
||||
this.uimanager.mainmanagerInit();
|
||||
|
||||
this.uimanager.__updateFloorsHard();
|
||||
|
||||
this.uimanager.setLoading(false);
|
||||
|
||||
this.uimanager.setLoading(true);
|
||||
|
||||
window.addEventListener("hashchange", () => this.hashchange());
|
||||
|
||||
await this.hashchange();
|
||||
|
||||
this.uimanager.setLoading(false);
|
||||
}
|
||||
|
||||
async hashchange() {
|
||||
const prevID = this.#currentFocus;
|
||||
|
||||
let hash = location.hash;
|
||||
if (hash.includes("#")) hash = hash.replace("#", "");
|
||||
|
||||
const floorFocus = this.convertIdFocus(hash, "floor");
|
||||
const roomFocus = this.convertIdFocus(hash, "room");
|
||||
const eventFocus = this.convertIdFocus(hash, "event");
|
||||
|
||||
if (floorFocus != this.convertFocus(prevID, "floor"))
|
||||
await this.selectFloor(floorFocus);
|
||||
if (roomFocus != this.convertFocus(prevID, "room"))
|
||||
await this.selectRoom(roomFocus);
|
||||
if (eventFocus != this.convertFocus(prevID, "event"))
|
||||
await this.selectEvent(eventFocus);
|
||||
}
|
||||
|
||||
async selectFloor(id) {
|
||||
this.floormanager.setCurrentFloor(id);
|
||||
|
||||
this.uimanager.__updateFloorsSoft();
|
||||
|
||||
this.uimanager.__updateEventsSoft();
|
||||
|
||||
this.gameobjmanager.generateFloor();
|
||||
|
||||
this.gameobjmanager.zoomToFloor();
|
||||
|
||||
this.uimanager.setLoading(true);
|
||||
|
||||
await this.floormanager.getRooms();
|
||||
|
||||
this.gameobjmanager.generateRooms();
|
||||
|
||||
this.uimanager.setLoading(false);
|
||||
|
||||
this.uimanager.setLoading(true);
|
||||
|
||||
await this.eventmanager.getEvents();
|
||||
|
||||
this.uimanager.updateEvents();
|
||||
|
||||
if (!this.uimanager.getEventsEmpty())
|
||||
this.uimanager.setEventsMinimized(false);
|
||||
|
||||
this.uimanager.setLoading(false);
|
||||
}
|
||||
|
||||
async selectRoom(id) {
|
||||
this.floormanager.setCurrentRoom(id);
|
||||
|
||||
if (id == null) this.gameobjmanager.zoomToFloor();
|
||||
else this.gameobjmanager.zoomToRoom(id);
|
||||
|
||||
this.uimanager.updateEvents();
|
||||
|
||||
if (!this.uimanager.getEventsEmpty())
|
||||
this.uimanager.setEventsMinimized(false);
|
||||
this.uimanager.setEventsInspector(false);
|
||||
}
|
||||
|
||||
async selectEvent(id) {
|
||||
this.eventmanager.setCurrentEvent(id);
|
||||
|
||||
if (id != null) {
|
||||
this.gameobjmanager.zoomToRoom(this.convertIdFocus(id, "room"));
|
||||
|
||||
this.uimanager.updateInspector();
|
||||
}
|
||||
|
||||
this.uimanager.setEventsInspector(id != null);
|
||||
}
|
||||
|
||||
// Focus
|
||||
|
||||
convertFocus(id, focus) {
|
||||
let res;
|
||||
switch (focus) {
|
||||
case "floor":
|
||||
return id.slice(0, 1).toString();
|
||||
case "room":
|
||||
res = id.slice(0, 2);
|
||||
if (res.length < 2) return null;
|
||||
return res.filter(Boolean).join("_");
|
||||
case "event":
|
||||
res = id.slice(0, 3);
|
||||
if (res.length < 3) return null;
|
||||
return res.join("_");
|
||||
}
|
||||
}
|
||||
|
||||
convertIdFocus(id, focus) {
|
||||
const focusFromId = id.split("_");
|
||||
let res;
|
||||
switch (focus) {
|
||||
case "floor":
|
||||
return focusFromId.slice(0, 1).toString();
|
||||
case "room":
|
||||
res = focusFromId.slice(0, 2);
|
||||
if (res.length < 2) return null;
|
||||
return res.filter(Boolean).join("_");
|
||||
case "event":
|
||||
res = focusFromId.slice(0, 3);
|
||||
if (res.length < 3) return null;
|
||||
return res.join("_");
|
||||
}
|
||||
}
|
||||
|
||||
splitIdFocus(id, focus) {
|
||||
const focusFromId = id.split("_");
|
||||
switch (focus) {
|
||||
case "floor":
|
||||
return focusFromId.slice(0, 1);
|
||||
case "room":
|
||||
return focusFromId.slice(0, 2);
|
||||
case "event":
|
||||
return focusFromId;
|
||||
}
|
||||
}
|
||||
|
||||
setCurrentFocus(focus, id) {
|
||||
if (id == null) {
|
||||
switch (focus) {
|
||||
case "floor":
|
||||
this.#currentFocus[0] = id;
|
||||
break;
|
||||
case "room":
|
||||
this.#currentFocus[1] = id;
|
||||
break;
|
||||
case "event":
|
||||
this.#currentFocus[2] = id;
|
||||
break;
|
||||
}
|
||||
} else this.#currentFocus = this.splitIdFocus(id, focus);
|
||||
}
|
||||
|
||||
getCurrentFocus(focus) {
|
||||
switch (focus) {
|
||||
case "floor":
|
||||
return this.#currentFocus.slice(0, 1).toString();
|
||||
case "room":
|
||||
return this.#currentFocus.slice(0, 2).filter(Boolean).join("_");
|
||||
case "event":
|
||||
return this.currentFocusId;
|
||||
}
|
||||
}
|
||||
|
||||
getIsFocused(focus) {
|
||||
switch (focus) {
|
||||
case "floor":
|
||||
return this.#currentFocus[0] != null;
|
||||
case "room":
|
||||
return this.#currentFocus[1] != null;
|
||||
case "event":
|
||||
return this.#currentFocus[2] != null;
|
||||
}
|
||||
}
|
||||
|
||||
set currentFocusId(id) {
|
||||
this.#currentFocus = id.split("_");
|
||||
}
|
||||
|
||||
get currentFocusId() {
|
||||
return this.#currentFocus.filter(Boolean).join("_");
|
||||
}
|
||||
|
||||
// IMC shorthand (focus)
|
||||
|
||||
getAllFocusObject(focus) {
|
||||
switch (focus) {
|
||||
case "floor":
|
||||
return this.floormanager.allFloors;
|
||||
case "room":
|
||||
return this.floormanager.currentFloorRooms;
|
||||
case "event":
|
||||
return this.eventmanager.currentRoomEvents;
|
||||
}
|
||||
}
|
||||
|
||||
getCurrentFocusObject(focus) {
|
||||
switch (focus) {
|
||||
case "floor":
|
||||
return this.floormanager.currentFloor;
|
||||
case "room":
|
||||
return this.floormanager.currentRoom;
|
||||
case "event":
|
||||
return this.eventmanager.currentEvent;
|
||||
}
|
||||
}
|
||||
|
||||
getCurrentLocalization() {
|
||||
return this.langmanager.currentLocalization;
|
||||
}
|
||||
|
||||
getCurrentLangCode() {
|
||||
return this.langmanager.langCode;
|
||||
}
|
||||
|
||||
// Inter-manager comms
|
||||
|
||||
// I don't know if this is Horrible or Fine
|
||||
addManagerEventListener(manager, event, callback) {
|
||||
switch (manager) {
|
||||
case "map":
|
||||
return this.map.events.addEventListener(event, callback);
|
||||
}
|
||||
}
|
||||
|
||||
removeManagerEventListener(manager, event, callback) {
|
||||
switch (manager) {
|
||||
case "map":
|
||||
return this.map.events.removeEventListener(event, callback);
|
||||
}
|
||||
}
|
||||
|
||||
callManagerFunction(manager, func, ...args) {
|
||||
switch (manager) {
|
||||
case "map":
|
||||
return this.map[func](...args);
|
||||
case "lang":
|
||||
return this.langmanager[func](...args);
|
||||
case "event":
|
||||
return this.eventmanager[func](...args);
|
||||
case "floor":
|
||||
return this.floormanager[func](...args);
|
||||
case "ui":
|
||||
return this.uimanager[func](...args);
|
||||
case "gameobj":
|
||||
return this.gameobjmanager[func](...args);
|
||||
}
|
||||
}
|
||||
|
||||
getManagerVariable(manager, variable) {
|
||||
switch (manager) {
|
||||
case "map":
|
||||
return this.map[variable];
|
||||
case "lang":
|
||||
return this.langmanager[variable];
|
||||
case "event":
|
||||
return this.eventmanager[variable];
|
||||
case "floor":
|
||||
return this.floormanager[variable];
|
||||
case "ui":
|
||||
return this.uimanager[variable];
|
||||
case "gameobj":
|
||||
return this.gameobjmanager[variable];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -6,18 +6,16 @@ import {
|
|||
|
||||
export class UIManager {
|
||||
ui;
|
||||
map;
|
||||
floormanager;
|
||||
eventmanager;
|
||||
mainmanager;
|
||||
|
||||
uiElements = {};
|
||||
floorsEmpty = true;
|
||||
eventsEmpty = true;
|
||||
|
||||
constructor(ui, map) {
|
||||
constructor(ui) {
|
||||
this.ui = ui;
|
||||
this.map = map;
|
||||
}
|
||||
|
||||
mainmanagerInit() {
|
||||
this.__initUIElements();
|
||||
|
||||
this.__initZoom();
|
||||
|
|
@ -27,6 +25,8 @@ export class UIManager {
|
|||
this.__initInspector();
|
||||
}
|
||||
|
||||
// State
|
||||
|
||||
setLoading(state) {
|
||||
if (state) {
|
||||
this.ui.classList.add("loading");
|
||||
|
|
@ -35,6 +35,42 @@ export class UIManager {
|
|||
}
|
||||
}
|
||||
|
||||
setZoomDisabled(state = 0) {
|
||||
if (state > 0) {
|
||||
this.uiElements.zoomIn.disabled = true;
|
||||
this.uiElements.zoomOut.disabled = false;
|
||||
} else if (state < 0) {
|
||||
this.uiElements.zoomIn.disabled = false;
|
||||
this.uiElements.zoomOut.disabled = true;
|
||||
} else {
|
||||
this.uiElements.zoomIn.disabled = false;
|
||||
this.uiElements.zoomOut.disabled = false;
|
||||
}
|
||||
}
|
||||
|
||||
setEventsMinimized(state) {
|
||||
if (state) {
|
||||
this.uiElements.eventsContainer.classList.add("minimized");
|
||||
} else {
|
||||
this.uiElements.eventsContainer.classList.remove("minimized");
|
||||
}
|
||||
}
|
||||
|
||||
setEventsInspector(state) {
|
||||
this.setEventsMinimized(false);
|
||||
if (state) {
|
||||
this.uiElements.eventsContainer.classList.add("inspector");
|
||||
} else {
|
||||
this.uiElements.eventsContainer.classList.remove("inspector");
|
||||
}
|
||||
}
|
||||
|
||||
getEventsEmpty() {
|
||||
return this.uiElements.events.classList.contains("empty");
|
||||
}
|
||||
|
||||
// Init
|
||||
|
||||
__initUIElements() {
|
||||
// Zoom
|
||||
this.uiElements.zoomButtons = this.ui.querySelector("#zoom");
|
||||
|
|
@ -110,52 +146,49 @@ export class UIManager {
|
|||
}
|
||||
|
||||
__initZoom() {
|
||||
this.uiElements.zoomIn.addEventListener("click", () => {
|
||||
this.map.zoomLevel += 1;
|
||||
this.uiElements.zoomIn.addEventListener("click", () =>
|
||||
this.mainmanager.callManagerFunction("map", "zoomIn")
|
||||
);
|
||||
this.uiElements.zoomOut.addEventListener("click", () =>
|
||||
this.mainmanager.callManagerFunction("map", "zoomOut")
|
||||
);
|
||||
this.mainmanager.addManagerEventListener("map", "zoomMin", () => {
|
||||
this.setZoomDisabled(-1);
|
||||
});
|
||||
this.uiElements.zoomOut.addEventListener("click", () => {
|
||||
this.map.zoomLevel -= 1;
|
||||
this.mainmanager.addManagerEventListener("map", "zoomMax", () => {
|
||||
this.setZoomDisabled(1);
|
||||
});
|
||||
this.map.kp.onUpdate(() => {
|
||||
if (this.map.zoomLevelLimit > 0) {
|
||||
this.uiElements.zoomIn.disabled = true;
|
||||
this.uiElements.zoomOut.disabled = false;
|
||||
} else if (this.map.zoomLevelLimit < 0) {
|
||||
this.uiElements.zoomIn.disabled = false;
|
||||
this.uiElements.zoomOut.disabled = true;
|
||||
} else {
|
||||
this.uiElements.zoomIn.disabled = false;
|
||||
this.uiElements.zoomOut.disabled = false;
|
||||
}
|
||||
this.mainmanager.addManagerEventListener("map", "zoom", () => {
|
||||
this.setZoomDisabled(0);
|
||||
});
|
||||
}
|
||||
|
||||
__initInspector() {
|
||||
this.uiElements.eventsInspectorMinimizeButton.addEventListener(
|
||||
"click",
|
||||
() => {
|
||||
this.uiElements.eventsContainer.classList.add("minimized");
|
||||
}
|
||||
() => this.setEventsMinimized(true)
|
||||
);
|
||||
this.uiElements.eventsInspectorMaximizeButton.addEventListener(
|
||||
"click",
|
||||
() => {
|
||||
this.uiElements.eventsContainer.classList.remove("minimized");
|
||||
}
|
||||
() => this.setEventsMinimized(false)
|
||||
);
|
||||
this.uiElements.eventsInspectorBackButton.addEventListener("click", () => {
|
||||
// this.eventmanager.setCurrentEvent("");
|
||||
window.location.hash = this.mainmanager.getCurrentFocus("room");
|
||||
});
|
||||
this.uiElements.eventsInspectorMinimizedBackButton.addEventListener(
|
||||
"click",
|
||||
() => {
|
||||
// this.eventmanager.setCurrentEvent("");
|
||||
this.eventsMaximize(true);
|
||||
window.location.hash = this.mainmanager.getCurrentFocus("room");
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
__updateInspector() {
|
||||
updateInspector() {
|
||||
const currentLocalization = this.mainmanager.getCurrentLocalization();
|
||||
|
||||
const currentEvent = this.mainmanager.getCurrentFocusObject("event");
|
||||
const eventRoom = this.mainmanager.getCurrentFocusObject("room");
|
||||
|
||||
this.uiElements.eventsInspectorBackButton.title =
|
||||
currentLocalization.event_inspector_back;
|
||||
this.uiElements.eventsInspectorMinimizedBackButton.title =
|
||||
|
|
@ -165,18 +198,6 @@ export class UIManager {
|
|||
this.uiElements.eventsInspectorMaximizeButton.title =
|
||||
currentLocalization.event_inspector_maximize;
|
||||
|
||||
// const currentEvent = this.eventmanager.currentEventItem;
|
||||
if (currentEvent != null) {
|
||||
this.uiElements.eventsContainer.classList.add("inspector");
|
||||
} else {
|
||||
this.uiElements.eventsContainer.classList.remove("inspector");
|
||||
return;
|
||||
}
|
||||
|
||||
// const eventFloor = this.floormanager.currentFloorRooms.get(
|
||||
// currentEvent.where
|
||||
// );
|
||||
|
||||
const currentDate = new Date();
|
||||
const eventDateStart = new Date(currentEvent.when.start);
|
||||
const eventDateEnd = new Date(currentEvent.when.end);
|
||||
|
|
@ -201,16 +222,16 @@ export class UIManager {
|
|||
datePrefix,
|
||||
getRelativeTime(
|
||||
eventDateStart,
|
||||
currentDate
|
||||
// this.floormanager.lang.replace(/_/g, "-")
|
||||
currentDate,
|
||||
this.mainmanager.getCurrentLangCode()
|
||||
)
|
||||
) +
|
||||
" " +
|
||||
currentLocalization.parenthesis(
|
||||
DatetoLocaleDynamicString(
|
||||
eventDateStart,
|
||||
currentDate
|
||||
// this.floormanager.lang.replace(/_/g, "-")
|
||||
currentDate,
|
||||
this.mainmanager.getCurrentLangCode()
|
||||
)
|
||||
);
|
||||
this.uiElements.eventsInspectorEventLength.textContent =
|
||||
|
|
@ -221,12 +242,9 @@ export class UIManager {
|
|||
""
|
||||
);
|
||||
|
||||
const eventWhere = document.createElement("button");
|
||||
eventWhere.classList.add("link");
|
||||
eventWhere.addEventListener("click", () => {
|
||||
// this.floormanager.setCurrentRoom(eventFloor.id);
|
||||
});
|
||||
eventWhere.textContent = eventFloor.name;
|
||||
const eventWhere = document.createElement("a");
|
||||
eventWhere.href = "#" + eventRoom.id;
|
||||
eventWhere.textContent = eventRoom.name;
|
||||
|
||||
this.uiElements.eventsInspectorEventLength.appendChild(eventWhere);
|
||||
|
||||
|
|
@ -241,6 +259,7 @@ export class UIManager {
|
|||
const eventURL = new URL(currentEvent.url);
|
||||
|
||||
eventAnchor.href = eventURL;
|
||||
eventAnchor.target = "_blank";
|
||||
eventAnchor.textContent = eventURL.toString();
|
||||
|
||||
eventLink.appendChild(eventAnchor);
|
||||
|
|
@ -262,10 +281,10 @@ export class UIManager {
|
|||
|
||||
__initEvents() {
|
||||
this.uiElements.eventsBackButton.addEventListener("click", () => {
|
||||
// this.floormanager.setCurrentRoom("");
|
||||
window.location.hash = this.mainmanager.getCurrentFocus("floor");
|
||||
});
|
||||
this.uiElements.eventsMinimizedBackButton.addEventListener("click", () => {
|
||||
// this.floormanager.setCurrentRoom("", false);
|
||||
window.location.hash = this.mainmanager.getCurrentFocus("floor");
|
||||
});
|
||||
|
||||
this.uiElements.minimizeButton.addEventListener("click", () => {
|
||||
|
|
@ -276,60 +295,57 @@ export class UIManager {
|
|||
});
|
||||
}
|
||||
|
||||
__updateEvents() {
|
||||
let currentEvents;
|
||||
// if (this.floormanager.currentRoom != "") {
|
||||
// const filterThing = Array.from(this.eventmanager.events.entries());
|
||||
// currentEvents = new Map(
|
||||
// filterThing.filter(
|
||||
// ([key, value]) => value.where == this.floormanager.currentRoom
|
||||
// )
|
||||
// );
|
||||
// } else {
|
||||
// currentEvents = this.eventmanager.events;
|
||||
// }
|
||||
__updateEventsSoft() {
|
||||
const focusedFloor = this.mainmanager.getCurrentFocusObject("floor");
|
||||
|
||||
if (focusedFloor == null) {
|
||||
this.uiElements.eventsContainer.classList.add("empty");
|
||||
} else {
|
||||
this.uiElements.eventsContainer.classList.remove("empty");
|
||||
}
|
||||
}
|
||||
|
||||
updateEvents() {
|
||||
const currentLocalization = this.mainmanager.getCurrentLocalization();
|
||||
|
||||
const currentEvents = this.mainmanager.getAllFocusObject("event");
|
||||
|
||||
const focusedFloor = this.mainmanager.getCurrentFocusObject("floor");
|
||||
const focusedRoom = this.mainmanager.getCurrentFocusObject("room");
|
||||
|
||||
this.uiElements.minimizeButton.title = currentLocalization.minimize;
|
||||
this.uiElements.maximizeButton.title = currentLocalization.maximize;
|
||||
// Figure out header
|
||||
|
||||
// if (this.floormanager.currentRoomItem != null) {
|
||||
// if (currentEvents.size < 1) {
|
||||
// this.uiElements.eventsRoomName.textContent =
|
||||
// this.floormanager.currentRoomItem.name;
|
||||
// } else {
|
||||
// this.uiElements.eventsRoomName.textContent =
|
||||
// currentLocalization.events_in(this.floormanager.currentRoomItem.name);
|
||||
// }
|
||||
// this.uiElements.eventsRoomDescription.textContent =
|
||||
// this.floormanager.currentRoomItem.description;
|
||||
// this.uiElements.eventsBackButton.disabled = false;
|
||||
// this.uiElements.eventsBackButton.title =
|
||||
// currentLocalization.view_events_in(
|
||||
// this.floormanager.currentFloorItem.name
|
||||
// );
|
||||
// this.uiElements.eventsMinimizedBackButton.disabled = false;
|
||||
// this.uiElements.eventsMinimizedBackButton.title =
|
||||
// currentLocalization.view_events_in(
|
||||
// this.floormanager.currentFloorItem.name
|
||||
// );
|
||||
// } else {
|
||||
// if (currentEvents.size < 1) {
|
||||
// this.uiElements.eventsRoomName.textContent =
|
||||
// this.floormanager.currentFloorItem.name;
|
||||
// } else {
|
||||
// this.uiElements.eventsRoomName.textContent =
|
||||
// currentLocalization.events_in(
|
||||
// this.floormanager.currentFloorItem.name
|
||||
// );
|
||||
// }
|
||||
// this.uiElements.eventsRoomDescription.textContent =
|
||||
// this.floormanager.currentFloorItem.description;
|
||||
// this.uiElements.eventsBackButton.disabled = true;
|
||||
// this.uiElements.eventsBackButton.title = "";
|
||||
// this.uiElements.eventsMinimizedBackButton.disabled = true;
|
||||
// this.uiElements.eventsMinimizedBackButton.title = "";
|
||||
// }
|
||||
if (this.mainmanager.getIsFocused("room")) {
|
||||
if (currentEvents.size < 1) {
|
||||
this.uiElements.eventsRoomName.textContent = focusedRoom.name;
|
||||
} else {
|
||||
this.uiElements.eventsRoomName.textContent =
|
||||
currentLocalization.events_in(focusedRoom.name);
|
||||
}
|
||||
this.uiElements.eventsRoomDescription.textContent =
|
||||
focusedRoom.description;
|
||||
this.uiElements.eventsBackButton.disabled = false;
|
||||
this.uiElements.eventsBackButton.title =
|
||||
currentLocalization.view_events_in(focusedFloor.name);
|
||||
this.uiElements.eventsMinimizedBackButton.disabled = false;
|
||||
this.uiElements.eventsMinimizedBackButton.title =
|
||||
currentLocalization.view_events_in(focusedFloor.name);
|
||||
} else {
|
||||
if (currentEvents.size < 1) {
|
||||
this.uiElements.eventsRoomName.textContent = focusedFloor.name;
|
||||
} else {
|
||||
this.uiElements.eventsRoomName.textContent =
|
||||
currentLocalization.events_in(focusedFloor.name);
|
||||
}
|
||||
this.uiElements.eventsRoomDescription.textContent =
|
||||
focusedFloor.description;
|
||||
this.uiElements.eventsBackButton.disabled = true;
|
||||
this.uiElements.eventsBackButton.title = "";
|
||||
this.uiElements.eventsMinimizedBackButton.disabled = true;
|
||||
this.uiElements.eventsMinimizedBackButton.title = "";
|
||||
}
|
||||
|
||||
// Remove all children
|
||||
this.uiElements.eventList.replaceChildren();
|
||||
|
|
@ -338,7 +354,9 @@ export class UIManager {
|
|||
|
||||
const currentDate = new Date();
|
||||
currentEvents.forEach((event, id) => {
|
||||
// const eventFloor = this.floormanager.currentFloorRooms.get(event.where);
|
||||
const eventRoom = this.mainmanager
|
||||
.getAllFocusObject("room")
|
||||
.get(this.mainmanager.convertIdFocus(event.id, "room"));
|
||||
const eventDateStart = new Date(event.when.start);
|
||||
const eventDateEnd = new Date(event.when.end);
|
||||
|
||||
|
|
@ -361,29 +379,22 @@ export class UIManager {
|
|||
|
||||
const eventListContainerSummary = document.createElement("p");
|
||||
|
||||
const eventListContainerSummaryName = document.createElement("button");
|
||||
eventListContainerSummaryName.classList.add("link");
|
||||
eventListContainerSummaryName.addEventListener("click", () => {
|
||||
// this.floormanager.setCurrentRoom(eventFloor.id, true, true);
|
||||
// this.eventmanager.setCurrentEvent(id);
|
||||
});
|
||||
const eventListContainerSummaryName = document.createElement("a");
|
||||
eventListContainerSummaryName.href = "#" + id;
|
||||
eventListContainerSummaryName.textContent = event.name;
|
||||
|
||||
eventListContainerSummary.appendChild(eventListContainerSummaryName);
|
||||
|
||||
eventListContainerSummary.appendChild(document.createTextNode(" "));
|
||||
|
||||
// if (this.floormanager.currentRoomItem == null) {
|
||||
// const eventListContainerSummaryRoom = document.createElement("button");
|
||||
// eventListContainerSummaryRoom.classList.add("link");
|
||||
// eventListContainerSummaryRoom.addEventListener("click", () => {
|
||||
// this.floormanager.setCurrentRoom(eventFloor.id);
|
||||
// });
|
||||
// eventListContainerSummaryRoom.textContent =
|
||||
// currentLocalization.parenthesis(eventFloor.name);
|
||||
if (!this.mainmanager.getIsFocused("room")) {
|
||||
const eventListContainerSummaryRoom = document.createElement("a");
|
||||
eventListContainerSummaryRoom.href = "#" + eventRoom.id;
|
||||
eventListContainerSummaryRoom.textContent =
|
||||
currentLocalization.parenthesis(eventRoom.name);
|
||||
|
||||
// eventListContainerSummary.appendChild(eventListContainerSummaryRoom);
|
||||
// }
|
||||
eventListContainerSummary.appendChild(eventListContainerSummaryRoom);
|
||||
}
|
||||
|
||||
eventListContainerSummary.appendChild(document.createElement("br"));
|
||||
|
||||
|
|
@ -392,7 +403,7 @@ export class UIManager {
|
|||
const eventListContainerSummaryTime = document.createElement("span");
|
||||
eventListContainerSummaryTime.classList.add("clarification");
|
||||
eventListContainerSummaryTime.title = eventDateStart.toLocaleString(
|
||||
// this.floormanager.lang.replace(/_/g, "-"),
|
||||
this.mainmanager.getCurrentLangCode(),
|
||||
{
|
||||
dateStyle: "short",
|
||||
timeStyle: "short",
|
||||
|
|
@ -403,8 +414,8 @@ export class UIManager {
|
|||
datePrefix,
|
||||
getRelativeTime(
|
||||
eventDateStart,
|
||||
currentDate
|
||||
// this.floormanager.lang.replace(/_/g, "-")
|
||||
currentDate,
|
||||
this.mainmanager.getCurrentLangCode()
|
||||
)
|
||||
);
|
||||
|
||||
|
|
@ -432,53 +443,56 @@ export class UIManager {
|
|||
});
|
||||
|
||||
if (currentEvents.size < 1) {
|
||||
this.uiElements.eventsContainer.classList.add("empty");
|
||||
this.eventsEmpty = true;
|
||||
this.uiElements.events.classList.add("empty");
|
||||
} else {
|
||||
this.uiElements.eventsContainer.classList.remove("empty");
|
||||
this.eventsEmpty = false;
|
||||
this.uiElements.events.classList.remove("empty");
|
||||
}
|
||||
}
|
||||
|
||||
__updateFloorsHard() {
|
||||
const currentLocalization = this.mainmanager.getCurrentLocalization();
|
||||
const currentFloors = this.mainmanager.getAllFocusObject("floor");
|
||||
const mainFocus = this.mainmanager.getCurrentFocus("floor");
|
||||
// Remove all children
|
||||
this.uiElements.floorButtons.replaceChildren();
|
||||
this.uiElements.floorsHeading.textContent =
|
||||
currentLocalization.floors_header;
|
||||
|
||||
// Put them back
|
||||
// this.floormanager.floors.forEach(({ name }, id) => {
|
||||
// const floorButton = document.createElement("button");
|
||||
// floorButton.textContent = name;
|
||||
// floorButton.classList.add("floor-button");
|
||||
// floorButton.id = "floor-" + id;
|
||||
// if (id === this.floormanager.currentFloor)
|
||||
// floorButton.classList.add("selected");
|
||||
// floorButton.addEventListener("click", () =>
|
||||
// this.floormanager.changeFloor(id)
|
||||
// );
|
||||
currentFloors.forEach(({ name }, id) => {
|
||||
const floorButton = document.createElement("button");
|
||||
floorButton.textContent = name;
|
||||
floorButton.classList.add("floor-button");
|
||||
floorButton.id = "floor-" + id;
|
||||
if (id === mainFocus) floorButton.classList.add("selected");
|
||||
floorButton.addEventListener("click", () => {
|
||||
window.location.hash = id;
|
||||
});
|
||||
|
||||
// this.uiElements.floorButtons.appendChild(floorButton);
|
||||
// });
|
||||
this.uiElements.floorButtons.appendChild(floorButton);
|
||||
});
|
||||
|
||||
// if (this.floormanager.floors.size < 1) {
|
||||
// this.uiElements.floors.classList.add("empty");
|
||||
// this.floorsEmpty = true;
|
||||
// } else {
|
||||
// this.uiElements.floors.classList.remove("empty");
|
||||
// this.floorsEmpty = false;
|
||||
// }
|
||||
if (currentFloors.size < 1) {
|
||||
this.uiElements.floors.classList.add("empty");
|
||||
this.floorsEmpty = true;
|
||||
} else {
|
||||
this.uiElements.floors.classList.remove("empty");
|
||||
this.floorsEmpty = false;
|
||||
}
|
||||
}
|
||||
|
||||
__updateFloorsSoft() {
|
||||
const currentLocalization = this.mainmanager.getCurrentLocalization();
|
||||
const currentFloors = this.mainmanager.getAllFocusObject("floor");
|
||||
const mainFocus = this.mainmanager.getCurrentFocus("floor");
|
||||
|
||||
this.uiElements.floorsHeading.textContent =
|
||||
currentLocalization.floors_header;
|
||||
|
||||
// this.floormanager.floors.forEach(({ name }, id) => {
|
||||
// const child = this.uiElements.floorButtons.querySelector("#floor-" + id);
|
||||
// if (id === this.floormanager.currentFloor)
|
||||
// child.classList.add("selected");
|
||||
// else child.classList.remove("selected");
|
||||
// });
|
||||
currentFloors.forEach((_, id) => {
|
||||
const child = this.uiElements.floorButtons.querySelector("#floor-" + id);
|
||||
if (id === mainFocus) child.classList.add("selected");
|
||||
else child.classList.remove("selected");
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,6 @@
|
|||
import kaplay from "./modules/kaplay.js";
|
||||
import { KaplayMap } from "./KaplayMap/index.js";
|
||||
import { FloorManager } from "./KaplayMap/floors.js";
|
||||
import { UIManager } from "./KaplayMap/ui.js";
|
||||
import { GameObjManager } from "./KaplayMap/gameobj.js";
|
||||
import { EventManager } from "./KaplayMap/events.js";
|
||||
import { LangManager } from "./KaplayMap/lang.js";
|
||||
import { KaplayMap } from "./KaplayMap/map.js";
|
||||
import { EventMapperManager } from "./KaplayMap/mapper.js";
|
||||
|
||||
const map = document.querySelector("#map");
|
||||
const mapUi = document.querySelector("#map-ui");
|
||||
|
|
@ -23,20 +19,12 @@ const kp = kaplay({
|
|||
});
|
||||
|
||||
const kaplaymap = new KaplayMap(kp, {});
|
||||
|
||||
const langmanager = new LangManager("en-US");
|
||||
const uimanager = new UIManager(mapUi, kaplaymap);
|
||||
const gameobjmanager = new GameObjManager(kaplaymap);
|
||||
const eventmanager = new EventManager(kaplaymap, uimanager, gameobjmanager);
|
||||
const floormanager = new FloorManager(
|
||||
kaplaymap,
|
||||
uimanager,
|
||||
gameobjmanager,
|
||||
eventmanager
|
||||
);
|
||||
const eventmappermanager = new EventMapperManager(kaplaymap, mapUi);
|
||||
|
||||
async function main() {
|
||||
kaplaymap.initGrid();
|
||||
|
||||
await eventmappermanager.load();
|
||||
}
|
||||
|
||||
main();
|
||||
|
|
@ -179,28 +179,28 @@ a {
|
|||
max-width: calc(100% - 32px);
|
||||
}
|
||||
|
||||
#map-ui #events-container:not(.inspector):not(.minimized) #events {
|
||||
#map-ui #events-container:not(.empty):not(.inspector):not(.minimized) #events {
|
||||
left: 16px;
|
||||
}
|
||||
|
||||
#map-ui #events-container:not(.inspector).minimized #events-minimized {
|
||||
#map-ui #events-container:not(.empty):not(.inspector).minimized #events-minimized {
|
||||
left: 16px;
|
||||
}
|
||||
|
||||
#map-ui #events-container:not(.minimized).inspector #events-inspector {
|
||||
#map-ui #events-container:not(.empty):not(.minimized).inspector #events-inspector {
|
||||
left: 16px;
|
||||
}
|
||||
|
||||
#map-ui #events-container.minimized.inspector #events-inspector-minimized {
|
||||
#map-ui #events-container:not(.empty).minimized.inspector #events-inspector-minimized {
|
||||
left: 16px;
|
||||
}
|
||||
|
||||
#map-ui #floors.empty ~ #events-container #events,
|
||||
/* #map-ui #floors.empty ~ #events-container #events,
|
||||
#map-ui #floors.empty ~ #events-container #events-inspector,
|
||||
#map-ui #floors.empty ~ #events-container #events-minimized,
|
||||
#map-ui #floors.empty ~ #events-container #events-inspector-minimized {
|
||||
left: -100% !important;
|
||||
}
|
||||
} */
|
||||
|
||||
#map-ui #events-container #events #footer #footer-buttons,
|
||||
#map-ui #events-container #events-inspector #footer #footer-buttons {
|
||||
|
|
@ -238,7 +238,7 @@ a {
|
|||
margin 0.25s; */
|
||||
}
|
||||
|
||||
#map-ui #events-container.empty #events #event-list {
|
||||
#map-ui #events-container #events.empty #event-list {
|
||||
min-height: 0;
|
||||
padding: 0 8px;
|
||||
margin: 0;
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
<div id="map-ui" class="loading">
|
||||
<div id="zoom">
|
||||
<button class="zoom-button" id="zoom-in">+</button>
|
||||
<button class="zoom-button" id="zoom-out">-</button>
|
||||
<button class="zoom-button" id="zoom-out" disabled>-</button>
|
||||
</div>
|
||||
<div id="floors" class="empty">
|
||||
<h1 class="widget-heading"></h1>
|
||||
|
|
|
|||
|
|
@ -10,9 +10,9 @@ app.use("/", express.static('pages'));
|
|||
|
||||
app.use("/dataServer", express.static('data')); // Example data file-server
|
||||
|
||||
app.get('/data/:lang/events', async (req, res) => {
|
||||
app.get('/data/:lang/events/:floor', async (req, res) => {
|
||||
// Get events
|
||||
let eventsReq = await fetch(new URL("events/events.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,43 +39,9 @@ app.get('/data/:lang/events', async (req, res) => {
|
|||
return res.send(merged);
|
||||
})
|
||||
|
||||
app.get('/data/:lang/events/:layer', async (req, res) => {
|
||||
// Get events
|
||||
let eventsReq = await fetch(new URL("events/events.json", config.data_url));
|
||||
let events;
|
||||
if (eventsReq.ok)
|
||||
events = await eventsReq.json();
|
||||
else
|
||||
return res.status(400).send("Bad Request");
|
||||
|
||||
// Get localization
|
||||
let l10nReq = await fetch(new URL(`localization/${req.params.lang}.json`, config.data_url));
|
||||
let l10n;
|
||||
if (l10nReq.ok)
|
||||
l10n = await l10nReq.json();
|
||||
else
|
||||
return res.status(404).send("Localization not found!");
|
||||
|
||||
const clippedEvents = events.filter((event) => event.where.layer == req.params.layer).map((event) => {
|
||||
event.where = event.where.room;
|
||||
return event;
|
||||
});
|
||||
|
||||
// Merge events and localization
|
||||
const merged = clippedEvents.map(event => {
|
||||
const localizationKey = l10n.__events[event.id];
|
||||
return {
|
||||
...event,
|
||||
...localizationKey
|
||||
};
|
||||
});
|
||||
|
||||
return res.send(merged);
|
||||
})
|
||||
|
||||
app.get('/data/:lang/map', async (req, res) => {
|
||||
app.get('/data/:lang/floors', async (req, res) => {
|
||||
// Get layers
|
||||
let layersReq = await fetch(new URL("map/layers.json", config.data_url));
|
||||
let layersReq = await fetch(new URL("floors.json", config.data_url));
|
||||
let layers;
|
||||
if (layersReq.ok)
|
||||
layers = await layersReq.json();
|
||||
|
|
@ -102,9 +68,9 @@ app.get('/data/:lang/map', async (req, res) => {
|
|||
return res.send(merged);
|
||||
})
|
||||
|
||||
app.get('/data/:lang/map/:layer', async (req, res) => {
|
||||
app.get('/data/:lang/rooms/:floor', async (req, res) => {
|
||||
// Get rooms
|
||||
let roomsReq = await fetch(new URL(`map/${req.params.layer}.json`, config.data_url));
|
||||
let roomsReq = await fetch(new URL(`rooms/${req.params.floor}.json`, config.data_url));
|
||||
let rooms;
|
||||
if (roomsReq.ok)
|
||||
rooms = await roomsReq.json();
|
||||
|
|
|
|||
Loading…
Reference in a new issue