dkirkby / desipano

360 degree panoramas of the DESI focal plane
MIT License
0 stars 0 forks source link

Add HTML content in tooltips #3

Closed dkirkby closed 1 year ago

dkirkby commented 1 year ago

Investigate feasibility of adding richer content using HTML in tooltip popups.

Some specific content suggestions from @SamuelBrieden:

[0] - Indicate towers positions in the plane or show photo [1] - show photo of motor [2] (or [5],[15]) - Link to science / overview page [3] - Link to Instrument / spectrograph page (or show photo of spectrograph) [4] - Link to Instrument / fiber system page [7] - maybe you have a photo of the different parts (either in real or 3d printed)? [9] (or [6]) - Link to Instrument / telescope / Tohono O’odham page [10] - Photo of robot next to pencil [14] - Link to Instrument / focal plane system page

dkirkby commented 1 year ago

One issue is whether to include links and, if so, what to do if a browser visits the link in the current tab, leaving the tour. Currently, the back button will take them back to the start of the tour, rather than their last view.

SamuelBrieden commented 1 year ago

Two suggestions for this:

  1. Adding the target="_blank" attribute to href (between link and displayed text) will open the link in a new tab to not reset the tour.
  2. Maybe you can add a preview, so the reader can have a look at content from the DESI webpage without leaving the tour and going to another tab. I think using iFrame as suggested in the answer to this question could be feasible. There is a JSFiddle in the answer, and when putting the DESI webpage as source it looks fairly well :)
dkirkby commented 1 year ago

Thanks. I don't think browser have to respect target="_blank" but it doesn't hurt to add it. I will experiment with an iframe preview.

dkirkby commented 1 year ago

I have HTML embedded links (using target="_blank") and images to some of the tooltips. There is more that could be usefully added, but this seems enough to get started with.