HOME

5h-3LL 1.0
DIR: /srv/http/adent.cz/horkynj.cz/app/webroot/virtual-prohlidka/xml/viewer/skin
/srv/http/adent.cz/horkynj.cz/app/webroot/virtual-prohlidka/xml/viewer/skin/
Current File : /srv/http/adent.cz/horkynj.cz/app/webroot/virtual-prohlidka/xml/viewer/skin/videointerface.xml
<krpano>

	<!-- krpano 1.20.11 - Video-Interface Skin -->


	<!-- skin settings -->
	<skin_settings layout_width="100%"
	               layout_maxwidth="814"
	               controlbar_width="-24"
	               controlbar_height="40"
	               controlbar_offset="20"
	               design_skin_images="vtourskin.png"
	               design_bgcolor="0x2D3E50"
	               design_bgalpha="0.8"
	               design_bgborder="0"
	               design_bgroundedge="1"
	               design_bgshadow="0 4 10 0x000000 0.3"
	               design_thumbborder_bgborder="3 0xFFFFFF 1.0"
	               design_thumbborder_padding="2"
	               design_thumbborder_bgroundedge="0"
	               design_text_css="color:#FFFFFF; font-family:Arial;"
	               design_text_shadow="1"
	               />


	<!-- save the url path of this xml file (the url value will be adjusted during xml parsing) -->
	<videointerfacexmlpath url="./" />


	<!-- mouse / touch / keyboard(button) control settings - http://krpano.com/docu/xml/#control -->
	<control mouse="drag"
	         touch="drag"
	         zoomtocursor="false"
	         zoomoutcursor="false"
	         draginertia="0.1"
	         dragfriction="0.9"
	         movetoaccelerate="1.0"
	         movetospeed="10.0"
	         movetofriction="0.8"
	         keybaccelerate="0.09"
	         keybfriction="0.94"
	         keybfovchange="0.25"
	         mousefovchange="1.0"
	         fovspeed="3.0"
	         fovfriction="0.9"
	         bouncinglimits="true"
	         />

	<!-- mouse cursors - http://krpano.com/docu/xml/#cursors -->
	<cursors standard="default"
	         dragging="move"
	         moving="move"
	         />


	<!-- ensure stagescale 2x for mobile devices (regardless if mobilescale is 0.5 or 1.0) -->
	<krpano stagescale="calc:stagescale * 2" if="stagescale LT 1.0" devices="mobile" />


	<!-- include VR support - http://krpano.com/plugins/webvr/ -->
	<include url="%VIEWER%/plugins/webvr.xml" devices="html5" />

	<!-- overwrite some settings from the webvr.xml for the skin integration -->
	<plugin name="WebVR" keep="true" devices="html5"
	        mobilevr_support="true"
	        mobilevr_fake_support="true"
	        onavailable="removelayer(webvr_enterbutton); set(layer[skin_btn_vr].enabled,true); tween(layer[skin_btn_vr].alpha, 1.0); webvr_onavailable();"
	        onentervr="webvr_onentervr(); webvr_setup();"
	        vr_cursor=""
	        />

	<!-- webvr button style (adjust to match skin style) -->
	<style name="webvr_button_style"
	       border="false"
	       roundedge="calc:1.0"
	       backgroundcolor="get:skin_settings.design_bgcolor" backgroundalpha="get:skin_settings.design_bgalpha"
	       shadow="0.01" shadowrange="10.0" shadowangle="90.0" shadowcolor="0x30261B" shadowalpha="0.50"
	       css="calc:skin_settings.design_text_css + ' color:#FFFFFF;font-size:' + 20*webvr_setup_scale*webvr_button_scale + 'px;'"
	       />

	<!-- show a 'rotate the device' info when the mobile device is in portrait orientation in VR mode -->
	<layer name="webvr_rotate_to_landscape_request" keep="true" vr="true" devices="mobile"
	       url="rotate_device.png" scale="0.5"
	       align="top" edge="center" y="28%"
	       autoalpha="true" alpha="0.0"
	       enabled="false"
	       />

	<events name="webvr_events" keep="true" devices="html5"
	        onresize.mobile="webvr_act_as_gyro_in_portrait_mode();"
	        onviewchange=""
	        />

	<action name="webvr_setup">
		if(webvr.isenabled,
			webvr_act_as_gyro_in_portrait_mode(true);
		  ,
			tween(layer[webvr_rotate_to_landscape_request].alpha, 0.0, 0.0);
			set(events[webvr_events].onviewchange, null);
		  );
	</action>

	<action name="webvr_act_as_gyro_in_portrait_mode">
		if(device.mobile AND webvr.isenabled,
			div(aspect, stagewidth, stageheight);
			if(aspect != lastaspect OR '%1' == 'true',
				copy(lastaspect, aspect);
				if(stagewidth GT stageheight,
					<!-- landscape orientation - use stereo rendering and a direct/fast gyro sensor mode -->
					set(display.stereo, true);
					set(webvr.mobilevr_sensor_mode, 3);
					webvr.update();
					tween(layer[webvr_rotate_to_landscape_request].alpha, 0.0, 0.0);
				  ,
					<!-- portrait orientation - use normal rendering and a smoother/slower gyro sensor mode -->
					set(display.stereo, false);
					set(webvr.mobilevr_sensor_mode, 1);
					webvr.update();
					tween(layer[webvr_rotate_to_landscape_request].alpha, 1.0);
					delayedcall(3.0, tween(layer[webvr_rotate_to_landscape_request].alpha, 0.0, 1.0); );
				  );
			  );
		  ,
			set(lastaspect, 0);
		  );
	</action>


	<!-- gyro plugin -->
	<plugin name="skin_gyro" keep="true" url="%VIEWER%/plugins/gyro2.js" devices="html5.and.touch" enabled="true" onavailable="skin_have_gyro_support();" onenable="skin_gyro_enabled();" ondisable="skin_gyro_disabled();" />


	<!-- skin styles -->

	<!-- skin_base - the base skin image -->
	<style name="skin_base" url="calc:videointerfacexmlpath.url + skin_settings.design_skin_images" />


	<!-- skin_glow - button glowing (if additional ondown,onup,onout,over events are needed, this style provides ondown2,onup2,onover2,onout2 events) -->
	<style name="skin_glow"
	       ondown="copy(skin_lockglow,name); skin_buttonglow(get(name)); stopdelayedcall(skin_autohide); if(ondown2, ondown2() );"
	       onover="if(skin_lockglow === null, copy(skin_lockglow,name); skin_buttonglow(get(name),0.3) ); if(onover2, onover2() );"
	       onout="if(skin_lockglow === name AND !pressed, skin_buttonglow(null);delete(skin_lockglow); ); if(onout2, onout2() );"
	       onup="if(onup2, onup2()); delayedcall(0, if(hovering AND enabled, skin_buttonglow(get(name),0.3); , skin_buttonglow(null);delete(skin_lockglow); ); );"
	       />

	<action name="skin_buttonglow">
		if('%1' !== 'null',
			set(strength,0.7);
			if(%2 != null, set(strength,%2));
			set(layer[skin_buttonglow].parent, %1);
			set(layer[skin_buttonglow].visible, true);
			tween(layer[skin_buttonglow].alpha, get(strength), 0.07);
		  ,
			tween(layer[skin_buttonglow].alpha, 0.0, 0.1, default,
				set(layer[skin_buttonglow].parent, null);
				set(layer[skin_buttonglow].visible, false);
			  );
		  );
	</action>


	<!-- skin events -->
	<events name="skin_events" keep="true"
	        onclick="skin_video_click_event();"
	        onmousedown="skin_video_down_event();"
	        onenterfullscreen.fullscreensupport="set(layer[skin_btn_fullscreen].crop, '64|576|64|64');"
	        onexitfullscreen.fullscreensupport="set(layer[skin_btn_fullscreen].crop, '0|576|64|64');"
	        />


	<!-- skin layout -->

	<style name="skintext" type="text" background="false" border="false" css="calc:skin_settings.design_text_css + ' text-align:left; font-style:italic; font-size:12px;'" textshadow="get:skin_settings.design_text_shadow" />
	<style name="skintext_sel" css="calc:skin_settings.design_text_css + ' text-align:left; font-style:italic; font-size:12px; text-decoration:underline;'" />
	<style name="settingsitem" type="container" align="lefttop" x="0" y="8" width="100%" height="20" bgcolor="0xFFFFFF" bgalpha="0.0" bgcapture="true" onover="set(bgalpha,0.25);" onout="set(bgalpha,0.0);" ondown.touch="onover();" onup.touch="onout();" children="false" />


	<layer name="skin_layer" keep="true" type="container" align="top" width="get:skin_settings.layout_width" maxwidth="get:skin_settings.layout_maxwidth" height="100%" maskchildren="true" xvisible="false" bgcapture="false" zorder="1">

		<layer name="skin_control_bar" state="visible" type="container" autoalpha="true" align="bottom" width="get:skin_settings.controlbar_width" height="calc:skin_settings.controlbar_height" x="0" y="get:skin_settings.controlbar_offset" zorder="3" bgcolor="get:skin_settings.design_bgcolor" bgalpha="get:skin_settings.design_bgalpha" bgborder="get:skin_settings.design_bgborder" bgroundedge="get:skin_settings.design_bgroundedge" bgshadow="get:skin_settings.design_bgshadow" onover="stopdelayedcall(skin_autohide);">

			<!-- left buttons - play/pause, volume -->
			<layer name="skin_btn_playpause" style="skin_base|skin_glow" crop="0|640|64|64" align="left" x="5" y="0" scale="0.5" onclick="plugin[video].togglepause();" />

			<layer name="skin_btn_volume" visible.no-desktop="false" style="skin_glow" type="container" width="32" height="32" align="left" x="40" y="0" bgcapture="true" children="false" onover2="stopdelayedcall(skin_autohide);stopdelayedcall(autoclose_volumectrl); skin_open_volumectrl();" onout2="if(layer[skin_volumectrl].pressed == false, delayedcall(autoclose_volumectrl, 0.5, skin_close_volumectrl()); );" onclick="if(layer[skin_volumectrl].alpha == 1.0, if(plugin[video].volume GT 0.0, set(plugin[video].volume,0.0), set(plugin[video].volume,1.0)); skin_volumectrl_update(); );">
				<layer name="skin_btn_volume_icon" style="skin_base" crop="64|704|64|64" scale="0.5" align="lefttop" />
			</layer>

			<!-- seek bar -->
			<layer name="skin_video_seekbar_container" type="container" align="left" x.desktop="90" x.no-desktop="50" width.desktop.and.fullscreensupport="-228" width.desktop.and.no-fullscreensupport="-188" width.no-desktop.and.fullscreensupport="-188" width.no-desktop.and.no-fullscreensupport="-148" height="100%" bgcapture="true" ondown="stopdelayedcall(skin_autohide);skin_video_ondownseeking();">
				<layer name="skin_video_seekbar" type="container" bgcolor="0xFFFFFF" bgalpha="0.25" align="center" width="100%" height="4">
					<layer name="skin_video_loadbar" type="container" bgcolor="0xFFFFFF" bgalpha="0.5" align="left" width="0" height="4" />
					<layer name="skin_video_seekpos" type="container" bgcolor="0xFFFFFF" bgalpha="1.0" align="left" edge="center" x="0" bgroundedge="8" width="10" height="10" />
				</layer>
			</layer>

			<!-- right buttons - vr, settings, fullscreen -->
			<layer name="skin_btn_vr" style="skin_base|skin_glow" crop="0|0|80|64" align="right" x.fullscreensupport="80" x.no-fullscreensupport="43" y="0" scale="0.5" onclick="webvr.enterVR();" enabled="false" alpha="0.25" />

			<layer name="skin_btn_settings" style="skin_base|skin_glow" crop="0|704|64|64" align="right" edge="center" x.fullscreensupport="57" x.no-fullscreensupport="20" y="0" scale="0.5" onclick="if(skin_settings_opened !== true, skin_open_settings(), skin_close_settings() );" />

			<layer name="skin_btn_fullscreen" style="skin_base|skin_glow" crop="0|576|64|64" align="right" x="5" y="0" scale="0.5" onclick="switch(fullscreen);" devices="fullscreensupport" />

			<!-- title, video time -->
			<layer name="skin_title" style="skintext" align="lefttop" edge="leftbottom" x="4" capture="false" handcursor="false" html="" />
			<layer name="skin_video_time" style="skintext" align="righttop" edge="rightbottom" x="4" enabled="false" html="" />

			<!-- settings menu -->
			<layer name="skin_settings_menu" type="container" align="righttop" edge="rightbottom" width="190" height.no-flash.and.no-chromemobile="110" height.flash.or.chromemobile="86" autoalpha="true" alpha="0.0" y="-24" bgcapture="true" handcursor="false" bgcolor="get:skin_settings.design_bgcolor" bgalpha="get:skin_settings.design_bgalpha" bgborder="get:skin_settings.design_bgborder" bgroundedge="get:skin_settings.design_bgroundedge" bgshadow="get:skin_settings.design_bgshadow">
				<layer name="skin_gyro_container" style="settingsitem" x="0" y="8" alpha="0.5" enabled="false" onclick="switch(plugin[skin_gyro].enabled);">
					<layer name="skin_gyro_txt" style="skintext" align="left" x="10" html="Gyro Control" />
					<layer name="skin_gyro_not" style="skintext" align="right" x="10" html="Not available" visible="true" />
					<layer name="skin_gyro_ctrl" type="container" align="right" x="10" width="24" height="12" bgborder="1 0xFFFFFF 1" bgroundedge="8" visible="false" alpha="0.5">
						<layer name="skin_gyro_ctrl_i" type="container" align="left" x="-1" width="14" height="14" bgcolor="0xFFFFFF" bgalpha="1" bgroundedge="8" />
					</layer>
				</layer>
				<layer name="skin_rate_container" style="settingsitem" x="0" y="32" onclick="tween(layer[skin_settings_menu].alpha,0.0,0.2);tween(layer[skin_settings_rate].alpha,1.0,0.2);" devices="no-flash.and.no-chromemobile">
					<layer name="skin_rate_txt" style="skintext" align="left" x="8" html="Playback Rate" />
					<layer name="skin_rate_val" style="skintext" align="right" x="10" html="1.0x" />
				</layer>
				<layer name="skin_view_container" style="settingsitem" x="0" y.no-flash.and.no-chromemobile="56" y.flash.or.chromemobile="32" onclick="tween(layer[skin_settings_menu].alpha,0.0,0.2);tween(layer[skin_settings_view].alpha,1.0,0.2);">
					<layer name="skin_view_txt" style="skintext" align="left" x="8" html="View Projection" />
					<layer name="skin_view_val" style="skintext" align="right" x="10" html="Normal" />
				</layer>
				<layer name="skin_quality_container" style="settingsitem" x="0" y.no-flash.and.no-chromemobile="80" y.flash.or.chromemobile="56" onclick="tween(layer[skin_settings_menu].alpha,0.0,0.2);tween(layer[skin_settings_quality].alpha,1.0,0.2);">
					<layer name="skin_quality_txt" style="skintext" align="left" x="8" html="Quality" />
					<layer name="skin_quality" style="skintext" align="right" x="10" html="" />
				</layer>
			</layer>

			<!-- playback-rate sub-menu -->
			<layer name="skin_settings_rate" type="container" align="righttop" edge="rightbottom" width="108" height="calc:20+24*6+6" autoalpha="true" alpha="0.0" y="-24" bgcapture="true" handcursor="false" bgcolor="get:skin_settings.design_bgcolor" bgalpha="get:skin_settings.design_bgalpha" bgborder="get:skin_settings.design_bgborder" bgroundedge="get:skin_settings.design_bgroundedge" bgshadow="get:skin_settings.design_bgshadow">
				<layer name="skin_settings_r0" style="settingsitem" y="8" onclick="tween(layer[skin_settings_rate].alpha,0.0,0.2);tween(layer[skin_settings_menu].alpha,1.0,0.2);"><layer name="skin_settings_r0t" x="-1" style="skintext" align="center" html="Playback Rate" /></layer>
				<layer name="skin_settings_rs" type="container" align="lefttop" y="36" width="100%" height="1" bgcolor="0xFFFFFF" bgalpha="0.5" />
				<layer name="skin_settings_r1" style="settingsitem" y="calc:20+24*1" onclick="skin_setplaybackrate(0.25);"><layer name="skin_settings_r1t" style="skintext" align="center" html="0.25x" /></layer>
				<layer name="skin_settings_r2" style="settingsitem" y="calc:20+24*2" onclick="skin_setplaybackrate(0.5);"><layer name="skin_settings_r2t" style="skintext" align="center" html="0.5x" /></layer>
				<layer name="skin_settings_r3" style="settingsitem" y="calc:20+24*3" onclick="skin_setplaybackrate(1.0);"><layer name="skin_settings_r3t" style="skintext|skintext_sel" align="center" html="1.0x" /></layer>
				<layer name="skin_settings_r4" style="settingsitem" y="calc:20+24*4" onclick="skin_setplaybackrate(1.5);"><layer name="skin_settings_r4t" style="skintext" align="center" html="1.5x" /></layer>
				<layer name="skin_settings_r5" style="settingsitem" y="calc:20+24*5" onclick="skin_setplaybackrate(2.0);"><layer name="skin_settings_r5t" style="skintext" align="center" html="2.0x" /></layer>
			</layer>

			<!-- view projection sub-menu -->
			<layer name="skin_settings_view" type="container" align="righttop" edge="rightbottom" width="108" height="calc:20+24*8+6" autoalpha="true" alpha="0.0" y="-24" bgcapture="true" handcursor="false" bgcolor="get:skin_settings.design_bgcolor" bgalpha="get:skin_settings.design_bgalpha" bgborder="get:skin_settings.design_bgborder" bgroundedge="get:skin_settings.design_bgroundedge" bgshadow="get:skin_settings.design_bgshadow">
				<layer name="skin_settings_v0" style="settingsitem" y="8" onclick="tween(layer[skin_settings_view].alpha,0.0,0.2);tween(layer[skin_settings_menu].alpha,1.0,0.2);"><layer name="skin_settings_v0t" x="-1" style="skintext" align="center" html="View Projection" /></layer>
				<layer name="skin_settings_vs" type="container" align="lefttop" y="36" width="100%" height="1" bgcolor="0xFFFFFF" bgalpha="0.5" />
				<layer name="skin_settings_v1" style="settingsitem" y="calc:20+24*1" onclick="skin_view_flat();"><layer name="skin_settings_v1t" style="skintext" align="center" html="Flat" /></layer>
				<layer name="skin_settings_v2" style="settingsitem" y="calc:20+24*2" onclick="skin_view_normal();"><layer name="skin_settings_v2t" style="skintext|skintext_sel" align="center" html="Normal" /></layer>
				<layer name="skin_settings_v3" style="settingsitem" y="calc:20+24*3" onclick="skin_view_fisheye();"><layer name="skin_settings_v3t" style="skintext" align="center" html="Fisheye" /></layer>
				<layer name="skin_settings_v4" style="settingsitem" y="calc:20+24*4" onclick="skin_view_stereographic();"><layer name="skin_settings_v4t" style="skintext" align="center" html="Stereographic" /></layer>
				<layer name="skin_settings_v5" style="settingsitem" y="calc:20+24*5" onclick="skin_view_architectural();"><layer name="skin_settings_v5t" style="skintext" align="center" html="Architectural" /></layer>
				<layer name="skin_settings_v6" style="settingsitem" y="calc:20+24*6" onclick="skin_view_pannini();"><layer name="skin_settings_v6t" style="skintext" align="center" html="Pannini" /></layer>
				<layer name="skin_settings_v7" style="settingsitem" y="calc:20+24*7" onclick="skin_view_littleplanet();"><layer name="skin_settings_v7t" style="skintext" align="center" html="Little Planet" /></layer>
			</layer>

			<!-- video-quality sub-menu -->
			<layer name="skin_settings_quality" type="container" align="righttop" edge="rightbottom" width="108" height="calc:8+24+8" autoalpha="true" alpha="0.0" y="-24" bgcapture="true" handcursor="false" bgcolor="get:skin_settings.design_bgcolor" bgalpha="get:skin_settings.design_bgalpha" bgborder="get:skin_settings.design_bgborder" bgroundedge="get:skin_settings.design_bgroundedge" bgshadow="get:skin_settings.design_bgshadow">
				<layer name="skin_settings_q0" style="settingsitem" y="8" onclick="tween(layer[skin_settings_quality].alpha,0.0,0.2);tween(layer[skin_settings_menu].alpha,1.0,0.2);"><layer name="skin_settings_q0t" x="-1" style="skintext" align="center" html="Quality" /></layer>
				<layer name="skin_settings_qs" type="container" align="lefttop" y="36" width="100%" height="1" bgcolor="0xFFFFFF" bgalpha="0.5" />
			</layer>

			<!-- sound volume control -->
			<layer name="skin_volumectrl" type="container" align="lefttop" edge="leftbottom" width="32" height="110" x="40" y="-24" autoalpha="true" alpha="0.0" bgcolor="get:skin_settings.design_bgcolor" bgalpha="get:skin_settings.design_bgalpha" bgborder="get:skin_settings.design_bgborder" bgroundedge="get:skin_settings.design_bgroundedge" bgshadow="get:skin_settings.design_bgshadow" bgcapture="true" onover="stopdelayedcall(autoclose_volumectrl);" onout="if(pressed == false, delayedcall(autoclose_volumectrl, 0.5, skin_close_volumectrl()); );" ondown="stopdelayedcall(autoclose_volumectrl); skin_volumectrl_ondownchanging();" onup="onout();">
				<layer name="skin_volumectrl_bar_container" type="container" align="lefttop" width="100%" height="100%">
					<layer name="skin_volumectrl_bar" type="container" bgcolor="0xFFFFFF" bgalpha="0.25" align="center" width="4" height="-32">
						<layer name="skin_volumectrl_pos" type="container" bgcolor="0xFFFFFF" bgalpha="1.0" align="top" edge="center" x="0" bgroundedge="8" width="10" height="10" />
					</layer>
				</layer>
			</layer>

		</layer>

		<!-- glow effect layer -->
		<layer name="skin_buttonglow" style="skin_base" crop="64|384|64|64" align="center" x="0" y="1" scale="1.0" alpha="0.0" visible="false" enabled="false" />

		<!-- centered play/pause button -->
		<layer name="skin_video_playpause" keep="true" style="skin_base|skin_glow" crop="0|640|64|64" scale="0.75" align="center" alpha="0.0" autoalpha="true" state="hidden" onclick="skin_video_playpause_click();" />

		<!-- error window -->
		<layer name="skin_error" visible="false" zorder="99" type="container" align="center" width="100" height="100" bgcapture="true" onclick="set(visible,false);" bgcolor="get:skin_settings.design_bgcolor" bgalpha="get:skin_settings.design_bgalpha" bgborder="get:skin_settings.design_bgborder" bgroundedge="get:skin_settings.design_bgroundedge" bgshadow="get:skin_settings.design_bgshadow">
			<layer name="skin_error_msg" style="skintext" align="center" html="" enabled="false" padding="8 16" onautosized="copy(layer[skin_error].width, width); copy(layer[skin_error].height, height)" />
		</layer>

	</layer>


	<action name="skin_video_setup">
		if(skin_video_setup_done !== true,
			set(skin_video_setup_done, true);

			<!-- use the video events for getting state updates -->
			set(plugin[video].onvideoready, skin_video_updatestate() );
			set(plugin[video].onvideoplay, skin_video_updatestate(); if(skin_settings_opened !== true, skin_autohide(2.0)); );
			set(plugin[video].onvideopaused, skin_video_updatestate(); skin_show_playpause(); );
			set(plugin[video].onvideocomplete, skin_video_updatestate(); skin_show_playpause(); skin_show(); );
			set(plugin[video].onerror, skin_video_error() );

			<!-- when paused onstart, show the play button -->
			if(plugin[video].pausedonstart,
				set(layer[skin_video_playpause].state, 'visible');
				set(layer[skin_video_playpause].enabled, true);
				tween(layer[skin_video_playpause].alpha, 1.0);
			  );

			<!-- use the current scene title -->
			copy(layer[skin_title].html, scene[get(xml.scene)].title);

			<!-- start the video-time update interval -->
			setinterval(skin_video_seek_updates, 0.5, skin_video_updatetime() );
		  );
	</action>


	<action name="skin_video_updatetime">
		copy(t1, plugin[video].time);
		copy(t2, plugin[video].totaltime);
		if(%1 !== null, calc(t1, %1 * t2); );
		div(t1_min, t1, 60);
		mod(t1_sec, t1, 60);
		Math.floor(t1_min);
		Math.floor(t1_sec);
		div(t2_min, t2, 60);
		mod(t2_sec, t2, 60);
		Math.floor(t2_min);
		Math.floor(t2_sec);
		calc(layer[skin_video_time].html, t1_min + ':' + (t1_sec LT 10 ? '0' : '') + t1_sec + ' / ' + t2_min + ':' + (t2_sec LT 10 ? '0' : '') + t2_sec);
		calc(layer[skin_video_seekpos].x, (t1 / t2 * 100) + '%');
		calc(layer[skin_video_loadbar].width, (plugin[video].loadedbytes / plugin[video].totalbytes * 100) + '%');
	</action>


	<action name="skin_video_ondownseeking">
		asyncloop(pressed,
			screentolayer(skin_video_seekbar, mouse.stagex,mouse.stagey, lx,ly);
			calc(seekpos, lx / layer[skin_video_seekbar].pixelwidth);
			clamp(seekpos, 0.0, 1.0);
			skin_video_updatetime(seekpos);
		  ,
			plugin[video].seek(calc((seekpos * 100) + '%'));
		  );
	</action>


	<action name="skin_video_updatestate">
		calc(layer[skin_video_playpause].crop, plugin[video].ispaused ? '0|640|64|64' : '64|640|64|64');
		copy(layer[skin_btn_playpause].crop, layer[skin_video_playpause].crop);
	</action>


	<action name="skin_video_error">
		calc(layer[skin_error_msg].html, 'Error: ' + videoerror);
		set(layer[skin_error].visible, true);
	</action>


	<action name="skin_video_click_event">
		delayedcall(skin_click_detection, 0.25,
			if(layer[skin_control_bar].state == 'hidden',
				stopdelayedcall(skin_autohide_pp);
				skin_show();
				skin_show_playpause();
			  ,
				if(skin_settings_opened === true OR skin_volumectrl_opened == true,
					skin_close_settings();
					skin_close_volumectrl();
				  ,
					stopdelayedcall(skin_autohide_pp);
					if(layer[skin_video_playpause].state == 'hidden',
						skin_show_playpause();
					  ,
						skin_hide_playpause();
						skin_autohide(0.0);
					  );
				  );
			  );
		  );
	</action>


	<action name="skin_autohide">
		delayedcall(skin_autohide, %1,
			set(layer[skin_control_bar].state, 'hidden');
			tween(layer[skin_control_bar].y, calc(-(skin_settings.controlbar_offset + skin_settings.controlbar_height)));
			tween(layer[skin_control_bar].alpha, 0.0);
		  );
	</action>


	<action name="skin_show">
		stopdelayedcall(skin_autohide);
		set(layer[skin_control_bar].state, 'visible');
		tween(layer[skin_control_bar].y, get(skin_settings.controlbar_offset));
		tween(layer[skin_control_bar].alpha, 1.0);
	</action>


	<action name="skin_show_playpause">
		set(layer[skin_video_playpause].state, 'visible');
		tween(layer[skin_video_playpause].alpha, 1.0);
		delayedcall(skin_autohide_pp, 2.0,
			set(layer[skin_video_playpause].state,'hidden');
			tween(layer[skin_video_playpause].alpha, 0.0);
		  );
	</action>


	<action name="skin_hide_playpause">
		set(layer[skin_video_playpause].state, 'hidden');
		tween(layer[skin_video_playpause].alpha, 0.0);
	</action>


	<action name="skin_video_down_event">
		stopdelayedcall(skin_click_detection);
	</action>


	<action name="skin_video_playpause_click">
		if(plugin[video].ispaused,
			plugin[video].play();
			set(layer[skin_video_playpause].state, 'hidden');
			tween(layer[skin_video_playpause].alpha, 0.0);
		  ,
			plugin[video].pause();
			set(layer[skin_video_playpause].state, 'visible');
			tween(layer[skin_video_playpause].alpha, 1.0);
			delayedcall(skin_autohide_pp, 2.0, set(layer[skin_video_playpause].state,'hidden'); tween(layer[skin_video_playpause].alpha, 0.0); );
		  );
	</action>


	<action name="skin_open_settings">
		if(skin_settings_opened !== true,
			set(skin_settings_opened, true);

			tween(layer[skin_btn_settings].rotate, 90);
			tween(layer[skin_settings_menu].alpha, 1.0, 0.2);
		  );
	</action>


	<action name="skin_close_settings">
		if(skin_settings_opened === true,
			set(skin_settings_opened, false);

			tween(layer[skin_btn_settings].rotate, 0);
			tween(layer[skin_settings_menu].alpha, 0.0, 0.2);

			tween(layer[skin_settings_rate].alpha, 0.0, 0.2);
			tween(layer[skin_settings_view].alpha, 0.0, 0.2);
			tween(layer[skin_settings_quality].alpha, 0.0, 0.2);
		  );
	</action>


	<action name="skin_open_volumectrl">
		if(skin_volumectrl_opened !== true,
			set(skin_volumectrl_opened, true);

			tween(layer[skin_volumectrl].alpha, 1.0, 0.2);
		  );
	</action>


	<action name="skin_close_volumectrl">
		if(skin_volumectrl_opened === true,
			set(skin_volumectrl_opened, false);

			tween(layer[skin_volumectrl].alpha, 0.0, 0.2);
		  );
	</action>


	<action name="skin_volumectrl_ondownchanging">
		asyncloop(pressed,
			screentolayer(skin_volumectrl_bar, mouse.stagex,mouse.stagey, lx,ly);
			calc(volumectrl_pos, 1.0 - (ly / layer[skin_volumectrl_bar].pixelheight));
			clamp(volumectrl_pos, 0.0, 1.0);
			copy(plugin[video].volume, volumectrl_pos);
			skin_volumectrl_update();
		  );
	</action>


	<action name="skin_volumectrl_update">
		calc(layer[skin_volumectrl_pos].y, ((1.0 - plugin[video].volume) * 100) + '%');
		calc(layer[skin_btn_volume_icon].crop, plugin[video].volume GT 0.0 ? '64|704|64|64' : '64|704|40|64');
		calc(layer[skin_btn_volume_icon].alpha, plugin[video].volume GT 0.0 ? 1.0 : 0.25);
	</action>


	<action name="skin_have_gyro_support">
		set(layer[skin_gyro_container].enabled, true);
		set(layer[skin_gyro_container].alpha, 1.0);
		set(layer[skin_gyro_not].visible, false);
		set(layer[skin_gyro_ctrl].visible, true);
	</action>


	<action name="skin_gyro_enabled">
		tween(layer[skin_gyro_ctrl_i].x, 11);
		tween(layer[skin_gyro_ctrl].alpha, 1.0);
	</action>


	<action name="skin_gyro_disabled">
		tween(layer[skin_gyro_ctrl_i].x, -1);
		tween(layer[skin_gyro_ctrl].alpha, 0.5);
	</action>


	<!-- context menu - http://krpano.com/docu/xml/#contextmenu -->
	<contextmenu>
		<item name="kr" caption="KRPANO"     />
		<item name="fs" caption="FULLSCREEN" />
		<item name="cc" caption="Change Controlmode" onclick="skin_changecontrolmode();"  separator="true" devices="mouse" />
		<item name="tv" caption="Flat View"          onclick="skin_view_flat();"          separator="true" />
		<item name="nv" caption="Normal View"        onclick="skin_view_normal();"        />
		<item name="fv" caption="Fisheye View"       onclick="skin_view_fisheye();"       />
		<item name="sv" caption="Stereographic View" onclick="skin_view_stereographic();" />
		<item name="av" caption="Architectural View" onclick="skin_view_architectural();" />
		<item name="pv" caption="Pannini View"       onclick="skin_view_pannini();"       />
		<item name="lp" caption="Little Planet View" onclick="skin_view_littleplanet();"  />
	</contextmenu>

	<action name="skin_changecontrolmode">
		switch(control.mode, moveto, drag);
	</action>

	<action name="skin_setplaybackrate">
		set(plugin[video].playbackrate, %1);
		set(layer[skin_rate_val].html, calc('%1' + 'x'));
		layer[skin_settings_r1t].loadstyle(calc('%1' == '0.25' ? 'skintext_sel' : 'skintext'));
		layer[skin_settings_r2t].loadstyle(calc('%1' == '0.5' ? 'skintext_sel' : 'skintext'));
		layer[skin_settings_r3t].loadstyle(calc('%1' == '1.0' ? 'skintext_sel' : 'skintext'));
		layer[skin_settings_r4t].loadstyle(calc('%1' == '1.5' ? 'skintext_sel' : 'skintext'));
		layer[skin_settings_r5t].loadstyle(calc('%1' == '2.0' ? 'skintext_sel' : 'skintext'));
	</action>

	<action name="skin_update_view_menu">
		copy(layer[skin_view_val].html, layer[skin_settings_v%1t].html);
		layer[skin_settings_v1t].loadstyle(calc('%1' == '1' ? 'skintext_sel' : 'skintext'));
		layer[skin_settings_v2t].loadstyle(calc('%1' == '2' ? 'skintext_sel' : 'skintext'));
		layer[skin_settings_v3t].loadstyle(calc('%1' == '3' ? 'skintext_sel' : 'skintext'));
		layer[skin_settings_v4t].loadstyle(calc('%1' == '4' ? 'skintext_sel' : 'skintext'));
		layer[skin_settings_v5t].loadstyle(calc('%1' == '5' ? 'skintext_sel' : 'skintext'));
		layer[skin_settings_v6t].loadstyle(calc('%1' == '6' ? 'skintext_sel' : 'skintext'));
		layer[skin_settings_v7t].loadstyle(calc('%1' == '7' ? 'skintext_sel' : 'skintext'));
	</action>

	<action name="skin_view_flat">
		set(plugin[skin_gyro].enabled, false);
		skin_update_view_menu(1);
		if(videointerface_isflat !== true,
			set(videointerface_isflat, true);
			stoptween(view.fov);
			mod(view.hlookat, 360);
			set(view.limitview, off);
			set(view.maxpixelzoom, 0);
			copy(videointerface_backup_fovmin, view.fovmin);
			set(view.fovmin, 0.01);
			set(control.usercontrol, off);
			copy(videointerface_backup_mouse, control.mode);
			set(control.mode, drag);

			copy(current_fov, view.fov);
			copy(videointerface_backup_fovtype, view.fovtype);
			remapfovtype(current_fov, get(view.fovtype), HFOV);
			set(view.fovtype, HFOV);
			copy(view.fov, current_fov);
			copy(startfov, current_fov);

			copy(image_hfov, image.hfov);
			tween(image_hfov, 1.0, 3.0, linear,
				set(control.usercontrol,all);
				set(view.fovmin, 0.25);
				set(view.hlookatmin, -2);
				set(view.hlookatmax, +2);
				set(view.vlookatmin, -1);
				set(view.vlookatmax, +1);
				set(view.limitview, range);
			  ,
				if(image_hfov LT 90,
					mul(view.fov, image_hfov, 1.1);
				  ,
					sub(hr, image_hfov, 90);
					div(hr, 270);
					sub(hr2, 1, hr);
					mul(a, startfov, hr);
					mul(b, 99, hr2);
					add(view.fov, a,b);
				  );
				copy(image.hfov, image_hfov);
				set(image.vfov, 0);
				updateobject(true, true);
			  );

			adjusthlookat(0);
			tween(view.hlookat, 0, 1.5);
			tween(view.vlookat, 0, 1.5);
		 );
	</action>

	<action name="skin_view_non_flat">
		if(videointerface_isflat === true,
			set(videointerface_isflat, false);
			set(view.limitview, off);
			set(control.usercontrol, all);
			copy(control.mode, videointerface_backup_mouse);

			copy(current_fov, view.fov);
			remapfovtype(current_fov, get(view.fovtype), get(videointerface_backup_fovtype));
			copy(view.fovtype, videointerface_backup_fovtype);
			copy(view.fov, current_fov);

			copy(image_hfov, image.hfov);
			tween(image_hfov, 360.0, 3.0, linear,
				copy(view.fovmin, videointerface_backup_fovmin);
				set(view.limitview, auto);
				set(view.hlookatmin, -180);
				set(view.hlookatmax, +180);
				set(view.vlookatmin, -90);
				set(view.vlookatmax, +90);
			  ,
				copy(image.hfov, image_hfov);
				set(image.vfov, 0);
				updateobject(true, true);
			  );

			tween(view.fov, 120, 1.5);
		  );

		if(view.vlookat LT -60 OR view.vlookat GT +60,
			tween(view.vlookat, 0.0, 1.0, easeInOutSine);
		  );
	</action>

	<action name="skin_view_look_straight">
		skin_view_non_flat();
		if(view.vlookat LT -80 OR view.vlookat GT +80,
			tween(view.vlookat, 0.0, 1.0, easeInOutSine);
			tween(view.fov,     100, distance(150,0.8));
		  );
	</action>

	<action name="skin_view_normal">
		skin_update_view_menu(2);
		skin_view_look_straight();
		tween(view.architectural, 0.0, distance(1.0,0.5));
		tween(view.pannini,       0.0, distance(1.0,0.5));
		tween(view.distortion,    0.0, distance(1.0,0.5));
	</action>

	<action name="skin_view_fisheye">
		skin_update_view_menu(3);
		skin_view_look_straight();
		tween(view.architectural, 0.0,  distance(1.0,0.5));
		tween(view.pannini,       0.0,  distance(1.0,0.5));
		tween(view.distortion,    0.35, distance(1.0,0.5));
	</action>

	<action name="skin_view_stereographic">
		skin_update_view_menu(4);
		skin_view_look_straight();
		tween(view.architectural, 0.0, distance(1.0,0.5));
		tween(view.pannini,       0.0, distance(1.0,0.5));
		tween(view.distortion,    1.0, distance(1.0,0.8));
	</action>

	<action name="skin_view_architectural">
		skin_update_view_menu(5);
		skin_view_look_straight();
		tween(view.architectural, 1.0, distance(1.0,0.5));
		tween(view.pannini,       0.0, distance(1.0,0.5));
		tween(view.distortion,    0.0, distance(1.0,0.5));
	</action>

	<action name="skin_view_pannini">
		skin_update_view_menu(6);
		skin_view_look_straight();
		tween(view.architectural, 0.0, distance(1.0,0.5));
		tween(view.pannini,       1.0, distance(1.0,0.8));
		if(view.distortion LT 0.1,
			tween(view.distortion, 1.0, distance(1.0,0.8));
		  );
	</action>

	<action name="skin_view_littleplanet">
		skin_update_view_menu(7);
		if(videointerface_isflat === true,
			skin_view_non_flat();
			tween(view.fov,           150, distance(150,0.8));
			tween(view.architectural, 0.0, distance(1.0,0.5));
			tween(view.pannini,       0.0, distance(1.0,0.5));
			tween(view.distortion,    1.0, distance(1.0,0.8));
			delayedcall(0.5,
				tween(view.vlookat, 90, distance(100,0.8));
				tween(view.hlookat,  0, distance(100,0.8));
			  );
		  ,
			tween(view.architectural, 0.0, distance(1.0,0.5));
			tween(view.pannini,       0.0, distance(1.0,0.5));
			tween(view.distortion,    1.0, distance(1.0,0.8));
			tween(view.fov,           150, distance(150,0.8));
			tween(view.vlookat,        90, distance(100,0.8));
			add(new_hlookat, view.hlookat, 0.0);
			tween(view.hlookat, get(new_hlookat), distance(100,0.8));
		  );
	</action>


	<!-- video interface actions -->

	<!-- videointerface_addsource (name, videourl, posterurl)
		%1 - name
		%2 - videourl
		%3 - posterurl
	-->
	<action name="videointerface_addsource">
		<!-- init/setup the video interface skin -->
		skin_video_setup();

		set(videosources['v%1'].sourcename, '%1');
		set(videosources['v%1'].videourl, '%2');
		set(videosources['v%1'].posterurl, '%3');

		<!-- add layers to the quality sub-menu -->
		calc(lname, 'skin_settings_q' + videosources.count);
		addlayer(get(lname));
		copy(ly, layer[get(lname)]);
		ly.loadstyle(settingsitem);
		calc(ly.y, 20 + 24*videosources.count);
		set(ly.parent, 'skin_settings_quality');
		set(ly.onclick, videointerface_play('%1') );
		calc(lname2, lname + 't');
		addlayer(get(lname2));
		copy(ly2, layer[get(lname2)]);
		ly2.loadstyle(skintext);
		copy(ly2.parent, lname);
		set(ly2.align,'center');
		set(ly2.html,'%1');
		copy(videosources['v%1'].textelement, ly2);

		calc(layer[skin_settings_quality].height, 20+24+24*videosources.count+6);
	</action>


	<!-- videointerface_addsource
		%1 - name
		%2 - videourl
		%3 - posterurl
	-->
	<action name="videointerface_play">
		set(layer[skin_error].visible, false);
		copy(vs, videosources['v%1']);
		plugin[video].playvideo(get(vs.videourl), get(vs.posterurl), get(plugin[video].pausedonstart), get(plugin[video].time));
		skin_volumectrl_update();
		set(layer[skin_quality].html, %1);
		for(set(i,0), i LT videosources.count, inc(i),
			videosources[get(i)].textelement.loadstyle(calc(videosources[get(i)].sourcename == '%1' ? 'skintext_sel' : 'skintext'));
		  );
	</action>

</krpano>