[x] change the type of clickedId to a Set<string> I'm just using string[] because Svelte's reactivity doesn't play well with objects, including Sets.
[x] add a flag to determine if the user is in the modify-OAs phase of custom scenario building. We can just use a prop to pass this between components. I made it a store.
[x] If said flag is false, preserve the behaviour below (making sure to never assign more than one element to clickedId)
[x] If the flag is set AND shift key was held down, make it such that clicking an OA adds it to clickedId, clicking it again removes it
[x] If the flag is set AND shift key was held down, turn the defaultPrevented behaviour off as it would be very annoying to click outside an OA during the custom scenario creation and lose all the OAs gotten so farRejected for UI intuitiveness reasons. Most programmes which allow shift-clicking also deselect everything when you click outside.
Adjust box in left sidebar accordingly to deal with multiple OAs being changed at once.
[x] Make it so that changing the sliders when multiple OAs are selected updates all OAs
[x] Make the sliders display the correct "aggregate" values when selecting multiple OAs
Open UX question(s):
[x] Is the current usage of setFeatureState good enough? Currently, when clicking on multiple OAs, this will lead to all borders being highlighted (including inner borders). That's probably ok(?). (Update: This is how it is right now - probably OK, pending discussion with the team.)
[x] Should the click popup be disabled when modifying OAs? There is already a hover popup. Lean towards yes, but should test it out. (Update: Click popup is removed in custom scenario creation. Doesn't seem to be a huge loss, and makes the maplibre state management code less painful.)
The steps for this are probably something like:
clickedId
to aI'm just usingSet<string>
string[]
because Svelte's reactivity doesn't play well with objects, includingSet
s.We can just use a prop to pass this between components.I made it a store.clickedId
)https://github.com/alan-turing-institute/demoland-web/blob/3cae61dd4f896e2e14d29b57f8e9a1e946cbdfd5/web/src/App.svelte#L139-L171
e.originalEvent.shiftKey
wheree
is the MapLibre eventboxZoom
inside the custom scenario creation so that shift-click events were recorded. See https://github.com/mapbox/mapbox-gl-js/issues/6971.clickedId
, clicking it again removes itIf the flag is set AND shift key was held down, turn theRejected for UI intuitiveness reasons. Most programmes which allow shift-clicking also deselect everything when you click outside.defaultPrevented
behaviour off as it would be very annoying to click outside an OA during the custom scenario creation and lose all the OAs gotten so farhttps://github.com/alan-turing-institute/demoland-web/blob/3cae61dd4f896e2e14d29b57f8e9a1e946cbdfd5/web/src/App.svelte#L173-L180
Open UX question(s):
setFeatureState
good enough? Currently, when clicking on multiple OAs, this will lead to all borders being highlighted (including inner borders). That's probably ok(?). (Update: This is how it is right now - probably OK, pending discussion with the team.)