Day & Night Transition in a Virtual tour.

[Octavias]

Day & Night Transition in a Virtual tour.

by Octavias » Wed Jan 30, 2013 4:31 pm

Hello everyone!

So I want to start writing a new theme for my company that will include the day / night transition. I don't know much about XML but i have seen people incorporating them in their tours and they look AMAZING. I understand it would have to be some script that will change between two panoramas in a fade in/ fade out style.

Please help if anyone can help me with the code i would greatly appreciate it and i can compensate as well. I don't have a large budget, but i am sure we can work something out!

Thanks again,

- Octavias

[Destiny]

by Destiny » Wed Jan 30, 2013 10:02 pm

Hi Octavias

I will try to make up a template for you. Can you get your two panos with cube faces ready with your swf. It is better to use the krpano software to create your tour for this... I will send you the template where you just replace these files for yours to get it working..

Destiny..

[Octavias]

by Octavias » Thu Jan 31, 2013 12:05 am

Destiny to the rescue!

Thank for helping, Okay now you got to guide with what you need. I will shoot the two Panoramas ASAP for you but regarding exporting. What exactly do you need from me? I am using PTgui to Stich and PTP to export.

You can e-mail me if you like,

Thanks so much,

-Octavias

[Destiny]

by Destiny » Thu Jan 31, 2013 12:28 am

Hi.. Well I am hoping you purchased PTP which means you can download and use krpano to create your tour.. You do not have to use it since ptp can do it too but with a lot more code editing, it makes it easier to replace the cube faces and swf using krpano.. The thing with this media, you cannot zoom in... its fixed as I understand it so save your pano to produce 1400 cube faces. You cannot physically see more than 96 dpi on any monitor so save and optimise at 80% 96 dpi.

http://krpano.com/download/

With the krpano all you need to do is drop your pano onto the droplet to produce the the tour.. You can then edit the nadir after. Droplets are amazing things. They are a kind of Macro recorded to carry out a process without having any prior knowledge of software or even having additional software..

This link will provide you with all you need.. Just download it and replace the swf and cube faces with yours, making sure you name your faces as they are which use cap letters.. You will need to add your krpano licences with the tour.

http://krpano.com/examples/blendcubes720/

I am sure you will work it out from this winter to summer where you can download the krpano example files.. but feel free to ask any questions.. I would keep the pano cubes small or it will take a long time to load.. 1400 is about the limit..

Destiny..

[UK Pano]

by UK Pano » Thu Jan 31, 2013 12:03 pm

You can e-mail me if you like,
-Octavias

No don't email it as I'm interested in this as well! Not from a Day/Night but looking at applying the same principle for a before/after

Thanks in advance Destiny

[Destiny]

by Destiny » Thu Jan 31, 2013 10:59 pm

Hi.. Ok, I will try to share and make sure its understandable and doable for all users.

To achieve this in the most simple way you need to create your tour and save-as krpano.swf

This code below is all krpano code but edited by me.

Later when you understand how it all works you can save-as any name but doing it this way all you need to do is replace the krpano.swf with yours and also replace the cube faces naming them as they are so their maintains correlation between the xml code. I have also provided a screen shot of the file structure. Simple and easy to understand.

I can send the files to anyone who asks for it, providing a zipped copy of this template setup.. If you need your tour to be in a table rather than as a full screen, I will send you a table structure. Also, if you need a menu set, you can just copy and past a set from any xml code but make sure you provide the full url and a folder with the menu graphics.

Destiny..

This is the test blend transition link..
http://members.westnet.com.au/dps/krpanoblend/Destinykrpanoblend.html


This is the striped to barebones html source code..

