backups/Fantasy-Map-Generator
1
0
Fork 0
mirror of https://github.com/Azgaar/Fantasy-Map-Generator.git synced 2025-12-22 03:51:23 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

changed type selection to button + dropdown menu

Browse source
This commit is contained in:
Elad Bernard Haviv 2023-08-05 11:48:00 +03:00
parent 128231144e
commit 7a8254a9b4
3 changed files with 61 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

29
modules/ui/markers-overview.js
View file

@ -15,6 +15,7 @@ function overviewMarkers() {
const markersRemoveAll = document.getElementById("markersRemoveAll");
const markersExport = document.getElementById("markersExport");
const markerTypeInput = document.getElementById("addedMarkerType");
const markerTypeSelector = document.getElementById("markerTypeSelector");
addLines();
@ -26,13 +27,6 @@ function overviewMarkers() {
position: {my: "right top", at: "right-10 top+10", of: "svg", collision: "fit"}
});
Markers.getConfig().forEach(markerConfig => {
const option = document.createElement("option");
option.setAttribute("value", markerConfig.type);
option.textContent = `${markerConfig.icon} ${markerConfig.type}`;
markerTypeInput.appendChild(option);
});
const listeners = [
listen(body, "click", handleLineClick),
listen(markersInverPin, "click", invertPin),
@ -42,9 +36,23 @@ function overviewMarkers() {
listen(markersGenerationConfig, "click", configMarkersGeneration),
listen(markersRemoveAll, "click", triggerRemoveAll),
listen(markersExport, "click", exportMarkers),
listen(markerTypeInput, "change", changeMarkerType),
listen(markerTypeSelector, "click", toggleMarkerTypeMenu),
//listen(markerTypeInput, "change", changeMarkerType),
];
[{type: "empty", icon: "❓"}, ...Markers.getConfig()].forEach(markerConfig => {
const option = document.createElement("button");
option.textContent = `${markerConfig.icon} ${markerConfig.type}`;
markerTypeSelectMenu.appendChild(option);
console.log(option.textContent);
listeners.push(listen(option, "click", () => {
markerTypeSelector.textContent = markerConfig.icon;
markerTypeInput.value = markerConfig.type;
changeMarkerType();
toggleMarkerTypeMenu();
}));
});
function handleLineClick(ev) {
const el = ev.target;
const i = +el.parentNode.dataset.i;
@ -148,6 +156,11 @@ function overviewMarkers() {
});
}
function toggleMarkerTypeMenu() {
document.getElementById("markerTypeSelectMenu").classList.toggle("visible");
}
function toggleAddMarker() {
markersAddFromOverview.classList.toggle("pressed");
addMarker.click();