<krpano>
<!-- krpano 1.19.pr8 - Virtual Tour Skin -->
<!-- maps="false" 是否使用必應地圖或谷歌地圖
maps_type="bing" 選擇使用谷歌地圖或必應地圖
maps_bing_api_key="" 必應地圖所需的API密鑰，需申請
maps_google_api_key="" 谷歌地圖所需的API密鑰，需申請
maps_zoombuttons="false" 是否在地圖上顯示縮放按鈕
gyro="true" 是否使用陀螺儀
webvr="true" 是否啟用VR
webvr_gyro_keeplookingdirection="false" 進入陀螺儀或VR時是否保持觀看方向
webvr_prev_next_hotspots="true" 在VR下是否啟用導航到前后場景的鏈接熱點
littleplanetintro="false" 是否使用小行星開場
title="true" 是否左下角顯示title
thumbs="true" 是否使用縮略圖，如不使用，則沒有縮略圖一欄
thumbs_width="120" thumbs_height="80" thumbs_padding="10" thumbs_crop="0|40|240|160" 縮略圖寬度、高度、間距以及縮略圖裁切范圍
thumbs_opened="false" 是否在啟動時彈出縮略圖一欄
thumbs_text="false" 是否在縮略圖上顯示名字
thumbs_dragging="true" 是否允許鼠標拖拽縮略圖區域
thumbs_onhoverscrolling="false" 是否允許鼠標懸停縮略圖自動滾動
thumbs_scrollbuttons="false" 是否顯示縮略圖滾動按鈕
thumbs_scrollindicator="false" 是否顯示縮略圖滾動條
thumbs_loop="false" 滾動按鈕是否使用縮略圖循環
tooltips_buttons="false" 鼠標在按鈕懸停時是否彈出文字提示
tooltips_thumbs="false" 鼠標在縮略圖懸停時是否彈出文字提示
tooltips_hotspots="false" 鼠標在熱點上懸停時是否彈出文字提示
tooltips_mapspots="false" 鼠標在地圖熱點懸停時是否彈出文字提示
deeplinking="false" 是否使用深度鏈接獲取功能，可使得當前頁面路徑獲取場景及視角信息
loadscene_flags="MERGE" 縮略圖切換場景時的變量
loadscene_blend="OPENBLEND(0.5, 0.0, 0.75, 0.05, linear)" 縮略圖切換場景時的融合
loadscene_blend_prev="SLIDEBLEND(0.5, 180, 0.75, linear)" 縮略圖切換到上一個場景時的融合
loadscene_blend_next="SLIDEBLEND(0.5, 0, 0.75, linear)" 縮略圖切換到下一個場景時的融合
loadingtext="載入中..." 在全景圖載入中時顯示的文字
layout_width="100%" 導航條容器相對屏幕寬度的百分比
layout_maxwidth="814" 導航條容器的最大寬度像素
controlbar_width="-24" 導航條背景的寬度像素
controlbar_height="40" 導航條背景的高度像素
controlbar_offset.normal="20" 導航條背景與屏幕底部的距離
controlbar_offset_closed="-40" 導航條隱藏狀態時與屏幕底部的距離
controlbar_overlap.no-fractionalscaling="10" 在不支持分級縮放頁面和設置像素比的設備的導航條重疊的像素
controlbar_overlap.fractionalscaling="0" 支持分級縮放頁面和設置像素比的設備的導航條重疊的像素
design_skin_images="vtourskin.png" 皮膚所用的源圖片
design_bgcolor="0x000000" 皮膚的背景顏色
design_bgalpha="0.5" 皮膚的透明度
design_bgborder="0 0xFFFFFF 1.0" 皮膚的邊框
design_bgroundedge="1" 皮膚邊框圓角設置
design_bgshadow="0 0 9 0xFFFFFF 0.5" 皮膚的背景陰影
design_thumbborder_bgborder="4 0xFFFFFF 1.0" 皮膚的縮略圖邊框
design_thumbborder_padding="2" 皮膚縮略圖邊框間距
design_thumbborder_bgroundedge="5" 皮膚縮略圖邊框的圓角
design_text_css="color:#FFFFFF; font-family:Arial; font-weight:bold;"皮膚文字樣式
design_text_shadow="1" 皮膚的文字陰影 -->
<skin_settings maps="false"
maps_type="google"
maps_bing_api_key=""
maps_google_api_key=""
maps_zoombuttons="false"
gyro="true"
webvr="true"
webvr_gyro_keeplookingdirection="false"
webvr_prev_next_hotspots="true"
littleplanetintro="false"
title="true"
thumbs="true"
thumbs_width="120" thumbs_height="80" thumbs_padding="10" thumbs_crop="0|40|240|160"
thumbs_opened="false"
thumbs_text="false"
thumbs_dragging="true"
thumbs_onhoverscrolling="false"
thumbs_scrollbuttons="false"
thumbs_scrollindicator="false"
thumbs_loop="false"
tooltips_buttons="false"
tooltips_thumbs="true"
tooltips_hotspots="false"
tooltips_mapspots="false"
deeplinking="false"
loadscene_flags="MERGE"
loadscene_blend="OPENBLEND(0.5, 0.0, 0.75, 0.05, linear)"
loadscene_blend_prev="SLIDEBLEND(0.5, 180, 0.75, linear)"
loadscene_blend_next="SLIDEBLEND(0.5, 0, 0.75, linear)"
loadingtext="loading..."
layout_width="100%"
layout_maxwidth="814"
controlbar_width="-24"
controlbar_height="40"
controlbar_offset="20"
controlbar_offset_closed="-40"
controlbar_overlap.no-fractionalscaling="10"
controlbar_overlap.fractionalscaling="0"
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) -->
<vtourskinxmlpath 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/ -->
<!-- WebVR插件 -->
<include url="%SWFPATH%/plugins/webvr.xml" devices="html5" />
<!-- overwrite some settings from the webvr.xml for the skin integration -->
<!-- 覆蓋WebVR默認設定 -->
<!-- onavailable去除插件自定義的進入VR按鈕（因為皮膚中已包含）webvr_enterbutton
skin_arrange_buttons初始化皮膚按鈕 webvr_onavailable()初始化設定，顯示Enter VR 按鈕-->
<!-- onentervr skin_showloading去除加載文字 webvr_setup 設置場景切換熱點並跟隨
webvr_onentervr 將所有沒有添加vr="true"的layer隱藏，並顯示VR的Layer skin_reloadscene_webvr
顯示屏幕旋轉提示圖片-->
<plugin name="WebVR" keep="true" devices="html5"
pluginurl="%SWFPATH%/plugins/webvr.js"
url=""
multireslock.desktop="true"
multireslock.mobile.or.tablet="false"
mobilevr_support="true"
mobilevr_fake_support="true"
onavailable="removelayer(webvr_enterbutton); skin_arrange_buttons(); webvr_onavailable();"
onentervr="skin_showloading(false); webvr_onentervr(); webvr_setup(); skin_reloadscene_webvr();"
onexitvr="webvr_onexitvr(); webvr_setup(); skin_reloadscene_webvr();"
/>
<!-- webvr button style (adjust to match skin style) -->
<!-- 修改WebVR界面的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 -->
<!-- 顯示屏幕旋轉提示圖片 devices="mobile" 只在手機模式下-->
<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"
/>
<!-- WebVR相關事件觸發 webvr_set_startup_view 設置鏡頭位置 onloadcomplete根據場景數目覺得是否顯示VR場景切換熱點-->
<events name="webvr_events" keep="true" devices="html5"
onxmlcomplete="webvr_set_startup_view()"
onresize.mobile="webvr_act_as_gyro_in_portrait_mode();"
onloadcomplete="delayedcall(0.5, if(webvr.isenabled AND scene.count GT 1 AND skin_settings.webvr_prev_next_hotspots, set(hotspot[webvr_prev_scene].visible,true); set(hotspot[webvr_next_scene].visible,true); ); );"
onviewchange=""
/>
<!-- 根據VR是否打開設置鏡頭位置 -->
<action name="webvr_set_startup_view">
if((webvr.isenabled OR plugin[skin_gyro].enabled) AND skin_settings.webvr_gyro_keeplookingdirection == false,
skin_lookat( get(xml.view.hlookat) );
);
</action>
<!-- 進入VR時設定 -->
<action name="webvr_setup">
if(webvr.isenabled,
<!-- 讀取自定義設定 -->
copy(loadscene_flags_backup, skin_settings.loadscene_flags);
<!-- 設置為 MERGE|KEEPVIEW|KEEPMOVING|NOPREVIEW-->
set(skin_settings.loadscene_flags, MERGE|KEEPVIEW|KEEPMOVING|NOPREVIEW);
<!-- 打開WebVR時是否豎屏啟動陀螺儀 -->
webvr_act_as_gyro_in_portrait_mode(true);
<!-- 讀取設置是否顯示VR模式下的上下按鈕 並且設置跟隨-->
if(scene.count GT 1 AND skin_settings.webvr_prev_next_hotspots,
set(hotspot[webvr_prev_scene].visible, true);
set(hotspot[webvr_next_scene].visible, true);
set(events[webvr_events].onviewchange, webvr_menu_following());
);
,
if(loadscene_flags_backup !== null, copy(skin_settings.loadscene_flags, loadscene_flags_backup));
tween(layer[webvr_rotate_to_landscape_request].alpha, 0.0, 0.0);
set(hotspot[webvr_prev_scene].visible, false);
set(hotspot[webvr_next_scene].visible, false);
set(events[webvr_events].onviewchange, null);
);
</action>
<!-- 打開WebVR時是否豎屏啟動陀螺儀 -->
<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>
<!-- VR scene switching hotspots -->
<!-- VR場景切換熱點 distorted="true" 熱點跟隨場景扭曲-->
<style name="webvr_menu_style" depth="800" scale="0.5" distorted="true" ath="0" atv="45" alpha="0.5" />
<hotspot name="webvr_prev_scene" keep="true" style="skin_base|webvr_menu_style" crop="0|64|64|64" ox="-64" onover="tween(scale,0.6);" onout="tween(scale,0.5);" vr_timeout="750" onclick="skin_nextscene_loop(-1);" visible="false" devices="html5.and.webgl" />
<hotspot name="webvr_next_scene" keep="true" style="skin_base|webvr_menu_style" crop="64|64|64|64" ox="+64" onover="tween(scale,0.6);" onout="tween(scale,0.5);" vr_timeout="750" onclick="skin_nextscene_loop(+1);" visible="false" devices="html5.and.webgl" />
<!-- floating/following VR hotspots -->
<!-- 設置VR模式下跟隨鏡頭的場景切換熱點 -->
<action name="webvr_menu_following" type="Javascript" devices="html5"><![CDATA[ var hs1 = krpano.get("hotspot[webvr_prev_scene]");
var hs2 = krpano.get("hotspot[webvr_next_scene]");
//頭追沒有移動到熱點處的時候
if(!hs1.hovering && !hs2.hovering)
{
var f = 0.01; // following speed factor
var h = krpano.view.hlookat;//獲取當前場景的垂直度數（垂直180°）
var v = krpano.view.vlookat;//獲取當前場景的水平度數（水平360°）
var hsh = hs1.ath;
var hsv = hs1.atv;
//將度數轉化為距離設置到熱點上
h = (h -(h|0)) + (((h|0) +360180)%360) - 180.0;
v = (v -(v|0)) + (((v|0) +360180)%360) - 180.0;
hsh = (hsh-(hsh|0)) + (((hsh|0)+360180)%360) - 180.0;
var dh = h - hsh;
dh += (dh > 180) ? -360 : (dh < -180) ? 360 : 0
hsh += dh*f;
var a = Math.abs(v - hsv) / 90.0;
a = 1.0 * Math.max(1.0 - 2.0*Math.sqrt(a), 0);
v = v + 55.0 - v*1.5;
hsv = hsv*(1.0 - f) + v*f;
hs1.ath = hs2.ath = hsh;
hs1.atv = hs2.atv = hsv;
hs1.alpha = hs2.alpha = a;
}
]]></action>
<!-- VR support -->
<!-- skin styles -->
<!-- skin_base - the base skin image -->
<!-- 基礎樣式，設置皮膚的圖標文件路徑 -->
<style name="skin_base" url="calc:vtourskinxmlpath.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) -->
<!-- 樣式屬性，如果有額外的事件監聽使用 ondown2,onup2,onover2,onout2 skin_buttonglow 設置按鈕的點擊hover效果-->
<style name="skin_glow"
ondown="copy(skin_lockglow,name); skin_buttonglow(get(name)); 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); ); );"
/>
<!-- skin_thumbtext_style - style/textfield for the (optional, skin_settings.thumbs_text) thumbnails texts -->
<!-- 場景縮略圖的文字樣式 通過skin_settings.thumbs_text設定是否顯示縮略圖的文字-->
<style name="skin_thumbtext_style" url="%SWFPATH%/plugins/textfield.swf" align="bottom" width="100%" autoheight="true" y="5" enabled="false" background="false" border="false" css="calc:skin_settings.design_text_css + ' text-align:center; font-size:10px;'" textshadow="get:skin_settings.design_text_shadow" />
<!-- skin_hotspotstyle - style for the hotspots -->
<!-- 當前皮膚熱點的按鈕樣式 如果skin_settings.tooltips_hotspots為true 則將scene的title屬性值設置為熱點的tips-->
<style name="skin_hotspotstyle" url="vtourskin_hotspot.png" scale="0.5" edge="top" distorted="true"
tooltip=""
linkedscene=""
linkedscene_lookat=""
onclick="skin_hotspotstyle_click();"
onover="tween(scale,0.55);"
onout="tween(scale,0.5);"
onloaded="if(linkedscene AND skin_settings.tooltips_hotspots, copy(tooltip,scene[get(linkedscene)].title); loadstyle(skin_tooltips); );"
/>
<!-- 熱點點擊 讀取熱點的linkedscene屬性設置為跳轉的scene如果存在linkedscene_lookat屬性則按照","切分字符分別賦值給h,v,fov
點擊時隱藏tips 調用skin_loadscene打開場景skin_lookat旋轉到指定位置-->
<action name="skin_hotspotstyle_click">
if(linkedscene,
if(linkedscene_lookat,
txtsplit(linkedscene_lookat, ',', hs_lookat_h, hs_lookat_v, hs_lookat_fov);
);
set(enabled, false);
skin_hidetooltips();
tween(depth|alpha|oy|rx, 4000|0.0|-50|-60, 0.5, default,
skin_loadscene(get(linkedscene), get(skin_settings.loadscene_blend));
if(hs_lookat_h !== null,
skin_lookat(get(hs_lookat_h), get(hs_lookat_v), get(hs_lookat_fov));
delete(hs_lookat_h, hs_lookat_v, hs_lookat_fov);
);
skin_updatescroll();
);
);
</action>
<!-- skin_tooltip - style for the thumb, hotspot and mapspot tooltips -->
<!-- tips樣式，當前為鼠標移動到layer讀取tooltip值設置到mouse.stagex mouse.stagey（為鼠標的topleft位置） 這個位置-->
<style name="skin_tooltips"
onover.mouse="copy(layer[skin_tooltip].html, tooltip);
set(layer[skin_tooltip].visible, true);
tween(layer[skin_tooltip].alpha, 1.0, 0.1);
asyncloop(hovering, copy(layer[skin_tooltip].x,mouse.stagex); copy(layer[skin_tooltip].y,mouse.stagey); );"
onout.mouse="tween(layer[skin_tooltip].alpha, 0.0, 0.1, default, set(layer[skin_tooltip].visible,false), copy(layer[skin_tooltip].x,mouse.stagex); copy(layer[skin_tooltip].y,mouse.stagey); );"
/>
<!-- the tooltip textfield -->
<!-- 文字提示tips layer使用文字插件展示，這里可以修改tips的式樣 -->
<layer name="skin_tooltip" keep="true"
url="%SWFPATH%/plugins/textfield.swf"
parent="STAGE"
visible="false" alpha="0" enabled="false" zorder="2"
align="lefttop" edge="bottom" oy="-2" width="200" autoheight="true"
background="false" backgroundcolor="0xFFFFFF" backgroundalpha="1.0"
border="false" bordercolor="0x000000" borderalpha="1.0" borderwidth="1.0" roundedge="0"
shadow="0.0" shadowrange="4.0" shadowangle="45" shadowcolor="0x000000" shadowalpha="1.0"
textshadow="get:skin_settings.design_text_shadow" textshadowrange="6.0" textshadowangle="90" textshadowcolor="0x000000" textshadowalpha="1.0"
css="calc:skin_settings.design_text_css + ' text-align:center; font-size:16px;'"
html=""
/>
<!-- skin layout -->
<!-- 下方控制條 -->
<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" visible="false" bgcapture="false" zorder="1">
<!-- 控制條上部分包括視頻控制條，縮略圖展示，場景名稱等 -->
<layer name="skin_scroll_window" type="container" align="bottom" width="100%" height="100%" x="0" y="calc:skin_settings.controlbar_offset + skin_settings.controlbar_height - skin_settings.controlbar_overlap" maskchildren="true" onloaded="skin_calc_opened_closed();" zorder="1">
<layer name="skin_scroll_layer" type="container" align="bottom" width="get:skin_settings.controlbar_width" height="100%" x="200" y="200" y_offset="get:skin_settings.controlbar_overlap" accuracy="1" bgalpha="get:skin_settings.design_bgalpha" bgcolor="get:skin_settings.design_bgcolor" bgborder="get:skin_settings.design_bgborder" bgroundedge="get:skin_settings.design_bgroundedge" bgshadow="get:skin_settings.design_bgshadow">
<!-- 場景名稱 -->
<layer name="skin_title" url="%SWFPATH%/plugins/textfield.swf" align="lefttop" edge="leftbottom" x="4" y="0" zorder="4" enabled="false" 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" visible="false" onautosized="skin_video_updateseekbarwidth();" />
<!-- 視頻控制條 -->
<layer name="skin_video_controls" type="container" align="lefttop" edge="leftbottom" width="100%" height="18" visible="false">
<layer name="skin_video_seekbar_container" type="container" align="lefttop" width="100%" height="100%" bgcapture="true" ondown="skin_video_ondownseeking();" >
<layer name="skin_video_seekbar" type="container" bgcolor="0xFFFFFF" bgalpha="0.25" align="center" width="100%" height="2">
<layer name="skin_video_loadbar" type="container" bgcolor="0xFFFFFF" bgalpha="0.5" align="left" width="0" height="2" />
<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>
<layer name="skin_video_time" url="%SWFPATH%/plugins/textfield.swf" align="rightbottom" x="4" enabled="false" 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" html="0:00 / 0:00" />
</layer>
<layer name="skin_scroll_container" type="container" align="lefttop" width="100%" height="100%" x="0" y="0" bgroundedge="get:skin_settings.design_bgroundedge" maskchildren="true">
<!-- 縮略圖展示 -->
<layer name="skin_thumbs_container" type="container" align="lefttop" width="100%" height="100%" visible="false">
<layer name="skin_thumbs_scrollleft" style="skin_base|skin_glow" crop="0|64|64|64" align="lefttop" edge="left" x="5" y="50" scale="0.5" zorder="2" alpha="1.0" ondown2="asyncloop(pressed, layer[skin_thumbs].scrollby(+2,0));" visible="false" />
<layer name="skin_thumbs_scrollright" style="skin_base|skin_glow" crop="64|64|64|64" align="righttop" edge="right" x="5" y="50" scale="0.5" zorder="2" alpha="1.0" ondown2="asyncloop(pressed, layer[skin_thumbs].scrollby(-2,0));" visible="false" />
<layer name="skin_thumbs_scrollindicator" type="container" bgcolor="0xFFFFFF" bgalpha="0.25" align="lefttop" width="0" y="100" height="2" visible="false" enabled="false" />
<!-- 滑動插件 -->
<layer name="skin_thumbs" state="closed" url.flash="%SWFPATH%/plugins/scrollarea.swf" url.html5="%SWFPATH%/plugins/scrollarea.js" direction="h" align="top" width="100%" height="100" zorder="1" onloaded="skin_updatescroll();" onscroll="skin_updatethumbscroll();" />
</layer>
<!-- 地圖展示 -->
<layer name="skin_map_container" type="container" align="leftop" width="100%" height="100%" bgroundedge="get:skin_settings.design_bgroundedge" maskchildren="true">
<layer name="skin_map" state="closed" url="" visible="false" align="lefttop" width="100%" height="50%" x="0" y="0" zorder="1" lat="0" lng="0" zoom="10" bgalpha="0" maptype="satellite" onmapready="skin_addmapspots();">
<maptypecontrol visible="true" align="righttop" x="5" y="5" buttonalign="v" scale.mobile="1.5" />
<radar visible="false" headingoffset="0" />
<spotstyle name="DEFAULT" url="vtourskin_mapspot.png" activeurl="vtourskin_mapspotactive.png" edge="bottom" x="-5" y="-8" scale="0.5" />
<layer name="skin_map_zoom_in" style="skin_base" visible="get:skin_settings.maps_zoombuttons" crop="9|512|46|64" align="right" x="0" y="-40" zorder="2" ondown="layer[skin_map].zoomin(); skin_buttonglow(get(name));" onup="skin_buttonglow(null);" />
<layer name="skin_map_zoom_out" style="skin_base" visible="get:skin_settings.maps_zoombuttons" crop="73|512|46|64" align="right" x="0" y="+40" zorder="2" ondown="layer[skin_map].zoomout(); skin_buttonglow(get(name));" onup="skin_buttonglow(null);" />
</layer>
</layer>
</layer>
</layer>
</layer>
<!-- 底部控制條背景圖 -->
<layer name="skin_splitter_bottom" type="container" align="bottom" width="100%" height="calc:skin_settings.controlbar_offset + skin_settings.controlbar_height - skin_settings.controlbar_overlap" y="0" maskchildren="true" onloaded="skin_calc_opened_closed();" zorder="2">
<layer name="skin_control_bar_bg" type="container" align="bottom" width="get:skin_settings.controlbar_width" height="calc:skin_settings.controlbar_height + skin_settings.controlbar_overlap" x="0" y="get:skin_settings.controlbar_offset" 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>
<!-- 控制按鈕區域 -->
<layer name="skin_control_bar" type="container" align="bottom" width="get:skin_settings.controlbar_width" height="calc:skin_settings.controlbar_height" x="0" y="get:skin_settings.controlbar_offset" onloaded="skin_calc_opened_closed();" zorder="3">
<!-- 控制按鈕 -->
<layer name="skin_control_bar_buttons" type="container" align="leftbottom" width="100%" height="get:skin_settings.controlbar_height">
<!-- 前一個場景按鈕 -->
<layer name="skin_btn_prev" style="skin_base|skin_glow" crop="0|64|64|64" align="left" x="5" y="0" scale="0.5" alpha="0.5" onclick="if(skin_settings.thumbs_loop, skin_nextscene_loop(-1), skin_nextscene(-1) );" />
<!-- 縮略圖按鈕，點擊后調用skin_showthumbs方法動畫展示縮略圖-->
<layer name="skin_btn_thumbs" style="skin_base|skin_glow" crop="0|128|64|64" align="left" x="50" y="0" scale="0.5" ondown2="skin_showmap(false); skin_showthumbs();" />
<!-- 地圖按鈕，點擊后會隱藏縮略圖-->
<layer name="skin_btn_map" style="skin_base|skin_glow" crop="64|128|64|64" align="left" x="90" y="0" scale="0.5" ondown2="skin_showthumbs(false); skin_showmap();" visible="false" />
<!-- 導航欄包括上下左右移動放大與縮小，鼠標按下距離+或-1，抬起初始化為默認的0 -->
<layer name="skin_btn_navi" type="container" align="center" x="0" width="240" height="32">
<layer name="skin_btn_left" style="skin_base|skin_glow" crop="0|192|64|64" align="center" x="-100" y="0" scale="0.5" ondown2="set(hlookat_moveforce,-1);" onup2="set(hlookat_moveforce,0);" />
<layer name="skin_btn_right" style="skin_base|skin_glow" crop="64|192|64|64" align="center" x="-60" y="0" scale="0.5" ondown2="set(hlookat_moveforce,+1);" onup2="set(hlookat_moveforce,0);" />
<layer name="skin_btn_up" style="skin_base|skin_glow" crop="0|256|64|64" align="center" x="-20" y="0" scale="0.5" ondown2="set(vlookat_moveforce,-1);" onup2="set(vlookat_moveforce,0);" />
<layer name="skin_btn_down" style="skin_base|skin_glow" crop="64|256|64|64" align="center" x="+20" y="0" scale="0.5" ondown2="set(vlookat_moveforce,+1);" onup2="set(vlookat_moveforce,0);" />
<layer name="skin_btn_in" style="skin_base|skin_glow" crop="0|320|64|64" align="center" x="+60" y="0" scale="0.5" ondown2="set(fov_moveforce,-1);" onup2="set(fov_moveforce,0);" />
<layer name="skin_btn_out" style="skin_base|skin_glow" crop="64|320|64|64" align="center" x="+100" y="0" scale="0.5" ondown2="set(fov_moveforce,+1);" onup2="set(fov_moveforce,0);" />
</layer>
<!-- 開啟或關閉陀螺儀按鈕 -->
<layer name="skin_btn_gyro" style="skin_base|skin_glow" crop="0|384|64|64" align="center" x="+140" y="0" scale="0.5" onclick="switch(plugin[skin_gyro].enabled); if(plugin[skin_gyro].enabled, skin_showmap(false));" visible="false" devices="html5" />
<!-- 進入VR模式按鈕 -->
<layer name="skin_btn_vr" style="skin_base|skin_glow" crop="0|0|80|64" align="center" x="+146" y="0" scale="0.5" onclick="webvr.enterVR();" visible="false" />
<!-- 全屏按鈕 -->
<layer name="skin_btn_fs" style="skin_base|skin_glow" crop="0|576|64|64" align="right" x="90" y="0" scale="0.5" onclick="switch(fullscreen);" devices="fullscreensupport" />
<!-- 隱藏控制條按鈕 -->
<layer name="skin_btn_hide" style="skin_base|skin_glow" crop="0|448|64|64" align="right" x="50" y="0" scale="0.5" onclick="skin_hideskin()" />
<!-- 顯示控制條按鈕 -->
<layer name="skin_btn_show" type="container" bgcapture="true" align="bottom" width="100%" height="get:skin_settings.controlbar_height" y="calc:skin_settings.controlbar_height - skin_settings.controlbar_offset_closed" onclick="skin_showskin()" onhover="tween(alpha,1.0);" onout="tween(alpha,0.25);" ondown.touch="onhover();" onup.touch="onout();" visible="false" capture="false" alpha="0.0">
<layer name="skin_btn_show_icon" style="skin_base" crop="64|448|64|64" scale="0.5" align="bottom" y="2" enabled="false" />
</layer>
<!-- 下一個場景按鈕 -->
<layer name="skin_btn_next" style="skin_base|skin_glow" crop="64|64|64|64" align="right" x="5" y="0" scale="0.5" alpha="0.5" onclick="if(skin_settings.thumbs_loop, skin_nextscene_loop(+1), skin_nextscene(+1) );" />
</layer>
</layer>
<!-- 顯示加載中文字圖層 -->
<layer name="skin_loadingtext" url="%SWFPATH%/plugins/textfield.swf" align="center" x="5" y="-5" html="get:skin_settings.loadingtext" visible="false" autoheight="true" background="false" border="false" enabled="false" css="calc:skin_settings.design_text_css + ' text-align:center; font-style:italic; font-size:22px;'" textshadow="get:skin_settings.design_text_shadow" />
<!-- 發光的背景圖片，用於按鈕點擊效果 -->
<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" />
<!-- 縮略圖選擇邊框效果 -->
<layer name="skin_thumbborder" type="container" x="get:skin_settings.design_thumbborder_padding" y="get:skin_settings.design_thumbborder_padding" width="calc:skin_settings.thumbs_width - 2*skin_settings.design_thumbborder_padding" height="calc:skin_settings.thumbs_height - 2*skin_settings.design_thumbborder_padding" visible="false" enabled="false" align="lefttop" bgborder="get:skin_settings.design_thumbborder_bgborder" bgroundedge="get:skin_settings.design_thumbborder_bgroundedge" />
</layer>
<!-- previous/next scene buttons for the hidden skin mode -->
<!-- 隱藏控制條時顯示的用於場景切換的按鈕 -->
<layer name="skin_btn_prev_fs" keep="true" type="container" align="lefttop" x="-50" width="40" height="100%" bgcapture="true" alpha="0.25" capture="false" zorder="2" onclick="skin_nextscene_loop(-1);" onhover="tween(alpha,1.0);" onout="tween(alpha,0.25);" ondown.touch="onhover();" onup.touch="onout();">
<layer name="skin_btn_prev_fs_icon" style="skin_base" crop="0|64|64|64" align="center" scale="0.5" enabled="false" />
</layer>
<layer name="skin_btn_next_fs" keep="true" type="container" align="righttop" x="-50" width="40" height="100%" bgcapture="true" alpha="0.25" capture="false" zorder="2" onclick="skin_nextscene_loop(+1);" onhover="tween(alpha,1.0);" onout="tween(alpha,0.25);" ondown.touch="onhover();" onup.touch="onout();">
<layer name="skin_btn_next_fs_icon" style="skin_base" crop="64|64|64|64" align="center" scale="0.5" enabled="false" />
</layer>
<!-- gyro plugin -->
<!-- 陀螺儀插件 -->
<plugin name="skin_gyro" keep="true" url="" html5_url="%SWFPATH%/plugins/gyro2.js" softstart="1.0" enabled="false" onavailable="skin_arrange_buttons();" devices="html5" />
<!-- skin events -->
<!-- 皮膚的事件
onxmlcomplete XML加載完成后清除當前事件，調用第一個函數skin_startup
onnewpano 加載新場景時skin_showloading顯示加載中文字 skin_update_scene_infos 根據URL重新設定初始位置等信息
onloadcomplete 加載完成后隱藏加載中文字
onidle 空閑時執行URL的信息更新
onresize 屏幕尺寸變化時執行一次skin_onresize，當每次加載新的pano時onresize也會被觸發一次
onenterfullscreen onexitfullscreen 進入退出全屏時更新全屏按鈕的圖標
onkeydown 監聽鍵盤事件-->
<events name="skin_events" keep="true"
onxmlcomplete="set(events[skin_events].onxmlcomplete,null); skin_startup();"
onnewpano="skin_showloading(true); skin_update_scene_infos(); skin_deeplinking_update_url();"
onremovepano="skin_showloading(true);"
onloadcomplete="skin_showloading(false);"
onidle="skin_deeplinking_update_url();"
onresize="skin_onresize();"
onenterfullscreen.fullscreensupport="set(layer[skin_btn_fs].crop, '64|576|64|64');"
onexitfullscreen.fullscreensupport="set(layer[skin_btn_fs].crop, '0|576|64|64');"
onkeydown="skin_keydown_event();"
/>
<!-- skin actions -->
<!-- 當前皮膚的啟動函數 -->
<action name="skin_startup">
<!-- apply skin settings on startup -->
<!-- 根據設置確定縮略圖是否在打開時就顯示，並且設定是否可拖拽，鼠標的情況下設置為滾動 -->
if(skin_settings.thumbs,
if(skin_settings.thumbs_opened, set(layer[skin_thumbs].state,'opened'); set(layer[skin_thumbs_container].visible,true); );
copy(layer[skin_thumbs].draggable, skin_settings.thumbs_dragging);
if(skin_settings.thumbs_onhoverscrolling AND device.mouse,
set(layer[skin_thumbs].draggable, false);
set(layer[skin_thumbs].onhover_autoscrolling, true);
);
);
<!-- html5的情況下加載陀螺儀插件 -->
if(skin_settings.gyro AND !device.desktop AND device.html5,
copy(plugin[skin_gyro].url, plugin[skin_gyro].html5_url);
);
<!-- html5並且支持WebVR的情況下加載WebVR插件 -->
if(skin_settings.webvr AND device.html5 AND device.webgl,
copy(plugin[WebVR].url, plugin[WebVR].pluginurl);
);
<!-- 是否顯示地圖插件 -->
if(skin_settings.maps == true,
set(layer[skin_btn_map].visible, true);
if(device.flash,
copy(layer[skin_map].key, skin_settings.maps_bing_api_key);
set(layer[skin_map].url, '%SWFPATH%/plugins/bingmaps.swf');
,
if(skin_settings.maps_type == 'bing',
copy(layer[skin_map].key, skin_settings.maps_bing_api_key);
set(layer[skin_map].url, '%SWFPATH%/plugins/bingmaps.js');
,
copy(layer[skin_map].key, skin_settings.maps_google_api_key);
set(layer[skin_map].url, '%SWFPATH%/plugins/googlemaps.js');
);
);
);
<!-- 小行星入場方式，只有支持WebGL和flash的情況下才可以 -->
if(skin_settings.littleplanetintro AND (device.webgl OR device.flash),
skin_setup_littleplanetintro();
);
<!-- 增加縮略圖 -->
skin_addthumbs();
<!-- 調用onresize -->
skin_onresize();
<!-- skin_updatescroll -->
skin_updatescroll();
<!-- 顯示下方控制條 -->
set(layer[skin_layer].visible, true);
</action>
<!-- 增加縮略圖 -->
<action name="skin_addthumbs">
if(skin_settings.thumbs == false,
set(layer[skin_btn_thumbs].visible,false);
,
copy(thumbwidth, skin_settings.thumbs_width);
copy(thumbheight, skin_settings.thumbs_height);
copy(thumbpadding, skin_settings.thumbs_padding);
copy(thumbcrop, skin_settings.thumbs_crop);
add(thumbxoffset, thumbwidth, thumbpadding);
mul(thumbxcenter, thumbxoffset, 0.5);
mul(thumbbarwidth, thumbxoffset, scene.count);
add(thumbbarwidth, thumbpadding);
add(thumbbarheight, thumbpadding, thumbheight);
add(thumbbarheight, thumbpadding);
if(skin_settings.thumbs_scrollindicator,
copy(layer[skin_thumbs_scrollindicator].y, thumbbarheight);
add(thumbbarheight, layer[skin_thumbs_scrollindicator].height);
);
copy(layer[skin_thumbs].height, thumbbarheight);
copy(layer[skin_thumbs].width, thumbbarwidth);
mul(halfheight, thumbbarheight, 0.5);
copy(layer[skin_thumbs_scrollleft].y, halfheight);
copy(layer[skin_thumbs_scrollright].y, halfheight);
<!-- 遍歷所有scene並且根據序號設置縮略圖名稱，並且根據設置添加縮略圖文字 -->
set(thumb_cnt,0);
for(set(i,0), i LT scene.count, inc(i),
inc(thumb_cnt);
txtadd(thumbname,'skin_thumb_',get(i));
addlayer(get(thumbname));
copy(layer[get(thumbname)].url, scene[get(i)].thumburl);
set(layer[get(thumbname)].keep, true);
set(layer[get(thumbname)].parent, 'skin_thumbs');
set(layer[get(thumbname)].align, lefttop);
copy(layer[get(thumbname)].crop, thumbcrop);
copy(layer[get(thumbname)].width, thumbwidth);
copy(layer[get(thumbname)].height, thumbheight);
mul(thumbx, i, thumbxoffset);
add(thumbx, thumbpadding);
copy(layer[get(thumbname)].x, thumbx);
copy(layer[get(thumbname)].y, thumbpadding);
add(scene[get(i)].thumbx, thumbx, thumbxcenter);
copy(scene[get(i)].thumby, thumbpadding);
set(layer[get(thumbname)].linkedscene, get(scene[get(i)].name) );
set(layer[get(thumbname)].onclick, copy(layer[skin_thumbborder].parent, name); skin_loadscene(get(linkedscene),get(skin_settings.loadscene_blend)); );
if(skin_settings.tooltips_thumbs,
set(layer[get(thumbname)].tooltip, get(scene[get(i)].title) );
layer[get(thumbname)].loadstyle(skin_tooltips);
);
if(skin_settings.thumbs_text,
txtadd(thumbtext, 'skin_thumbtext_', get(i));
addlayer(get(thumbtext));
layer[get(thumbtext)].loadstyle(skin_thumbtext_style);
set(layer[get(thumbtext)].keep, true);
set(layer[get(thumbtext)].parent, get(thumbname));
set(layer[get(thumbtext)].html, get(scene[get(i)].title));
);
);
if(thumb_cnt == 1,
set(layer[skin_thumbs].align, 'lefttop');
);
);
</action>
<!-- 設置地圖熱點 -->
<action name="skin_addmapspots">
for(set(i,0), i LT scene.count, inc(i),
if(scene[get(i)].lat,
txtadd(spotname, 'spot', get(i));
txtadd(spotclickevent, 'skin_hidetooltips(); activatespot(',get(spotname),'); skin_loadscene(', get(scene[get(i)].name), ',get(skin_settings.loadscene_blend)); skin_updatescroll(); delayedcall(0.5,skin_showmap(false));');
copy(scene[get(i)].mapspotname, spotname);
addspot(get(spotname), get(scene[get(i)].lat), get(scene[get(i)].lng), get(scene[get(i)].heading), false, get(spotclickevent), null);
if(skin_settings.tooltips_mapspots,
set(layer[skin_map].spot[get(spotname)].tooltip, get(scene[get(i)].title) );
txtadd(layer[skin_map].spot[get(spotname)].onover, 'set(hovering,true);', get(style[skin_tooltips].onover) );
txtadd(layer[skin_map].spot[get(spotname)].onout, 'set(hovering,false);', get(style[skin_tooltips].onout) );
);
);
);
if(xml.scene != null,
activatespot( get(scene[get(xml.scene)].mapspotname) );
,
activatespot(spot0);
);
<!-- zoom and pan the map to see all spots at the same time -->
zoomToSpotsExtent();
</action>
<!-- 小行星入場方式 -->
<action name="skin_setup_littleplanetintro">
copy(lp_scene, xml.scene);
copy(lp_hlookat, view.hlookat);
copy(lp_vlookat, view.vlookat);
copy(lp_fov, view.fov);
copy(lp_fovmax, view.fovmax);
copy(lp_limitview, view.limitview);
set(view.fovmax, 170);
set(view.limitview, lookto);
set(view.vlookatmin, 90);
set(view.vlookatmax, 90);
lookat(calc(lp_hlookat - 180), 90, 150, 1, 0, 0);
set(events[lp_events].onloadcomplete,
delayedcall(0.5,
if(lp_scene === xml.scene,
set(control.usercontrol, off);
copy(view.limitview, lp_limitview);
set(view.vlookatmin, null);
set(view.vlookatmax, null);
tween(view.hlookat|view.vlookat|view.fov|view.distortion, calc('' + lp_hlookat + '|' + lp_vlookat + '|' + lp_fov + '|' + 0.0),
3.0, easeOutQuad,
set(control.usercontrol, all);
tween(view.fovmax, get(lp_fovmax));
);
);
);
);
</action>
<!-- 跳轉到指定的視角，VR模式下要同時更新切換熱點的位置 -->
<action name="skin_lookat">
if(webvr.isenabled,
<!-- adjust the VR prev/next hotspots for the view change -->
calc(hlookat_offset, %1 - view.hlookat);
add(hotspot[webvr_prev_scene].ath, hlookat_offset);
add(hotspot[webvr_next_scene].ath, hlookat_offset);
);
if(plugin[skin_gyro].enabled,
<!-- reset the gyro tracking -->
plugin[skin_gyro].resetsensor(%1);
);
<!-- change the view -->
lookat(%1, %2, %3);
</action>
<!-- 皮膚重置位置 -->
<action name="skin_onresize">
mul(mh, area.pixelheight, -1);
if(layer[skin_thumbs].state == 'opened', add(mh,layer[skin_thumbs].height); );
if(layer[skin_map].state == 'opened', sub(hh,area.pixelheight,skin_settings.controlbar_offset); sub(hh,layer[skin_control_bar].height); sub(hh,32); add(mh,hh); add(mh,skin_settings.controlbar_overlap); sub(mh, layer[skin_scroll_layer].y_offset); copy(layer[skin_map].height, hh); );
add(mh, layer[skin_scroll_layer].y_offset);
set(layer[skin_scroll_layer].y, get(mh));
skin_video_updateseekbarwidth();
skin_arrange_buttons();
</action>
<!-- determine the visibility of the buttons and calculate their positions -->
<!-- 判斷是否顯示按鈕並且計算他們的位置 -->
<action name="skin_arrange_buttons">
<!-- 通過場景樹是否大於1確定是否顯示場景切換按鈕 -->
calc(show_selbuttons, scene.count GT 1);
calc(show_thumbutton, skin_settings.thumbs == true);
calc(show_mapbutton, skin_settings.maps == true);
calc(show_gyrobutton, plugin[skin_gyro].available == true AND (view.vlookatrange == 180 OR lp_scene === xml.scene));
calc(show_vrbutton, webvr.isavailable == true);
calc(show_fsbutton, device.fullscreensupport == true);
set(lpos,6);
set(cpos,0);
if(show_gyrobutton, dec(cpos,20));
if(show_vrbutton, dec(cpos,24));
set(rpos,6);
<!-- 非手機且展示寬度去除VR和陀螺儀按鈕寬度后大於520時顯示方向控制按鈕 -->
calc(show_dirbuttons, !device.mobile AND ((area.pixelwidth + 2*cpos) GT 520));
copy(layer[skin_btn_navi].visible, show_dirbuttons);
copy(layer[skin_btn_prev].visible, show_selbuttons);
copy(layer[skin_btn_next].visible, show_selbuttons);
if(show_selbuttons, inc(lpos,44); inc(rpos,44); );
copy(layer[skin_btn_thumbs].visible, show_thumbutton);
copy(layer[skin_btn_thumbs].x, lpos);
if(show_thumbutton, inc(lpos,40));
copy(layer[skin_btn_map].visible, show_mapbutton);
copy(layer[skin_btn_map].x, lpos);
if(show_mapbutton, inc(lpos,40));
<!-- 如果賢惠方向控制按鈕需要重新設置按鈕的列方式 -->
if(show_dirbuttons,
copy(layer[skin_btn_navi].x, cpos);
inc(cpos,140);
set(layer[skin_btn_gyro].align, center);
copy(layer[skin_btn_gyro].visible, show_gyrobutton);
copy(layer[skin_btn_gyro].x, cpos);
if(show_gyrobutton, inc(cpos,48));
set(layer[skin_btn_vr].align, center);
copy(layer[skin_btn_vr].visible, show_vrbutton);
copy(layer[skin_btn_vr].x, cpos);
if(show_vrbutton, inc(cpos,80));
,
set(layer[skin_btn_gyro].align, left);
copy(layer[skin_btn_gyro].visible, show_gyrobutton);
copy(layer[skin_btn_gyro].x, lpos);
if(show_gyrobutton, inc(lpos,40));
set(layer[skin_btn_vr].align, left);
copy(layer[skin_btn_vr].visible, show_vrbutton);
copy(layer[skin_btn_vr].x, lpos);
if(show_vrbutton, inc(lpos,80));
);
copy(layer[skin_btn_hide].x, rpos);
inc(rpos,40);
copy(layer[skin_btn_fs].visible, show_fsbutton);
copy(layer[skin_btn_fs].x, rpos);
if(show_fsbutton, inc(rpos,40));
</action>
<!-- 將當前的scene縮略圖設置到正中央 -->
<action name="skin_updatescroll">
if(layer[skin_thumbs].loaded,
set(cursceneindex, 0);
if(xml.scene, copy(cursceneindex, scene[get(xml.scene)].index));
layer[skin_thumbs].setcenter(get(scene[get(cursceneindex)].thumbx), get(scene[get(cursceneindex)].thumby));
);
</action>
<!-- 更新滑動組件 -->
<action name="skin_updatethumbscroll">
copy(padding,skin_settings.thumbs_padding);
if(skin_settings.thumbs_scrollbuttons,
if(loverflow GT 0, set(layer[skin_thumbs_scrollleft].visible,true), set(layer[skin_thumbs_scrollleft].visible,false) );
if(roverflow GT 0, set(layer[skin_thumbs_scrollright].visible,true), set(layer[skin_thumbs_scrollright].visible,false) );
);
if(skin_settings.thumbs_scrollindicator,
if(woverflow GT 0,
set(layer[skin_thumbs_scrollindicator].visible,true);
sub(iw,pixelwidth,woverflow);
div(pw,iw,pixelwidth);
div(px,loverflow,woverflow);
mul(pw,iw);
copy(layer[skin_thumbs_scrollindicator].width,pw);
sub(iw,pw);
sub(iw,padding);
sub(iw,padding);
mul(px,iw);
add(px,padding);
copy(layer[skin_thumbs_scrollindicator].x,px);
,
set(layer[skin_thumbs_scrollindicator].visible,false);
);
);
</action>
<!-- 更新場景信息 -->
<action name="skin_update_scene_infos">
if(xml.scene !== null AND scene[get(xml.scene)].index GE 0,
<!-- 設置場景名稱 -->
if(skin_settings.title,
if(title, txtadd(layer[skin_title].html, get(title), ' - ', get(scene[get(xml.scene)].title) ); , copy(layer[skin_title].html, scene[get(xml.scene)].title ); );
delayedcall(0.1, set(layer[skin_title].visible,true) );
);
<!-- 如果不循環根據當前場景的序號設置切換按鈕顯示 -->
if(skin_settings.thumbs_loop == false,
if(scene[get(xml.scene)].index GT 0,
set(layer[skin_btn_prev].enabled, true);
set(layer[skin_btn_prev].alpha, 1.0);
,
set(layer[skin_btn_prev].enabled, false);
set(layer[skin_btn_prev].alpha, 0.3);
);
sub(lastsceneindex, scene.count, 1);
if(scene[get(xml.scene)].index LT lastsceneindex,
set(layer[skin_btn_next].enabled, true);
set(layer[skin_btn_next].alpha, 1.0);
,
set(layer[skin_btn_next].enabled, false);
set(layer[skin_btn_next].alpha, 0.3);
);
,
if(scene.count GT 1,
set(layer[skin_btn_prev].enabled, true);
set(layer[skin_btn_prev].alpha, 1.0);
set(layer[skin_btn_next].enabled, true);
set(layer[skin_btn_next].alpha, 1.0);
,
set(layer[skin_btn_prev].enabled, false);
set(layer[skin_btn_prev].alpha, 0.3);
set(layer[skin_btn_next].enabled, false);
set(layer[skin_btn_next].alpha, 0.3);
);
);
if(scene.count GT 1,
set(layer[skin_btn_prev_fs].visible, true);
set(layer[skin_btn_next_fs].visible, true);
,
set(layer[skin_btn_prev_fs].visible, false);
set(layer[skin_btn_next_fs].visible, false);
);
<!-- 設置當前場景的縮略圖為選中式樣 -->
txtadd(parentname, 'skin_thumb_', get(scene[get(xml.scene)].index));
if(layer[get(parentname)],
set(layer[skin_thumbborder].parent, get(parentname));
set(layer[skin_thumbborder].visible, true);
,
set(layer[skin_thumbborder].visible, false);
);
if(scene[get(xml.scene)].mapspotname,
layer[skin_map].activatespot(get(scene[get(xml.scene)].mapspotname));
layer[skin_map].pantospot(get(scene[get(xml.scene)].mapspotname));
);
<!-- 設置陀螺儀按鈕是否顯示 -->
if(plugin[skin_gyro].isavailable == true AND view.vlookatrange == 180,
set(layer[skin_btn_gyro].visible, true);
,
set(layer[skin_btn_gyro].visible, false)
);
<!-- 設置反彈效果 -->
if(view.vlookatrange LT 180,
if(backup_control_bouncinglimits === null,
copy(backup_control_bouncinglimits, control.bouncinglimits);
);
set(control.bouncinglimits, false);
,
if(backup_control_bouncinglimits !== null,
copy(control.bouncinglimits, backup_control_bouncinglimits);
);
);
<!-- 如果當前場景為視頻則加載視頻控制條 -->
if(scene[get(xml.scene)].isvideopano AND plugin[video] !== null,
skin_video_addcontrols();
,
skin_video_removecontrols();
);
);
</action>
<!-- 跳轉到某一指定scene 參數為scene的序號-->
<action name="skin_gotoscene">
if(scene[%1],
copy(cursceneindex, scene[get(xml.scene)].index);
copy(newsceneindex, scene[%1].index);
skin_loadscene(get(newsceneindex), calc(newsceneindex LT cursceneindex ? skin_settings.loadscene_blend_prev : (newsceneindex GT cursceneindex ? skin_settings.loadscene_blend_next : skin_settings.loadscene_blend)) );
);
</action>
<!-- 顯示下一個場景（不循環） -->
<action name="skin_nextscene">
add(newsceneindex, scene[get(xml.scene)].index, %1);
if(newsceneindex GE 0 AND newsceneindex LT scene.count,
skin_loadscene(get(newsceneindex), calc(%1 LT 0 ? skin_settings.loadscene_blend_prev : skin_settings.loadscene_blend_next));
);
</action>
<!-- 顯示下一個場景（循環） -->
<action name="skin_nextscene_loop">
add(newsceneindex, scene[get(xml.scene)].index, %1);
sub(lastsceneindex, scene.count, 1);
if(newsceneindex LT 0, copy(newsceneindex,lastsceneindex));
if(newsceneindex GT lastsceneindex, set(newsceneindex,0));
skin_loadscene(get(newsceneindex), calc(%1 LT 0 ? skin_settings.loadscene_blend_prev : skin_settings.loadscene_blend_next));
</action>
<!-- skin_loadscene(scenenameorindex, blendmode) -->
<!-- 加載場景如果只有一個場景就WebVR的按鈕隱藏，並且在場景縮略圖上加上邊框效果，blendmode為場景切換動畫 -->
<action name="skin_loadscene">
if(webvr.isenabled AND scene.count GT 1,
set(hotspot[webvr_prev_scene].visible, false);
set(hotspot[webvr_next_scene].visible, false);
);
txtadd(layer[skin_thumbborder].parent, 'skin_thumb_', get(scene[%1].index));
layer[skin_thumbs].scrolltocenter(get(scene[%1].thumbx), get(scene[%1].thumby));
loadscene(get(scene[%1].name), null, get(skin_settings.loadscene_flags), %2);
</action>
<!-- 加載文字是否顯示 -->
<action name="skin_showloading">
if(display.stereo == true,
set(layer[skin_loadingtext].visible, false);
,
set(layer[skin_loadingtext].visible, %1);
);
</action>
<!-- 隱藏tips -->
<action name="skin_hidetooltips">
set(layer[skin_tooltip].alpha,0.0);
set(layer[skin_tooltip].visible,false);
</action>
<!-- 按鈕的點擊效果，在點擊的按鈕下添加一個Child -->
<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>
<!-- 設置關閉打開的距離 -->
<action name="skin_calc_opened_closed">
if(layer[get(name)].y_closed === null,
set(layer[get(name)].y_opened, get(layer[get(name)].y));
set(layer[get(name)].y_closed, calc(layer[get(name)].y - skin_settings.controlbar_offset - skin_settings.controlbar_height + skin_settings.controlbar_offset_closed));
);
</action>
<!-- 隱藏控制條，首先隱藏上方布局，其次底部最后控制條 -->
<action name="skin_hideskin">
callwith(layer[skin_scroll_window], skin_calc_opened_closed() );
callwith(layer[skin_splitter_bottom], skin_calc_opened_closed() );
callwith(layer[skin_control_bar], skin_calc_opened_closed() );
if(layer[skin_map].state != 'closed', skin_showmap(false); wait(0.40); );
if(layer[skin_thumbs].state != 'closed', skin_showthumbs(false); wait(0.25); );
set(hidetime, calc('%1' == 'instant' ? 0.0 : 0.5));
tween(layer[skin_scroll_window].y, get(layer[skin_scroll_window ].y_closed), get(hidetime));
tween(layer[skin_splitter_bottom].y, get(layer[skin_splitter_bottom].y_closed), get(hidetime));
tween(layer[skin_control_bar].y, get(layer[skin_control_bar ].y_closed), get(hidetime));
tween(layer[skin_btn_prev_fs].x, 0, get(hidetime));
tween(layer[skin_btn_next_fs].x, 0, get(hidetime));
if(layer[skin_logo], tween(layer[skin_logo].alpha, 0.0, 0.5, default, set(layer[skin_logo].visible,false)); );
stopdelayedcall(skin_btn_show_alpha);
set(layer[skin_btn_show].visible, true);
delayedcall(skin_btn_show_alpha, get(hidetime), tween(layer[skin_btn_show].alpha, 0.25, 0.25); );
</action>
<!-- 顯示隱藏的控制條 -->
<action name="skin_showskin">
tween(layer[skin_scroll_window ].y, get(layer[skin_scroll_window ].y_opened));
tween(layer[skin_splitter_bottom].y, get(layer[skin_splitter_bottom].y_opened));
tween(layer[skin_control_bar ].y, get(layer[skin_control_bar ].y_opened));
tween(layer[skin_btn_prev_fs].x, -50);
tween(layer[skin_btn_next_fs].x, -50);
if(layer[skin_logo], set(layer[skin_logo].visible,true); tween(layer[skin_logo].alpha, 1.0); );
stopdelayedcall(skin_btn_show_alpha);
set(layer[skin_btn_show].visible, false);
delayedcall(skin_btn_show_alpha, 0.25, tween(layer[skin_btn_show].alpha, 0.0, 0.0); );
</action>
<!-- 顯示縮略圖， 首先判斷是否已經關閉，layer[skin_scroll_layer].pixelheight=area.pixelheight的值為當前窗口的高度
假設當前窗口高度為640 1.640*-1=-640 2.減去（layer[skin_thumbs].height）縮略圖的高度100 -640+100=-540 3.減去（y_offset）背景重疊區域大小 10 -540+10=-530
4. layer[skin_scroll_layer].y大小為負的area.pixelheight+y_offset一開始onresize時設定 則變化范圍為 -630 到-530
詳細參照http://krpano.com/docu/xml/pluginalignment.png這張圖，備注下對於xy屬性，默認向下為Y的正向向右為X 的正向，edge未設定時默認和align一個值-->
<action name="skin_showthumbs">
if(%1 == null, if(layer[skin_thumbs].state == 'closed', set(show,true), set(show,false)); , set(show,%1); );
mul(mh, layer[skin_scroll_layer].pixelheight, -1);
if(show,
set(layer[skin_thumbs].state, 'opened');
tween(layer[skin_thumbs].alpha, 1.0, 0.25);
add(mh, layer[skin_thumbs].height);
add(mh, layer[skin_scroll_layer].y_offset);
tween(layer[skin_scroll_layer].y, get(mh), 0.5, easeOutQuint);
set(layer[skin_thumbs_container].visible, true);
tween(layer[skin_thumbs_container].alpha, 1.0, 0.25);
tween(layer[skin_map].alpha, 0.0, 0.25, default, set(layer[skin_map].visible,false));
,
set(layer[skin_thumbs].state, 'closed');
tween(layer[skin_thumbs].alpha, 0.0, 0.25, easeOutQuint);
add(mh, layer[skin_scroll_layer].y_offset);
tween(layer[skin_scroll_layer].y, get(mh), 0.5, easeOutQuint, set(layer[skin_thumbs_container].visible, false););
);
</action>
<!-- 顯示地圖 -->
<action name="skin_showmap">
if(%1 == null, if(layer[skin_map].state == 'closed', set(show,true), set(show,false)); , set(show,%1); );
mul(mh, layer[skin_scroll_layer].pixelheight, -1);
if(show,
tween(layer[skin_thumbs_container].alpha, 0.0, 0.25, default, set(layer[skin_thumbs_container].visible,false));
set(layer[skin_map].visible, true);
tween(layer[skin_map].alpha, 1.0, 0.25);
set(layer[skin_map].state, 'opened');
sub(hh,area.pixelheight,skin_settings.controlbar_offset);
sub(hh,layer[skin_control_bar].height);
sub(hh,32);
add(mh,hh);
sub(hh,skin_settings.controlbar_overlap);
copy(layer[skin_map].height, hh);
tween(layer[skin_scroll_layer].y, get(mh), 0.5, easeOutQuint);
,
if(layer[skin_map].state != 'closed',
set(layer[skin_map].state, 'closed');
add(mh, layer[skin_scroll_layer].y_offset);
tween(layer[skin_map].alpha, 0.0, 0.5, easeOutQuint);
tween(layer[skin_scroll_layer].y, get(mh), 0.5, easeOutQuint, set(layer[skin_map].visible,false) );
);
);
</action>
<!-- 綁定鍵盤事件 -->
<action name="skin_keydown_event">
if(keycode == 33, skin_nextscene_loop(-1) ); <!-- Page Up - previous scene -->
if(keycode == 34, skin_nextscene_loop(+1) ); <!-- Page Dowm - next scene -->
if(keycode == 35, skin_gotoscene(calc(scene.count-1)) ); <!-- End - last scene -->
if(keycode == 36, skin_gotoscene(0) ); <!-- Home/Pos1 - first scene -->
</action>
<!-- 如果使用深度鏈接功能調用skin_deeplinking_update_url_process獲取鏈接參數並設置 -->
<action name="skin_deeplinking_update_url">
if(skin_settings.deeplinking AND (!webvr OR webvr.isenabled === false),
delayedcall(skin_deeplinking_update, calc(%1 == null ? 0.1 : %1), skin_deeplinking_update_url_process() );
);
</action>
<!-- 深度鏈接功能，通過URL傳遞場景的初始位置等信息，重新設定到新的場景上 -->
<action name="skin_deeplinking_update_url_process">
<!-- 獲取當前的URL -->
copy(adr, browser.location);
<!-- 獲取？后的參數信息 -->
indexoftxt(qi, get(adr), '?');
if(qi GT 0, subtxt(adr, adr, 0, get(qi)));
copy(si, scene[get(xml.scene)].index);
copy(h, view.hlookat);
copy(v, view.vlookat);
copy(f, view.fov);
copy(d, view.distortion);
copy(a, view.architectural);
clamp(d, 0.0, 1.0);
clamp(a, 0.0, 1.0);
set(pp, calc(f LT 10 ? 6 : 2));
roundval(h, get(pp));
roundval(v, get(pp));
roundval(f, get(pp));
roundval(d, 2);
roundval(a, 1);
set(adr, calc(adr + '?startscene=' + si + '&startactions=lookat('+h+','+v+','+f+','+d+','+a+');'));
js( history.replaceState(null, document.title, get(adr)); );
</action>
<!-- reload the scene when there is a special image for VR -->
<!-- 如果scene標簽有havevrimage屬性，進入VR重載界面 -->
<action name="skin_reloadscene_webvr">
delayedcall(0.1,
if(scene[get(xml.scene)].havevrimage,
copy(keeplookingdirection_backup, skin_settings.webvr_gyro_keeplookingdirection);
set(skin_settings.webvr_gyro_keeplookingdirection, true);
loadscene(get(xml.scene), null, MERGE|KEEPVIEW|KEEPMOVING|KEEPHOTSPOTS|NOPREVIEW, BLEND(0.5));
copy(skin_settings.webvr_gyro_keeplookingdirection, keeplookingdirection_backup);
delete(keeplookingdirection_backup);
);
);
</action>
<!-- videopano support - http://krpano.com/plugins/videoplayer/ -->
<!-- 加載視頻控制條 -->
<action name="skin_video_addcontrols">
set(events[skin_events].onclick, skin_video_clickevent() );
set(plugin[video].onvideoready, skin_video_updatestate() );
set(plugin[video].onvideoplay, skin_video_updatestate() );
set(plugin[video].onvideopaused, skin_video_updatestate() );
set(plugin[video].onvideocomplete, skin_video_updatestate() );
if(plugin[video].ispaused AND 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);
);
delayedcall(skin_video_delayedvisible, 0.25, set(layer[skin_video_controls].visible, true) );
skin_video_updateseekbarwidth();
set(layer[skin_video_seekpos].x,0);
set(layer[skin_video_loadbar].width,0);
setinterval(skin_video_seek_updates, 0.5, skin_video_updatetime() );
</action>
<!-- 去除視頻控制條 -->
<action name="skin_video_removecontrols">
stopdelayedcall(skin_video_delayedvisible);
set(events[skin_events].onclick, null);
set(layer[skin_video_playpause].alpha, 0.0);
set(layer[skin_video_controls].visible, false);
clearinterval(skin_video_seek_updates);
</action>
<!-- 實時更新seek的進度和時間顯示 -->
<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_updateseekbarwidth">
if(skin_settings.title,
calc(layer[skin_video_seekbar_container].width, 0 - (32 + layer[skin_title].pixelwidth + layer[skin_video_time].pixelwidth));
calc(layer[skin_video_seekbar_container].x, layer[skin_title].pixelwidth + 16);
,
calc(layer[skin_video_seekbar_container].width, 0 - (24 + layer[skin_video_time].pixelwidth));
set(layer[skin_video_seekbar_container].x, 8);
);
</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>
<!-- 暫停或者顯示時的圖層 -->
<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();"
/>
<!-- 狀態變更時更新 -->
<action name="skin_video_updatestate">
calc(layer[skin_video_playpause].crop, plugin[video].ispaused ? '0|640|64|64' : '64|640|64|64');
if(plugin[video].iscomplete,
set(layer[skin_video_playpause].state, 'visible');
tween(layer[skin_video_playpause].alpha, 1.0);
);
</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(autohide_pp, 2.0, set(layer[skin_video_playpause].state,'hidden'); tween(layer[skin_video_playpause].alpha, 0.0); );
);
</action>
<!-- 點擊屏幕的事件觸發視頻播放和暫停 -->
<action name="skin_video_clickevent">
stopdelayedcall(autohide_pp);
switch(layer[skin_video_playpause].state, 'visible', 'hidden');
if(layer[skin_video_playpause].state == 'hidden',
tween(layer[skin_video_playpause].alpha, 0.0);
,
tween(layer[skin_video_playpause].alpha, 1.0);
delayedcall(autohide_pp, 2.0, set(layer[skin_video_playpause].state,'hidden'); tween(layer[skin_video_playpause].alpha, 0.0); );
);
</action>
<!-- context menu - http://krpano.com/docu/xml/#contextmenu -->
<!-- 右鍵按鈕菜單 -->
<contextmenu>
<item name="kr" caption="Krpano" onclick="openurl('http://www.krpano.com',_blank);"/>
<item name="fs" caption="FULLSCREEN" />
<item name="cc" caption="Change Controlmode" onclick="skin_changecontrolmode();" separator="true" />
<item name="nv" caption="Normal View" onclick="skin_view_normal();" showif="view.vlookatrange == 180" separator="true" />
<item name="fv" caption="Fisheye View" onclick="skin_view_fisheye();" showif="view.vlookatrange == 180" devices="flash|webgl" />
<item name="sv" caption="Stereographic View" onclick="skin_view_stereographic();" showif="view.vlookatrange == 180" devices="flash|webgl" />
<item name="av" caption="Architectural View" onclick="skin_view_architectural();" showif="view.vlookatrange == 180" />
<item name="pv" caption="Pannini View" onclick="skin_view_pannini();" showif="view.vlookatrange == 180" devices="flash|webgl" />
<item name="lp" caption="Little Planet View" onclick="skin_view_littleplanet();" showif="view.vlookatrange == 180" devices="flash|webgl" />
</contextmenu>
<!-- 點擊改變控制方式函數 -->
<action name="skin_changecontrolmode">
switch(control.mouse, moveto, drag);
switch(control.touch, moveto, drag);
</action>
<!-- 以下為不同的全景顯示模式 -->
<action name="skin_view_look_straight">
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));
);
skin_deeplinking_update_url(1.0);
</action>
<action name="skin_view_normal">
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_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_architectural">
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_stereographic">
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_pannini">
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">
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, 123.0);
tween(view.hlookat, get(new_hlookat), distance(100,0.8));
skin_deeplinking_update_url(1.0);
</action>
</krpano>
