Hotspot with preview

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

Hotspot with preview

Post by Hopki » Thu Aug 01, 2013 4:14 pm

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 1537 times

User avatar
jobes
Posts: 87
Joined: Fri Mar 07, 2008 2:34 am
Contact:

Re: Hotspot with preview

Post by jobes » Sat Aug 03, 2013 1:49 pm

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

Re: Hotspot with preview

Post by Rajah » Wed Aug 07, 2013 6:26 pm

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

Frans

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

Re: Hotspot with preview

Post by Hopki » Wed Aug 07, 2013 7:29 pm

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

Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

Re: Hotspot with preview

Post by Rajah » Wed Aug 07, 2013 8:52 pm

Hi Hopki,

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

Frans

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

Re: Hotspot with preview

Post by Hopki » Mon Aug 12, 2013 6:55 pm

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 366 times

Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

Re: Hotspot with preview

Post by Rajah » Tue Aug 13, 2013 10:06 am

Hi Hopki,

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

Frans

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

Re: Hotspot with preview

Post by Hopki » Tue Aug 13, 2013 11:03 am

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

Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

Re: Hotspot with preview

Post by Rajah » Tue Aug 13, 2013 11:47 am

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: 9651
Joined: Thu Jan 10, 2008 3:16 pm
Location: Layer de la Haye, Essex UK
Contact:

Re: Hotspot with preview

Post by Hopki » Tue Aug 13, 2013 4:23 pm

Hi Frans,
PM me and we can meet up on Skype.
Regards,
Hopki

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

Re: Hotspot with preview

Post by Hopki » Thu Aug 15, 2013 6:02 pm

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

Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

Re: Hotspot with preview

Post by Rajah » Thu Aug 15, 2013 6:17 pm

Thanks Martin,

Going to try that.

Frans

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

Re: Hotspot with preview

Post by Hopki » Fri Aug 16, 2013 11:29 am

:oops: Might help if I added the project
Regards,
Hopki
Attachments
preview.zip
(395.41 KiB) Downloaded 367 times

Rajah
Posts: 254
Joined: Sun Jul 11, 2010 8:02 pm

Re: Hotspot with preview

Post by Rajah » Fri Aug 16, 2013 11:44 am

Hi Hopki,

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

Frans

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

Re: Hotspot with preview

Post by Hopki » Fri Aug 16, 2013 12:29 pm

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

Post Reply

Who is online

Users browsing this forum: No registered users and 1 guest