Web Dev Solutions

Catalin Mititiuc

From d393934679290ab4e16aa0b4a73408273eb26596 Mon Sep 17 00:00:00 2001 From: Catalin Mititiuc Date: Tue, 30 Apr 2024 16:58:12 -0700 Subject: Refactor index.js --- src/modules/map_select_dialog.js | 42 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 42 insertions(+) create mode 100644 src/modules/map_select_dialog.js (limited to 'src/modules/map_select_dialog.js') diff --git a/src/modules/map_select_dialog.js b/src/modules/map_select_dialog.js new file mode 100644 index 0000000..a9f8bc8 --- /dev/null +++ b/src/modules/map_select_dialog.js @@ -0,0 +1,42 @@ +export function init() { + const showButton = document.getElementById('show-dialog'), + mapDialog = document.getElementById('map-dialog'), + selectEl = mapDialog.querySelector('select'), + confirmBtn = mapDialog.querySelector('#confirm-btn'); + + return { + selectCurrentOptionOnPageLoad() { + mapDialog.querySelectorAll('option').forEach(option => + option.value === localStorage.getItem('map') && (option.selected = true) + ); + + return this; + }, + + showOnClick() { + showButton.addEventListener('click', () => { + mapDialog.showModal(); + }); + + return this; + }, + + updateValueOnSelection() { + selectEl.addEventListener('change', () => { + confirmBtn.value = selectEl.value; + }); + + return this; + }, + + changeMapOnConfirm() { + confirmBtn.addEventListener('click', e => { + e.preventDefault(); + localStorage.removeItem('pan-zoom'); + localStorage.setItem('map', selectEl.value); + document.querySelector('object').data = `${selectEl.value}.svg`; + mapDialog.close(); + }); + } + }; +} -- cgit v1.2.3