task/WG-91-Allow non-persistent tile layer adjustments in public hazmapper maps

[tjgrafft]

Overview:

During the RAPID webinar, users wanted to be able to tweak public map opacity without making changes to the map.

also from Karen (https://designsafe-ci.slack.com/archives/C057MKDUZFS/p1683657846684769?thread_ts=1683649659.461539&cid=C057MKDUZFS):

It may also be helpful to keep some format of the layers option so users can still toggle between the satellite view and the map view. That way they can see what an area looked like before the event?

PR Status:

• Ready.
• Work in Progress.
• Hold.

Related Jira tickets:

• WG-91

Summary of Changes:

• Project Owners will still be able to add tile layers, add overlays, edit tile layer names, change opacity, delete tile layers and delete overlays.
• However, now when project owners make their maps "public", the guest/user will be able to:
  1. See the Layers Option
  2. Tweak the opacity of a tile layer
  3. Toggle between tile layers (for example: toggling between Satellite view and the Roads view)
  4. Guests/users will not be able to delete or save layer changes (by design).

Testing Steps:

1. Go to geoapi repo and run 'make start'
2. Go to hazmapper repo and run 'npm run start'
3. Navigate to localhost:4200 and pick a project
4. Make the map "public" if it's not already, and open public map in another tab.
5. Compare the view that the project owner or co-owner can see (non-public) versus the public view of the map.
6. See screenshots below for comparison

UI Photos:

Project Owner/Co-Owner view is unchanged (non-public view)



Here is Option 1 for the public view (notice buttons are disabled, but not hidden from view)



Here is Option 2 for the public view (notice buttons are hidden/not rendered)
If this option is picked I need to add back the 'Overlays' title


Let me know which option y'all prefer

Notes:

I made it so that the 'Save Layer Options' button is only rendered when there's a change/save opportunity. Otherwise the button is not rendered, until it needs to be (this is only in the non-public view, in the public view the 'Save Layer Options' button is never rendered, by design).

[taoteg]

I am inclined to adhere to the UI consistency of option 1. The disabled state is pretty well understood these days. Hiding controls might be bad for accessibility design as well.

[taoteg]

LGTM. I like option 1.

[nathanfranklin]

I am inclined to adhere to the UI consistency of option 1. The disabled state is pretty well understood these days. Hiding controls might be bad for accessibility design as well.

@taoteg but in the public view, it can never be enabled. in that case, wouldn't it be better to just hide it as it doesn't apply to the public view.

[tjgrafft]

@nathanfranklin I'll go with Option 2. Adding the Overlays title back now

[taoteg]

@nathanfranklin I think there may be a terminology mismatch here - I would say "hide the control" NO, but "not include the control at all" YES. It runs afoul of accessibility best practices to hide UI controls (because they are still there for anyone who needs the accessibility to work, which creates bad navigation experience). However, as long as the control doesn't exist in the component to begin with(when the client renders it), that is fine. I'm a bit rusty in my Angular, is the showInput value going to hide the element or render it display:none? (or put another way, does it behave like ng-hide or like ngIf)?

[nathanfranklin]

However, as long as the control doesn't exist in the component to begin with(when the client renders it), that is fine.

@taoteg , ngif 👍 i can see how saying "hide element" is unclear (hide vs not render).

[sophia-massie]

LGTM!