1 files changed, 42 insertions, 9 deletions

diff --git a/resources/js/ui.js b/resources/js/ui.js
index 089a3c3..e69fd83 100644
--- a/resources/js/ui.js
+++ b/resources/js/ui.js
@@ -531,7 +531,7 @@ const UI = {
 
   drawArea () {
     if (Game.isTown(Memory.state.currentArea)) {
-      UI.elements.sceneTown.querySelector('[data-template-slot="map"]').replaceChildren(UI.createMap());
+      UI.drawTown();
 
       UI.closeLog();
 
@@ -689,7 +689,9 @@ const UI = {
 
   /* Town */
 
-  drawTown () {},
+  drawTown () {
+      UI.elements.sceneTown.querySelector('[data-template-slot="map"]').replaceChildren(UI.createMap());
+  },
 
 
   /* Map */
@@ -721,6 +723,23 @@ const UI = {
       }
     }
 
+    template.querySelectorAll('[data-area]').forEach((node) => node.addEventListener('click', UI.wrapCallback(async () => {
+      await Game.goToArea(node.dataset.area);
+      UI.closeAllPopups();
+    })));
+
+    template.querySelectorAll('[data-encounter]').forEach((node) => node.addEventListener('click', UI.wrapCallback(async () => {
+      if (!Memory.state.Game.isInBattle) {
+        const monster = await fetchMonster(node.dataset.encounter);
+        monster.level = parseInt(node.dataset.encounterLevel);
+
+        Game.encounterMonster(monster);
+        Memory.state.Game.isInBattle = true;
+
+        UI.closeAllPopups();
+      }
+    })));
+
     return template;
   },
 
@@ -973,7 +992,7 @@ const UI = {
     if (!Game.isTown(currentArea)) {
       if (
         Memory.state.Game.isInBattle ||
-          (Memory.state.opponent && Memory.state.opponent.type === 'trainer')
+        (Memory.state.opponent && Memory.state.opponent.type === 'trainer' && Memory.state.opponent.activeMonster !== Memory.state.opponent.monsters[0])
       ) {
         changeAreaButton.disabled = true;
       } else {
@@ -1027,11 +1046,9 @@ const UI = {
       return;
     }
 
-    const popup = UI.createPopup();
-    const template = UI.createMap();
-
-    popup.querySelector('.popup').appendChild(template);
-    UI.drawPopup(popup);
+    UI.drawTown();
+    UI.elements.sceneBattle.classList.toggle('hidden');
+    UI.elements.sceneTown.classList.toggle('hidden');
   },
 
   openAreaSelection () {
@@ -1057,7 +1074,22 @@ const UI = {
         }
 
         else if (condition.startsWith('area.')) {
-          canGo = Memory.state.areaProgress.hasOwnProperty(condition.replace('area.', ''));
+          const areaCondition = condition.replace('area.', '');
+          const areaSlug = areaCondition.split('.')[0];
+          const area = Memory.state.areaProgress[areaSlug] || null;
+
+          if (!area) {
+            canGo = false;
+            continue;
+          }
+
+          if (areaCondition.includes('completed')) {
+            canGo = canGo && area.isCompleted;
+          }
+
+          else { // doesn't have any extra properties and exists in progress => visited
+            canGo = canGo && true;
+          }
         }
 
         else if (condition.startsWith('event.')) {
@@ -1679,6 +1711,7 @@ const UI = {
     const popup = UI.createPopup();
     const template = document.createElement('div');
 
+    template.classList.add('item-info');
     template.textContent = item.description;
 
     popup.querySelector('.popup').appendChild(template);