HTML5 not hiding hotspots

Q&A about the latest versions
Post Reply
Panoartist
Posts: 8
Joined: Sun Feb 22, 2009 1:27 pm

Attached is a photographer's attempt of trying to use and understand Pano2VR software...

The Flash does work as I want. The point hotspot shows the label with a hover over, and when clicked - opens the image and hides all hotspot icons so multiple hotspots can't be opened. I'm really happy.

HTML5 - shows label with hover over, does not hide hotspot icons and multiple hotspots could be opened. Also hotspot icon can show over other opened hotspot image.Tried many permutations. Frustrated. Same results with Chrome and iPad.

My goal would be to have HTML5 work like Flash version. I've read and tried most of all the examples posted, missing something or maybe it isn't possible. Hopefully the test file provides enough background. Purposely not using Flash fallback for testing so Chrome opens HTML5. Again, I'm a photographer and not a coder...but bless you for creating amazing software.
Attachments
Hotspot_test.zip
(240.82 KiB) Downloaded 211 times
User avatar
Hopki
Gnome
Posts: 13051
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Hi,
This seems to be a bug, we had this and and was fixed in flash, but still not functioning in the HTML5 output.
The problem is the % to address all elements with the same ID when its a child of a Hotspot Template. Issue #444

The % works when not a child of a Hotspot temple so a workaround will be to place two containers in the skin and give them ID's, say hs_hide and hs_show.

In hs_hide set the action:
Mouse Click => Set Element Scale => Scale X/Y: 0 => Target: %hsimage

In hs_show set the action:
Mouse Click => Set Element Scale => Scale X/Y: 1 => Target: %hsimage

Now move the containers off the stage, say position X: -100 Y: -100 as containers will become active elements in the HTML5 skin and will stop interaction with the panorama.

Now in the hotspot image set the actions:
Mouse Click => Change Element Scale => Scale X/Y: 1 => Target: image1
Mouse Click => Trigger Click => Target: hs_hide.

In the popup image1 set the actions:
Mouse Click => Change Element Scale => Scale X/Y: 0 => Target: $self
Mouse Click => Trigger Click => Target: hs_show

You can also add the actions together to make one skin that will work with both the Flash and HTML5 outputs.

The hsimage:
Mouse Click => Change Element Scale => Scale X/Y: 1 => Target: image1
Mouse Click => Set Image Scale => Scale X/Y: 0 => Target: %hsimage (required action for flash)
Mouse Click => Trigger Click => Target: hs_hide. (required action for html5)

The popup image1:
Mouse Click => Change Element Scale => Scale X/Y: 0 => Target: $self
Mouse Click => Set Image Scale => Scale X/Y: 1 => Target: %hsimage (required action for flash)
Mouse Click => Trigger Click => Target: hs_show (required action for html5)

Of course you still need to add the containers, but then you only have the one skin.
Regards,
Hopki
Garden Gnome Support
If you send an e-mail to support please send a link to the forum post for reference.
support@ggnome.com
https://ggnome.com/wiki/documentation/
Panoartist
Posts: 8
Joined: Sun Feb 22, 2009 1:27 pm

Hopki,

Thanks for the resolution - would of never used Target Click. It did work in iPad :D
Post Reply