manage.js 57 KB

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