manage.js 61 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915
  1. var g_ProjectName=window.location.pathname.substring(window.location.pathname.indexOf("/")+1,window.location.pathname.lastIndexOf("/"));
  2. var g_Prefix="https://super.4dage.com/";
  3. // var g_Prefix=window.location.href.substring(0,window.location.href.indexOf("/index.html")+1);
  4. var s = window.location.href.split('/');
  5. s.pop();
  6. //var g_Prefix = s.join('/');
  7. var g_index=null;
  8. var g_modeldata=null;
  9. var g_weixinTitle=null;
  10. var g_Hots=null;
  11. var g_HotMeshes=[];
  12. var g_HotMeshSize = {
  13. g_HotMeshWidth: 0.3,
  14. g_HotMeshHeight:0.3
  15. };
  16. //add表示添加,delete表示删除
  17. var g_HotStatus=null;
  18. var g_newHot = [];//存储新加热点
  19. var g_HotImage= {
  20. "point":"https://super.4dage.com/images/4dagePoint2.png",
  21. "point2":"https://super.4dage.com/images/4dagePoint.png"
  22. };
  23. var g_saveHot=false;
  24. var g_TextColor=0x7777ff;
  25. var g_Text=null;
  26. var g_TextPlaneMesh=[];
  27. var g_TextIconMesh=[];
  28. var g_TextIcon="./images/text.png";
  29. var g_SelectTextIndex=null;
  30. var g_TextShow=null;
  31. var g_audioPlay=false;
  32. var g_background=null;
  33. var g_roof=null;
  34. var g_data2 = null;//加载的data2.js的内容
  35. var g_bgAudio=null;//背景音乐
  36. var g_tourAudio=null;//导览音乐
  37. var g_play = 1;//表示播放图标状态
  38. var g_playAudio = null;//当前在播放或当继续播放时应该播放的,是g_bgAudio或g_tourAudio
  39. var g_currentHot = null;//当前打开的热点
  40. //var g_Texture=null;
  41. //var g_ChunknameTexture={}; //chunkname和贴图名称对应
  42. var g_NormalTexture=false;
  43. var g_SpecularTexture=false;
  44. var g_DirectionalLight=null;
  45. var g_snapShotWidth = 200; //截图下载图片的大小
  46. var g_snapShotHeight = 140;
  47. //微信分享
  48. var g_weixinObj = {
  49. "title": document.querySelector("head title").innerHTML,
  50. "lineLink" : window.location.href,
  51. "imgUrl" : "https://www.4dmodel.com/SuperPanoramic/images/weixintitle.jpg",
  52. "desc" : "四维时代提供技术支持",
  53. }
  54. var settings = {
  55. hotClickEvent:{
  56. video:{
  57. playAndPause:true,
  58. examine:false,
  59. openHot:false
  60. },
  61. photo:{
  62. examine:false,
  63. openHot:false
  64. },
  65. shine:{
  66. examine:true,
  67. openHot:true
  68. }
  69. },
  70. hotClickActions:['playAndPause','examine','openHot','fastTran'],
  71. //默认的:
  72. teleportTime: 1500,//瞬间过渡的时间
  73. /* flytimeDistanceMultiplier:150,
  74. flyTime:750, */
  75. tourRotTime:2, //默认停留2秒
  76. //dontExamHot:true,
  77. hotFastTran:true,
  78. transparentBg: false,
  79. bgImg: null,
  80. tileClass:{//默认全景贴图加载的清晰度
  81. pc:{
  82. nav: '2k',
  83. max: '4k',
  84. },
  85. bigMobile:{ //width和height都超过一定值
  86. nav: '2k',
  87. max: '2k',
  88. },
  89. mobile:{
  90. nav: '1k', //不放大时
  91. max: '2k', //放大最大
  92. }
  93. }, //可以稍后自行修改
  94. }
  95. if(window.number == '725'||window.number == '724'){
  96. //settings.mobileNavHigh = true
  97. settings.tileClass.mobile = {nav:'2k', max: '2k'}
  98. }
  99. //共用函数:
  100. window.common = null;
  101. window.MathLight = null;
  102. window.math = null
  103. window.easing = null
  104. window.lerp = null
  105. window.transitions = null
  106. window.browser = null
  107. function watch(object, propName, initialValue){ //监听某个属性的变化
  108. let v = initialValue
  109. Object.defineProperty(object, propName, {
  110. get: function() {
  111. return v
  112. },
  113. set: function(e) {
  114. console.log('watch:',propName, e)
  115. v = e
  116. }
  117. })
  118. }
  119. var toPrecision = function(e, t) {
  120. function i(e, t) {
  121. var i = Math.pow(10, t);
  122. return Math.round(e * i) / i
  123. }
  124. if (e instanceof Array) {
  125. for (var n = 0; n < e.length; n++)
  126. e[n] = i(e[n], t);
  127. return e
  128. }
  129. return i(e, t)
  130. }
  131. var dealMap = (map, o={} )=>{
  132. //使不resize when image is not power of two ,但缩小时会有锯齿
  133. if(!o.ignoreResize){
  134. if(!map.image || !THREE.Math.isPowerOfTwo(map.image.width ) || !THREE.Math.isPowerOfTwo(map.image.height )){
  135. map.wrapS = map.wrapT = THREE.ClampToEdgeWrapping;
  136. map.minFilter = THREE.LinearFilter;
  137. map.generateMipmaps = true;
  138. }
  139. }
  140. if(!browser.isMobile()) map.anisotropy = 3
  141. }
  142. var dom = {
  143. getOffset: function(type, element, parent) {
  144. left = (type == "left") ? element.offsetLeft : element.offsetTop;
  145. if (!parent) parent = $("body")[0];
  146. while (element = element.offsetParent) {
  147. if (element == parent) break;
  148. left += (type == "left") ? element.offsetLeft : element.offsetTop;
  149. }
  150. return left;
  151. }
  152. };
  153. var getTransformSid = function(){
  154. var name
  155. if(player.mode == 'panorama'){
  156. name = player.currentPano ? player.currentPano.id : 'outside'
  157. }else{
  158. name = 'outside'
  159. }
  160. return name
  161. }
  162. var LineDraw = {
  163. /* createLine: function(posArr, o) {
  164. var e = new THREE.BufferGeometry
  165. , p = new Float32Array(6);
  166. e.addAttribute("position", new THREE.BufferAttribute(p,3));
  167. //这句新旧版写法不同 旧版这样:e.addAttribute("position",Float32Array,2,3);
  168. var p = e.attributes.position.array;
  169. for (var i = 0; i < 2; i++) {
  170. p[i * 3] = posArr[i].x;
  171. p[i * 3 + 1] = posArr[i].y;
  172. p[i * 3 + 2] = posArr[i].z;
  173. }
  174. var mat = new THREE[o.deshed ? "LineDashedMaterial" : "LineBasicMaterial"]({
  175. linewidth: o.width || 1,
  176. //windows无效。 似乎mac/ios上粗细有效 ?
  177. color: o.color || defaultColor,
  178. transparent: o.dontAlwaysSeen ? false : true,
  179. depthTest: o.dontAlwaysSeen ? true : false
  180. })
  181. var line = new THREE.Line(e,mat);
  182. line.renderOrder = o.renderOrder || 4
  183. //同tagStem; //如果不加高,可能会部分被model遮住
  184. return line;
  185. } */
  186. createLine: function (posArr, o={}) {
  187. //多段普通线 (第二个点和第三个点之间是没有线段的, 所以不用在意线段顺序)
  188. var mat
  189. if(o.mat){
  190. mat = o.mat
  191. }else{
  192. let prop = {
  193. lineWidth: o.lineWidth || 1,
  194. //windows无效。 似乎mac/ios上粗细有效 ?
  195. color: o.color || defaultColor,
  196. transparent: o.dontAlwaysSeen ? false : true,
  197. depthTest: o.dontAlwaysSeen ? true : false,
  198. opacity: o.opacity != void 0 ? o.opacity : 1,
  199. }
  200. if(o.deshed ){
  201. prop.dashSize = o.dashSize || 0.1,
  202. prop.gapSize = o.gapSize || 0.1
  203. }
  204. mat = new THREE[o.deshed ? "LineDashedMaterial" : "LineBasicMaterial"](prop)
  205. }
  206. var line = new THREE.LineSegments(new THREE.BufferGeometry, mat);
  207. line.renderOrder = o.renderOrder || 4
  208. this.moveLine(line, posArr)
  209. return line;
  210. },
  211. moveLine: function (line, posArr) {
  212. if(posArr.length == 0)return
  213. let position = new Float32Array(posArr.length * 3); //[]
  214. for (var i = 0; i < 2; i++) {
  215. position[i * 3] = posArr[i].x;
  216. position[i * 3 + 1] = posArr[i].y;
  217. position[i * 3 + 2] = posArr[i].z;
  218. }
  219. line.geometry.addAttribute("position", new THREE.BufferAttribute(position,3));
  220. //line.geometry.setAttribute('position', new THREE.Float32BufferAttribute(new Float32Array(position), 3));
  221. line.geometry.attributes.position.needsUpdate = true;
  222. line.geometry.computeBoundingSphere();
  223. /* if(line.material instanceof THREE.LineDashedMaterial){
  224. line.computeLineDistances() //只有非buffer的geometry才有
  225. } */
  226. }
  227. ,
  228. }
  229. var convertTool = {
  230. getPos2d : function(point, camera, dom){//获取一个三维坐标对应屏幕中的二维坐标
  231. var camera = camera || player.camera;
  232. var dom = dom || player.domElement;
  233. if(!camera)return
  234. var pos = point.clone().project(camera) //比之前hotspot的计算方式写得简单 project用于3转2(求法同shader); unproject用于2转3 :new r.Vector3(e.x, e.y, -1).unproject(this.camera);
  235. var x,y;
  236. x = (pos.x + 1) / 2 * dom.clientWidth;
  237. y = (1 - (pos.y + 1) / 2) * dom.clientHeight;
  238. var inSight = x <= dom.clientWidth && x >= 0 //是否在屏幕中
  239. && y <= dom.clientHeight && y >= 0
  240. return {
  241. pos: new THREE.Vector2(x,y), // 屏幕像素坐标
  242. vector: pos, //(范围 -1 ~ 1)
  243. trueSide : pos.z<1, //trueSide为false时,即使在屏幕范围内可见,也是反方向的另一个不可以被渲染的点 参见Tag.update
  244. inSight : inSight //在屏幕范围内可见
  245. };
  246. },
  247. ifShelter: function (pos3d, pos2d, camera, floorIndex) {
  248. //检测某点在视线中是否被mesh遮挡
  249. if (!pos2d) pos2d = convertTool.getPos2d(pos3d )
  250. camera = camera || player.camera
  251. var ori = new THREE.Vector3(pos2d.x, pos2d.y, -1).unproject(camera) //找到视线原点
  252. var dir = pos3d.clone().sub(ori).normalize()
  253. var ray = new THREE.Raycaster(ori, dir); //由外向里 因为模型从内侧是可见的所以从外侧
  254. /* if(config.isEdit && publicObjectSet.editor.mainDesign.editing){
  255. var o = ray.intersectObjects(publicObjectSet.editor.mainDesign.wallMeshes);
  256. }else{ */
  257. let colliders = player.model.allFloorsVisible ? player.model.colliders : (floorIndex != void 0 ? player.model.floors.index[floorIndex] : player.model.currentFloor).collider.children
  258. //let colliders = (floorIndex == void 0 ) ? player.model.colliders : player.model.floors.index[floorIndex].collider.children
  259. var o = ray.intersectObjects(colliders);
  260. //}
  261. var len = pos3d.distanceTo(ori);
  262. if (o && o.length) {
  263. for(var i=0;i<o.length;i++){
  264. if(o[i].distance < len){ return true; }//有遮挡
  265. }
  266. }
  267. },
  268. /*
  269. 拖拽时,获取鼠标在拖拽面上的位置(需要借助另一个intersectPlane面来计算,即和相机方向一样的面,可保证铺满屏幕)
  270. 但是不一定能获取到,比如鼠标射线不朝向拖拽面时,即使获取也会是一个意外的反方向的交点。
  271. */
  272. getPosAtPlane : function(pos, info/* , mouse, camera */){ //pos:与intersectPlane的交点 见笔记
  273. var A = pos;
  274. var player = player;
  275. var mouse = player.mouse;
  276. var O = new THREE.Vector3(mouse.x, mouse.y, -1).unproject(player.camera);
  277. if(info.y != void 0){//地面线的
  278. var y = info.y;
  279. if(player.mode == "floorplan"/* || Math.abs(O.x-pos.x)<0.0001 && Math.abs(O.z-pos.z)<0.0001) */){
  280. //intersectPlane和地面平行,无交点
  281. var x = pos.x, z = pos.z;
  282. }else{
  283. if(y<player.camera.position.y && O.y <= A.y /* || y>player.camera.position.y && O.y >= A.y */)return null; //鼠标射线向上。因为相机一定位于地面以上(地面不会抬高到相机上吧?),所以无交点。
  284. if(O.y == A.y){console.log('一样??');return;}
  285. if(A.y == y){console.log('一样2??');return;}
  286. var r = (O.y-y)/(A.y-y);
  287. var x = (r*A.x-O.x)/(r-1);
  288. var z = (r*A.z-O.z)/(r-1);
  289. }
  290. }else{//垂直的也有越过消失点以后反向变化的情况,但使用时影响不大
  291. var N = info.normalVec;
  292. var P = info.pullPos;
  293. if(N.y != 0 ){console.log('N.y != 0');return;} //仅仅支持垂直于地面的的墙壁,目前都是
  294. if(O.z==A.z){console.log('O.z==A.z?');return;}
  295. if(N.z!=0 && N.x != 0){//直接用这个通用的也可以,支持斜线的墙
  296. //console.log('N.z==0 && N.x == 0?');
  297. var c = ( N.x*(A.x-O.x) + N.y*(A.y-O.y) + N.z*(A.z-O.z));
  298. if(c == 0){console.log("分母为0?? return;");return;}
  299. var t = -((N.x*O.x + N.y*O.y + N.z*O.z) - (P.x*N.x + P.y*N.y + P.z*N.z) ) / c
  300. var x = t * (A.x - O.x) + O.x;
  301. var y = t * (A.y - O.y) + O.y;
  302. var z = t * (A.z - O.z) + O.z;
  303. /*原理: 已知空间直线L:(x-a)/m=(x-b)/n=(z-c)/p和空间平面π:Ax+By+Cz+D=0;
  304. 求直线L与平面π的交点的坐标。
  305. 把直线方程改写成参数形式:设(x-a)/m=(x-b)/n=(z-c)/p=t;
  306. 则x=mt+a;y=nt+b;z=pt+c;代入平面π的方程得:
  307. A(mt+a)+B(nt+b)+C(pt+c)+D=0
  308. 由此解得t=-(Aa+Bb+Cc+D)/(Am+Bn+Cp)
  309. 再代入参数方程即得交点的坐标(x,y,z). */
  310. }else if(N.x ==0 ){ //z与pullPos相等
  311. var z = P.z;
  312. if(O.y == A.y){console.log('一样??');return;}
  313. if(A.y == y){console.log('一样2??');return;}
  314. if(A.z == z){console.log('一样3??');return;}
  315. var r = (O.z-z)/(A.z-z);
  316. var x = (r*A.x-O.x)/(r-1);
  317. var y = (r*A.y-O.y)/(r-1);
  318. }else if(N.z == 0){//x与pullPos相等
  319. var x = P.x;
  320. if(O.y == A.y){console.log('一样??');return;}
  321. if(A.y == y){console.log('一样2??');return;}
  322. if(A.x == x){console.log('一样3??');return;}
  323. var r = (O.x-x)/(A.x-x);
  324. var y = (r*A.y-O.y)/(r-1);
  325. var z = (r*A.z-O.z)/(r-1);
  326. }
  327. }
  328. return new THREE.Vector3(x,y,z);
  329. },
  330. getMouseIntersect : function(camera, meshes, mouse){//获取鼠标和meshes交点
  331. var raycaster = new THREE.Raycaster;
  332. camera.updateMatrixWorld();
  333. var origin = new THREE.Vector3(mouse.x,mouse.y,-1).unproject(camera)
  334. , end = new THREE.Vector3(mouse.x,mouse.y,1).unproject(camera);
  335. var dir = end.sub(origin).normalize()
  336. raycaster.set(origin, dir);
  337. var n = raycaster.intersectObjects(meshes);
  338. if (0 === n.length)
  339. return null;
  340. return n[0];
  341. },
  342. ifIntersectChunks : function(A,B,options={}){//获取某个线段/射线和meshes的交点
  343. var dir = B.clone().sub(A).normalize();
  344. var len = options.InfinityLen ? Infinity : A.distanceTo(B) + (options.extLen||0);
  345. var ray = new THREE.Raycaster(A.clone(), dir, 0, len);
  346. var o = ray.intersectObjects(options.model || player.model.colliders);
  347. if (o && o.length)return o;
  348. if(options.throughWidth){ //允许最小宽度,防止穿过极小的缝隙导致撞墙感
  349. var normal = math.getNormal({points:[{x:A.x, y:A.z},{x:B.x, y:B.z}]});//线段法线
  350. normal.multiplyScalar(options.throughWidth)
  351. var normalVec3 = new THREE.Vector3(normal.x, 0, normal.y);
  352. var A2 = A.clone().add(normalVec3)
  353. ray.set(A2, dir);
  354. var o2 = ray.intersectObjects(options.model || player.model.colliders);
  355. ray.set(A.clone().add(normalVec3.negate()), dir);
  356. if (o2 && o2.length)return o2;
  357. var o3 = ray.intersectObjects(options.model || player.model.colliders);
  358. if (o3 && o3.length)return o3;
  359. }
  360. return null;
  361. },
  362. getPosAtSphere : function(pos3d, toPanoPos){
  363. var dir = pos3d.clone().sub(toPanoPos);
  364. dir.normalize();//然后计算在球中
  365. dir.multiplyScalar(Constants.skyRadius);
  366. dir.add(toPanoPos);
  367. return dir;
  368. } ,
  369. getScaleForConstantSize : function(op={}){ //获得规定二维大小的mesh的scale值。可以避免因camera的projection造成的mesh视觉大小改变。 来源:tag.updateDisc
  370. var w;
  371. var i = new THREE.Vector3, o = new THREE.Vector3, l = new THREE.Vector3, c = new THREE.Vector3, h = new THREE.Vector3
  372. if(op.width2d) w = op.width2d //如果恒定二维宽度
  373. else{//否则考虑上距离,加一丢丢近大远小的效果
  374. var currentDis, nearBound, farBound
  375. if(op.camera.type == "OrthographicCamera"){
  376. currentDis = (op.camera.right - op.camera.left) / op.camera.zoom
  377. }else{
  378. currentDis = op.position.distanceTo(op.camera.position);
  379. }
  380. w = op.maxSize - ( op.maxSize - op.minSize) * THREE.Math.smoothstep(currentDis, op.nearBound, op.farBound);
  381. //maxSize : mesh要表现的最大像素宽度; nearBound: 最近距离,若比nearBound近,则使用maxSize
  382. }
  383. i.copy(op.position).project(op.camera), //tag中心在屏幕上的二维坐标
  384. o.set(op.resolution.x / 2, op.resolution.y / 2, 1).multiply(i), //转化成px -w/2 到 w/2的范围
  385. l.set(w / 2, 0, 0).add(o), //加上tag宽度的一半
  386. c.set(2 / op.resolution.x, 2 / op.resolution.y, 1).multiply(l), //再转回 -1 到 1的范围
  387. h.copy(c).unproject(op.camera);//再转成三维坐标,求得tag边缘的位置
  388. var g = h.distanceTo(op.position)//就能得到tag的三维半径
  389. return g //可能NAN 当相机和position重叠时
  390. } ,
  391. updateVisible : function(object, reason, ifShow, level=0, type){//当所有加入的条件都不为false时才显示. reason='force'一般是强制、临时的
  392. if(!object.unvisibleReasons) object.unvisibleReasons = []; //如果length>0代表不可见
  393. if(!object.visibleReasons) object.visibleReasons = []; //在同级时,优先可见
  394. var update = function(){
  395. //先按从高到低的level排列
  396. object.unvisibleReasons = object.unvisibleReasons.sort((a,b)=>b.level-a.level)
  397. object.visibleReasons = object.visibleReasons.sort((a,b)=>b.level-a.level)
  398. var maxVisiLevel = object.visibleReasons[0] ? object.visibleReasons[0].level : -1
  399. var maxunVisiLevel = object.unvisibleReasons[0] ? object.unvisibleReasons[0].level : -1
  400. var shouldVisi = maxVisiLevel >= maxunVisiLevel
  401. var visiBefore = object.visible
  402. if(visiBefore != shouldVisi){
  403. object.visible = shouldVisi
  404. object.dispatchEvent({
  405. type: 'isVisible',
  406. visible: shouldVisi,
  407. reason,
  408. })
  409. }
  410. }
  411. if(ifShow){
  412. var index = object.unvisibleReasons.findIndex(e=>e.reason == reason)
  413. if(index > -1){
  414. type = 'cancel'
  415. object.unvisibleReasons.splice(index, 1);
  416. }
  417. if(type == 'add' ){
  418. if(!object.visibleReasons.some(e=>e.reason == reason)){
  419. object.visibleReasons.push({reason,level})
  420. }
  421. }
  422. }else{
  423. var index = object.visibleReasons.findIndex(e=>e.reason == reason)
  424. if(index > -1){
  425. type = 'cancel'
  426. object.visibleReasons.splice(index, 1);
  427. }
  428. if(type != 'cancel' ){
  429. if(!object.unvisibleReasons.some(e=>e.reason == reason)){
  430. object.unvisibleReasons.push({reason,level})
  431. }
  432. }
  433. }
  434. update()
  435. },
  436. getObjVisiByReason : function(object,reason){//获取在某条件下是否可见. 注: 用户在数据集选择可不可见为"datasetSelection"
  437. if(object.visible)return true
  438. else{
  439. return !object.unvisibleReasons || !object.unvisibleReasons.some(e=>e.reason == reason)
  440. }
  441. }
  442. }
  443. //--------------------------------------
  444. //管理js文件 获取modeldata.js 判断是否有特殊的字段,如果有就先加载SpecialScene.js 里面有对特殊场景处理的代码 否则就直接加载main
  445. var Manage = function(){
  446. this.weixinURL = "https://res.wx.qq.com/open/js/jweixin-1.2.0.js",
  447. this.time = "?"+new Date().getTime();
  448. this.loadAudio();
  449. this.loadWeixin();
  450. }
  451. //动态加载js文件
  452. Manage.prototype.LoadJs = function(_files, succes){
  453. /* 已加载文件缓存列表,用于判断文件是否已加载过,若已加载则不再次加载*/
  454. var classcodes = [];
  455. var FileArray = [];
  456. if (typeof _files === "object") {
  457. FileArray = _files;
  458. } else {
  459. /*如果文件列表是字符串,则用,切分成数组*/
  460. if (typeof _files === "string") {
  461. FileArray = _files.split(",");
  462. }
  463. }
  464. if (FileArray != null && FileArray.length > 0) {
  465. var LoadedCount = 0;
  466. for (var i = 0; i < FileArray.length; i++) {
  467. loadFile(FileArray[i], function() {
  468. LoadedCount++;
  469. if (LoadedCount == FileArray.length) {
  470. try {
  471. succes();
  472. }
  473. catch(err) {
  474. console.log("err: 您未定义回调");
  475. }
  476. }
  477. })
  478. }
  479. }
  480. /*加载JS文件,url:文件路径,success:加载成功回调函数*/
  481. function loadFile(url, success) {
  482. if (!FileIsExt(classcodes, url)) {
  483. var _ThisType = GetFileType(url);
  484. var ThisType = _ThisType.indexOf("?") == -1 ? _ThisType : _ThisType.substring(0,_ThisType.indexOf("?"));
  485. var fileObj = null;
  486. if (ThisType == ".js") {
  487. fileObj = document.createElement('script');
  488. fileObj.src = url;
  489. } else if (ThisType == ".css") {
  490. fileObj = document.createElement('link');
  491. fileObj.href = url;
  492. fileObj.type = "text/css";
  493. fileObj.rel = "stylesheet";
  494. } else if (ThisType == ".less") {
  495. fileObj = document.createElement('link');
  496. fileObj.href = url;
  497. fileObj.type = "text/css";
  498. fileObj.rel = "stylesheet/less";
  499. }
  500. success = success || function() {};
  501. fileObj.onload = fileObj.onreadystatechange = function() {
  502. if (!this.readyState || 'loaded' === this.readyState || 'complete' === this.readyState) {
  503. success();
  504. classcodes.push(url)
  505. }
  506. }
  507. document.getElementsByTagName('head')[0].appendChild(fileObj);
  508. } else {
  509. success();
  510. }
  511. }
  512. /*获取文件类型,后缀名,小写*/
  513. function GetFileType(url) {
  514. if (url != null && url.length > 0) {
  515. return url.substr(url.lastIndexOf(".")).toLowerCase();
  516. }
  517. return "";
  518. }
  519. /*文件是否已加载*/
  520. function FileIsExt(FileArray, _url) {
  521. if (FileArray != null && FileArray.length > 0) {
  522. var len = FileArray.length;
  523. for (var i = 0; i < len; i++) {
  524. if (FileArray[i] == _url) {
  525. return true;
  526. }
  527. }
  528. }
  529. return false;
  530. }
  531. };
  532. //获取页面url后面的参数
  533. Manage.prototype.number = function(variable) {
  534. var query = window.location.search.substring(1);
  535. var vars = query.split("&");
  536. for (var i=0;i<vars.length;i++) {
  537. var pair = vars[i].split("=");
  538. if(pair[0] == variable){return pair[1];}
  539. }
  540. return(false);
  541. };
  542. Manage.prototype.loadWeixin = function() {
  543. var that = this;
  544. this.LoadJs(that.weixinURL+that.time,function(){ });
  545. }
  546. Manage.prototype.weixinShare = function() {
  547. console.log("weixinShare")
  548. $.ajax({
  549. url:'https://www.4dage.com/wechat/jssdk/',
  550. type: "post",
  551. data : {
  552. 'url' : location.href.split('#')[0]
  553. },
  554. dataType:"jsonp",
  555. jsonpCallback:"success_jsonp",
  556. success:function(data,textStatus){
  557. console.log("weixinShare success")
  558. console.log(data.appId)
  559. wx.config({
  560. // debug : true,
  561. appId : data.appId,
  562. timestamp : data.timestamp,
  563. nonceStr : data.nonceStr,
  564. signature : data.signature,
  565. jsApiList : [ 'checkJsApi', 'onMenuShareTimeline',
  566. 'onMenuShareAppMessage', 'onMenuShareQQ',
  567. 'onMenuShareWeibo', 'hideMenuItems',
  568. 'showMenuItems', 'hideAllNonBaseMenuItem',
  569. 'showAllNonBaseMenuItem', 'translateVoice',
  570. 'startRecord', 'stopRecord', 'onRecordEnd',
  571. 'playVoice', 'pauseVoice', 'stopVoice',
  572. 'uploadVoice', 'downloadVoice', 'chooseImage',
  573. 'previewImage', 'uploadImage', 'downloadImage',
  574. 'getNetworkType', 'openLocation', 'getLocation',
  575. 'hideOptionMenu', 'showOptionMenu', 'closeWindow',
  576. 'scanQRCode', 'chooseWXPay',
  577. 'openProductSpecificView', 'addCard', 'chooseCard',
  578. 'openCard' ]
  579. });
  580. },
  581. error:function(XMLHttpRequest,textStatus,errorThrown){
  582. console.log("jsonp.error:"+textStatus);
  583. }
  584. });
  585. var success_jsonp = function(json){
  586. console.log(json);
  587. };
  588. wx.ready(function(){
  589. // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行〿
  590. //对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中〿
  591. //分享到朋友圈
  592. console.log(g_weixinObj)
  593. wx.onMenuShareTimeline({
  594. title: g_weixinObj.title, // 分享标题
  595. link: g_weixinObj.lineLink, // 分享链接
  596. imgUrl: g_weixinObj.imgUrl, // 分享图标
  597. desc: g_weixinObj.desc
  598. });
  599. //获取“分享给朋友”按钮点击状态及自定义分享内容接叿
  600. wx.onMenuShareAppMessage({
  601. title: g_weixinObj.title, // 分享标题
  602. desc: g_weixinObj.desc, // 分享描述
  603. link: g_weixinObj.lineLink, // 分享链接
  604. imgUrl: g_weixinObj.imgUrl, // 分享图标
  605. type: '', // 分享类型,music、video或link,不填默认为link
  606. dataUrl: '' // 如果type是music或video,则要提供数据链接,默认为空
  607. });
  608. wx.onMenuShareWeibo({
  609. title: g_weixinObj.title, // 分享标题
  610. desc: g_weixinObj.desc, // 分享描述
  611. link: g_weixinObj.lineLink, // 分享链接
  612. imgUrl: g_weixinObj.imgUrl, // 分享图标
  613. success: function () {
  614. // 用户确认分享后执行的回调函数
  615. },
  616. cancel: function () {
  617. // 用户取消分享后执行的回调函数
  618. }
  619. });
  620. wx.onMenuShareQZone({
  621. title: g_weixinObj.title, // 分享标题
  622. desc: g_weixinObj.desc, // 分享描述
  623. link: g_weixinObj.lineLink, // 分享链接
  624. imgUrl: g_weixinObj.imgUrl, // 分享图标
  625. success: function () {
  626. // 用户确认分享后执行的回调函数
  627. },
  628. cancel: function () {
  629. // 用户取消分享后执行的回调函数
  630. }
  631. });
  632. wx.onMenuShareQQ({
  633. title: g_weixinObj.title, // 分享标题
  634. desc: g_weixinObj.desc, // 分享描述
  635. link: g_weixinObj.lineLink, // 分享链接
  636. imgUrl: g_weixinObj.imgUrl, // 分享图标
  637. success: function () {
  638. // 用户确认分享后执行的回调函数
  639. },
  640. cancel: function () {
  641. // 用户取消分享后执行的回调函数
  642. }
  643. });
  644. wx.error(function(res){
  645. // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名〿
  646. });
  647. });
  648. }
  649. Manage.prototype.dealURL = function(src, type){
  650. //music: "///super.4dage.com/data/LYW/edit/20200928_151633415.mp3"
  651. //"https://super.4dage.com/data/LYW/edit/20200928_165319399.jpg"]
  652. if(window.isLocal && settings.localPrefix!=void 0){//本地将线上的前缀替换
  653. var oldPrefix = 'super.4dage.com/'; //最简单的地址写一个,如果有其他完全不一样的地址就用数组逐个判断
  654. var index = src.indexOf(oldPrefix);
  655. if(index>-1){
  656. var wholeOldPrefix = src.slice(0, index+oldPrefix.length);
  657. return src.replace(wholeOldPrefix, settings.localPrefix)
  658. }
  659. console.error("没有找到合适的本地链接")
  660. return src
  661. }else{
  662. //add https://
  663. var prefix = g_Prefix.replace('https://','').replace('http://','')
  664. if(!src.includes('http:/') && !src.includes('https:/') && src.includes(prefix)){
  665. src = 'https://'+src
  666. }
  667. return src
  668. }
  669. }
  670. Manage.prototype.removeSrcPostMark = function(url){//去除texture.load时自动加上的'?'
  671. var index = url.indexOf('?')
  672. if(index>-1){
  673. return url.slice(0, index)
  674. }else return url
  675. }
  676. Manage.prototype.showInfo = function (o) { // ({result:true, title:"发布成功"});
  677. var box = $(".resultBox");
  678. var title = o.title || o || i18n.get('保存成功');
  679. box.children().eq(0).html(title)
  680. //var time = o.time || THREE.Math.clamp((Config.lang=='en') ? title.length*50 : title.length*130 ,1300,5000);
  681. var time = o.time || THREE.Math.clamp(title.length*130 ,1300, 5000);
  682. o.time || console.log("showtime " + time)
  683. //实际有一半的时间在渐变透明度
  684. this.showInfoTimer && clearTimeout(this.showInfoTimer)
  685. box.removeClass("animate");//如果之后不久又要showinfo一个的话,先停止前面的animate
  686. setTimeout(function () {
  687. box.css(
  688. {
  689. '-webkit-animation-duration': time + 'ms',
  690. 'animation-duration': time + 'ms'
  691. }
  692. )
  693. if(o.top){
  694. box.children().css('top', o.top + "%");
  695. }else{
  696. box.children().css('top', '' )
  697. }
  698. box.removeClass("hide");
  699. box.addClass("animate");
  700. if (o.dontInteract) {//遮挡对屏幕的操作
  701. box.css('pointer-events', 'auto')
  702. } else {
  703. box.css('pointer-events', 'none')
  704. }
  705. this.showInfoTimer = setTimeout(function () {
  706. box.removeClass("animate");
  707. box.addClass("hide");
  708. this.showInfoTimer = null;
  709. }.bind(this), time + 20)
  710. }.bind(this), 50)//这个数字太小的话后面触发的没有重新animate的效果 应该要比帧率大吧
  711. }//like: manage.showInfo({title:'a', top:20})
  712. //公用的函数
  713. function getQueryVariable(variable)
  714. {
  715. var query = window.location.search.substring(1);
  716. var vars = query.split("&");
  717. for (var i=0;i<vars.length;i++) {
  718. var pair = vars[i].split("=");
  719. if(pair[0] == variable){return pair[1];}
  720. }
  721. return(false);
  722. }
  723. //隐藏公司Logo
  724. function showLogo(){
  725. $("#myCompany").hide();
  726. $("#loaderCoBrandName").hide();
  727. $("#title-logo").hide();
  728. $(".title-container").css("justify-content","center")
  729. }
  730. //czj 添加随机的时间
  731. function randomTime(){
  732. return new Date()
  733. };
  734. function matcher(data){
  735. if(!data || !g_version ) return data;
  736. delete data.model.vision_version;
  737. var _data = {
  738. files: {
  739. "templates": ["images/images{{number}}/{{filename}}"]
  740. },
  741. model :{
  742. sid :window.number,
  743. camera_start:
  744. data.model.images && data.model.images.length != 0 ?
  745. {
  746. camera: {
  747. zoom: "-1",
  748. quaternion: [
  749. JSON.parse(data.model.images[0].metadata).camera_quaternion.z,
  750. JSON.parse(data.model.images[0].metadata).camera_quaternion.w,
  751. JSON.parse(data.model.images[0].metadata).camera_quaternion.x,
  752. JSON.parse(data.model.images[0].metadata).camera_quaternion.y
  753. ]
  754. },
  755. pano: { uuid: JSON.parse(data.model.images[0].metadata).scan_id },
  756. mode: "0"
  757. }
  758. : ''
  759. },
  760. sid: window.number,
  761. hoticon: {
  762. default: "https://super.4dage.com/images/4dagePoint2.png",
  763. higt: "https://super.4dage.com/images/4dagePoint.png"
  764. },
  765. special: "false",
  766. weixinDesc: ""
  767. };
  768. $.extend(true,data,_data)
  769. return data;
  770. }
  771. function hotMatcher(data={}){
  772. //if(!data || !g_version) return data;
  773. if(g_version) {
  774. data.tourAudio = data.audio || {};
  775. }else{
  776. data.tourAudio = {}
  777. }
  778. return data;
  779. }
  780. var GifTexDeal = {
  781. animateObjects : [],
  782. animateTexs : [] ,
  783. addAnimation : function(texture, owner, info, id){
  784. /* if(this.animateObjects.find(e=>
  785. e.texture == texture && !ifSame(info, e.info)
  786. )) */
  787. var animation
  788. var tex = this.animateTexs.find(e=>e.texture == texture)
  789. if(tex){
  790. animation = tex
  791. }else{
  792. animation = {texture,info }
  793. this.animateTexs.push(animation)
  794. this.setRepeart(animation)
  795. }
  796. var object = {
  797. animation, //默认相同的texture对应的info是一样的, 对应一个animation
  798. owner,
  799. }
  800. this.animateObjects.push(object)
  801. return object
  802. },
  803. remove : function(object){
  804. var index = this.animateObjects.indexOf(object)
  805. if(index>-1){
  806. this.animateObjects.splice(index, 1)
  807. if(!this.animateObjects.find(e=>e.animation == object.animation)){
  808. let i = this.animateTexs.indexOf(object.animation)
  809. this.animateTexs.splice(i, 1)
  810. object.animation.texture.repeat.set(1,1)
  811. }
  812. this.stop(object)
  813. }
  814. },
  815. setRepeart : function(animation){
  816. animation.texture.repeat.set(1/animation.info.cellXcount, 1/animation.info.cellYcount)
  817. },
  818. start: function(object){
  819. if(!object || object.started )return;
  820. object.started = true
  821. if(object.animation.started)return;
  822. object.animation.started = true
  823. var info = object.animation.info
  824. var count = info.cellXcount * info.cellYcount - (info.voidCount || 0)
  825. if(count <= 1)return;
  826. transitions.start( (progress)=>{
  827. var index = Math.floor(count * progress);
  828. var indexX = index % info.cellXcount
  829. var indexY = info.cellYcount - Math.floor(index /info.cellXcount ) - 1; //uv.offset.y是从下到上的
  830. object.animation.texture.offset.x = indexX / info.cellXcount;
  831. object.animation.texture.offset.y = indexY / info.cellYcount;
  832. //console.log(object.id + " : "+ object.texture.offset.toArray())
  833. } , info.duration * (-1), null,/* ()=>{//done (-1):循环
  834. object.started = false
  835. object.texture.offset.x = 0;
  836. object.texture.offset.y = 0;
  837. this.start(object)
  838. }, */ 0 ,null, object.id, "gif_"+object.animation.texture.id);
  839. },
  840. stop: function(object){
  841. if(!object || !object.started)return;
  842. object.started = false
  843. //只有该object对应的texture对应的所有object都停止了,才能真的停止动画:
  844. if(this.animateObjects.find(e=>e.animation == object.animation && e.started)) return;
  845. transitions.cancelById("gif_"+object.animation.texture.id);
  846. object.animation.texture.offset.set(0,0)
  847. object.animation.started = false
  848. }
  849. }
  850. var CloneObject = function(copyObj, result, isSimpleCopy, extraReplace) {
  851. //isSimpleCopy只复制最外层
  852. //复制json result的可能:普通数字或字符串、普通数组、复杂对象
  853. if(!copyObj)return copyObj //0 null undefined ''
  854. result = result || {};
  855. if (copyObj instanceof Array) {
  856. /* if (copyObj[0]instanceof Object) {
  857. //不支持含有 [[Object]] 这样二级数组里面还是复杂数据的,普通和复杂的数据混合可能也不支持
  858. console.error("不支持含有 [[Object]] 这样二级数组里面还是复杂数据的...")
  859. }
  860. return copyObj.slice(0);*/ //如果是数组,直接复制返回(排除数组内是object
  861. return copyObj.map(e=>{
  862. if(e instanceof Object){
  863. return CloneObject(e)
  864. }else return e
  865. })
  866. }else{
  867. if(copyObj.clone instanceof Function ){ //解决一部分
  868. return copyObj.clone()
  869. }
  870. }
  871. for (var key in copyObj) {
  872. if (copyObj[key] instanceof Object && !isSimpleCopy)
  873. result[key] = CloneObject(copyObj[key]);
  874. else
  875. result[key] = copyObj[key];
  876. //如果是函数类同基本数据,即复制引用
  877. }
  878. return result;
  879. }
  880. ;
  881. var ifSame = function(object1, object2){
  882. if(object1 == object2 )return true // 0 != undefined , 0 == ''
  883. else if(!object1 || !object2) return false
  884. else if(object1.constructor != object2.constructor){
  885. return false
  886. }else if(object1 instanceof Array ) {
  887. if(object1.length != object2.length)return false;
  888. var _object2 = object2.slice(0);
  889. for(let i=0;i<object1.length;i++){
  890. var u = _object2.find(e=>ifSame(object1[i], e));
  891. if(u == void 0 && !_object2.includes(u) && !object1.includes(u))return false;
  892. else{
  893. let index = _object2.indexOf(u);
  894. _object2.splice(index,1);
  895. }
  896. }
  897. return true
  898. }else if(object1.equals instanceof Function ){//复杂数据仅支持这种,其他的可能卡住?
  899. return object1.equals(object2)
  900. }else if(typeof object1 == 'number' || typeof object1 == 'string'){
  901. if(isNaN(object1) && isNaN(object2))return true
  902. else return object1 == object2
  903. }else if(typeof object1 == "object"){
  904. var keys1 = Object.keys(object1)
  905. var keys2 = Object.keys(object2)
  906. if(!ifSame(keys1,keys2))return false;
  907. for(let i in object1){
  908. var same = ifSame(object1[i], object2[i]);
  909. if(!same)return false
  910. }
  911. return true
  912. }else{
  913. console.log('isSame出现例外')
  914. }
  915. }
  916. function initByTHREE(THREE){
  917. window.bus = new THREE.EventDispatcher();//因为player一开始总是没创建好,所以加一个事件传递器
  918. THREE.TransitionPass = function ( scene, camera ) {
  919. this.renderScene = scene;
  920. this.renderCamera = camera;
  921. this.coverRenderTarget = new THREE.WebGLRenderTarget( 100, 100, {
  922. minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter,
  923. format: THREE.RGBAFormat
  924. });
  925. this.coverTex = this.coverRenderTarget.texture;
  926. this.enabled = false;
  927. this.oldClearColor = new THREE.Color();
  928. this.oldClearAlpha = 1;
  929. this.camera = new THREE.OrthographicCamera( - 1, 1, 1, - 1, 0, 1 );
  930. this.scene = new THREE.Scene();
  931. this.material = this.getMaskMaterial()
  932. var copyShader = THREE.CopyShader;
  933. this.materialCopy = new THREE.ShaderMaterial( {
  934. uniforms: this.copyUniforms,
  935. vertexShader: copyShader.vertexShader,
  936. fragmentShader: copyShader.fragmentShader,
  937. blending: THREE.NoBlending,
  938. depthTest: false,
  939. depthWrite: false,
  940. transparent: true
  941. } );
  942. this.quad = new THREE.Mesh( new THREE.PlaneBufferGeometry( 2, 2 ), this.material);
  943. this.quad.frustumCulled = false; // Avoid getting clipped
  944. this.scene.add( this.quad );
  945. }
  946. THREE.TransitionPass.prototype = {//波形扩散,出下一个画面
  947. constructor: THREE.TransitionPass,
  948. setSize: function ( width, height ) {
  949. this.coverRenderTarget.setSize( width, height );
  950. },
  951. render: function ( renderer, writeBuffer, readBuffer, delta, maskActive ) {
  952. var oldAutoClear = renderer.autoClear;
  953. renderer.autoClear = false;
  954. var uniforms = this.quad.material.uniforms
  955. uniforms.bgTex.value = readBuffer.texture; //更新
  956. uniforms.coverTex.value = this.coverTex;
  957. uniforms.progress.value = player.model.skybox.material.uniforms.progress.value//
  958. uniforms.screenRatio.value = player.domElement.clientWidth / player.domElement.clientHeight;// 使波纹为圆形
  959. uniforms.screenRatio.value *= uniforms.screenRatio.value
  960. renderer.render( this.scene, this.camera);
  961. renderer.autoClear = oldAutoClear;
  962. },
  963. start:function(sceneRenderer){
  964. this.enabled = true
  965. //draw coverTex
  966. this.quad.material.uniforms.progress.value = 1;
  967. sceneRenderer.renderer.render( sceneRenderer.scene, sceneRenderer.camera, this.coverRenderTarget, true );
  968. console.log('start111')
  969. },
  970. stop:function(){
  971. this.enabled = false
  972. console.log('stop111')
  973. }
  974. ,
  975. getMaskMaterial :function(){
  976. return new THREE.ShaderMaterial( {
  977. uniforms: {
  978. coverTex: {
  979. type: "t",
  980. value: null
  981. },
  982. bgTex: {
  983. type: "t",
  984. value: null
  985. },
  986. progress:{
  987. type: "f",
  988. value: 0
  989. },
  990. screenRatio:{
  991. type: "f",
  992. value: 1
  993. }
  994. },
  995. vertexShader: `
  996. varying vec2 vUv;
  997. void main()
  998. {
  999. vUv = uv;
  1000. gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
  1001. }
  1002. `,
  1003. fragmentShader: `
  1004. uniform sampler2D coverTex;
  1005. uniform sampler2D bgTex;
  1006. uniform float progress;
  1007. uniform float screenRatio;
  1008. varying vec2 vUv;
  1009. void main() {
  1010. const float maxRadius = 0.708; // sqrt(0.5^2+0.5^2)
  1011. const float minRadius = 0.0 ;
  1012. float radius = screenRatio>1.0 ? sqrt((vUv.x - 0.5)*(vUv.x - 0.5) + (vUv.y - 0.5)*(vUv.y - 0.5)/screenRatio) : sqrt((vUv.x - 0.5)*(vUv.x - 0.5)*screenRatio+ (vUv.y - 0.5)*(vUv.y - 0.5));
  1013. float diff = 0.292; //1.0-maxRadius;
  1014. float radiusIn = maxRadius * progress + minRadius * (1.0-progress);
  1015. float radiusOut = radiusIn + diff;
  1016. if(radius < radiusIn) {
  1017. gl_FragColor = texture2D(bgTex, vUv);
  1018. //gl_FragColor = vec4(0.0,0.0,1.0,1.0);//
  1019. }else if(radius>radiusOut){
  1020. gl_FragColor = texture2D(coverTex, vUv) ;
  1021. //gl_FragColor = vec4(1.0,1.0,0.0,1.0);//
  1022. }else{
  1023. vec4 color1 = texture2D(bgTex, vUv);
  1024. vec4 color2 = texture2D(coverTex, vUv);
  1025. float rotio = smoothstep(radiusIn ,radiusOut,radius);
  1026. gl_FragColor = mix(color1, color2, rotio);
  1027. }
  1028. }
  1029. `
  1030. } );
  1031. },
  1032. }
  1033. let labels = []
  1034. class Label2D extends THREE.EventDispatcher{
  1035. constructor(o={}){
  1036. super()
  1037. this.position = o.position
  1038. this.elem = $(o.innerHTML || '<div ><a></a></div>');
  1039. $(o.domElement).append(this.elem)
  1040. this.pos2d = new THREE.Vector3
  1041. this.elem.css({position: 'absolute', 'z-index':999})
  1042. this.clickFun = o.clickFun;
  1043. this.clickFun && this.elem.on('click',this.clickFun.bind(this))
  1044. if(o.autoUpdate){
  1045. let update = (e)=>{if(e.cameraChanged) this.update()}
  1046. player.on("view.changed",update) //确保player存在
  1047. this.addEventListener('dispose', (e)=>{
  1048. player.off("view.changed",update)
  1049. })
  1050. }
  1051. this.visible = true
  1052. this.shelterByModel = o.shelterByModel
  1053. this.floorIndex = o.floorIndex
  1054. labels.push(this)
  1055. if(window.player.model){
  1056. this.init()
  1057. }else{
  1058. let f = ()=>{
  1059. window.bus.removeEventListener('playerAndModelReady',f)
  1060. this.init()
  1061. }
  1062. window.bus.addEventListener('playerAndModelReady',f)
  1063. }
  1064. }
  1065. init(){
  1066. if(this.floorIndex != void 0){
  1067. player.model.on("floor.changed",(currentFloor, mode, oldFloor)=>{
  1068. this.update(currentFloor) //注: currentFloor 这时候还没成为 model.currentFloor
  1069. })
  1070. }
  1071. }
  1072. update(currentFloor){
  1073. if(!this.position || !this.visible)return
  1074. var p = convertTool.getPos2d(this.position);
  1075. if(!p || !p.trueSide){
  1076. this.elem.css('display','none'); return;
  1077. }
  1078. //判断label是否被模型遮挡,遮挡则消失(如果是漫游模式最好提前计算visiblePanos)
  1079. if(player.mode != 'panorama'){
  1080. currentFloor = currentFloor || player.model.currentFloor
  1081. if(!player.model.allFloorsVisible && this.floorIndex != void 0 && this.floorIndex!= currentFloor.floorIndex){
  1082. this.elem.css('display','none'); return;
  1083. }
  1084. if(this.shelterByModel && convertTool.ifShelter(this.position , p.vector, this.floorIndex )){
  1085. this.elem.css('display','none'); return;
  1086. }
  1087. }
  1088. this.elem.css({
  1089. left: p.pos.x +'px',
  1090. top: p.pos.y +'px'
  1091. })
  1092. /* if(settings.vrEnabled){
  1093. this.elem.css({transform:'rotate('+window.screenFaceOrient+'deg)'})
  1094. }else{
  1095. this.elem.css({transform:''})
  1096. } */
  1097. this.elem.css('display','block');
  1098. this.pos2d = p.vector;
  1099. }
  1100. setVisible(visi, reason, level=0, type){
  1101. convertTool.updateVisible(this, reason, visi, level, type )
  1102. if(!this.visible){
  1103. this.elem.css('display','none');
  1104. }else{
  1105. this.update()
  1106. }
  1107. }
  1108. setPos(pos){
  1109. this.position = pos;
  1110. this.update()
  1111. }
  1112. dispose(){
  1113. this.elem.remove();
  1114. this._listeners = {}
  1115. this.dispatchEvent({type:'dispose'})
  1116. let index = labels.indexOf(this)
  1117. index > -1 && labels.splice(index,1)
  1118. }
  1119. }
  1120. window.Label2D = Label2D
  1121. class RoomLabel extends Label2D{
  1122. constructor(o){
  1123. if(o.position instanceof Array) o.position = new THREE.Vector3().fromArray(o.position)
  1124. o.innerHTML = `<div class="room-label" ><a><p><span>${o.title}</span></p></a></div>`
  1125. o.domElement = $(".widgets-doll-labels")[0]
  1126. o.shelterByModel = true , o.autoUpdate = true
  1127. o.clickFun = ()=>{
  1128. if(player.roomLebelClickUnabled)return
  1129. let result = common.sortByScore(player.model.floors.index[this.floorIndex].panos, [], [(pano)=>{
  1130. return -pano.position.distanceToSquared(this.position)
  1131. }]);
  1132. player.flyToPano({
  1133. pano : result && result[0] && result[0].item
  1134. })
  1135. }
  1136. super(o)
  1137. this.setTitle(o.title )
  1138. }
  1139. init(){
  1140. super.init()
  1141. //飞入后不可见
  1142. player.on("mode.changing",(oldMode, mode, pano, duration)=>{//准备飞
  1143. this.setStyle(oldMode, mode, duration)
  1144. })
  1145. this.setStyle()
  1146. }
  1147. setStyle(oldMode, mode, duration){
  1148. if(!mode) mode = player.modeTran.split('-')[1] || player.mode //要变成的mode或当前mode
  1149. if(mode == 'panorama'){
  1150. this.setVisible(false, 'isPanorama')
  1151. }else if(oldMode == 'panorama'){
  1152. setTimeout(()=>{
  1153. this.setVisible(true, 'isPanorama')
  1154. },duration*0.7)
  1155. }
  1156. }
  1157. setTitle(title){
  1158. this.title = title || ''
  1159. this.elem.html(`<a><p><span>${this.title}</span></p></a>`)
  1160. }
  1161. setEditSelect(state){//编辑页面用
  1162. this.editing = !!state
  1163. this.setVisible(state, 'editSelected', 1, state ? 'add':'cancel') //强制可见
  1164. }
  1165. }
  1166. window.RoomLabel = RoomLabel
  1167. let f = ()=>{
  1168. window.bus.removeEventListener('playerAndModelReady',f)
  1169. player.on("mode.changing",(currentMode, mode, pano, duration)=>{
  1170. let noLine = mode == 'floorplan';
  1171. if(noLine){
  1172. $('.widgets-doll-labels').addClass('noLine').addClass('noCorner')
  1173. }else{
  1174. $('.widgets-doll-labels').removeClass('noLine').removeClass('noCorner')
  1175. }
  1176. })
  1177. player.on("view.changed",(e)=>{
  1178. if(e.cameraChanged){
  1179. //if(needUpdateZIndex){ //如果某个label显示时需要更新index的话,加个参数
  1180. let label_ = labels.filter(e=>e.elem[0].style.display == 'block')
  1181. label_.sort((a,b)=>b.pos2d.z - a.pos2d.z)
  1182. label_.forEach((e,index)=>e.elem.css('z-index', index+1000));
  1183. //}
  1184. }
  1185. })
  1186. }
  1187. window.bus.addEventListener('playerAndModelReady',f) //player model currentPano都已有
  1188. window.bus.dispatchEvent({type: 'THREE_inited'})
  1189. }
  1190. //最好能知道应该播放到的currentTime
  1191. var SoundManager = {//暂不支持同时播放
  1192. currentAudio:null,//当前正在播放list中的哪一个
  1193. enableSound:true,//是否允许有声音
  1194. playHistory:[],//被打断的加入播放历史
  1195. list:[ ],//同一级别可以互相打断 //暂时不做多级别
  1196. play:function(name, src, currentTime){
  1197. var object = this.list.find(e=>e.name == name)
  1198. if(object){
  1199. if(this.currentAudio){
  1200. this.pause(this.currentAudio.name, false, true)
  1201. }
  1202. {//将当前要播放的播放历史中清除
  1203. let index = this.playHistory.indexOf(object)
  1204. if(index>-1)this.playHistory.splice(index,1);
  1205. }
  1206. this.currentAudio = object
  1207. if(src){
  1208. this.setSrc(name, src)
  1209. }
  1210. if(currentTime!=void 0){
  1211. object.audio.currentTime = currentTime
  1212. }
  1213. if(object.audio && object.src){
  1214. object.audio.load(); // iOS 9 还需要额外的 load 一下, 否则直接 play 无效 *///https://www.cnblogs.com/interdrp/p/4211883.html 部分资料
  1215. object.audio.play();
  1216. object.callback && object.callback(true)
  1217. Log(name + ' 播放 ' )
  1218. }
  1219. }
  1220. },
  1221. pause:function(name, autoReplayLast, isInterrupt){//需要能自动恢复上一个被打算的音频。恢复前判断是否还需要播放
  1222. var object = this.list.find(e=>e.name == name)
  1223. if(object && this.currentAudio == object){
  1224. this.currentAudio = null
  1225. if(object.audio){
  1226. object.audio.pause()
  1227. object.callback && object.callback(false)
  1228. object.audio.src && Log(name + ' 中断音频 '+ "("+common.getFileNameFromUrl(object.audio.src)+')' )
  1229. }
  1230. if(isInterrupt){//一般主动调用不需要加这个
  1231. this.playHistory.push(object)//如果是被中断的,加入播放历史,等待恢复播放
  1232. }
  1233. if(autoReplayLast){ //播放之前的音频。它们是被打断过的。
  1234. while(this.playHistory.length){
  1235. var last = this.playHistory.pop();
  1236. if(last.src && last.canplay(last.audio)){
  1237. this.play(last.name )
  1238. }
  1239. }
  1240. }
  1241. }
  1242. },
  1243. setSrc : function(name, src){//不能直接给audio赋src!一定要用这个函数!因为我要拿这里的src来判断有无src,因为貌似audio的src会自动变,''时会变成html的链接
  1244. var object = this.list.find(e=>e.name == name)
  1245. object.src = src
  1246. object.audio.src = src
  1247. Log(`${object.name} 设置src: ${src}`)
  1248. },
  1249. createAudio:function(object={}){//name, level, canplay
  1250. if(!object.fake){
  1251. object.audio = new Audio();
  1252. object.audio.loop = !!object.loop;
  1253. //object.audio.autoplay = true;
  1254. object.audio.addEventListener('ended', ()=>{
  1255. if(object.loop){//循环
  1256. Log(`${object.name} 播放完毕,重新播放`)
  1257. object.audio.play()
  1258. }else{
  1259. this.pause(object.name, true);//停止后的后续处理
  1260. }
  1261. });
  1262. object.audio.oncanplaythrough = ()=>{
  1263. Log(`${object.name} canplaythrough `)
  1264. }
  1265. }
  1266. this.list.push(object)
  1267. },
  1268. initAutoPlay:function(){ //处理设备自动播放限制
  1269. let play = function(){
  1270. if(this.currentAudio && this.currentAudio.audio && this.currentAudio.src){
  1271. this.currentAudio.audio.play()
  1272. Log(`${this.currentAudio.name} 自动播放成功`) //即使设置src在这之后好像也能成功播放
  1273. }else{
  1274. }
  1275. document.removeEventListener("touchstart",play);
  1276. document.removeEventListener("click",play);
  1277. $('#player')[0].removeEventListener("touchstart", play);
  1278. }.bind(this);
  1279. document.addEventListener("WeixinJSBridgeReady", play, false);
  1280. document.addEventListener("touchstart", play);//ios需要加个事件才能播放 不能自动播放;如果还有浏览器不行,换成别的交互事件
  1281. document.addEventListener("click", play);
  1282. $('#player')[0].addEventListener("touchstart", play);
  1283. }
  1284. }
  1285. function Log(value, color, fontSize){
  1286. color = color || '#13f'
  1287. fontSize = fontSize || 14
  1288. console.warn(`%c${value}`, `color:${color};font-size:${fontSize}px`)
  1289. }
  1290. Manage.prototype.loadAudio = function() { //相关:g_tourAudio \ g_playAudio
  1291. //热点页面因为挡住了界面,所以暂时不存在别的音频阻止热点音频的可能
  1292. //box视频都静音,所以暂时不考虑
  1293. SoundManager.createAudio({
  1294. name:'bgm',
  1295. level:0,
  1296. src:'',
  1297. loop:true,
  1298. canplay:(audio)=>{
  1299. return this.bgmShouldPlay
  1300. },
  1301. callback:(state)=>{//play或pause时随之触发的函数(即使还没开始播放)
  1302. if(state){
  1303. $("#volume a img").attr("src", "./images/Volume btn_off.png")
  1304. $("#volume").attr("title", "关闭声音");
  1305. }else{
  1306. $("#volume a img").attr("src", "./images/Volume btn_on.png")
  1307. $("#volume").attr("title", "打开声音");
  1308. }
  1309. }
  1310. })
  1311. SoundManager.createAudio({
  1312. name:'tour',
  1313. level:0,
  1314. src:'',
  1315. loop:false,
  1316. canplay:(audio)=>{
  1317. return player.director && player.director.tourIsPlaying && player.director.getAudio()
  1318. }
  1319. })
  1320. SoundManager.createAudio({
  1321. name:'hot',
  1322. fake:true,//实际上没有audio. 只是为了来停止和续播其他音频
  1323. level:1,
  1324. src:'',
  1325. loop:false,
  1326. canplay:(audio)=>{
  1327. }
  1328. })
  1329. $("#volume").find("a").on("click", ()=> {
  1330. if($("#volume img")[0].src.indexOf("btn_on.png")>-1)
  1331. {
  1332. this.switchBgmState(true);
  1333. }
  1334. else if($("#volume img")[0].src.indexOf("btn_off.png")>-1)
  1335. {
  1336. this.switchBgmState(false);
  1337. }
  1338. })
  1339. this.switchBgmState(true);//初始设置允许播放bgm
  1340. SoundManager.initAutoPlay()
  1341. }
  1342. Manage.prototype.switchBgmState = function(state){//按钮的状态完全代表是否应该播放bgm,即使还没加载完
  1343. this.bgmShouldPlay = state
  1344. if(state){
  1345. SoundManager.play('bgm')
  1346. }else{
  1347. SoundManager.pause('bgm')
  1348. }
  1349. /* if(!g_bgAudio || !g_bgAudio.src) return;
  1350. var played = function(){
  1351. console.log('begin play bgm');
  1352. g_play = 1;
  1353. g_playAudio = g_bgAudio;
  1354. g_tourAudio && g_tourAudio.pause()
  1355. }
  1356. var paused = function(){
  1357. g_play = 0;
  1358. g_playAudio == g_bgAudio && (g_playAudio = null)
  1359. }
  1360. if(state ){
  1361. g_bgAudio.play();
  1362. if(g_bgAudio.paused){
  1363. paused()
  1364. }else{
  1365. played()
  1366. return true
  1367. }
  1368. }else{
  1369. g_bgAudio.pause();
  1370. paused()
  1371. }
  1372. g_bgAudio.pauseByHot = false
  1373. g_bgAudio.pauseByTour = false */
  1374. }
  1375. var manage = new Manage();
  1376. //处理cursor优先级
  1377. var CursorDeal = {
  1378. priorityEvent : [//在前面的优先级高
  1379. {"noIntersect":'not-allowed'},
  1380. {"addHot":'cell'},
  1381. {"hoverFootIcon":'pointer'},
  1382. {"hoverHot":'pointer'},
  1383. {"addLabel":'cell'},
  1384. {"moveLabel":'grab'},
  1385. ],
  1386. domElements :[$('#player')[0]],
  1387. list:[], //当前存在的cursor状态
  1388. currentCursorIndex:null,
  1389. /* init : function(viewer){
  1390. this.priorityEvent.forEach(e=>{//刚开始Potree.resourcePath没值,现在换
  1391. for(let i in e){
  1392. e[i] = Common.replaceAll(e[i],'{Potree.resourcePath}',Potree.resourcePath)
  1393. }
  1394. })
  1395. this.domElements = [viewer.renderArea, viewer.mapViewer.renderArea];
  1396. viewer.addEventListener("CursorChange",(e)=>{
  1397. if(e.action == 'add'){
  1398. this.add(e.name)
  1399. }else{
  1400. this.remove(e.name)
  1401. }
  1402. })
  1403. }, */
  1404. add : function(name){
  1405. var priorityItem = this.priorityEvent.find(e=>e[name])
  1406. if(!priorityItem){
  1407. console.error('CursorDeal 未定义优先级 name:'+ name);
  1408. return
  1409. }
  1410. if(!this.list.includes(name)){
  1411. this.judge({addItem: priorityItem, name})
  1412. this.list.push(name)
  1413. }
  1414. },
  1415. remove : function(name){
  1416. var index = this.list.indexOf(name);
  1417. if(index > -1){
  1418. this.list.splice(index, 1)
  1419. this.judge()
  1420. }
  1421. },
  1422. judge:function(o={}){
  1423. //console.log(o,this.list)
  1424. if(o.addItem){
  1425. var addIndex = this.priorityEvent.indexOf(o.addItem)
  1426. if(addIndex < this.currentCursorIndex || this.currentCursorIndex == void 0){
  1427. this.domElements.forEach(e=>e.style.cursor = o.addItem[o.name] )
  1428. this.currentCursorIndex = addIndex
  1429. }
  1430. }else{
  1431. var levelMax = {index:Infinity, cursor:null }
  1432. this.list.forEach(name=>{
  1433. var priorityItem = this.priorityEvent.find(e=>e[name])
  1434. var index = this.priorityEvent.indexOf(priorityItem)
  1435. if(index < levelMax.index){
  1436. levelMax.index = index;
  1437. levelMax.cursor = priorityItem[name]
  1438. }
  1439. })
  1440. this.currentCursorIndex = levelMax.index
  1441. this.domElements.forEach(e=>e.style.cursor = levelMax.cursor || '')
  1442. }
  1443. }
  1444. }
  1445. //兼容一代的場景
  1446. //請求地址統一管理
  1447. var g_onePregix = "https://bigscene.4dage.com/" //对应一代 http://www.4dmodel.com/SuperPanoramic/index.html?m=55
  1448. var g_version = manage.number("version");
  1449. g_version === "one" ? g_Prefix = g_onePregix : '';