vrshow.js 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517
  1. var pk_works_main;
  2. var mapModalEl;
  3. var _user_view_uuid;
  4. var _name;
  5. var _userList;
  6. var plugins_init_function = new Array();//接收显示时的init方法
  7. //krpano loadcomplete调用
  8. function showPanoBtns(sceneCount){
  9. if (sceneCount > 1) {
  10. $(".vrshow_container_3_min .img_desc_container_min:eq(0)").show();
  11. }else{
  12. $(".vrshow_container_3_min .img_desc_container_min:eq(0)").hide();
  13. }
  14. $("#panoBtns").show();
  15. }
  16. function fullscreen(el){
  17. //krpano.call("switch(fullscreen);");
  18. //launchFullScreen(document.documentElement);
  19. if($(el).hasClass('btn_fullscreen')){
  20. launchFullScreen(document.getElementById('fullscreenid'));
  21. var krpano = document.getElementById('krpanoSWFObject');
  22. krpano.call("skin_showthumbs(false);");
  23. }else{
  24. exitFullscreen();
  25. }
  26. toggleFullscreenBtn(el);
  27. }
  28. function launchFullScreen(element) {
  29. if(element.requestFullscreen) {
  30. element.requestFullscreen();
  31. } else if(element.mozRequestFullScreen) {
  32. element.mozRequestFullScreen();
  33. } else if(element.webkitRequestFullscreen) {
  34. element.webkitRequestFullscreen();
  35. } else if(element.msRequestFullscreen) {
  36. element.msRequestFullscreen();
  37. }
  38. }
  39. function exitFullscreen() {
  40. if (document.exitFullscreen) {
  41. document.exitFullscreen();
  42. }
  43. else if (document.mozCancelFullScreen) {
  44. document.mozCancelFullScreen();
  45. }
  46. else if (document.webkitCancelFullScreen) {
  47. document.webkitCancelFullScreen();
  48. }
  49. else if (document.msExitFullscreen) {
  50. document.msExitFullscreen();
  51. }
  52. }
  53. function toggleFullscreenBtn(el){
  54. if($(el).hasClass("btn_fullscreen")){
  55. $(el).removeClass("btn_fullscreen");
  56. $(el).addClass("btn_fullscreen_off");
  57. }else{
  58. $(el).removeClass("btn_fullscreen_off");
  59. $(el).addClass("btn_fullscreen");
  60. }
  61. }
  62. function toggleBtns(flag){
  63. if(flag){
  64. $("#panoBtns").show();
  65. }else{
  66. $("#panoBtns").hide();
  67. var krpano = document.getElementById('krpanoSWFObject');
  68. krpano.call('skin_showthumbs(false);');
  69. }
  70. }
  71. function showWebVR(){
  72. var krpano = document.getElementById('krpanoSWFObject');
  73. var webvr = krpano.get("webvr");
  74. webvr.entervr();
  75. }
  76. function showthumbs(){
  77. var krpano = document.getElementById('krpanoSWFObject');
  78. krpano.call("skin_showthumbs();");
  79. }
  80. function hidePictext() {
  81. $('#pictextModal').modal('hide');
  82. toggleBtns(true);
  83. }
  84. function showPictext(title,content) {
  85. toggleBtns(false);
  86. //var data = $("body").data("panoData");
  87. // $('#pictextWorkName').text('');
  88. // $('#pictextContent').text('');
  89. $('#pictextWorkName').text(title);
  90. $('#pictextContent').html(imgtext_decode(content));
  91. //$('#pictextContent').append(content);
  92. $('#pictextModal').modal("show");
  93. }
  94. //krpano调用 初始化高级设置
  95. function initAdvancedSetting(sceneName){
  96. //initViewSetting(sceneName);
  97. initEffectSetting(sceneName);
  98. initHotspotSetting(sceneName);
  99. initSandTableSetting(sceneName);
  100. initTourGuideSetting(sceneName);
  101. //作者信息 TODO
  102. // initAuthourInfo(sceneName);
  103. }
  104. function initTourGuideSetting(sceneName){
  105. var krpano = document.getElementById('krpanoSWFObject');
  106. var tourGuideObj = $("body").data("panoData").tour_guide;
  107. if(tourGuideObj.points.length > 0){
  108. $('#pano .vrshow_tour_btn').show();
  109. }else{
  110. $('#pano .vrshow_tour_btn').hide();
  111. }
  112. }
  113. var lsTourGuideObj = null;
  114. function startTourGuide(){
  115. toggleBtns(false);
  116. lsTourGuideObj = $("body").data("panoData").tour_guide;
  117. var krpano = document.getElementById('krpanoSWFObject');
  118. //krpano.call('showlog(true)');
  119. var curSceneName = krpano.get('xml.scene');
  120. var firstPoint = lsTourGuideObj.points[0];
  121. if(lsTourGuideObj.useStartImg){
  122. krpano.call('show_tour_guide_alert('+lsTourGuideObj.startImgUrl+');');
  123. }
  124. if(this.sceneName != curSceneName){
  125. krpano.call('loadscene('+firstPoint.sceneName+', null, MERGE);');
  126. }
  127. var curfov = krpano.get('view.fov');
  128. krpano.call('lookto('+firstPoint.ath+','+firstPoint.atv+','+curfov+',smooth(720,-720,720),true,true,js(looktoCallBack('+1+')));');
  129. }
  130. function looktoCallBack(idx){
  131. var krpano = document.getElementById('krpanoSWFObject');
  132. if(idx < lsTourGuideObj.points.length){
  133. var pointObj = lsTourGuideObj.points[idx];
  134. var curSceneName = krpano.get('xml.scene');
  135. var curfov = krpano.get('view.fov');
  136. if(pointObj.sceneName != curSceneName){
  137. krpano.call('loadscene('+pointObj.sceneName+', null, MERGE);');
  138. krpano.call('lookto('+pointObj.ath+','+pointObj.atv+','+curfov+',smooth(720,-720,720),true,true,js(looktoCallBack('+(parseInt(idx)+1)+')));');
  139. }else{
  140. krpano.call('lookto('+pointObj.ath+','+pointObj.atv+','+curfov+',tween(easeInOutQuad,'+parseInt(pointObj.moveTime)+'),true,true,js(looktoCallBack('+(parseInt(idx)+1)+')));');
  141. }
  142. }else{
  143. if(lsTourGuideObj.useEndImg){
  144. krpano.call('show_tour_guide_alert('+lsTourGuideObj.endImgUrl+');');
  145. }
  146. toggleBtns(true);
  147. }
  148. }
  149. function initSandTableSetting(sceneName){
  150. var krpano = document.getElementById('krpanoSWFObject');
  151. var sandTableObj = $("body").data("panoData").sand_table;
  152. var existFlag = false;
  153. $(sandTableObj.sandTables).each(function(idx){
  154. if(this.sceneOpt[sceneName]){
  155. //设置背景图片
  156. krpano.set("layer[map].url",this.imgPath);
  157. $.each(this.sceneOpt,function(sceneName,value){
  158. var spotName = 'spot_'+sceneName;
  159. addRadarSpot(spotName,value.krpLeft,value.krpTop);
  160. });
  161. var hlookatIncre = krpano.get('view.hlookat') - this.sceneOpt[sceneName].hlookat;
  162. krpano.call('activatespot('+(parseFloat(this.sceneOpt[sceneName].rotate)+parseFloat(hlookatIncre))+');');
  163. existFlag = true;
  164. return false;
  165. }
  166. });
  167. if(!existFlag){
  168. $('.vrshow_radar_btn').hide();
  169. krpano.set('layer[mapcontainer].visible',false);
  170. }else{
  171. $('.vrshow_radar_btn').show();
  172. if(sandTableObj.isOpen){
  173. krpano.set('layer[mapcontainer].visible',true);
  174. }
  175. }
  176. }
  177. function toggleKrpSandTable(){
  178. var krpano = document.getElementById('krpanoSWFObject');
  179. var isVisible = krpano.get('layer[mapcontainer].visible');
  180. if(isVisible){
  181. krpano.set('layer[mapcontainer].visible',false);
  182. }else{
  183. krpano.set('layer[mapcontainer].visible',true);
  184. }
  185. }
  186. function addRadarSpot(name,x,y){
  187. //console.log(x+','+y);
  188. var krpano = document.getElementById('krpanoSWFObject');
  189. krpano.call('addlayer('+name+');');
  190. krpano.set('layer['+name+'].style','spot');
  191. krpano.set('layer['+name+'].x',x);
  192. krpano.set('layer['+name+'].y',y);
  193. krpano.set('layer['+name+'].parent','radarmask');
  194. krpano.call('layer['+name+'].loadstyle(spot);');
  195. //krpano.set('layer['+name+'].keep','true');
  196. //krpano.set('layer['+name+'].visible','true');
  197. }
  198. function initHotspotSetting(sceneName){
  199. var krpano = document.getElementById('krpanoSWFObject');
  200. var hotspotObj = ($("body").data("panoData").hotspot)[sceneName];
  201. if(hotspotObj){
  202. $.each(hotspotObj,function(key,value){
  203. if(key == 'scene'){
  204. $(value).each(function(idx){
  205. krpano.call('addSceneChangeHotSpot("'+this.imgPath+'","'+ (this.name) +'",'+this.linkedscene+','+(this.ath)+','+(this.atv)+','+this.isDynamic+',false,true)');
  206. });
  207. }else if(key == 'link'){
  208. $(value).each(function(idx){
  209. krpano.call('addLinkHotSpot("'+this.imgPath+'","'+ (this.name) +'",'+html_encode(this.hotspotTitle)+','+(this.ath)+','+(this.atv)+','+this.isDynamic+',false,true,'+this.link+','+this.isShowSpotName+')');
  210. });
  211. }else if(key == 'image'){
  212. $(value).each(function(idx){
  213. krpano.call('addImgHotSpot("'+this.imgPath+'","'+ (this.name) +'",'+html_encode(this.hotspotTitle)+','+(this.ath)+','+(this.atv)+','+this.isDynamic+',false,true,'+this.galleryName+','+this.isShowSpotName+')');
  214. });
  215. }else if(key == 'text'){
  216. $(value).each(function(idx){
  217. krpano.call('addWordHotSpot("'+this.imgPath+'","'+ (this.name) +'",'+html_encode(this.hotspotTitle)+','+(this.ath)+','+(this.atv)+','+this.isDynamic+',false,true,'+html_encode(this.wordContent)+','+this.isShowSpotName+')');
  218. });
  219. }else if(key == 'voice'){
  220. $(value).each(function(idx){
  221. krpano.call('addVoiceHotSpot("'+this.imgPath+'","'+ (this.name) +'",'+html_encode(this.hotspotTitle)+','+(this.ath)+','+(this.atv)+','+this.isDynamic+',false,true,'+this.musicSrc+','+this.isShowSpotName+')');
  222. });
  223. }else if(key == 'around'){
  224. $(value).each(function(idx){
  225. krpano.call('addAroundHotSpot("'+this.imgPath+'","'+ (this.name) +'",'+html_encode(this.hotspotTitle)+','+(this.ath)+','+(this.atv)+','+this.isDynamic+',false,true,'+this.aroundPath+','+this.fileCount+','+this.isShowSpotName+')');
  226. });
  227. }else if(key == 'imgtext'){
  228. $(value).each(function(idx){
  229. krpano.call('addImgTextHotSpot("'+this.imgPath+'","'+ (this.name) +'",'+html_encode(this.hotspotTitle)+','+(this.ath)+','+(this.atv)+','+this.isDynamic+',false,true,'+imgtext_encode(this.imgtext_wordContent)+','+this.isShowSpotName+')');
  230. });
  231. }else if(key == 'obj'){
  232. $(value).each(function(idx){
  233. krpano.call('addObjHotSpot("'+this.imgPath+'","'+ (this.name) +'",'+html_encode(this.hotspotTitle)+','+(this.ath)+','+(this.atv)+','+this.isDynamic+',false,true,'+this.objid+','+this.isShowSpotName+')');
  234. });
  235. }else if(key == 'video'){
  236. $(value).each(function(idx){
  237. krpano.call('addVideoHotSpot("'+this.imgPath+'","'+ (this.name) +'",'+html_encode(this.hotspotTitle)+','+(this.ath)+','+(this.atv)+','+this.isDynamic+',false,true,'+this.location+','+this.isShowSpotName+')');
  238. });
  239. }
  240. });
  241. }
  242. }
  243. function initEffectSetting(sceneName){
  244. var krpano = document.getElementById('krpanoSWFObject');
  245. var effectObj = null;
  246. var effectData = $("body").data("panoData").special_effects;
  247. $(effectData.effectSettings).each(function(idx){
  248. if(this.sceneName == sceneName){
  249. effectObj = this;
  250. return false;
  251. }
  252. });
  253. if(effectObj){
  254. if(effectObj.isOpen){
  255. if(effectObj.effectType == 'sunshine'){
  256. //krpano.set('lensflares[obj].item[lensitemobj].scene',sceneName);
  257. //krpano.set('lensflares[obj].item[lensitemobj].ath',effectObj.ath);
  258. //krpano.set('lensflares[obj].item[lensitemobj].atv',effectObj.atv);
  259. krpano.call('addLensflares('+effectObj.ath+','+effectObj.atv+')');
  260. }else{
  261. krpano.call('addEffect("'+effectObj.effectType+'","'+effectObj.effectImgPath+'")');
  262. }
  263. }
  264. }
  265. }
  266. function littlePlaneOpen(sceneName){
  267. var krpano = document.getElementById('krpanoSWFObject');
  268. var lookatObj = null;
  269. var angleData = $("body").data("panoData").angle_of_view;
  270. $(angleData.viewSettings).each(function(idx){
  271. if(this.sceneName == sceneName){
  272. lookatObj = this;
  273. return false;
  274. }
  275. });
  276. if(lookatObj){
  277. krpano.set('view.vlookat',lookatObj.vlookat);
  278. krpano.set('view.hlookat',lookatObj.hlookat);
  279. krpano.set('view.fov',lookatObj.fov);
  280. krpano.set('view.fovmax',lookatObj.fovmax);
  281. if(lookatObj.hlookatmin){
  282. krpano.set('view.hlookatmin',lookatObj.hlookatmin);
  283. }
  284. if(lookatObj.hlookatmax){
  285. krpano.set('view.hlookatmax',lookatObj.hlookatmax);
  286. }
  287. krpano.call('skin_setup_littleplanetintro('+lookatObj.fovmin+','+(-1*lookatObj.vlookatmax)+','+(-1*lookatObj.vlookatmin)+','+(lookatObj.keepView ? "off" : "0.0")+');');
  288. }else{
  289. krpano.call('skin_setup_littleplanetintro(5,-90,90,"0.0");');
  290. }
  291. }
  292. //场景载入时加载视角设置
  293. function initViewSetting(sceneName){
  294. var krpano = document.getElementById('krpanoSWFObject');
  295. var lookatObj = null;
  296. var angleData = $("body").data("panoData").angle_of_view;
  297. $(angleData.viewSettings).each(function(idx){
  298. if(this.sceneName == sceneName){
  299. lookatObj = this;
  300. return false;
  301. }
  302. });
  303. if(lookatObj){
  304. krpano.set('view.vlookat',lookatObj.vlookat);
  305. krpano.set('view.hlookat',lookatObj.hlookat);
  306. krpano.set('view.fov',lookatObj.fov);
  307. krpano.set('view.fovmin',lookatObj.fovmin);
  308. krpano.set('view.fovmax',lookatObj.fovmax);
  309. krpano.set('view.vlookatmin',-1*lookatObj.vlookatmax);
  310. krpano.set('view.vlookatmax',-1*lookatObj.vlookatmin);
  311. krpano.set('autorotate.horizon',lookatObj.keepView ? "off" : "0.0");
  312. if(lookatObj.hlookatmin){
  313. krpano.set('view.hlookatmin',lookatObj.hlookatmin);
  314. }
  315. if(lookatObj.hlookatmax){
  316. krpano.set('view.hlookatmax',lookatObj.hlookatmax);
  317. }
  318. }
  319. }
  320. function loadGallery(){
  321. var krpano = document.getElementById('krpanoSWFObject');
  322. var hotspotObj = $("body").data("panoData").hotspot;
  323. //var xmlStr = '';
  324. $.each(hotspotObj,function(sceneName,value){
  325. if(value){
  326. $(value.image).each(function(idx){
  327. var xmlStr = '<gallery name="'+this.galleryName+'" title="">';
  328. $(this.imgs).each(function(idx){
  329. xmlStr += '<img name="img'+idx+'" url="'+this.src+'" title="" />';
  330. });
  331. xmlStr += '</gallery>';
  332. krpano.call('loadxml('+xmlStr+');');
  333. });
  334. }
  335. });
  336. }
  337. function reloadGallery(gallery){
  338. var krpano = document.getElementById('krpanoSWFObject');
  339. var ua = window.navigator.userAgent.toLowerCase();
  340. if(typeof(wx)!='undefined' && ua.match(/MicroMessenger/i) == 'micromessenger'){
  341. //整合gallery的图片到数组
  342. var urls = new Array();
  343. for(var i=0; i<krpano.get('gallery['+gallery+'].img.count'); i++){
  344. urls.push(krpano.get('gallery['+gallery+'].img['+i+'].url'));
  345. }
  346. wx.previewImage({
  347. current: krpano.get('gallery['+gallery+'].img[0].url'), // 当前显示图片的http链接
  348. urls: urls // 需要预览的图片http链接列表
  349. });
  350. }
  351. else{
  352. toggleBtns();
  353. krpano.call('show_gallery('+gallery+')');
  354. }
  355. }
  356. function getWorkPrivacyFlag(){
  357. var privacy_flag = '0';
  358. return privacy_flag;
  359. }
  360. function initPano(){//TODO
  361. if(data.pk_works_main == undefined){
  362. window.location.href = '/404.html';
  363. return ;
  364. }
  365. //微信分享
  366. // initWxConfig(data);
  367. // initQQShare(data);
  368. //存储作者的信息
  369. // _user_view_uuid = data.user_view_uuid;
  370. _user_view_uuid = "admin";
  371. _name = data.name;
  372. //$("#thumb_img").attr("src",data.absolutelocation);
  373. //var descContent='';
  374. //if(data.profile){
  375. // descContent = data.profile;
  376. //}else{
  377. // descContent = data.name;
  378. //}
  379. //$("head").append('<meta name="description" content="'+descContent+'"/>');
  380. $("body").data("panoData",data);
  381. pk_works_main = data.pk_works_main;
  382. var settings = {};
  383. settings["events[skin_events].onloadcomplete"] = "skin_showloading(false);";
  384. settings["onstart"] = '';
  385. //是否开始时弹出场景选择
  386. if (data.scenechoose=='1') {
  387. settings["events[skin_events].onloadcomplete"] += "open_show_scene_thumb();";
  388. }
  389. //统计人气
  390. if(data.browsing_num!='0'){
  391. $("#user_viewNum").text(parseInt(data.browsing_num)+1);
  392. }else{
  393. $("#user_viewNum").text("1");
  394. }
  395. //启动画面
  396. var loadingObj = data.loading_img;
  397. if (loadingObj && loadingObj.useLoading) {
  398. settings["onstart"] += "showloadingimg('" + loadingObj.loadingImgPathWebsite + "','" + loadingObj.loadingImgPathMobile + "');";
  399. }
  400. for(var i=0 ; i<plugins_init_function.length;i++){
  401. plugins_init_function[i](data,settings);
  402. }
  403. if(data.scene_group.sceneGroups.length>0) {
  404. $(".vrshow_container_3_min .img_desc_container_min:eq(0) img").attr('src',data.scene_group.sceneGroups[0].imgPath);
  405. }
  406. settings['skin_settings.littleplanetintro'] = data.littleplanet=="1" ? true : false;
  407. settings['autorotate.enabled'] = data.autorotate=="1" ? true : false;
  408. embedpano({
  409. swf: "tour.swf",
  410. xml: "tour.xml",
  411. target: "pano",
  412. html5:'prefer',
  413. //flash:'only',
  414. wmode:'opaque-flash',
  415. mobilescale:0.7,
  416. vars: settings
  417. });
  418. }
  419. function html_encode(str)
  420. {
  421. var s = "";
  422. if (str.length == 0) return "";
  423. s = str.replace(/\'/g, "&#39;");
  424. s = s.replace(/\"/g, "&quot;");
  425. s = s.replace(/\(/g, "(");
  426. s = s.replace(/\)/g, ")");
  427. s = s.replace(/,/g, ",");
  428. return s;
  429. }
  430. function imgtext_encode(str){
  431. var s = "";
  432. if (str.length == 0) return "";
  433. s = str.replace(/\'/g, "&#39;");
  434. s = s.replace(/\"/g, "&quot;");
  435. s = s.replace(/\(/g, "(");
  436. s = s.replace(/\)/g, ")");
  437. s = s.replace(/\,/g,"%2C");
  438. return s;
  439. }
  440. function imgtext_decode(str){
  441. var s = "";
  442. if (str.length == 0) return "";
  443. s = str.replace(/&quot;/g, "\"");
  444. s = s.replace(/%2C/g,",");
  445. return s;
  446. }
  447. function showFullscreenBtn(){
  448. $(".btn_fullscreen").show();
  449. }
  450. function radarRotate(sceneName,hlookat){
  451. }
  452. function openSpeechVoiceBtn(){
  453. var voiceOff = $('.btn_music_off');
  454. voiceOff.removeClass('btn_music_off');
  455. voiceOff.addClass('btn_music');
  456. }
  457. var player ;
  458. function playvideo(url){
  459. var location = window.location.href;
  460. url = location.substring(0,location.lastIndexOf("\/")+1)+url;
  461. player = new prismplayer({
  462. id: "J_prismPlayer", // 容器id
  463. source:url,
  464. autoplay: true, // 自动播放
  465. width: "100%", // 播放器宽度
  466. height: "400px" // 播放器高度
  467. });
  468. $("#video_player_modal").modal('show');
  469. }
  470. function close_video_player(){
  471. player.pause();
  472. $("#video_player_modal").modal('hide');
  473. }