<html>
<head>
<title>Destiny krpano blend test setup</title>
</head>
<style>
body{ font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#FFFFFF; background-color:#000000; margin:0; padding:0; }
* html, * html body{ overflow: hidden; }
a{ color:#FFFFFF; text-decoration:underline; }
a:hover{ color:#AAAAAA; text-decoration:underline; }
</style>
<body>

<div id="krpanoDIV"></div>

<script type="text/javascript" src="swfkrpano.js"></script>

<script type="text/javascript">

var swf = createswf("krpano.swf","krpanoSWFObject","100%","100%");
swf.addVariable("xml","krpano.xml");
swf.embed("krpanoDIV");

</script>

</body>
</html>


This is xml code

<krpano onstart="start();">

<view hlookat="180" vlookat="0" fovtype="HFOV" fov="100" fovmin="70" fovmax="120" />


<action name="addface">
addhotspot(%1);
set(hotspot[%1].url, %2);
set(hotspot[%1].ath, %3);
set(hotspot[%1].atv, %4);
set(hotspot[%1].width, 1000);
set(hotspot[%1].height, 1000);
set(hotspot[%1].distorted, true);
set(hotspot[%1].enabled, false);
set(hotspot[%1].visible, false);
set(hotspot[%1].alpha, 0.0);
set(hotspot[%1].details, 16);
set(hotspot[%1].zorder, %1);
</action>


<action name="addcube">
addface(face_%1_F, %1_f.jpg, 0, 0);
addface(face_%1_L, %1_l.jpg, -90, 0);
addface(face_%1_R, %1_r.jpg, +90, 0);
addface(face_%1_B, %1_b.jpg, +180, 0);
addface(face_%1_Z, %1_u.jpg, 0, -90);
addface(face_%1_N, %1_d.jpg, 0, +90);
</action>


<action name="setalpha">
set(%1.alpha, %2);
if(%1.alpha == 0.0, set(%1.visible,false), set(%1.visible,true));
</action>


<action name="setcubealpha">
setalpha(hotspot[face_%1_F], %2);
setalpha(hotspot[face_%1_L], %2);
setalpha(hotspot[face_%1_R], %2);
setalpha(hotspot[face_%1_B], %2);
setalpha(hotspot[face_%1_Z], %2);
setalpha(hotspot[face_%1_N], %2);
</action>


<action name="start">
addcube(blue);
addcube(grey);
</action>


<action name="blendcubes720">
set(overlap, 30); <!-- set overlapping/blending range in degrees -->

mul(edge1, overlap, 0.5);
sub(edge2, 360, edge1);
add(edge3, 360, edge1);
sub(edge4, 720, edge1);

mod(pan, view.hlookat, 720);
if(pan LT 0, add(pan,pan,1440);mod(pan,pan,720); );

if(pan GT edge2,
if(pan LT edge3,
sub(blend,pan,edge2);
div(blend,blend,overlap);
,
set(blend,1);
);
if(pan GT edge4,
sub(blend,pan,edge4);
div(blend,blend,overlap);
sub(blend,1,blend);
);
,
if(pan LT edge1,
add(blend,pan,edge1);
div(blend,blend,overlap);
sub(blend,1,blend);
,
set(blend,0);
);
);

sub(blend2, 1.0, blend);
setcubealpha(blue, get(blend));
setcubealpha(grey, get(blend2));
</action>


<events onviewchange="blendcubes720();" />


</krpano>

[klausesser]

by klausesser » Thu Jan 31, 2013 11:08 pm

I can send the files to anyone who asks for it, providing a zipped copy of this template setup.. If you need your tour to be in a table rather than as a full screen, I will send you a table structure. Also, if you need a menu set, you can just copy and past a set from any xml code but make sure you provide the full url and a folder with the menu graphics.

Destiny..

I think you should point out that this doesn´t work on iDevices.
Here´s one with real images : http://360impressions.de/LTKuppelBlend/krpano.swf

best, Klaus

Last edited by klausesser on Thu Jan 31, 2013 11:11 pm, edited 1 time in total.

[UK Pano]

by UK Pano » Fri Feb 01, 2013 10:41 am

Thank you Destiny for this and can see how the code works. Simple when you think about it *blush*
Thanks also Klaus for the example with real imagery - very effective.

I have been renovating a house and wish to apply this as before/after transition. I was originally looking to use a hotspot icon to trigger the switch, but his automated fade is much more impressive.

Thanks again

[Octavias]

by Octavias » Sat Feb 02, 2013 12:05 am

You guys are amazing!!! I had little time toc heck on the replies but wow am i happy i posted lol Thank you Destiny for the code, i will implemented it as soon as i can and wil get back to you guy with a result!

[Octavias]

by Octavias » Mon Feb 04, 2013 8:27 am

I did it guys!! it looks great, the only think i can't get to work is applying my license from PTP. Where would i find it? Is it a file? Because as far as i know i have my e-mail ad my registration KEY from the e-mail?

Please advice!

[Destiny]

by Destiny » Mon Feb 04, 2013 9:00 am

When you create your own tour swf and and cube images, it generates the licences automatically... Just copy and past them to your transition tour template.... Since the licence was generated when you created you swf, it will work fine.. You are just replacing the krpano original file..

Destiny..

[mediavets]

by mediavets » Mon Feb 04, 2013 9:41 am

I did it guys!! it looks great, the only think i can't get to work is applying my license from PTP. Where would i find it? Is it a file? Because as far as i know i have my e-mail ad my registration KEY from the e-mail?

Please advice!

You can export the embedded krpano licenses from PTP using the Help/Licenses option.

Last edited by mediavets on Mon Feb 04, 2013 9:41 am, edited 1 time in total.

[Octavias]

by Octavias » Mon Feb 04, 2013 4:23 pm

Awesome!

Thanks Destiny and Mediavets, i will try when i get home.

Also, i did it kind of a weird way for now, since i just started messing around with the code. I just took my test panorama and dropped it into the kpano droplet, it made the cubes for me and then i replaced it with the Blend Sample file i downloaded from your comments. I mean it worked and i had my two panoramas blend after a rotation but, i don't think its the most correct way, since i need my hotspots and all that to be embedded as well.

I will keep trying and re-reading this thread, will keep you guys informed.

Thanks again fro helping,

-Max

[Octavias]

by Octavias » Wed Feb 06, 2013 8:39 pm

Hey gang!

So i got it to work with the sample theme! And ohh i am so excited about it!

The only problem is. when i exported the licences from PTP there was no 3rd licence (krpanobrandingfree.license) I cannot seem to be able to find this one, so the (kpano) is gone from my images BUT the "DEMO" in the middle still remains.

Please help!

-Max

[Destiny]

by Destiny » Wed Feb 06, 2013 8:49 pm

Can you provide a url to this..

Destiny...

[mediavets]

by mediavets » Wed Feb 06, 2013 8:51 pm

The only problem is. when i exported the licences from PTP there was no 3rd licence (krpanobrandingfree.license)

Do you have a branding-free license? This is not part of the PTP package but a separate product available at extra cost:

http://www.kolor.com/buy/software/branding-free-license-panotour-pro-krpano-1.html

the (kpano) is gone from my images BUT the "DEMO" in the middle still remains.

Please help!

-Max

Not sure what you mean; but that's not related to a branding-free license, which remove references to krpano from the right-click context menu.

Last edited by mediavets on Wed Feb 06, 2013 8:51 pm, edited 1 time in total.

[Octavias]

by Octavias » Wed Feb 06, 2013 9:01 pm

I am sticking another panorama and uploading it soon!

Destiny, i thought you said if i have PTP license i can use k-pano to export it? Or should i just use k-pano to make my cubes?

[Destiny]

by Destiny » Wed Feb 06, 2013 9:08 pm

You use PTP to export your cubic faces and create a tour to create your swf file.. Keep the size low or it will take a long time to load.. You then rename your cube faces as my demo I provided and replace the cube faces and swf for your own... Once you understand how it all works, you can change the names in the code to your own.. This is the easiest way to get it to work... You can use krpano to do all this too, but what I am saying with krpano, since you own ptp, you can use the krpano download as your template.. PTP will generate your licences for you...

Destiny..

[Octavias]

by Octavias » Wed Feb 06, 2013 10:32 pm

It worked! Destiny you are amazing! Thank you so much for your help!

This is what i have so far. There is a square of some sort that pops up when the blend happens, any ideas why? also how do i get my navigation menu in there?

http://www.acmbphotography.com/Day%20and%20Night%20test/Destinykrpanoblend.html

Thanks in advance!

- Max

[Destiny]

by Destiny » Wed Feb 06, 2013 11:10 pm

It's a nice feature.. I sure hope its in the new PTP but with a loader... or others might think its not loading.. I can see it having many uses.. You need to fix up your cube faces and also optimise more.. Remember, no monitor can see more than 96 dpi so if you set your faces at jpg, 80% at 96 dpi with max faces about 1400 X 1400 it should work fine..

Well done..

Destiny...

[Octavias]

by Octavias » Thu Feb 07, 2013 4:41 pm

It really is a nice feature. I am gonna optimize the cubes when i have some free time again and show you my results!

-Max

[klausesser]

by klausesser » Thu Feb 07, 2013 7:17 pm

Remember, no monitor can see more than 96 dpi

Sorry, Destiny: you´re wrong.

My Apple 30" 2560x1600 px has 100dpi.
Apple´s 15" MacBook Pro Retina (2880 x 1800) has around 220ppi.
NEC MD205MG-1 2560x2048 @ 20.1 has 163dpi

There´s a growing number of displays which definitely exceeds 96dpi/ppi.

best, Klaus

Last edited by klausesser on Thu Feb 07, 2013 7:18 pm, edited 1 time in total.

[Octavias]

by Octavias » Thu Feb 07, 2013 7:24 pm

Klausesser, If that is so, Why is my cube images have that weird square on it? Do you have any idea? And how do I obtain my navigation bar in the tour, is that possible?

-Max

[klausesser]

by klausesser » Thu Feb 07, 2013 7:58 pm

Why is my cube images have that weird square on it?

??? Sorry?

best, Klaus

[Octavias]

by Octavias » Thu Feb 07, 2013 9:24 pm

It worked! Destiny you are amazing! Thank you so much for your help!

This is what i have so far. There is a square of some sort that pops up when the blend happens, any ideas why? also how do i get my navigation menu in there?

http://www.acmbphotography.com/Day%20and%20Night%20test/Destinykrpanoblend.html

Thanks in advance!

- Max

That's the link to my panorama, would you kindly take a look please? Do you have any idea why that weird square shows up when the transition happens?

Everyone's help is highly appreciated!