1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606 |
- //合并热点和展览
- g_currentHot = null;
- const playVideoWhenFlyOut = false
- window.initHot = function(model) {
- var objLoader = new THREE.OBJLoader();
- var _planeGeometry = new THREE.PlaneGeometry(1, 1);
- var _boxGeometry = new THREE.BoxBufferGeometry(1, 1, 1);
- {
- //ie的mesh 加了polygonOffset也是会重叠。所以去掉前面的face: (但是突然ie又播放不了videoTexture)
- var newIndex = [..._boxGeometry.index.array];
- newIndex.splice(4 * 6, 12);
- _boxGeometry.setIndex(new THREE.BufferAttribute(new Uint16Array(newIndex), 1));
- }
- var originPhotoCount = (photoLoaded = originModelCount = modelLoaded = 0);
- var defaultTex1 = Texture.load(g_HotImage.point);
- var defaultTex2 = Texture.load(g_HotImage.point2);
- /* var _boxMat = new THREE.MeshBasicMaterial({
- color: "#eeeeee",
- transparent: !0,
- opacity: 0.8
- }) */
- var _boxMat = new THREE.MeshPhongMaterial({
- color: "#eeeeee",
- transparent: !0,
- opacity: 0.8,
- side: THREE.DoubleSide,
- });
- // var autoSizeInfo = { minSize: 120, maxSize: 600, nearBound: 1, farBound: 15 };
- var autoSizeInfo = {width2d:150}
- var hotGroup = new THREE.Object3D();
- hotGroup.name = "hotGroup";
- model.add(hotGroup);
- model.hotGroup = hotGroup;
- var animateTexSrcs = {};
- var getLink = function(link) {
- var src = "";
- var r = link.substring(link.indexOf("html") + 4),
- o = "en" == manage.number("lang") ? "&lang=" + manage.number("lang") : "";
- -1 == r.indexOf("?")
- ? (src = link + "?time=" + randomTime().getTime() + "&id=" + window.number + o)
- : (src = link + "&time=" + randomTime().getTime() + "&id=" + window.number + o);
- return src;
- };
- var removeSrcPostMark = function(url) {
- //去除texture.load时自动加上的'?'
- var index = url.indexOf("?");
- if (index > -1) {
- return url.slice(0, index);
- } else return url;
- };
- {
- //get plane Bound
- var planeBound = new THREE.Box3();
- var cornerPoint = [new THREE.Vector3(-0.5, 0.5, 0), new THREE.Vector3(0.5, 0.5, 0), new THREE.Vector3(0.5, -0.5, 0), new THREE.Vector3(-0.5, -0.5, 0)];
- cornerPoint.forEach((e) => {
- planeBound.expandByPoint(e);
- });
- }
- var shineMats = [];
- var getShineMat = function(texture1, texture2) {
- var mat = shineMats.find((e) => e.uniforms.texture1.value == texture1 && e.uniforms.texture2.value == texture2);
- if (mat) return mat;
- else {
- var mat = new THREE.ShaderMaterial({
- uniforms: {
- color: {
- type: "c",
- value: new THREE.Color(16720384),
- },
- opac: {
- type: "f",
- value: 0,
- },
- texture1: {
- type: "t",
- value: texture1,
- },
- texture2: {
- type: "t",
- value: texture2,
- },
- },
- vertexShader: "varying vec2 vUv;\n\nvoid main() {\n\n vUv = uv ;\n gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\n}\n",
- fragmentShader:
- "varying vec3 vNormal;\n\nvarying vec2 vUv;\n\nuniform float opac;\n\nuniform vec3 color;\n\nuniform sampler2D texture1;\n\nuniform sampler2D texture2;\n\nvoid main() {\n\nvec4 tcolor1 = texture2D( texture1, vUv );\n\nvec4 tcolor2 = texture2D( texture2, vUv );\n\ngl_FragColor = mix(tcolor1,tcolor2 ,opac) + tcolor2*0.2; }\n",
- transparent: !0,
- });
- shineMats.push(mat);
- return mat;
- }
- };
- var modelGeos = [];
- var getModelGeo = function(url) {
- var geo = modelGeos.find((e) => (e.url = url));
- if (geo) return geo;
- else {
- var geo = null;
- geo.url = url;
- }
- };
- class Hot extends THREE.Object3D {
- constructor(info, source) {
- super();
- this.sid = info.sid;
- this.preDeal(info, source); // source:来源
- this.info = info;
- this.cornerPoints = [];
- this.build(info);
- this.name = "hot_" + this.sid;
- model.hots[info.sid] = this;
- }
- build(info) {
- /* this.changeMaterial(new THREE.MeshBasicMaterial({
- color: "#00c8af",
- opacity: 0.4,
- transparent: !0,
- polygonOffset: true,
- //是否开启多边形偏移 //ie不开启时blank也不会闪烁
- polygonOffsetFactor: -0.9,
- //多边形偏移因子
- polygonOffsetUnits: -4.0,
- //多边形偏移单位
- }))
-
- if(!info.objSrc){
- this.addPlane()
- if (info.hasBox) this.addBox(true)
- }else{
- this.addModel(new THREE.Mesh())//暂时创建个空的
-
- } */
- hotGroup.add(this);
- this.setTitleElem();
- this.setFromInfo(info);
- }
- setFromInfo(info, media, objObject) {
- //1 恢复到编辑之前 2 初始加载
- var plane = this.plane;
- /* var transformAtPanos = {}
- for(var i in info.transformAtPanos){
- transformAtPanos[i] = {//只保留一个位移,主要原因是大小变化和热点大小设置冲突了, isSprite和qutaernion衝突
- pos : info.transformAtPanos[i].pos && info.transformAtPanos[i].pos.clone(),
- //qua : info.transformAtPanos[i].qua && info.transformAtPanos[i].qua.clone(),
- }
- }
-
- this.transformAtPanos = transformAtPanos */
- //在每个漫游点独立设置的position。
- var curPanoTransform = this.info.transformAtPanos[getTransformSid()] || {};
- //没有单独设置position的漫游点使用的position
- this.position.copy(curPanoTransform.pos || info.position);
- this.rotation.copy(info.rotation);
- this.scale.copy(info.scale);
- this.changeTexType(info.texType, media);
- if (!info.objSrc) {
- this.addPlane();
- if (!!this.hasBox != !!info.hasBox) {
- this.addBox(!this.hasBox);
- }
- } else {
- this.addModel(objObject || new THREE.Mesh()); //暂时创建个空的
- }
- this.updateMatrixWorld();
- /* if(!this.info.visiblePanos){//移到model.build时,在collider建好之后
- this.getVisiblePanos()
- } */
- {
- //gif
- if (this.animation) {
- GifTexDeal.remove(this.animation);
- }
- if (this.info.animateInfo && this.material_.map) {
- this.animation = GifTexDeal.addAnimation(this.material_.map, this, this.info.animateInfo, this.sid);
- this.visible && this.inSight() && GifTexDeal.start(this.animation);
- }
- }
- /* if(this.info.modelBound){
- this.mesh.updateMatrixWorld()
- this.mesh.boxHelper2 = new THREE.Box3Helper( new THREE.Box3().copy(this.info.modelBound.bound).applyMatrix4(this.mesh.matrixWorld), new THREE.Color("#00aaee"));
- model.add(this.mesh.boxHelper2)
-
- }else{
- var bound = new THREE.Box3()
-
- var cornerPoint = [
- new THREE.Vector3(-0.5, 0.5, 0),
- new THREE.Vector3(0.5, 0.5, 0),
- new THREE.Vector3(0.5, -0.5, 0),
- new THREE.Vector3(-0.5, -0.5, 0),
- ]
- cornerPoint.forEach(e=>{
- bound.expandByPoint(e)
- })
-
- this.mesh.updateMatrixWorld()
- this.mesh.boxHelper2 = new THREE.Box3Helper( bound.applyMatrix4(this.mesh.matrixWorld), new THREE.Color("#00aaee"));
- model.add(this.mesh.boxHelper2)
-
- } */
- }
- changeTexType(texType, media) {
- var plane = this.plane;
- if (this.texType != texType || media == "clear") {
- //删除旧的
- if (this.texType == "shine") {
- /* this.material_.uniforms.texture1.value.dispose()
- this.material_.uniforms.texture2.value.dispose() */
- //为了恢复 不删
- } else {
- //this.material_.map.dispose()
- if (this.texType == "video") {
- this.texMedia && this.texMedia.pause();
- } else {
- }
- }
- if (this.material_ && !hotGroup.children.find((e) => e != this && e.material_ == this.material_)) {
- this.material_.dispose();
- }
- //添加新的
- if (texType == "shine") {
- } else {
- this.changeMaterial(
- new THREE.MeshBasicMaterial({
- color: "#00c8af",
- opacity: 0.4,
- transparent: !0,
- polygonOffset: true,
- //是否开启多边形偏移 //ie不开启时blank也不会闪烁
- polygonOffsetFactor: -0.9,
- //多边形偏移因子
- polygonOffsetUnits: -4.0,
- //多边形偏移单位
- })
- );
- if (texType == "video") {
- } else {
- }
- }
- }
- this.texType = texType;
- if (media == "clear") {
- this.material_.opacity = 0.4;
- this.texMedia = null;
- return;
- }
- if (texType == "video") {
- //视频不能共用一个,否则会一起播放暂停
- var video;
- if (media) {
- video = media;
- } else {
- if (!this.info.texSrc) return;
- var video = $(
- `<video controls="controls" loop autoplay x5-playsinline="" webkit-playsinline="true" playsinline="true" controlslist="nodownload"></video>`
- )[0];
- //video.src = manage.dealURL(this.info.texSrc);
- video.name = this.info.fileName;
- }
- video.setAttribute("crossOrigin", "Anonymous"); //要在src设置好前解决跨域
- $(video).on("contextmenu", function() {
- return false;
- }); //禁止右键点击出
- this.texMedia = video;
- video.oncanplaythrough = () => {
- if (this.texMedia == video) {
- this.material_.map.needsUpdate = !0;
- video.play();
- }
- };
- video.volume = 0;
- video.muted = true;
- video.currentTime = 0;
- this.material_.map = new THREE.VideoTexture(video);
- this.material_.map.wrapS = this.material_.map.wrapT = THREE.ClampToEdgeWrapping;
- this.material_.map.generateMipmaps = true;
- } else if (texType == "photo") {
- if (media) {
- this.texMedia = media;
- this.info.texSrc = media.src;
- this.material_.map = new THREE.Texture(); //texture也不能共用一个,因为有的会有动画,就不一样
- this.material_.map.image = media; //image可以共用
- this.material_.map.needsUpdate = !0;
- } else {
- if (!this.info.texSrc) return;
- this._loadDones = [];
- this.material_.opacity = 0.1;
- }
- } else if (texType == "shine") {
- if (media) {
- this.changeShineTex(media);
- } else {
- this.styleImg = /* this.styleImg || */ [];
- if (this.info.styleImg) {
- this.styleImg = this.info.styleImg.map((src) => {
- return { src: /* manage.dealURL( */ src }; //如果要dealURL,在predeal里
- });
- }
- this.changeShineTex(this.styleImg);
- }
- this.info.texSrc = null;
- }
- if (this.material_.map) {
- /* this.material_.map.minFilter = THREE.LinearFilter;
- this.material_.map.magFilter = THREE.LinearFilter; */
- dealMap(this.material_.map);
- this.material_.color.set("#FFFFFF");
- this.material_.opacity = 1;
- this.material_.needsUpdate = true;
- }
- }
- changeShineTex(styleImg) {
- styleImg = styleImg || this.styleImg;
- var tex1, tex2;
- if (styleImg.length) {
- tex1 = Texture.load(styleImg[0].src);
- tex2 = Texture.load((styleImg[1] && styleImg[1].src) || styleImg[0].src);
- } else {
- tex1 = defaultTex1;
- tex2 = defaultTex2;
- }
- this.changeMaterial(getShineMat(tex1, tex2));
- this.styleImg = styleImg;
- this.info.styleImg = styleImg.map((img) => img.src);
- }
- changeMaterial(mat) {
- this.material_ = mat;
- this.mesh &&
- this.mesh.traverse((mesh) => {
- if (mesh.material && !(mesh instanceof THREE.Box3Helper)) {
- mesh.material = this.material_;
- }
- });
- }
- /*
- actionType: "common"
- infoAttribute: {images: [], styleImg: [], model: [], video: [], bgName: "background", iframe: [], title: "11",…}
- bgName: "background"
- content: "111"
- iframe: []
- images: []
- model: []
- styleImg: []
- title: "11"
- video: []
- isSprite: 0
- link: "https://www.4dmodel.com/SuperTwo/hot_online1/index.html#/?m=EDwn769489868"
- linkType: "common"
- noAction: 0
- order: 4
- position: {x: -4.238, y: 1.32, z: -0.648}
- rotation: {x: 0, y: 0.018105110200249575, z: 0}
- transformAtPanos: {}
- IO4Kq7494332: {actionTy
- depth: 0.08
- file: "https://super.4dage.com/data/TEST/edit/20200805_172635119.mp4"
- hasBox: 1
- height: 0.7289
- media: ["video"]
- pos: [-5.562, 1.349, 1.994]
- qua: [0, 0.70672, 0, 0.70749]
- sid: "1596619585929"
- transformAtPanos: {,…} */
- preDeal(info, source) {
- // source:来源
- var convertValue = function(v, Type) {
- var value;
- if (v instanceof Array) {
- v.forEach((v1) => {
- v1 = parseFloat(v1);
- });
- value = new Type().fromArray(v);
- } else {
- if (!(v instanceof Type)) {
- for (let i in v) {
- v[i] = parseFloat(v[i]);
- }
- value = new Type().copy(v);
- } else {
- value = v;
- }
- }
- return value;
- };
- if (!info.transformAtPanos) info.transformAtPanos = {};
- if (source == "byHot") {
- var infoAttribute = info.infoAttribute || {};
- info.title = infoAttribute.title || info.title;
- info.model = infoAttribute.model || info.model || []; //模型链接
- info.images = infoAttribute.images || info.images || [];
- info.video = infoAttribute.video || info.video || [];
- info.bgName = infoAttribute.bgName || info.bgName;
- info.backgroundMusic = info.backgroundMusic || info.backgroundMusic;
- info.iframe = infoAttribute.iframe || info.iframe || [];
- info.styleImg = infoAttribute.styleImg || info.styleImg || [];
- info.content = infoAttribute.content || info.content;
- {
- let action = CloneObject(settings.hotClickEvent.shine);
- if (info.actionType == "noAction" || info.noAction) {
- (action.examine = false), (action.openHot = false);
- } else if (info.actionType == "dontExam") {
- action.examine = false;
- }
- info.actionType = action;
- }
- if (info.quaternion) {
- info.rotation = new THREE.Euler().setFromVector3(convertValue(info.quaternion, THREE.Quaternion));
- } else {
- info.rotation = new THREE.Euler().setFromVector3(convertValue(info.rotation, THREE.Vector3)); //热点的旧数据很多是字符串
- }
- var s = Hot.getDefaulScale(info.hotIconScale);
- info.scale = new THREE.Vector3(s, s, 0.02);
- delete info.infoAttribute;
- /* for (let i in this.transformAtPanos) {
- info.transformAtPanos[i].pos = new THREE.Vector3().fromArray(info.transformAtPanos[i].pos)
- info.transformAtPanos[i].qua && (info.transformAtPanos[i].qua = new THREE.Quaternion().fromArray(info.transformAtPanos[i].qua))
- } */
- info.texType = "shine";
- } else {
- if (source == "byOverlay") {
- info.texType = info.media[0];
- //info.title = info.texType == 'video'?'视频':'图片'
- info.texSrc = info.file;
- info.actionType = CloneObject(settings.hotClickEvent[info.texType]); //给一个默认
- delete info.media;
- info.rotation = new THREE.Euler().setFromQuaternion(convertValue(info.qua, THREE.Quaternion));
- info.position = info.pos;
- delete info.pos;
- delete info.qua;
- let a = info.texSrc.split("/");
- info.fileName = a.pop();
- info.scale = new THREE.Vector3(info.width, info.height, info.depth);
- delete info.width;
- delete info.height;
- delete info.depth;
- delete info.file;
- } else {
- info.rotation = new THREE.Euler().fromArray(info.rotation); //.setFromVector3(info.rotation)
- }
- info.model = info.model || []; //模型链接
- info.images = info.images || [];
- info.video = info.video || [];
- info.iframe = info.iframe || [];
- info.styleImg = info.styleImg || [];
- info.imagesDesc = info.imagesDesc || [];
- info.titleShowType = info.titleShowType || "hover";
- info.titlePos = info.titlePos || "right";
- }
- if (info.texSrc) {
- info.texSrc = manage.removeSrcPostMark(info.texSrc);
- }
- //whole:
- //为了兼容旧数据,尽量和hot的数据靠近,最后保存在hot里
- info.position = convertValue(info.position, THREE.Vector3);
- info.scale = convertValue(info.scale, THREE.Vector3);
- delete info.quaternion;
- info.linkType = info.linkType || "common";
- for (let i in info.transformAtPanos) {
- info.transformAtPanos[i].pos = new THREE.Vector3().fromArray(info.transformAtPanos[i].pos);
- //info.transformAtPanos[i].qua = new THREE.Quaternion().fromArray(info.transformAtPanos[i].qua)
- }
- info.styleImg = info.styleImg.map((item) => {
- if (item.indexOf("images/4dagePoint") > -1) {
- item = "static/" + item;
- }
- return item;
- });
- }
- addBox(state) {
- if (state == !!this.hasBox) {
- return;
- }
- if (state) {
- var box = new THREE.Mesh(_boxGeometry, _boxMat);
- box.position.set(0, 0, 1 / 2);
- box.renderOrder = 3;
- this.plane.position.set(0, 0, 1);
- this.add(box);
- this.box = box;
- } else {
- this.plane.position.set(0, 0, 0);
- this.remove(this.box);
- this.box = null;
- }
- this.hasBox = this.info.hasBox = state;
- }
- /* getSizeByScale() {
- return {
- width: settings.defaultOverlaySize[0] * this.scale.x,
- height: settings.defaultOverlaySize[1] * this.scale.y
- }
- }
-
- getScaleBySize(width, height) {
- return {
- x: width / settings.defaultOverlaySize[0],
- y: height / settings.defaultOverlaySize[1],
- }
- }*/
- setVisiblePanos(visibleData) {
- if (visibleData) this.info.visiblePanos = visibleData;
- else if (!this.info.visiblePanos) this.getVisiblePanos();
- }
- getVisiblePanos() {
- //在不同点还不一样
- var depth = this.hasBox ? this.scale.z : 0;
- var width = this.scale.x,
- height = this.scale.y;
- var cornerPoint;
- if (this.plane) {
- cornerPoint = [
- new THREE.Vector3(0, 0, depth),
- new THREE.Vector3(-width / 2, height / 2, depth),
- new THREE.Vector3(width / 2, height / 2, depth),
- new THREE.Vector3(width / 2, -height / 2, depth),
- new THREE.Vector3(-width / 2, -height / 2, depth),
- ];
- } else {
- var bound = new THREE.Box3().copy(this.info.modelBound.bound);
- var center = bound.center();
- cornerPoint = [
- new THREE.Vector3(center.x, center.y, center.z),
- new THREE.Vector3(bound.min.x, bound.min.y, bound.min.z),
- new THREE.Vector3(bound.min.x, bound.min.y, bound.max.z),
- new THREE.Vector3(bound.min.x, bound.max.y, bound.min.z),
- new THREE.Vector3(bound.max.x, bound.min.y, bound.min.z),
- new THREE.Vector3(bound.max.x, bound.max.y, bound.min.z),
- new THREE.Vector3(bound.max.x, bound.min.y, bound.max.z),
- new THREE.Vector3(bound.min.x, bound.max.y, bound.max.z),
- new THREE.Vector3(bound.max.x, bound.max.y, bound.max.z),
- ];
- }
- var getPos = (position) => {
- //每个overlay位置对应5个坐标,plane中心和四个角的位置
- if (this.plane) {
- return cornerPoint.map((e) => {
- return e
- .clone()
- .applyEuler(this.info.rotation)
- .add(position);
- });
- } else {
- var matrixWorld = new THREE.Matrix4().compose(position, this.quaternion, this.scale);
- matrixWorld.multiplyMatrices(matrixWorld, this.mesh.matrix);
- return cornerPoint.map((e) => {
- return e.clone().applyMatrix4(matrixWorld);
- });
- }
- };
- this.info.visiblePanos = [];
- var customPositions = getPos(this.info.position);
- var posAtPanos = {};
- for (let panoId in this.info.transformAtPanos) {
- if (panoId == "outSide") continue;
- posAtPanos[panoId] = getPos(this.info.transformAtPanos[panoId].pos);
- }
- let maxCount = browser.isMobile() ? 2000 : 5000;
- let c = model.panos.list.length * model.colliders.length;
- if (window.isEdit || c < maxCount) {
- //编辑页面保险起见还是全部算完后才可浏览,就能保证保存全部的visiblePano
- this.info.visiblePanos = common.getVisiblePano(customPositions, model.panos.list, {
- model: model.colliders,
- posAtPanos,
- });
- } else {
- let start = 0;
- let interval = setInterval(() => {
- let end = start + Hot.visiPanosCountSlice;
- end = Math.min(end, model.panos.list.length);
- let i = start;
- start = end;
- let panos = model.panos.list.slice(i, end);
- this.info.visiblePanos = this.info.visiblePanos.concat(
- common.getVisiblePano(customPositions, panos, {
- model: model.colliders,
- posAtPanos,
- })
- );
- if (end >= model.panos.list.length) {
- console.log(window.hotsi ? ++window.hotsi : (window.hotsi = 1));
- clearInterval(interval);
- }
- }, Hot.visiEveryDurSlice); // visiEveryDurSlice 等在main中定义
- }
- }
- updateVisible(panos, visibility) {
- if (window.isEdit && editTool.hotpoint.editSpot == this) {
- return (this.visible = true);
- }
- this.visible = visibility != void 0 ? visibility : !this.info.visiblePanos || !!panos.find((pano) => this.info.visiblePanos.includes(pano.id));
- this.titleElem && this.titleElem.setVisible(this.visible, "hotVisible");
- if (this.texType == "video") {
- //this.switchPlay(this.visible, this.visible ? null : 'stop' );//可见时不操作;不可见时停止
- this.update(player);
- }
- }
- getCornerPoint() {
- //获取在每个漫游点上的视觉边界点 可以打开boxHelper和addBall来观测是否准确
- if (this.cornerPoints[player.currentPano.id]) {
- return this.cornerPoints[player.currentPano.id];
- } else {
- var boundPoint, cornerPoint;
- var center; //中心点
- if (this.plane) {
- center = this.plane.getWorldPosition();
- boundPoint = [new THREE.Vector3(-0.5, 0.5, 0), new THREE.Vector3(0.5, 0.5, 0), new THREE.Vector3(0.5, -0.5, 0), new THREE.Vector3(-0.5, -0.5, 0)];
- } else {
- var bound = new THREE.Box3().copy(this.info.modelBound.bound);
- boundPoint = [
- new THREE.Vector3(bound.min.x, bound.min.y, bound.min.z),
- new THREE.Vector3(bound.min.x, bound.min.y, bound.max.z),
- new THREE.Vector3(bound.min.x, bound.max.y, bound.min.z),
- new THREE.Vector3(bound.max.x, bound.min.y, bound.min.z),
- new THREE.Vector3(bound.max.x, bound.max.y, bound.min.z),
- new THREE.Vector3(bound.max.x, bound.min.y, bound.max.z),
- new THREE.Vector3(bound.min.x, bound.max.y, bound.max.z),
- new THREE.Vector3(bound.max.x, bound.max.y, bound.max.z),
- ];
- }
- var maxLon = -Infinity;
- var minLon = +Infinity;
- var maxLat = -Infinity;
- var minLat = +Infinity;
- var pos1 = player.currentPano.position.clone();
- center = this.position.clone(); //模型bound的中心点已经位移到了hot中心点。 注意不能用getWorldPosition,得到的会是偏移的
- var dir = center
- .clone()
- .sub(pos1)
- .normalize();
- var centerDirInfo = {};
- player.cameraControls.controls.panorama.lookAt.call(centerDirInfo, null, dir);
- boundPoint.forEach((e) => {
- //lon左右
- var point = e.applyMatrix4(this.mesh.matrixWorld);
- var dir = point
- .clone()
- .sub(pos1)
- .normalize();
- var dirInfo = {};
- player.cameraControls.controls.panorama.lookAt.call(dirInfo, null, dir);
- var diffLon = (dirInfo.lon - centerDirInfo.lon) % 360;
- if (Math.abs(diffLon) > 180) {
- //因为有时需要根据符号判断是在中心的左边还是右边,所以限制在180内
- diffLon += diffLon > 0 ? -360 : 360;
- }
- var diffLat = dirInfo.lat - centerDirInfo.lat;
- maxLon = Math.max(diffLon, maxLon);
- minLon = Math.min(diffLon, minLon);
- maxLat = Math.max(diffLat, maxLat);
- minLat = Math.min(diffLat, minLat);
- });
- var diffLon = maxLon - minLon;
- var diffLat = maxLat - minLat;
- if (diffLat > 180) {
- //可能是到了反面。不好算,直接返回所有boundPoint
- cornerPoint = boundPoint;
- } else {
- //读取lon lat的最大最小值,勾勒出一个没有倾斜的矩形 。它比boundPoint看起来范围更大些
- maxLon = maxLon + centerDirInfo.lon;
- maxLat = maxLat + centerDirInfo.lat;
- minLon = minLon + centerDirInfo.lon;
- minLat = minLat + centerDirInfo.lat;
- var dirs = [
- math.getDirByLonLat(maxLon, maxLat),
- math.getDirByLonLat(minLon, minLat),
- math.getDirByLonLat(maxLon, minLat),
- math.getDirByLonLat(minLon, maxLat),
- ];
- cornerPoint = dirs.map((e) => {
- return e.clone().add(pos1);
- });
- cornerPoint = [center, ...cornerPoint]; //最后增加一个中心点
- }
- /* if(this.objObject){
- cornerPoint = [pos2, ...cornerPoint]
- } */
- //addPoints(cornerPoint)
- this.cornerPoints[player.currentPano.id] = { cornerPoint, diffLon, diffLat };
- return this.cornerPoints[player.currentPano.id];
- }
- }
- inSight() {
- //return true
- if (window.isEdit) return true; // 太容易move了
- if (player.mode == "panorama" && player.currentPano) {
- if (!player.camera) return;
- var cornerPointInfo = this.getCornerPoint();
- var cornerPoint;
-
- if(cornerPointInfo.diffLon < 3 || cornerPointInfo.diffLat < 3 ){
- //console.log('two far and small')
- return false
- }
-
- if (cornerPointInfo.diffLon < 15 && cornerPointInfo.diffLat < 15) {
- //当很小的时候,只判断中心点即可
- cornerPoint = [cornerPointInfo.cornerPoint[0]];
- } else {
- cornerPoint = cornerPointInfo.cornerPoint;
- }
- for (let i = 0, j = cornerPoint.length; i < j; i++) {
- //只要有一点可见就算看见
- var pos2d = math.getPos2d(cornerPoint[i], player.camera, $("#player")[0]);
- if (pos2d.trueSide && pos2d.inSight) return true;
- }
- } else {
- //飞出要判断模型阻挡,有点耗时就算了
- return playVideoWhenFlyOut;
- }
- }
- update(player) {
- if (player.mode == "panorama") {
- //实时监测播放
- if (this.texType == "video") {
- if (this.visible && !this.pausedByUser && this.inSight()) {
- this.videoControl(true);
- } else {
- this.videoControl(false);
- }
- } else if (this.info.animateInfo) {
- if (this.visible && this.inSight()) {
- GifTexDeal.start(this.animation);
- } else {
- GifTexDeal.stop(this.animation);
- }
- }
- }
- if (this.info.isSprite) {
- this.quaternion.copy(player.camera.quaternion);
- }
- this.updateScale();
- }
- updateScale(e, t) {
- //自适应调节大小
- if (!DATA.autoAdjustHotScale || this.texType != "shine") return;
- //let renderSize = player.sceneRenderer.renderer.domElement
- let renderSize = player.sceneRenderer.renderer.getSize();
- var scale = convertTool.getScaleForConstantSize(
- $.extend(autoSizeInfo, {
- camera: player.camera,
- resolution: { x: renderSize.width, y: renderSize.height },
- position: this.position.clone(),
- })
- );
- this.plane.scale.set(scale, scale, scale);
- }
- switchPlay(state) {
- //手动播放暂停
- this.pausedByUser = !state;
- this.videoControl(state);
- }
- loadVideo(video){
- if(video.src)return
- video.src = manage.dealURL(this.info.texSrc);
- }
- videoControl(state) {
- if (this.texType != "video" || !this.material_.map) return;
- var video = this.material_.map.image;
- if (!state || state == "stop") {
- if (!video.paused) {
- video.pause();
- //console.log("pause " + this.sid)
- }
- if (state == "stop") {
- video.currentTime = 0;
- }
- } else if (state) {
- if (video.paused) {
- this.loadVideo(video)
- video.play();
- //console.log("play " + this.sid)
- }
- }
- }
- /* setDefaultHotScale = function(){//设置成默认热点大小
- var w = DATA.hotIconScale) * g_HotMeshSize.g_HotMeshWidth
- this.scale.set( w, w, this.scale.z)
- } */
- setTitleElem() {
- var title = this.info.title;
- if (title) {
- if (!this.titleElem) {
- this.titleElem = new Label2D({ position: this.position, innerHTML: `<div>${title}</div>`, domElement: $("#hot")[0], shelterByModel: true });
- } else {
- this.titleElem.elem.html(`<div>${title}</div>`);
- }
- this.titleElem.setVisible(this.visible, "hotVisible");
- this.setHoverState(false);
- this.setTitleDir();
- } else {
- if (this.titleElem) {
- this.titleElem.dispose();
- this.titleElem = null;
- }
- }
- }
- setTitleDir() {
- this.titleElem && this.titleElem.elem.attr("pos", this.info.titlePos);
- }
- updateTitle() {
- this.titleElem && this.titleElem.update();
- }
- /* setTitleElem(){
- var root = $("#hot");
- var title = this.info.title;
- if(title){
- if(!this.titleElem){
- var elem = $(`<div></div>`)
- root.append(elem);
- this.titleElem = elem;
- }
- this.titleElem.text(title)
- this.setTitleDir()
- }else{
- if(this.titleElem){
- this.titleElem.remove()
- this.titleElem = null;
- }
- }
- }
-
-
- setTitleDir(){
- this.titleElem.attr('pos',this.info.titlePos)
- }
-
-
-
- updateTitle(){
- if(!this.titleElem)return;
- if(!this.visible || this.info.titleShowType == 'unvisible' ||
- this.info.titleShowType != 'always' && !this.hovered ){
- return this.titleElem.css("display","none");
- }
- var pos = math.getPos2d(this.position, player.camera, $("#player")[0])
- if(pos.trueSide){//inSight
- this.titleElem.css( { "left" : `${pos.pos.x}px`, "top": `${pos.pos.y}px ` });
- this.titleElem.css("display","block");
- }else{
- this.titleElem.css("display","none");
- }
- } */
- setHoverState(state) {
- if (!this.titleElem) return;
- this.hovered = !!state;
- var v = this.info.titleShowType != "unvisible" && (this.info.titleShowType == "always" || this.hovered);
- this.titleElem.setVisible(v, "hoveredVisi");
- //this.updateTitle()
- }
- closestPanoTowardTag(e, t) {
- var i = [],
- n = [],
- r = this.mesh.getWorldPosition();
- if (e === "panorama") {
- /* var o = t.position.clone().sub(r).normalize();
- n.push(function(t, i) {//scoreFunctions.direction 最好这个漫游点在currentPano到热点之间的路径上。但是这样的话可能就看不到热点正面,所以删掉
- return function(e) {
- return e.position.clone().sub(t).normalize().dot(i) * window._settings.navigation.directionFactor
- }}(r, o)
- ) */
- }
- var a = new THREE.Vector3();
- i.push(
- function(e) {
- return (
- Math.abs(e.position.x - r.x) > window._settings.tags.visibility.cameraClearance ||
- Math.abs(e.position.z - r.z) > window._settings.tags.visibility.cameraClearance
- );
- },
- function(e) {
- a.copy(r).sub(e.position);
- var t = -THREE.Math.radToDeg(Math.atan(a.y / Math.sqrt(a.x * a.x + a.z * a.z))),
- i = window._settings.tags.navigate.tiltTolerance;
- return window._settings.insideLookLimitDown - i < t && t < window._settings.insideLookLimitUp + i;
- },
- (pano) => {
- // add
- return player.checkHasNeighbor(pano);
- },
- (pano) => {
- // add
- // 周恩光改 解决visiblePanos为undefined时的bug
- return this.info.visiblePanos && this.info.visiblePanos.includes(pano.id);
- }
- );
- n.push(
- (function(hot, i) {
- //scoreFunctions.distanceSquared
- return function(pano) {
- //i = a.navigation.distanceFactor
- return hot ? hot.position.distanceToSquared(pano.position) * i : 0;
- };
- })(this, -2),
- (pano) => {
- //尽量正对hot
- let dir = new THREE.Vector3(0, 0, 1).applyQuaternion(this.quaternion);
- let dir2 = new THREE.Vector3().subVectors(pano.position, this.position).normalize();
- let s = dir.dot(dir2) * 10;
- //console.log(pano.id + ":" + s)
- return s;
- }
- );
- var s = t.model.panos.sortByScore(i, n);
- return s && 0 < s.length && s[0].pano;
- }
- examine(options = {}) {
- var openHot = this.info.link && this.info.actionType.openHot && !options.dontOpen;
- var fastTran = !options.dontFastTran && this.info.actionType.fastTran;
- if (fastTran) {
- let info = this.info.cameraData;
- player.blackToPano({
- pano: player.model.panos.index[info.pano.uuid],
- quaternion: new THREE.Quaternion().fromArray(info.camera.quaternion),
- });
- }
- var needExamine = !fastTran && (options.examine || (!settings.dontExamHot && this.info.actionType.examine));
- if (!openHot && !needExamine) return;
- // if(openHot && this.info.linkType!="common" && this.info.iframe && this.info.iframe[0]){
- // var src = getLink(this.info.iframe[0]);
- // if(this.info.linkType=="jumpLink"){
- // var newPage = window.open(src, "_blank" );
- // newPage.focus();
- // }else if(this.info.linkType=="iframeDiv"){
- // var div = document.createElement("div");
- // div.style.position = 'fixed';
- // div.style.width = div.style.height = "100%";
- // div.style.left = div.style.top = '0';
- // div.style["z-index"] = "999"
- // var exit = document.createElement("div");
- // exit.style["background-image"] = "url(images/vrOffImg.png)";
- // exit.style.position = 'absolute';
- // exit.style.width = exit.style.height = "50px";
- // exit.style.left = '17px'; exit.style.top = "20px"
- // exit.style.cursor = "pointer";
- // exit.style["background-repeat"] = "no-repeat";
- // exit.style["background-size"] = "25%";
- // exit.style["background-position"] = "center center";
- // exit.style["background-color"] = "rgba(0, 0, 0, 0.2)";
- // exit.style["border-radius"] = "50%";
- // exit.style["z-index"] = "3"
- // exit.onclick = ()=>{
- // $(div).remove()
- // Hot.closePopup()
- // }
- // var myElement = document.createElement("iframe");
- // myElement.style.position = 'absolute';
- // myElement.style.width = myElement.style.height = "100%";
- // myElement.style.left = myElement.style.top = '0';
- // myElement.src = src
- // $("body").append(div);
- // div.appendChild(exit);
- // div.appendChild(myElement)
- // SoundManager.play('hot')
- // }
- // return;
- // }
- if (!player.currentPano) return;
- var popup = document.getElementById("popup");
- // if (openHot) {
- // g_currentHot = this,
- // popup.style.display = "block",
- // popup.classList.add("wait");
- // var n = document.createElement("iframe");
- // SoundManager.play('hot')
- // var src = getLink(this.info.link )
- // n.src = src;
- // n.id = "id1",
- // n.allowTransparency = "true";
- // var a = document.getElementById("id1");
- // if (void 0 === a || null == a) {
- // document.querySelector(".popup-content").appendChild(n);
- // var s = !1;
- // window.loaddingSuccess = function() {
- // s = !0
- // }
- // ,
- // setTimeout(function e() {
- // if (s) {
- // var t = document.querySelector("#id1").contentWindow.document;
- // t.querySelector("video") && (t.querySelector("video").play(),
- // !t.querySelector("video").paused && t.querySelector(".playPause") && t.querySelector(".playPause").classList.add("fa-pause")),
- // t.querySelector("audio") && t.querySelector("audio").play()
- // } else
- // setTimeout(e, 300)
- // }, 800)
- // }
- // }
- var done = function() {
- player.flyingToTag = !1;
- if (openHot) {
- window.player.emit("openHotspot", this.info.sid);
- }
- // openHot && popup.classList.remove("wait")
- }.bind(this);
- if (!needExamine) {
- done();
- return;
- }
- var c = this.closestPanoTowardTag(player.mode, player.currentPano) || player.currentPano,
- h = this.mesh.getWorldPosition();
- player.flyingToTag = !0;
- if (player.mode === "panorama") {
- var d = {
- pano: c,
- lookAtPoint: h,
- duration: options.duration,
- maxDistanceOverride: null,
- skipWarpingCheck: !1,
- aimDuration: options.aimDuration,
- };
- player.flyToPano(d, done);
- } else {
- var p = {
- pano: c,
- };
- if (h) {
- var f = new THREE.Matrix4().lookAt(c.position, h, new THREE.Vector3(0, 1, 0));
- p.quaternion = new THREE.Quaternion().setFromRotationMatrix(f);
- }
- (p.callback = done), (p.duration = options.duration || 1500), (p.mode = "panorama"), (p.aimDuration = options.aimDuration);
- player.flyToNewMode(p);
- }
- }
- addModel(object) {
- if (this.objObject) {
- this.remove(this.objObject);
- }
- this.objObject = object;
- /* object.traverse((mesh)=>{
- if(mesh.material && mesh.type == "hotSprite"){
- mesh.material = this.material_;
- }
- }) */
- object.name = this.info.objName;
- object.src = this.info.objSrc;
- this.info.hasBox = false;
- this.addBox(false);
- this.remove(this.plane);
- this.plane = null;
- this.setMesh(this.objObject);
- //this.adjustModelAuto()
- if (this.info.modelBound) {
- //应该不会改变
- var s = this.info.modelBound.scaleRatio;
- this.mesh.scale.set(s, s, s);
- this.mesh.position.fromArray(this.info.modelBound.position);
- this.mesh.modelBound = this.info.modelBound;
- }
- this.material_.side = THREE.FrontSide;
- this.changeBoxHelperDisplay(false);
- //this.mesh.boxHelper.visible = true
- }
- addPlane() {
- //换成plane
- if (this.plane) return;
- this.plane = new THREE.Mesh(_planeGeometry, this.material_);
- this.remove(this.objObject);
- this.objObject = null;
- delete this.info.objSrc;
- delete this.info.objName;
- delete this.info.modelBound;
- this.setMesh(this.plane);
- //this.material_.side = THREE.DoubleSide //双面的话飞出来会看到悬空的
- }
- setMesh(mesh) {
- this.mesh = mesh;
- this.add(this.mesh);
- this.mesh.renderOrder = 3;
- this.changeMaterial(this.material_); //re applyTo every mesh
- this.mesh.traverse((mesh) => {
- mesh.type = "hotSprite"; //raycaster use
- });
- if (!this.mesh.boxHelper) {
- var boxHelper = this.mesh.children.find((e) => e instanceof THREE.Box3Helper);
- if (boxHelper) {
- this.mesh.boxHelper = boxHelper;
- } else {
- var bound;
- if (this.objObject) {
- bound = new THREE.Box3().copy(this.info.modelBound.bound);
- } else {
- bound = planeBound;
- }
- bound.expandByVector(new THREE.Vector3(0.0001, 0.0001, 0.0001));
- this.mesh.boxHelper = new THREE.Box3Helper(bound, new THREE.Color("#00ffff"));
- this.mesh.add(this.mesh.boxHelper);
- this.mesh.boxHelper.material.depthTest = false;
- this.mesh.boxHelper.material.transparent = true;
- this.mesh.boxHelper.visible = false;
- }
- }
- }
- changeBoxHelperDisplay(show) {
- if (show) {
- this.visible_ = this.visible;
- this.visible = true;
- this.mesh.boxHelper.visible = true;
- } else {
- if (this.visible_ != void 0) {
- this.visible = this.visible_;
- }
- this.mesh.boxHelper.visible = false;
- }
- }
- /* addToLoadQueue() {
- if (this.texType == 'photo') {
- Hot.loadQueue.includes(this) || Hot.loadQueue.push(this)
- }
- } */
- requestDownload(type, callback) {
- var plane = this.plane;
- if (type == "photo") {
- if (this.photoHasRequestLoad || this.texType != "photo") {
- return;
- }
- //console.log('overlay beginDownload : ' + this.sid)
- /* this.material_.map = */ Texture.load(this.info.texSrc, (tex) => {
- callback && callback();
- if (!tex.image) {
- return; //只是单纯用了相同src的tex,但image仍未加载完
- }
- //if(!this._loadDones)return
- dealMap(tex);
- setTimeout(Hot.loadNext, 50);
- hotGroup.children.forEach((e) => {
- if (e.info.texSrc == this.info.texSrc && e.info.texType == type) {
- e.material_.color.set("#FFFFFF");
- e.material_.opacity = 1;
- //console.log('overlay loaded: ' + e.sid + " - " + this.info.texSrc.split('/').pop());
- e.texMedia = tex.image;
- {
- //animation不同致使的不能使用同一个texture
- if (window.isEdit) {
- if (animateTexSrcs[e.info.texSrc]) {
- e.material_.map = tex.clone(); //编辑动画直接不用一个texture, 故而animation也不同
- e.material_.map.needsUpdate = true;
- } else {
- e.material_.map = tex;
- animateTexSrcs[e.info.texSrc] = 1;
- }
- } else {
- if (animateTexSrcs[e.info.texSrc]) {
- //已有该texSrc
- let finded = false;
- for (let i of animateTexSrcs[e.info.texSrc]) {
- if (ifSame(i[0], e.info.animateInfo)) {
- e.material_.map = i[1];
- finded = true;
- break;
- }
- }
- if (!finded) {
- let tex_ = tex.clone();
- animateTexSrcs[e.info.texSrc].set(e.info.animateInfo, tex_);
- e.material_.map = tex_;
- }
- } else {
- let object = new Map();
- object.set(e.info.animateInfo, tex);
- animateTexSrcs[e.info.texSrc] = object; //注册第一个texSrc
- e.material_.map = tex;
- }
- }
- }
- if (e.info.animateInfo && !e.animation) {
- e.animation = GifTexDeal.addAnimation(e.material_.map, e, e.info.animateInfo, e.sid);
- e.visible && e.inSight() && GifTexDeal.start(e.animation);
- }
- if (++photoLoaded == originPhotoCount) {
- //data2.js中的所有photo加载完毕
- Hot.allPhotoLoaded = true;
- Hot.whenAllFileLoaded && Hot.allModelLoaded && Hot.whenAllFileLoaded();
- }
- {
- e._loadDones.forEach((a) => a());
- e._loadDones = null;
- //e.photoHasRequestLoad = true;
- }
- e.material_.needsUpdate = true;
- }
- });
- });
- this.photoHasRequestLoad = true;
- } else if (type == "model") {
- if (this.modelHasRequestLoad || !this.info.objSrc) return;
- //需要处理重复?
- objLoader.load(this.info.objSrc, (object) => {
- this.remove(this.mesh);
- this.addModel(object);
- callback && callback();
- if (++modelLoaded == originModelCount) {
- //data2.js中的所有photo加载完毕
- Hot.allModelLoaded = true;
- Hot.whenAllFileLoaded && Hot.allPhotoLoaded && Hot.whenAllFileLoaded();
- }
- });
- this.modelHasRequestLoad = true;
- }
- }
- }
- Hot.updateVisibles = function(panos) {
- /* if (panos === true) {
- model.hotGroup.children.forEach((e) => e.updateVisible(null, true));
- } else {
- model.hotGroup.children.forEach((e) => e.updateVisible(panos));
- } */
- // 更改:平面、三维视角,热点不可见。
- if (panos === true) {
- model.hotGroup.children.forEach((e) => e.updateVisible(null, true));
- } else if(panos === false){
- model.hotGroup.children.forEach((e) => e.updateVisible(null, false));
- }else{
- model.hotGroup.children.forEach((e) => e.updateVisible(panos));
- }
-
- };
- Hot.beginShineHot = function() {
- if (!window.isEdit && shineMats.length == 0) return;
- transitions.trigger({
- func: function(e) {
- var opa = e <= 0.5 ? 2 * e : -2 * e + 2;
- shineMats.forEach((mat) => {
- mat.uniforms.opac.value = opa;
- });
- },
- cycling: !0,
- duration: 3e3,
- name: "hotShine",
- });
- };
- Hot.getDefaulScale = function(hotIconScale) {
- return (hotIconScale || DATA.hotIconScale) * g_HotMeshSize.g_HotMeshWidth;
- };
- var loadings = [];
- Hot.loadQueue = []; //等待下载的overlay,目前只针对photo
- Hot.maxLoadingCount = 3; //同时正在load图片的数量
- Hot.loadNext = () => {
- //继续requestDownload loadQueue中前排的item
- let count = Hot.maxLoadingCount - loadings.length;
- Hot.loadQueue.slice(0, count).forEach((e) => {
- loadings.push(e);
- //console.log('requestDownload', e.hot.info.texSrc)
- e.hot.requestDownload(e.type, () => {
- var i = loadings.indexOf(e);
- //console.log('requestDownload index', i)
- i > -1 && loadings.splice(i, 1);
- });
- });
- Hot.loadQueue.splice(0, count);
- };
- Hot.getNeedLoad = function() {
- //计算获取loadQueue,每次都重新计算,覆盖旧的
- if (!player || !player.domElement || !player.mode) return;
- var hots1, hots2;
- if (player.mode != "panorama") {
- if (Hot.loadQueue.length == 0) {
- hots1 = model.hotGroup.children.filter((e) => e.texType == "photo" && !e.photoHasRequestLoad);
- hots2 = model.hotGroup.children.filter((e) => e.info.objSrc && !e.modelHasRequestLoad);
- Hot.loadQueue = hots1
- .map((e) => {
- return { hot: e, type: "photo" };
- })
- .concat(
- hots2.map((e) => {
- return { hot: e, type: "model" };
- })
- );
- }
- return;
- }
- //Hot.loadWhenOutside = true
- hots1 = model.hotGroup.children.filter(
- (e) => e.texType == "photo" && !e.photoHasRequestLoad && (!e.info.visiblePanos || e.info.visiblePanos.includes(player.currentPano.id))
- );
- hots2 = model.hotGroup.children.filter(
- (e) => e.info.objSrc && !e.modelHasRequestLoad && (!e.info.visiblePanos || e.info.visiblePanos.includes(player.currentPano.id))
- );
- if (hots1.length + hots2.length == 0) {
- hots1 = model.hotGroup.children.filter((e) => e.texType == "photo" && !e.photoHasRequestLoad);
- hots2 = model.hotGroup.children.filter((e) => e.info.objSrc && !e.modelHasRequestLoad);
- }
- var cameraDir = player.getDirection();
- Hot.loadQueue = hots1
- .map((e) => {
- return { hot: e, type: "photo" };
- })
- .concat(
- hots2.map((e) => {
- return { hot: e, type: "model" };
- })
- );
- var request = [
- (item) => {
- return true;
- },
- ];
- var rank = [
- (item) => {
- var dis = item.hot.mesh.getWorldPosition().distanceTo(player.position);
- return -dis;
- },
- (item) => {
- var tagDir = item.hot.mesh.getWorldPosition().sub(player.position);
- var angle = tagDir.angleTo(cameraDir);
- return -angle * 20;
- },
- ];
- var result = common.sortByScore(Hot.loadQueue, request, rank);
- //Hot.loadQueue = result ? result.slice(0, 5).map(e=>e.item) : model.hotGroup.children.filter(e=>e.texType == 'photo' && !e.hasRequestLoad).slice(0, 2);
- Hot.loadQueue = result ? result.slice(0, 5).map((e) => e.item) : [];
- };
- Hot.load = () => {
- //开始下载图片
- Hot.getNeedLoad();
- Hot.loadNext();
- var hots1 = model.hotGroup.children.filter((e) => e.texType == "photo" && !e.photoHasRequestLoad);
- var hots2 = model.hotGroup.children.filter((e) => e.info.objSrc && !e.modelHasRequestLoad);
- if (hots1.length + hots2.length > 0) {
- setTimeout(Hot.load, 200);
- } else {
- Hot.allRequestLoad = true;
- console.log("allRequestLoad");
- }
- };
- Hot.startLoad = () => {
- originPhotoCount = hotGroup.children.filter((e) => e.texType == "photo").length;
- originModelCount = hotGroup.children.filter((e) => !!e.info.objSrc).length;
- if (originPhotoCount == 0) Hot.allPhotoLoaded = true;
- if (originModelCount == 0) Hot.allModelLoaded = true;
- if (Hot.allModelLoaded && Hot.allPhotoLoaded) Hot.whenAllFileLoaded && Hot.whenAllFileLoaded();
- //所有加载完毕
- else {
- Hot.load();
- }
- };
- window.Hot = Hot;
- /* var ball = new THREE.Mesh(new THREE.SphereBufferGeometry(0.01),new THREE.MeshBasicMaterial({color:"#f00",depthTest:false,transparent:true}))
- var balls = []
- var addPoint = function(point){
- console.log(point)
- var ball1 = ball.clone()
- model.add(ball1);
- ball1.position.copy(point)
- balls.push(ball1)
- }
- var addPoints = function(points){
- balls.forEach(e=>model.remove(e))
- balls = []
- points.forEach(e=>addPoint(e))
- }
- */
- //判断是否是移动端,如果是给关闭按钮添加touchstart事件
- Hot.closePopup = () => {
- // 关闭热点页面
- if (!g_currentHot) return;
- g_currentHot = null;
- var hotPop = document.getElementById("popup");
- hotPop.style.display = "none";
- document.querySelector(".popup-content").removeChild(document.getElementById("id1"));
- $("#popup iframe:last").remove();
- SoundManager.pause("hot", true); //自动播放被中断的音频 (bgm
- return false;
- };
- if (browser.isMobile()) {
- $("#closepop").on("touchstart", Hot.closePopup);
- } else {
- $("#closepop").on("click", Hot.closePopup);
- }
- Hot.createHotList = function() {
- if (!window.DATA.showHotListSta) return;
- var docFragment = document.createDocumentFragment();
- var hots = hotGroup.children.filter((hot) => hot.info.actionType.openHot);
- hots = hots.sort((a, b) => {
- return a.order - b.order;
- });
- hots.forEach((hot) => {
- var li = document.createElement("li");
- var span = document.createElement("span");
- span.innerHTML = hot.info.title || "热点";
- // console.log(span.innerHTML);
- li.hot = hot; // 列表每一项对应一个热点
- li.appendChild(span);
- docFragment.appendChild(li);
- });
- setTimeout(() => {
- var ul = document.querySelector("#hotListContent ul");
- ul && ul.appendChild(docFragment);
- }, 3000); //部分安卓手机的钉钉和支付宝浏览器如果立即添加到列表会卡住
- };
- };
- /*
- 保存 JSON.stringify(editTool.hotpoint.getSavingInfo())
- 可能需要再写一份保存到overlay 给旧场景项目使用
- 最好后台有针对手机版的做一个压缩。压缩成几个档位。
- 安卓手机firefox出现过视频mesh不可见或者闪烁的情况。
-
-
- 视频最容易导致崩溃, 模型还好
-
- 数据速率为4064kbps,1920*1080px 时测试部门电脑崩溃
- 数据速率为1824kbps,720 *576px 时正常
- 所以尽量降到2000以下 同时播放个数最好不超过2个 可能需要将src归零 并延迟加载、不自动播放
-
- */
|