3 files changed, 20 insertions, 13 deletions
diff --git a/src/index.js b/src/index.js
index d677b01..992366a 100644
--- a/src/index.js
+++ b/src/index.js
@@ -3,7 +3,7 @@ import * as gameboard from './modules/gameboard.js';
 import * as recordSheet from './modules/record_sheet.js';
 import * as mapSelectDialog from './modules/map_select_dialog.js';
 import { Observable } from './modules/observable.js';
-import sideShow from './assets/images/scenario-side_show.svg';
+import { scenarios } from './modules/scenarios.js';
 
 globalThis.svgns = 'http://www.w3.org/2000/svg';
 
@@ -13,8 +13,7 @@ const mapPlaceholder = document.querySelector('.map-placeholder'),
   contentVisToggleEl = document.querySelector('#content input[type="checkbox"].visible'),
   // fileName = localStorage.getItem('map') || (env === 'test' ? 'test_map' : 'map1'),
   fileName = localStorage.getItem('map') || 'scenario-side_show',
-  // map = `assets/images/${fileName}.svg`,
-  map = sideShow,
+  map = scenarios[fileName]?.hashed || `assets/images/${fileName}.svg`,
   fileInputEl = document.querySelector('input[type="file"]'),
   dice = document.querySelectorAll('.die'),
 
diff --git a/src/modules/map_select_dialog.js b/src/modules/map_select_dialog.js
index 24215f6..359477d 100644
--- a/src/modules/map_select_dialog.js
+++ b/src/modules/map_select_dialog.js
@@ -6,17 +6,17 @@ export function init() {
     selectEl = mapDialog.querySelector('select'),
     confirmBtn = mapDialog.querySelector('#confirm-btn');
 
-  Object.keys(scenarios).forEach(scenario => {
+  Object.keys(scenarios).reverse().forEach(scenario => {
     const option = document.createElement('option');
     option.setAttribute('value', scenario);
-    option.textContent = scenarios[scenario];
-    selectEl.appendChild(option);
+    option.textContent = scenarios[scenario].title;
+    selectEl.prepend(option);
   });
 
   return {
     selectCurrentOptionOnPageLoad() {
-      mapDialog.querySelectorAll('option').forEach(option =>
-        option.value === localStorage.getItem('map') && (option.selected = true)
+      mapDialog.querySelectorAll('option').forEach((option, index) =>
+        option.selected = option.value === localStorage.getItem('map') || index === 0
       );
 
       return this;
@@ -43,8 +43,7 @@ export function init() {
         e.preventDefault();
         localStorage.removeItem('pan-zoom');
         localStorage.setItem('map', selectEl.value);
-        // loadFn(`assets/images/${selectEl.value}.svg`);
-        loadFn(selectEl.value);
+        loadFn(scenarios[selectEl.value]?.hashed || `assets/images/${selectEl.value}.svg`);
         mapDialog.close();
       });
     }
diff --git a/src/modules/scenarios.js b/src/modules/scenarios.js
index afe375f..2a4af26 100644
--- a/src/modules/scenarios.js
+++ b/src/modules/scenarios.js
@@ -3,7 +3,16 @@ import dragonHunting from './assets/images/scenario-dragon_hunting.svg';
 import raceAgainstTime from './assets/images/scenario-race_against_time.svg';
 
 export const scenarios = {
-  [sideShow]: 'BattleTroops Scenario 1: Side Show',
-  [dragonHunting]: 'BattleTroops Scenario 2: Dragon Hunting',
-  [raceAgainstTime]: 'BattleTroops Scenario 3: Race Against Time',
+  'scenario-side_show': {
+    hashed: sideShow,
+    title: 'BattleTroops Scenario 1: Side Show',
+  },
+  'scenario-dragon_hunting': {
+    hashed: dragonHunting,
+    title: 'BattleTroops Scenario 2: Dragon Hunting',
+  },
+  'scenario-race_against_time': {
+    hashed: raceAgainstTime,
+    title: 'BattleTroops Scenario 3: Race Against Time',
+  },
 }