Shared-Reality-Lab / IMAGE-browser

IMAGE project browser extensions & client-side code
Other
2 stars 0 forks source link

Implement buttons on photos in browser for testing #311

Closed jeffbl closed 1 year ago

jeffbl commented 1 year ago

Following up on #281 , we would like to see what happens when we enable buttons on all eligible content in IMAGE, including photos. As previously discussed, likely better to do this in a separate git branch and build a custom version of the extension, so that if we try it and decide it is a terrible idea, it is trivial to do so without having to revert it out of main. @Cybernide and I will need a special drop for testing this.

@Cybernide assigning to you for decision on whether we want to try ordinary buttons, or the more "invisible" type you were discussing this morning. Once decided, please assign to @jaydeepsingh25 for implementation. @jaydeepsingh25 if the chosen approach makes this anything other than trivial, please ping @Cybernide and me to discuss before going ahead. Note that we expect glitches and weirdnesses, and mostly just want to see how much additional work there is likely to be to make this practical, so this work item does not encompass doing any non-trivial tweaks to make it a smooth experience - that can be costed separately and put into new work item(s) if we decide to go ahead.

jeffbl commented 1 year ago

@cybernide If this is still important to try, please decide what type of buttons should be implemented, so that it can be assigned to @jaydeepsingh25 for implementation and moved into an appropriate sprint (e.g., May29). If not still important, please let me know and I will move to backlog.

Cybernide commented 1 year ago

Was playing around with the aria-label functionality. Here's an example. Note that the HTML button has the attribute aria-label="Interpret this graphic with IMAGE" and the CSS for the button gives it a transparent colour, height and width of 0px.

Is this approach at all compatible with what we currently do? @jaydeepsingh25

Cybernide commented 1 year ago

Discussed with @jaydeepsingh25 on how to implement. Agreed on using approach outlined here: https://bootcamp.uxdesign.cc/when-to-use-aria-label-or-screen-reader-only-text-cd778627b43b

and here: https://getbootstrap.com/docs/4.0/utilities/screenreaders/

jaydeepsingh25 commented 1 year ago

The feature has been implemented in a separate branch: https://github.com/Shared-Reality-Lab/IMAGE-browser/tree/sr-buttons. @jeffbl , @Cybernide Please use the following custom build for testing: sr-buttons.zip Based on the test results, the code can be merged in main later.