ccm/btroops
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix storing scenario in local storage

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc 2024-05-30 18:06:46 -07:00
parent 56c8411920
commit 85f5abb4e2
4 changed files with 21 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
public/index.html
View File

@ -227,13 +227,10 @@
<label> <label>
Load scenario: Load scenario:
<select> <select>
<!-- <option value="scenario-side_show">BattleTroops Scenario 1: Side Show</option>
<option value="scenario-dragon_hunting">BattleTroops Scenario 2: Dragon Hunting</option>
<option value="scenario-race_against_time">BattleTroops Scenario 3: Race Against Time</option>
<option value="map4">Test</option> <option value="map4">Test</option>
<option value="contour-lines">Contour Lines</option> <option value="contour-lines">Contour Lines</option>
<option value="pendle">Pendle</option> <option value="pendle">Pendle</option>
<option value="10-simplex_t03">10-simplex family polytope graph, in A10 Coxeter plane</option> --> <option value="10-simplex_t03">10-simplex family polytope graph, in A10 Coxeter plane</option>
</select> </select>
</label> </label>
</p> </p>

5
src/index.js
View File

@ -3,7 +3,7 @@ import * as gameboard from './modules/gameboard.js';
import * as recordSheet from './modules/record_sheet.js'; import * as recordSheet from './modules/record_sheet.js';
import * as mapSelectDialog from './modules/map_select_dialog.js'; import * as mapSelectDialog from './modules/map_select_dialog.js';
import { Observable } from './modules/observable.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'; 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'), contentVisToggleEl = document.querySelector('#content input[type="checkbox"].visible'),
// fileName = localStorage.getItem('map') || (env === 'test' ? 'test_map' : 'map1'), // fileName = localStorage.getItem('map') || (env === 'test' ? 'test_map' : 'map1'),
fileName = localStorage.getItem('map') || 'scenario-side_show', fileName = localStorage.getItem('map') || 'scenario-side_show',
// map = `assets/images/${fileName}.svg`, map = scenarios[fileName]?.hashed || `assets/images/${fileName}.svg`,
map = sideShow,
fileInputEl = document.querySelector('input[type="file"]'), fileInputEl = document.querySelector('input[type="file"]'),
dice = document.querySelectorAll('.die'), dice = document.querySelectorAll('.die'),

13
src/modules/map_select_dialog.js
View File

@ -6,17 +6,17 @@ export function init() {
selectEl = mapDialog.querySelector('select'), selectEl = mapDialog.querySelector('select'),
confirmBtn = mapDialog.querySelector('#confirm-btn'); confirmBtn = mapDialog.querySelector('#confirm-btn');
Object.keys(scenarios).forEach(scenario => { Object.keys(scenarios).reverse().forEach(scenario => {
const option = document.createElement('option'); const option = document.createElement('option');
option.setAttribute('value', scenario); option.setAttribute('value', scenario);
option.textContent = scenarios[scenario]; option.textContent = scenarios[scenario].title;
selectEl.appendChild(option); selectEl.prepend(option);
}); });
return { return {
selectCurrentOptionOnPageLoad() { selectCurrentOptionOnPageLoad() {
mapDialog.querySelectorAll('option').forEach(option => mapDialog.querySelectorAll('option').forEach((option, index) =>
option.value === localStorage.getItem('map') && (option.selected = true) option.selected = option.value === localStorage.getItem('map') || index === 0
); );
return this; return this;
@ -43,8 +43,7 @@ export function init() {
e.preventDefault(); e.preventDefault();
localStorage.removeItem('pan-zoom'); localStorage.removeItem('pan-zoom');
localStorage.setItem('map', selectEl.value); localStorage.setItem('map', selectEl.value);
// loadFn(`assets/images/${selectEl.value}.svg`); loadFn(scenarios[selectEl.value]?.hashed || `assets/images/${selectEl.value}.svg`);
loadFn(selectEl.value);
mapDialog.close(); mapDialog.close();
}); });
} }

15
src/modules/scenarios.js
View File

@ -3,7 +3,16 @@ import dragonHunting from './assets/images/scenario-dragon_hunting.svg';
import raceAgainstTime from './assets/images/scenario-race_against_time.svg'; import raceAgainstTime from './assets/images/scenario-race_against_time.svg';
export const scenarios = { export const scenarios = {
[sideShow]: 'BattleTroops Scenario 1: Side Show', 'scenario-side_show': {
[dragonHunting]: 'BattleTroops Scenario 2: Dragon Hunting', hashed: sideShow,
[raceAgainstTime]: 'BattleTroops Scenario 3: Race Against Time', 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',
},
} }