<!-- 
	krpano Virtual Tour Demo - Weingut
		http://krpano.com/tours/weingut/
	
	note - this is an reduced example (stronger image compression, only small 
	images, fewer panos) to keep the download package small
-->
<krpano version="1.0.8" onstart="startup();">
	<!-- vtour.xml template krpano tools version 1.0.8.12 -->
	
	<action name="startup">
		<!-- load the first scene -->
		loadscene(get(scene[0].name), null, MERGE); 
		
		<!-- build the thumbnails (remove the next line to remove the thumbnails) -->
		buildthumbs(); 
	</action>
	
	
	<!-- disable the progress bar -->
	<progress showload="none" showwait="none" />
	

	<!-- hotspot styles (for Flash and HTML5) -->
	<style name="hotspot_ani_black"
	       url="hotspots/hotspot_ani_black_64x64x20.png"
	       crop="0|0|64|64"
	       framewidth="64" frameheight="64" frame="0" lastframe="19"
	       onloaded="hotspot_animate();"
	       altonloaded="if(isphone, mul(scale,2)); onloaded();"
	       />

	<style name="hotspot_ani_white"
	       url="hotspots/hotspot_ani_white_64x64x20.png"
	       crop="0|0|64|64"
	       framewidth="64" frameheight="64" frame="0" lastframe="19"
	       onloaded="hotspot_animate();"
	       altonloaded="if(isphone, mul(scale,2)); onloaded();"
	       />
	       
	<style name="alt_hotspot_ani_black"
	       alturl="hotspots/hotspot_ani_black_64x64x20.png"
	       framewidth="64" frameheight="64" frame="0" lastframe="19"
	       altonloaded="set(crop,'0|0|64|64'); resetsize(); set(alpha,1.0); if(isphone, mul(scale,2)); hotspot_animate();"
	       />
	       
	<style name="alt_hotspot_ani_white"
	       alturl="hotspots/hotspot_ani_white_64x64x20.png"
	       framewidth="64" frameheight="64" frame="0" lastframe="19"
	       altonloaded="set(crop,'0|0|64|64'); resetsize(); set(alpha,1.0); if(isphone, mul(scale,2)); hotspot_animate();"
	       />
		       

	<action name="hotspot_animate">
		inc(frame,1,get(lastframe),0);
		mul(ypos,frame,frameheight);
		txtadd(crop,'0|',get(ypos),'|',get(framewidth),'|',get(frameheight));
		delayedcall(0.03, if(loaded, hotspot_animate()) );
	</action>
	
	
	<!-- text style for hotspot hovering -->       
	<textstyle name="hotspottextstyle" 
	           font="Arial" fontsize="18" bold="true" italic="true" textcolor="0xFFF7EF" background="false" border="false"
	           alpha="1" blendmode="layer" effect="glow(0x000000,0.5,4,3);dropshadow(4,45,0x000000,4,0.66);" 
	           origin="cursor" edge="bottom" textalign="center" xoffset="0" yoffset="-3" noclip="true" showtime="0.1" fadetime="0.25" fadeintime="0.1" 
	           />	
	       

	<scene name="scene_kellerstueberl" title="kellerstueberl" onstart="" thumburl="kellerstueberl.tiles/thumb.jpg">

		<view hlookat="50" vlookat="25" fovtype="MFOV" fov="100" fovmin="60" fovmax="120" />

		<preview url="kellerstueberl.tiles/preview.jpg" />

		<!-- NOTE - to keep the download package small - all devices (desktop,mobile,tablet) are using the same small mobile images in this example -->
		<image>
			<left  url="kellerstueberl.tiles/mobile_l.jpg" />
			<front url="kellerstueberl.tiles/mobile_f.jpg" />
			<right url="kellerstueberl.tiles/mobile_r.jpg" />
			<back  url="kellerstueberl.tiles/mobile_b.jpg" />
			<up    url="kellerstueberl.tiles/mobile_u.jpg" />
			<down  url="kellerstueberl.tiles/mobile_d.jpg" />
			<mobile>
				<left  url="kellerstueberl.tiles/mobile_l.jpg" />
				<front url="kellerstueberl.tiles/mobile_f.jpg" />
				<right url="kellerstueberl.tiles/mobile_r.jpg" />
				<back  url="kellerstueberl.tiles/mobile_b.jpg" />
				<up    url="kellerstueberl.tiles/mobile_u.jpg" />
				<down  url="kellerstueberl.tiles/mobile_d.jpg" />
			</mobile>
			<tablet>
				<left  url="kellerstueberl.tiles/mobile_l.jpg" />
				<front url="kellerstueberl.tiles/mobile_f.jpg" />
				<right url="kellerstueberl.tiles/mobile_r.jpg" />
				<back  url="kellerstueberl.tiles/mobile_b.jpg" />
				<up    url="kellerstueberl.tiles/mobile_u.jpg" />
				<down  url="kellerstueberl.tiles/mobile_d.jpg" />
			</tablet>
		</image>

		<!-- opened door distorted image hotspot (Flash only) -->
		<hotspot name="door"
		         devices="flash"
			     url="graphics/kellerstueberl_dooropen.jpg"
			     distorted="true"
			     visible="false"
			     enabled="false"
			     ath="0"
			     atv="0"
			     width="318.181818"
			     height="590.909090"
			     edge="lefttop"
			     ox="-91.818181"
			     oy="-167.272727"
			     alpha="0.0"
			     />
	
		<!-- invisible polygonal hotsppot as 'hit area' for the door hotspot
			(for HTML5 an animated gif is used as alternative) -->
		<hotspot name="door_hitarea"
		         style="alt_hotspot_ani_white"
			     ath="11" 
			     atv="6"
		         alpha="0"
		         capture="false"
		         onover="set(hotspot[door].visible,true); tween(hotspot[door].alpha,1,0.4);"
			     onout="if(enabled, tween(hotspot[door].alpha,0.0,0.4,default,set(hotspot[door].visible,false)) );"
			     onhover="showtext('Vorraum',hotspottextstyle);"
			     onclick="set(enabled,false);
			              set(view.maxpixelzoom,null);
			              set(view.fovmin,28);
			              lookto(10.7, 3.5, 42);
			              loadscene(scene_vorraum, null, MERGE, BLEND(2));
			              lookat(-94, 19, 97);
			              wait(LOAD);
			              oninterrupt(break);
			              wait(BLEND);
			              lookto(-352.7, -1.6, 108, smooth(45,45,60), false);
			             "
			>
			<point ath="  0.2451" atv="-13.0911" />
			<point ath="  9.5232" atv="-12.6311" />
			<point ath=" 18.9875" atv="-12.5328" />
			<point ath=" 19.5338" atv=" 10.7739" />
			<point ath=" 15.7329" atv=" 11.3926" />
			<point ath=" 15.6678" atv=" 25.4866" />
			<point ath="  8.4078" atv=" 25.7356" />
			<point ath="  8.4083" atv=" 27.0813" />
			<point ath="  2.7864" atv=" 26.7555" />
			<point ath="  1.7124" atv=" 27.8670" />
			<point ath=" -0.9187" atv=" 27.0069" />
			<point ath=" -1.4939" atv=" 11.6458" />
			<point ath=" -0.6737" atv=" -5.2171" />
		</hotspot>
		
		
		<!-- polygonal hotspots for the pictures on the wall 
			(for a HTML5 a zoomicon is used as alternative) -->
		<style name="pichotspot" 
		       capture="false" 
		       zorder="1" 
		       onclick="showpic();" 
		       alturl="hotspots/zoomicon.png" 
		       altonloaded="if(isphone, mul(scale,2));"
		       zoom="true" 
		       scale="0.5" 
		       ox="+40" 
		       oy="+30" 
		       />
 
		<hotspot name="hs2" style="pichotspot" pic="bildgruen"  ath="42" atv="1">
			<point ath=" 35.5409" atv=" -4.8241" />
			<point ath=" 35.6940" atv="  3.7081" />
			<point ath=" 46.0841" atv="  3.0648" />
			<point ath=" 45.9859" atv=" -4.4321" />
		</hotspot>
	
		<hotspot name="hs3" style="pichotspot" pic="bildrot" ath="80.6" atv="-1.2">
			<point ath=" 75.8092" atv=" -8.8103" />
			<point ath=" 75.6990" atv="  2.4090" />
			<point ath=" 84.3261" atv="  2.6917" />
			<point ath=" 84.3253" atv=" -9.0785" />
		</hotspot>
	
		<hotspot name="hs4" style="pichotspot" pic="bildlandschaft" ath="116.5" atv="-4">
			<point ath="113.4572" atv=" -7.9561" />
			<point ath="113.5170" atv=" -2.1261" />
			<point ath="121.4668" atv=" -2.6612" />
			<point ath="121.2671" atv="-10.8025" />
		</hotspot>

	</scene>	   
	


	<scene name="scene_vorraum" title="vorraum" onstart="" thumburl="vorraum.tiles/thumb.jpg">

		<view hlookat="-47" vlookat="13" fovtype="MFOV" fov="100" fovmin="60" fovmax="120" />

		<preview url="vorraum.tiles/preview.jpg" />

		<!-- NOTE - to keep the download package small - all devices (desktop,mobile,tablet) are using the same small mobile images in this example -->
		<image>
			<left  url="vorraum.tiles/mobile_l.jpg" />
			<front url="vorraum.tiles/mobile_f.jpg" />
			<right url="vorraum.tiles/mobile_r.jpg" />
			<back  url="vorraum.tiles/mobile_b.jpg" />
			<up    url="vorraum.tiles/mobile_u.jpg" />
			<down  url="vorraum.tiles/mobile_d.jpg" />
			<mobile>
				<left  url="vorraum.tiles/mobile_l.jpg" />
				<front url="vorraum.tiles/mobile_f.jpg" />
				<right url="vorraum.tiles/mobile_r.jpg" />
				<back  url="vorraum.tiles/mobile_b.jpg" />
				<up    url="vorraum.tiles/mobile_u.jpg" />
				<down  url="vorraum.tiles/mobile_d.jpg" />
			</mobile>
			<tablet>
				<left  url="vorraum.tiles/mobile_l.jpg" />
				<front url="vorraum.tiles/mobile_f.jpg" />
				<right url="vorraum.tiles/mobile_r.jpg" />
				<back  url="vorraum.tiles/mobile_b.jpg" />
				<up    url="vorraum.tiles/mobile_u.jpg" />
				<down  url="vorraum.tiles/mobile_d.jpg" />
			</tablet>
		</image>

		<hotspot name="kellerstueberl"
		         style="alt_hotspot_ani_white"
		         ath="46.2"
		         atv="13.9"
		         alpha="0"
		         capture="false"
		         onhover="showtext('Kellerstüberl',hotspottextstyle);"
		         onclick="set(view.maxpixelzoom,null);
		                  set(view.fovmin,28);
		                  looktohotspot(get(name),42);
		                  loadscene(scene_kellerstueberl, null, MERGE, BLEND(2));
		                  lookat(9.5, 7.9, 45);
		                  wait(LOAD);
			              oninterrupt(break);
			              wait(BLEND);
			              lookto(50, 25, 100, smooth(45,45,60));
			             "
		>
			<point ath=" 45.7058" atv="-26.1906" />
			<point ath=" 40.2116" atv="-10.1630" />
			<point ath=" 33.4871" atv="  6.7408" />
			<point ath=" 29.7230" atv=" 14.7433" />
			<point ath=" 32.1818" atv=" 23.7997" />
			<point ath=" 34.5828" atv=" 41.3338" />
			<point ath=" 34.6037" atv=" 43.5191" />
			<point ath=" 61.6951" atv=" 50.3994" />
			<point ath=" 63.6808" atv=" 20.4884" />
			<point ath=" 64.8881" atv=" 17.9660" />
			<point ath=" 61.0023" atv=" 12.2691" />
			<point ath=" 50.8736" atv="-12.9786" />
		</hotspot>
		
		<hotspot name="keller" 
		         style="alt_hotspot_ani_white"
		         ath="130.5" 
		         atv="10.4"
		         alpha="0"
		         capture="false"
		         onhover="showtext('Keller',hotspottextstyle);"
		         onclick="set(view.maxpixelzoom,null);
		                  set(view.fovmin,28);
		                  looktohotspot(get(name),42);
		                  loadscene(scene_keller, null, MERGE, BLEND(2));
		                  lookat(193, 2, 45);
			              wait(LOAD);
			              oninterrupt(break);
			              wait(BLEND);
			              lookto(331, 7, 108, smooth(45,45,60), false);
		                 "
		>
			<point ath="127.3806" atv=" 40.8125" />
			<point ath="172.8342" atv=" 43.1718" />
			<point ath="172.6533" atv="-30.7950" />
			<point ath="127.6526" atv="-29.0440" />
		</hotspot>

	</scene>	    

	
	<scene name="scene_keller" title="keller" onstart="" thumburl="keller.tiles/thumb.jpg">

		<view hlookat="331" vlookat="7" fovtype="MFOV" fov="108" fovmin="60" fovmax="120" />

		<preview url="keller.tiles/preview.jpg" />

		<!-- NOTE - to keep the download package small - all devices (desktop,mobile,tablet) are using the same small mobile images in this example -->
		<image>
			<left  url="keller.tiles/mobile_l.jpg" />
			<front url="keller.tiles/mobile_f.jpg" />
			<right url="keller.tiles/mobile_r.jpg" />
			<back  url="keller.tiles/mobile_b.jpg" />
			<up    url="keller.tiles/mobile_u.jpg" />
			<down  url="keller.tiles/mobile_d.jpg" />
			<mobile>
				<left  url="keller.tiles/mobile_l.jpg" />
				<front url="keller.tiles/mobile_f.jpg" />
				<right url="keller.tiles/mobile_r.jpg" />
				<back  url="keller.tiles/mobile_b.jpg" />
				<up    url="keller.tiles/mobile_u.jpg" />
				<down  url="keller.tiles/mobile_d.jpg" />
			</mobile>
			<tablet>
				<left  url="keller.tiles/mobile_l.jpg" />
				<front url="keller.tiles/mobile_f.jpg" />
				<right url="keller.tiles/mobile_r.jpg" />
				<back  url="keller.tiles/mobile_b.jpg" />
				<up    url="keller.tiles/mobile_u.jpg" />
				<down  url="keller.tiles/mobile_d.jpg" />
			</tablet>
		</image>

		<hotspot name="hs1" 
		         style="hotspot_ani_white"
		         ath="192.3" 
		         atv="-4.9"
		         onhover="showtext('Vorraum Verkostungsraum',hotspottextstyle);"
		         onclick="looktohotspot(get(name),42);
		                  loadscene(scene_vorraum, null, MERGE, BLEND(2));
		                  lookat(128, 10, 58);
			              wait(LOAD);
			              oninterrupt(break);
			              wait(BLEND);
			              lookto(54, 8, 97, smooth(45,45,60));
		                 "
		         />

		<hotspot name="hs2"
		         style="hotspot_ani_white"
		         ath="6.6"
		         atv="4.5"
		         onhover="showtext('Keller Stahlfässer',hotspottextstyle);"
		         onclick="set(view.maxpixelzoom,null);
		                  set(view.fovmin,20);
		                  looktohotspot(get(name),20);
		                  loadscene(scene_skeller, null, MERGE, BLEND(2));
		                  lookat(1.08, 3.82, 50);
			              wait(LOAD);
			              oninterrupt(break);
			              wait(BLEND);
			              lookto(62, 0, 99, smooth(45,45,60));
		                 "
		         />

	</scene>


	<scene name="scene_skeller" title="skeller" onstart="" thumburl="skeller.tiles/thumb.jpg">

		<view hlookat="62" vlookat="0" fovtype="MFOV" fov="99" fovmin="60" fovmax="120" />

		<preview url="skeller.tiles/preview.jpg" />

		<!-- NOTE - to keep the download package small - all devices (desktop,mobile,tablet) are using the same small mobile images in this example -->
		<image>
			<left  url="skeller.tiles/mobile_l.jpg" />
			<front url="skeller.tiles/mobile_f.jpg" />
			<right url="skeller.tiles/mobile_r.jpg" />
			<back  url="skeller.tiles/mobile_b.jpg" />
			<up    url="skeller.tiles/mobile_u.jpg" />
			<down  url="skeller.tiles/mobile_d.jpg" />
			<mobile>
				<left  url="skeller.tiles/mobile_l.jpg" />
				<front url="skeller.tiles/mobile_f.jpg" />
				<right url="skeller.tiles/mobile_r.jpg" />
				<back  url="skeller.tiles/mobile_b.jpg" />
				<up    url="skeller.tiles/mobile_u.jpg" />
				<down  url="skeller.tiles/mobile_d.jpg" />
			</mobile>
			<tablet>
				<left  url="skeller.tiles/mobile_l.jpg" />
				<front url="skeller.tiles/mobile_f.jpg" />
				<right url="skeller.tiles/mobile_r.jpg" />
				<back  url="skeller.tiles/mobile_b.jpg" />
				<up    url="skeller.tiles/mobile_u.jpg" />
				<down  url="skeller.tiles/mobile_d.jpg" />
			</tablet>
		</image>
		
		<hotspot name="hs1"
		         style="hotspot_ani_white"
		         ath="189.0"
		         atv="-4.2"
		         onhover="showtext('Keller Barriquefässer',hotspottextstyle);"
		         onclick="set(view.maxpixelzoom,null);
		                  set(view.fovmin,1);
		                  looktohotspot(get(name),10.88);
		                  loadscene(scene_keller, null, MERGE, BLEND(2));
		                  lookat(195.89, -1.89, 51.32);
			              wait(LOAD);
			              oninterrupt(break);
			              wait(BLEND);
			              lookto(331, 7, 108, smooth(45,45,60));
		                 "
		         />
	
	</scene>







	<!-- actions -->

	       
	<!-- calc the max. flyout size of a hotspot for the current screen size -->
	<action name="calc_flyout_size">
		div(screen_sideaspect, stagewidth, stageheight);
		div(hotspot_sideaspect, hotspot[%1].width, hotspot[%1].height);
		
		if(screen_sideaspect LT hotspot_sideaspect,
			<!-- align at screen width -->
			div(hotspot[%1].width,stagewidth,stageheight);
			mul(hotspot[%1].width,80);
			txtadd(hotspot[%1].width,'%');
			set(hotspot[%1].height,prop);
		  ,
		  <!-- align at screen height -->
			set(hotspot[%1].width,prop);
			set(hotspot[%1].height,80%);
		  );
	</action>

	<!-- fly in a hotspot = show hotspot fixed at screen -->
	<action name="flyin">
		if(hotspot[%1].flying == 0.0, hotspot[%1].resetsize(); calc_flyout_size(%1); );
		if(hotspot[%1].oldscale === null, copy(hotspot[%1].oldscale, hotspot[%1].scale) );
		if(hotspot[%1].oldrx === null, copy(hotspot[%1].oldrx, hotspot[%1].rx) );
		if(hotspot[%1].oldry === null, copy(hotspot[%1].oldry, hotspot[%1].ry) );
		if(hotspot[%1].oldrz === null, copy(hotspot[%1].oldrz, hotspot[%1].rz) );
		set(hotspot[%1].enabled,true);
		set(hotspot[%1].visible,true);
		tween(hotspot[%1].alpha,  1.0);
		tween(hotspot[%1].flying, 1.0);
		tween(hotspot[%1].scale,  1.0);
		tween(hotspot[%1].rx, 0.0);
		tween(hotspot[%1].ry, 0.0);
		tween(hotspot[%1].rz, 0.0);
	</action>

	<!-- fly the hotspot out/back -->
	<action name="flyout">
		set(hotspot[%1].enabled,false);
		tween(hotspot[%1].alpha,  0.0, 0.5, default, set(hotspot[%1].visible,false); );
		tween(hotspot[%1].flying, 0.0);
		tween(hotspot[%1].scale,  get(hotspot[%1].oldscale));
		tween(hotspot[%1].rx,  get(hotspot[%1].oldrx));
		tween(hotspot[%1].ry,  get(hotspot[%1].oldry));
		tween(hotspot[%1].rz,  get(hotspot[%1].oldrz));
	</action>	       
	       
	<action name="showpic">
		<!-- creates a new hotspot and fly it out -->
		if(hotspot[get(pic)] === null,
			txtadd(picfilename,'%CURRENTXML%/graphics/pic_',get(pic),'.jpg');
			addhotspot(get(pic));
			getcenter(hsath,hsatv);
			copy(hotspot[get(pic)].ath, hsath);
			copy(hotspot[get(pic)].atv, hsatv);
			set(hotspot[get(pic)].visible,false);
			set(hotspot[get(pic)].distorted,true);
			set(hotspot[get(pic)].zorder,2);
			set(hotspot[get(pic)].scale,0.1);
			set(hotspot[get(pic)].alpha,0.0);
			<!--set(hotspot[get(pic)].effect,glow(0xFFFFFF,1.0,30,10000);dropshadow(10,45,0x000000,10,0.3););-->
			set(hotspot[get(pic)].onloaded, flyin(get(name)) );
			set(hotspot[get(pic)].onclick, flyout(get(name)) );
			copy(hotspot[get(pic)].url,picfilename); 
		,
			flyin(get(pic));
		);
	</action>
	



	<!-- thumbnail actions begin (remove the 'buildthumbs()' call in the onstart event to remove the thumbs) -->
	<action name="buildthumbs">
		if(%1 != NEXT, set(i,0));
		if(i LT scene.count,
			copy(thumb, scene[get(i)].thumburl);
			txtadd(thumbname,'thumb_',get(i));
			addplugin(get(thumbname));
			set(plugin[get(thumbname)].url, get(thumb));
			set(plugin[get(thumbname)].keep, true);
			set(plugin[get(thumbname)].align, leftbottom);
			set(plugin[get(thumbname)].width,  40);
			set(plugin[get(thumbname)].height, 40);
			set(plugin[get(thumbname)].x, 10);
			set(plugin[get(thumbname)].y, 10);
			mul(plugin[get(thumbname)].x, i,3);
			mul(plugin[get(thumbname)].y, i,3);
			add(plugin[get(thumbname)].x, 5);
			add(plugin[get(thumbname)].y, 5);
			copy(plugin[get(thumbname)].xsmall, plugin[get(thumbname)].x);
			copy(plugin[get(thumbname)].ysmall, plugin[get(thumbname)].y);
			add(plugin[get(thumbname)].zorder, 100, i);
			set(plugin[get(thumbname)].effect,glow(0xFFFFFF,1.0,2,10000));
			set(plugin[get(thumbname)].jsborder,'1px solid #FFFFFF');
			copy(plugin[get(thumbname)].thumbpos, i);
			set(plugin[get(thumbname)].linkedscene, get(scene[get(i)].name) );
			set(plugin[get(thumbname)].onclick, openthumbs() );
			inc(i);
			buildthumbs(NEXT);
		  );
	</action>

	<action name="openthumb">
		if(%2 != NEXT,
			set(pos,0);
			copy(curpos, plugin[%1].thumbpos);
			set(xdst, 0);
			set(ydst, 0);
		  );

		if(pos LT curpos,
			inc(pos);
			inc(ydst,90);
			sub(ymax, stageheight, 100);
			if(ydst GT ymax, inc(xdst,90);set(ydst,0); );
			openthumb(%1,NEXT);
		  ,
			add(xdst,10);
			add(ydst,10);
			tween(plugin[%1].x, get(xdst) );
			tween(plugin[%1].y, get(ydst) );
			tween(plugin[%1].width, 80);
			tween(plugin[%1].height, 80);
		  );
	</action>

	<action name="closethumb">
		tween(plugin[%1].x, get(plugin[%1].xsmall));
		tween(plugin[%1].y, get(plugin[%1].ysmall));
		tween(plugin[%1].width, 40);
		tween(plugin[%1].height, 40);
	</action>

	<action name="openthumbs">
		if(%1 != NEXT,
			set(i,0);
			set(events.onclick, set(events.onclick,null); delayedcall(0.1, closethumbs() ); );
		  );

		if(i LT scene.count,
			txtadd(thumbname,'thumb_',get(i));
			openthumb(get(thumbname));
			set(plugin[get(thumbname)].onclick, set(events.onclick,null); closethumbs(); loadscene(get(linkedscene),null,MERGE,BLEND(1)); );
			inc(i);
			openthumbs(NEXT);
		  );
	</action>

	<action name="closethumbs">
		if(%1 != NEXT, set(i,0));
		if(i LT scene.count,
			txtadd(thumbname,'thumb_',get(i));
			closethumb(get(thumbname));
			set(plugin[get(thumbname)].onclick, openthumbs() );
			inc(i);
			closethumbs(NEXT);
		  );
	</action>
	<!-- thumbnail actions end -->


</krpano>
