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

markers-overview - ability to invert lock and pinned statuses

Browse source
This commit is contained in:
Azgaar 2021-10-17 14:03:59 +03:00
parent 6ac9adb9c5
commit b0e788b575
2 changed files with 29 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

2
index.html
View file

@ -3380,6 +3380,8 @@
<div id="markersOverview" class="dialog stable" style="display: none"> <div id="markersOverview" class="dialog stable" style="display: none">
<div id="markersHeader" class="header"> <div id="markersHeader" class="header">
<div style="left:1em" data-tip="Click to sort by marker type" class="sortable alphabetically" data-sortby="type">Type&nbsp;</div> <div style="left:1em" data-tip="Click to sort by marker type" class="sortable alphabetically" data-sortby="type">Type&nbsp;</div>
<div id="markersInverPin" style="left:14.9em; color: #6e5e66" data-tip="Click to invert pin state for all markers" class="icon-pin pointer"></div>
<div id="markersInverLock" style="left:16.1em; color: #6e5e66" data-tip="Click to invert lock state for all markers" class="icon-lock pointer"></div>
</div> </div>
<div id="markersBody" class="table"></div> <div id="markersBody" class="table"></div>

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

@ -6,6 +6,8 @@ function overviewMarkers() {
const markerGroup = document.getElementById("markers"); const markerGroup = document.getElementById("markers");
const body = document.getElementById("markersBody"); const body = document.getElementById("markersBody");
const markersInverPin = document.getElementById("markersInverPin");
const markersInverLock = document.getElementById("markersInverLock");
const markersFooterNumber = document.getElementById("markersFooterNumber"); const markersFooterNumber = document.getElementById("markersFooterNumber");
const markersOverviewRefresh = document.getElementById("markersOverviewRefresh"); const markersOverviewRefresh = document.getElementById("markersOverviewRefresh");
const markersAddFromOverview = document.getElementById("markersAddFromOverview"); const markersAddFromOverview = document.getElementById("markersAddFromOverview");
@ -25,6 +27,8 @@ function overviewMarkers() {
const listeners = [ const listeners = [
listen(body, "click", handleLineClick), listen(body, "click", handleLineClick),
listen(markersInverPin, "click", invertPin),
listen(markersInverLock, "click", invertLock),
listen(markersOverviewRefresh, "click", addLines), listen(markersOverviewRefresh, "click", addLines),
listen(markersAddFromOverview, "click", toggleAddMarker), listen(markersAddFromOverview, "click", toggleAddMarker),
listen(markersGenerationConfig, "click", configMarkersGeneration), listen(markersGenerationConfig, "click", configMarkersGeneration),
@ -45,12 +49,12 @@ function overviewMarkers() {
function addLines() { function addLines() {
const lines = pack.markers const lines = pack.markers
.map(({i, type, icon, lock}) => { .map(({i, type, icon, pinned, lock}) => {
return `<div class="states" data-i=${i} data-type="${type}"> return `<div class="states" data-i=${i} data-type="${type}">
<div data-tip="Marker icon and type" style="width:12em">${icon} ${type}</div> <div data-tip="Marker icon and type" style="width:12em">${icon} ${type}</div>
<span style="padding-right:.1em" data-tip="Edit marker" class="icon-pencil"></span> <span style="padding-right:.1em" data-tip="Edit marker" class="icon-pencil"></span>
<span style="padding-right:.1em" data-tip="Focus on marker position" class="icon-dot-circled pointer"></span> <span style="padding-right:.1em" data-tip="Focus on marker position" class="icon-dot-circled pointer"></span>
<span style="padding-right:.1em" data-tip="Pin marker (display only pinned markers)" class="icon-pin inactive pointer"></span> <span style="padding-right:.1em" data-tip="Pin marker (display only pinned markers)" class="icon-pin ${pinned ? "" : "inactive"}" pointer"></span>
<span style="padding-right:.1em" class="locks pointer ${lock ? "icon-lock" : "icon-lock-open inactive"}" onmouseover="showElementLockTip(event)"></span> <span style="padding-right:.1em" class="locks pointer ${lock ? "icon-lock" : "icon-lock-open inactive"}" onmouseover="showElementLockTip(event)"></span>
<span data-tip="Remove marker" class="icon-trash-empty"></span> <span data-tip="Remove marker" class="icon-trash-empty"></span>
</div>`; </div>`;
@ -63,6 +67,27 @@ function overviewMarkers() {
applySorting(markersHeader); applySorting(markersHeader);
} }
function invertPin() {
let anyPinned = false;
pack.markers.forEach(marker => {
const pinned = !marker.pinned;
if (pinned) {
marker.pinned = true;
anyPinned = true;
} else delete marker.pinned;
});
markerGroup.setAttribute("pinned", anyPinned ? 1 : null);
drawMarkers();
addLines();
}
function invertLock() {
pack.markers = pack.markers.map(marker => ({...marker, lock: !marker.lock}));
addLines();
}
function openEditor(i) { function openEditor(i) {
const marker = pack.markers.find(marker => marker.i === i); const marker = pack.markers.find(marker => marker.i === i);
if (!marker) return; if (!marker) return;