diff --git a/OverworldEvent.js b/OverworldEvent.js
index 9580e43..5193224 100644
--- a/OverworldEvent.js
+++ b/OverworldEvent.js
@@ -60,8 +60,13 @@ class OverworldEvent {
}
changeMap(resolve) {
- this.map.overworld.startMap(window.OverworldMaps[this.event.map]);
- resolve();
+ const sceneTransition = new SceneTransition();
+ sceneTransition.init(document.querySelector(".game-container"), () => {
+ this.map.overworld.startMap(window.OverworldMaps[this.event.map]);
+ resolve();
+
+ sceneTransition.fadeOut();
+ });
}
init() {
diff --git a/SceneTransition.js b/SceneTransition.js
new file mode 100644
index 0000000..c68292f
--- /dev/null
+++ b/SceneTransition.js
@@ -0,0 +1,26 @@
+class SceneTransition {
+ constructor() {
+ this.element = null;
+ }
+
+ createElement() {
+ this.element = document.createElement("div");
+ this.element.classList.add("SceneTransition");
+ }
+
+ fadeOut() {
+ this.element.classList.add("fade-out");
+ this.element.addEventListener("animationend", () => {
+ this.element.remove();
+ }, { once: true })
+ }
+
+ init(container, callback) {
+ this.createElement();
+ container.appendChild(this.element);
+
+ this.element.addEventListener("animationend", () => {
+ callback();
+ }, { once: true });
+ }
+}
\ No newline at end of file
diff --git a/index.html b/index.html
index d6ba1d1..b90cf74 100644
--- a/index.html
+++ b/index.html
@@ -5,6 +5,7 @@
+
witchday
@@ -23,6 +24,7 @@
+