Hotspot with preview

Post Reply
User avatar
Hopki
Gnome
Posts: 12999
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

HI,
Been asked about how you would go about adding a preview image to your hotspots.
Attached is a simple project which does just that.

Download and unzip.
Make sure you enter a user data title as the project is looking for this for its file names. This project already has then set.

The Project File (p2vr)
I have set a remap to make the preview images, the output file path is output/preview/$ut.jpg.
This will produce the images with the file names that the skin will be looking for as $ut is the user data Title.
This will produce a folder in the output folder called preview and inside will be images with the user data titles with the file extension .jpg.
The reason for doing this way is that you can have as many preview images in one panorama as is required.

The Skin:
It is using the Simplex hotspot template with the addition of two rectangles and an external loader.
The rectangle with the ID preview is the background and is set to not visible.
The next rectangle with the ID drop is acting like a drop shadow for the preview image.
The external loader which has the ID of preview_image will show the image.
Each is a child of the other to keep everything simple in terms of showing and hiding.

The hotspot template has the additional actions:

Mouse Enter => Set Text => Text: preview/$hs.jpg => Target: preview_image
Mouse Enter => Show Element => Target: preview
Mouse Leave => Set Text => Text: (leave blank) => Target: preview_image
Mouse Leave => Hide Element => Target: preview

The trick is to set the user data title before you out anything.

Regards,
Hopki
Attachments
hotspot with preview.zip
(3.76 MiB) Downloaded 2138 times
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/
User avatar
jobes
Posts: 87
Joined: Fri Mar 07, 2008 2:34 am
Contact:

Thanks Hopki, nice tip. Just been setting a less complicated version of this to show an image in a loader page… I think I'll play around more with the options now you've posted this. Cheers!
Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

Nice Hopki!
Is there a solution to use this with more hotspots in one panorama?

Frans
User avatar
Hopki
Gnome
Posts: 12999
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Hi Frans,
This will work with as many hotspots as you want.
If your having problems let me know and ill post up one with more then one hotspot.
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/
Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

Hi Hopki,

I would like it for 6 hotspots :D
http://www.360360360.nl/testfs/

Frans
User avatar
Hopki
Gnome
Posts: 12999
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Hi Frans,
Please find project attached, only does 5 but you will get the idea.
Unzip and click Create All.
Regards,
Hopki
Attachments
multi_hotspot.zip
(55.17 KiB) Downloaded 738 times
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/
Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

Hi Hopki,

I am afraid you sent the wrong file. The same one as here above.

Frans
User avatar
Hopki
Gnome
Posts: 12999
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Hi Frans,
The project is different?
The first node has 5 hotspots each showing a preview image?
Ok it has Node Two twice, but does all work.

The skin is the same as this will not change, what has changed is the number of input images and hotspots in the hotspot editor.
The remap will create all the preview images, regardless of how many input images you have.

Thats the point of the skin is that it will work with any number of hotspots per node.
Just make sure you add User Data Titles before you output the files as its using this to locate the correct preview image for each hotspot.

Regards,
Martin
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/
Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

I still understand nothing of what you try to explain.
Multi_hotspot has 5 pano images
1 preview.ggsk and
1 preview.p2v

Don't know what to do with it.

Frans
User avatar
Hopki
Gnome
Posts: 12999
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Hi Frans,
PM me and we can meet up on Skype.
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/
User avatar
Hopki
Gnome
Posts: 12999
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Preview Project attached for non Pro projects :)

Each p2vr project file has User Data Title set.
Each has a Remap thats creating the preview image with the file path using: output/preview/$ut.jpg so picking up the User Data title for the images file name and putting it in a folder called "preview".

The Hotspot Editor is using the same User Data title in the Hotspots title.

Explanation of function.
The User Data Title is being used to create the file name of the preview image with using $ut in the preview images file path along with the folder name, in this case "preview".
This will add a sub folder in the output folder with all the preview images, file names:
Pano One.jpg
Pano Two.jpg
Pano Three.jpg
Pano Four.jpg
Pano Five.jpg

The Hotspot Editor has the exact name used in the User Data in the Hotspot Editors Title text field, example:
Pano One will have Pano Two in the Pano Two Hotspots title.

In the skin the Hotspot Template has the actions:
Mouse Enter => Set Text => Text: preview/$hs.jpg => Target: preview_image (preview_image being the ID of the External Loader)
Mouse Enter => Show Element => Target: preview (preview being the ID of the preview images background)

When you mouse over the point hotspot in Pano One for Pano Two the above actions will show the external loader and set the text "preview/$hs.jpg".
As Pano Two is in the title of the point hotspot it will internally replace $hs with "Pano Two".
So the text that is bing set will be "preview/Pano Two.jpg"
This will call the Pano Two.jpg image out of the preview folder and display it.

Mouse Leave sets the text to blank, so unloading the image and hides the background, preview.

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/
Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

Thanks Martin,

Going to try that.

Frans
User avatar
Hopki
Gnome
Posts: 12999
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

:oops: Might help if I added the project
Regards,
Hopki
Attachments
preview.zip
(395.41 KiB) Downloaded 746 times
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/
Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

Hi Hopki,

But it is in essence the same as the multi-hotspot.zip?

Frans
User avatar
Hopki
Gnome
Posts: 12999
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Hi Frans,
Now that I have added the Non Pro Project have a look. The skin is the same, you just need to make sure each p2vr project file has the User Data Title and a Remap to make the preview image.
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/
Post Reply