diff --git a/assets/scripts/KaplayMap/gameobj.js b/assets/scripts/KaplayMap/gameobj.js
index 4855709..c9c1858 100644
--- a/assets/scripts/KaplayMap/gameobj.js
+++ b/assets/scripts/KaplayMap/gameobj.js
@@ -1,4 +1,8 @@
export class GameObjManager {
+ opts = {
+ floorMinZoom: 1,
+ roomMinZoom: 2,
+ };
map;
floormanager;
@@ -9,7 +13,11 @@ export class GameObjManager {
this.map = map;
}
- generateFloor() {
+ generateFloor(opts) {
+ this.opts = {
+ ...this.opts,
+ opts,
+ };
if (this.floorObject) this.floorObject.destroy();
const currentFloor = this.floormanager.floors.get(
@@ -51,13 +59,19 @@ export class GameObjManager {
this.map.kp.add(this.floorObject);
- this.map.zoomToAbs(this.map.opts.minZoomLevel, bounds.center());
+ this.map.zoomToAbs(
+ this.map.opts.minZoomLevel + this.opts.floorMinZoom,
+ bounds.center()
+ );
}
zoomToFloor() {
const objectBounds = this.floorObject.renderArea().bbox();
- this.map.zoomToAbs(this.map.opts.minZoomLevel, objectBounds.center());
+ this.map.zoomToAbs(
+ this.map.opts.minZoomLevel + this.opts.floorMinZoom,
+ objectBounds.center()
+ );
}
zoomToRoom(id) {
@@ -66,7 +80,10 @@ export class GameObjManager {
const objectBounds = selectedObject.renderArea().bbox();
- this.map.zoomToAbs(this.map.opts.minZoomLevel + 1, objectBounds.center());
+ this.map.zoomToAbs(
+ this.map.opts.minZoomLevel + this.opts.roomMinZoom,
+ objectBounds.center()
+ );
}
generateRooms() {
@@ -133,9 +150,11 @@ export class GameObjManager {
const camScale = 1 / this.map.kp.camScale().y;
this.map.kp.drawText({
text: room.name,
+ width: polygon.bbox().width,
size: 24 * camScale,
pos: polygon.bbox().center(),
color: this.map.kp.WHITE,
+ align: "center",
anchor: "center",
});
});
diff --git a/assets/scripts/KaplayMap/index.js b/assets/scripts/KaplayMap/index.js
index c150049..b7983e0 100644
--- a/assets/scripts/KaplayMap/index.js
+++ b/assets/scripts/KaplayMap/index.js
@@ -1,7 +1,7 @@
export class KaplayMap {
kp;
opts = {
- minZoomLevel: 2,
+ minZoomLevel: 1,
maxZoomLevel: 5,
dblClickDuration: 0.2, // s
dblClickForgiveness: 100, // px
diff --git a/assets/scripts/KaplayMap/localization.js b/assets/scripts/KaplayMap/localization.js
index 5e88ae7..8a70d10 100644
--- a/assets/scripts/KaplayMap/localization.js
+++ b/assets/scripts/KaplayMap/localization.js
@@ -17,4 +17,25 @@ export default new Map([
maximize: "Show events panel",
},
],
+ [
+ // Used Google Translate, pls fix
+ "es_US",
+ {
+ date_starting: "Comenzando",
+ date_started: "Comenzó",
+ floors_header: "Pisos",
+ date_summary: (prefix, time) => `${prefix} ${time}`,
+ parenthesis: (content) => `(${content})`,
+ hours_long: (hours) =>
+ hours == 1 ? `${hours} hora de duración` : `${hours} horas de duración`,
+ minutes_long: (hours) =>
+ hours == 1
+ ? `${hours} minuto de duración`
+ : `${hours} minutos de duración`,
+ events_in: (name) => `Eventos (${name})`,
+ view_events_in: (name) => `Volver a eventos en ${name}`,
+ minimize: "Ocultar panel de eventos",
+ maximize: "Mostrar panel de eventos",
+ },
+ ],
]);
diff --git a/assets/scripts/KaplayMap/ui.js b/assets/scripts/KaplayMap/ui.js
index 8b003f5..480ebcd 100644
--- a/assets/scripts/KaplayMap/ui.js
+++ b/assets/scripts/KaplayMap/ui.js
@@ -125,13 +125,30 @@ export class UIManager {
__updateEvents() {
const currentLocalization = localization.get(this.floormanager.lang);
+ 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;
+ }
+
this.uiElements.minimizeButton.title = currentLocalization.minimize;
this.uiElements.maximizeButton.title = currentLocalization.maximize;
// Figure out header
if (this.floormanager.currentRoomItem != null) {
- this.uiElements.eventsRoomName.textContent =
- currentLocalization.events_in(this.floormanager.currentRoomItem.name);
+ 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;
@@ -145,8 +162,15 @@ export class UIManager {
this.floormanager.currentFloorItem.name
);
} else {
- this.uiElements.eventsRoomName.textContent =
- currentLocalization.events_in(this.floormanager.currentFloorItem.name);
+ 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;
@@ -161,13 +185,7 @@ export class UIManager {
// Put them back
const currentDate = new Date();
- this.eventmanager.events.forEach((event, id) => {
- if (
- this.floormanager.currentRoomItem &&
- event.where != this.floormanager.currentRoom
- )
- return; // Don't display this event
-
+ currentEvents.forEach((event, id) => {
const eventFloor = this.floormanager.currentFloorRooms.get(event.where);
const eventDateStart = new Date(event.when.start);
const eventDateEnd = new Date(event.when.end);
@@ -185,11 +203,11 @@ export class UIManager {
datePrefix = currentLocalization.date_starting;
}
- const eventListContainer = document.createElement("details");
+ const eventListContainer = document.createElement("div");
eventListContainer.classList.add("event-list-container");
eventListContainer.id = "event-" + id;
- const eventListContainerSummary = document.createElement("summary");
+ const eventListContainerSummary = document.createElement("p");
const eventListContainerSummaryName = document.createElement("b");
eventListContainerSummaryName.textContent = event.name;
@@ -249,19 +267,14 @@ export class UIManager {
eventListContainer.appendChild(eventListContainerSummary);
- const eventListContainerDescription = document.createElement("p");
- eventListContainerDescription.textContent = event.description;
-
- eventListContainer.appendChild(eventListContainerDescription);
-
this.uiElements.eventList.appendChild(eventListContainer);
});
- if (this.eventmanager.events.size < 1) {
- this.uiElements.eventList.classList.add("empty");
+ if (currentEvents.size < 1) {
+ this.uiElements.eventsContainer.classList.add("empty");
this.eventsEmpty = true;
} else {
- this.uiElements.eventList.classList.remove("empty");
+ this.uiElements.eventsContainer.classList.remove("empty");
this.eventsEmpty = false;
}
}
diff --git a/assets/styles/style.css b/assets/styles/style.css
index b916532..1d5cc58 100644
--- a/assets/styles/style.css
+++ b/assets/styles/style.css
@@ -24,6 +24,7 @@ h1.widget-heading {
p.widget-description {
margin: 0;
margin-bottom: 8px;
+ white-space: pre-line;
/* border-bottom: 1px solid currentColor;
padding-bottom: 2px; */
}
@@ -163,6 +164,7 @@ button.link {
#map-ui #events-container #events {
left: 16px;
width: 400px;
+ max-width: calc(100% - 32px);
}
#map-ui #events-container.minimized #events {
@@ -192,11 +194,11 @@ button.link {
grid-template-columns: 36px auto;
gap: 8px;
margin-bottom: 8px;
- align-items: center;
+ /* align-items: center; */
}
#map-ui #events-container #events #event-list {
- min-height: 200px;
+ /* min-height: 100px; */
max-height: calc(50% - 16px);
margin: 8px 0;
padding: 8px;
@@ -204,11 +206,20 @@ button.link {
display: flex;
flex-direction: column;
gap: 4px;
+ /* transition: height 0.25s,
+ min-height 0.25s,
+ padding 0.25s,
+ margin 0.25s; */
+}
+
+#map-ui #events-container.empty #events #event-list {
+ min-height: 0;
+ padding: 0 8px;
+ margin: 0;
}
#map-ui #events-container #events #event-list .event-list-container p {
- margin: 2px 0;
- white-space: pre-line;
+ margin: 0;
}
#map-ui #events-container #events #events-header button,
diff --git a/pages/index.html b/pages/index.html
index c59a0ea..d56488d 100644
--- a/pages/index.html
+++ b/pages/index.html
@@ -19,18 +19,18 @@
-