Simplify examples page #1489
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
demiankatz
left a comment
There was a problem hiding this comment.
Thanks, @Saira-A, this is off to a great start. A couple of organizational suggestions, though:
1.) I think the "target" control should move back into the "general" tab, since it applies to multiple extensions. (It works in OSD, for example -- it captures the current pan and zoom settings; you can see it changing as you navigate the viewer).
2.) Maybe we should create an "OpenSeadragon" tab for the rotation control, since I think that only applies to OSD, and I can imagine we might introduce other OSD-specific controls in future.
|
@Saira-A and @demiankatz, I know this is still in draft, just an observation. In the I did notice that currently, the only way to reset the rotation is by manually adjusting the slider back to 0 or, if that's not possible, refreshing the page to restore the original view. Just a suggestion, happy to hear what others think as well. |
|
@LanieOkorodudu, your suggestion makes sense to me, as long as it's not overly complicated to implement (and I don't imagine that it would be). |
|
Agree a reset button would be a nice user friendly touch |
Add collapsible headings and reset rotation button
|
Thanks everyone. I’ve put the text under collapsible headings in the config tab now so let me know what you think of that. I didn’t add the reset rotation button previously because there’s a pre-existing issue where the viewer ignores being reset to 0 and doesn’t re-render. For now I’ve added the button but it resets it to 0.5 degrees which is hopefully better than nothing while I look into it |
|
Looks good @Saira-A! |
Seems like setting rotation in general has some weird side effects -- clicking the submit button repeatedly without changing the value does odd things. I also wonder if setting the rotation to 360 would effectively get you back to 0, if you're looking for a different temporary workaround. In any case, if this is taking too much time, I'm definitely in favor of merging the control reorganization first, and then dealing with the rotation issues separately, since they're obviously not directly related. |
demiankatz
left a comment
There was a problem hiding this comment.
@Saira-A, I took a closer look at this today and noticed there were a few areas where indentation was slightly out of alignment. Hopefully the comments below will help straighten it out.
Also see below for a possible interim suggestion about the reset button.
| </div> | ||
| </div> | ||
| <div class="collapsible-section"> | ||
| <button class="collapsible-heading collapsible-icon caret-down"><strong>Custom configuration</strong></button> |
There was a problem hiding this comment.
I'm not sure it's clear that this button displays help. Would it be better to keep a "Custom configuration" heading, and have a button next to it labeled "More information" or something like that? (For accessibility, we would probably need to aria-label such a button with a longer description like "More information about custom configuration").
Co-authored-by: Demian Katz <demian.katz@villanova.edu>
Co-authored-by: Demian Katz <demian.katz@villanova.edu>
Co-authored-by: Demian Katz <demian.katz@villanova.edu>
…ewer into examplespage
|
Thanks @demiankatz! I changed the rotation button to 0 - 360 with the reset setting it to 360 as that seems like the best temporary solution. I'll experiment with other ways to show the explanatory text later |
Great compromise for now -- thanks! |
demiankatz
left a comment
There was a problem hiding this comment.
Thanks, @Saira-A, I like the new "More information" controls a lot better!
|
(I realize this PR is still in draft mode with some uncompleted TODOs... happy to leave it there so we can make further progress, OR to merge as-is and follow up with separate PRs, depending on everyone's preferences). |
|
I'm changing it again based on feedback from Erin and Lanie so let's leave it as a draft for now (sorry, I requested review too hastily!) I think the annotations tab could also do with some explanatory text but I don't really know how to use it myself; would you be able to write something up @demiankatz? |
|
Updated with another option for displaying the explanatory text - I'll try and move the IIIF/YouTube tabs to the top before we merge it as well |
Definitely more compact! As long as it passes accessibility checks (and I see it has an aria-label, so I assume it will), I have no objections to this. |
|
Updated with the IIIF and YouTube tabs moved to the top and the stacked tabs looking more like tabs and less like buttons. That just leaves adding explanatory text to the annotations tab which we can't do at present |
|
Thanks, @Saira-A, I think this is looking quite good. Just one thought: would it be helpful to outline the tabs? I think it looks fine in the lower area, but at the top, with only two values, the greyed-out YouTube tab catches my attention more than the active IIIF tab, and it feels confusing. I think an outline to make it clearer that these are tabs might straighten it out. Not a big deal, though, and happy to hear other opinions! |
|
Thanks @demiankatz - made some changes but it may still be too subtle, happy for anyone else to finish it off while I'm away though! |
demiankatz
left a comment
There was a problem hiding this comment.
Thanks, @Saira-A, looks good enough to my eye! I think this is sufficient progress to take this out of draft mode and merge it, but we'll see if others still have more feedback.
|
I agree @demiankatz, looks good to me |
Work in progress PR to make the examples page easier to use. #1455
Changes so far:
To be done:
Any thoughts or feedback would be appreciated :)