| 1 |
- var MiniMap=function(){"use strict";var t="SingleDoor",o="DoubleDoor",i="SlideDoor",n="SingleWindow",r="BayWindow",e="FrenchWindow",a={top:20,down:20,left:20,right:20},s=["rgba(31,228,220, 1)","rgba(31,228,220, 0)"],l=(Math.PI,function(t,o,i,n){var r={};return r.leftBottom={x:t,y:o},r.rigthTop={x:i,y:n},r.leftTop={x:t,y:n},r.rightBottom={x:i,y:o},r.left=t,r.right=i,r.down=o,r.top=n,r}),h=function(t,o){var i=t.x,n=t.y,r=o.x,e=o.y;return function(t,o){return o||(o=5),parseFloat(t.toFixed(o))}(Math.sqrt(Math.pow(i-r,2)+Math.pow(n-e,2)))},d=function(t,o,i){this.app=t,this.dom=o,this.player=this.app.core.get("Player")};return d.prototype.init=function(){var t=this;this.$map=this.dom.querySelector("[xui_mini_map]"),this.width=this.$map.clientWidth,this.height=this.$map.clientHeight,this.stage=new Konva.Stage({container:this.$map,width:this.width,height:this.height}),this.layer_ground=new Konva.Layer,this.layer_player=new Konva.Layer,this.stage.add(this.layer_ground),this.stage.add(this.layer_player),this.toCvsBounding(),this.player.on("mode.changing",(function(o,i,n){t.mode=i,"panorama"!==i||t.player.vrEnabled?t.hide():(t.show(),t.render(n.floorIndex))})),this.player.on("update",(function(o){var i=o.x,n=o.y,r=o.lon;if(o.hasChanged,t.player.cameraControls.activeControl&&!t.player.cameraControls.activeControl.updateForCad){if(!t.floor)return;t.drawPlayer({x:i,y:-1*n},r/180*Math.PI,r-35)}})),this.app.store.get("flooruser").then((function(o){t.floor=JSON.parse(JSON.stringify(o)),t.toCadBounding(),t.render(t.app.core.get("Player").currentPano.floorIndex)})),this.$map.addEventListener("click",(function(){return t.app.Camera.floorplan()})),this.show()},d.prototype.show=function(){this.$map.classList.add("show")},d.prototype.hide=function(){this.$map.classList.remove("show")},d.prototype.render=function(t){this.floor&&(this.angle=0,this.toMapping(),null!=t?(this.subgroup=t,this.floorNum=t):this.floorNum=null==this.floorNum?0:this.floorNum,this.layer_ground.destroyChildren(),this.draw(this.floor.floors[this.floorNum]||{}))},d.prototype.draw=function(t){if(t.walls)for(var o in t.walls)this.drawWall(t,o);if(t.symbols)for(var i in t.symbols)this.drawSymbol(t.symbols[i]);if(t.components)for(var n in t.components)this.drawComponent(t.components[n])},d.prototype.drawWall=function(t,o){var i=t.walls[o],n=i.start,r=i.end,e=t.points[n],a=t.points[r],s=[];s.push(e);for(var l=0;l<i.children.length;++l){var d=t.symbols[i.children[l]];s.push(d.startPoint),s.push(d.endPoint)}s.push(a),s=s.sort((function(t,o){return function(t,o,i){return h(t,o)-h(t,i)}(e,t,o)}));for(var p=[],u=0;u<s.length-1;u+=2){var c=this.toScreenXY(s[u]),y=this.toScreenXY(s[u+1]);p=p.concat([c.x,c.y,y.x,y.y])}new Konva.Line({points:p,stroke:"white",strokeWidth:2,lineCap:"square",lineJoin:"round"})},d.prototype.drawSymbol=function(o){switch(o.geoType){case t:this.drawSingleDoor(o)}},d.prototype.drawSingleDoor=function(t){for(var o=t.points2d,i=[],n=0;n<o.length;n++){var r=this.toScreenXY(o[n]);i=i.concat({x:r.x,y:r.y})}var e=new Konva.Line({points:[i[0].x,i[0].y,i[1].x,i[1].y,i[2].x,i[2].y,i[3].x,i[3].y],stroke:"white",strokeWidth:2,lineCap:"square",lineJoin:"round"}),a=new Konva.Arc({x:i[2].x,y:i[2].y,innerRadius:0,outerRadius:15,angle:70,opacity:1,stroke:"white"});this.layer_ground.add(e),this.layer_ground.add(a)},d.prototype.drawPlayer=function(t,o,i){if((o+=this.angle)<0||o>2*Math.PI){var n=o/(2*Math.PI);(o-=Math.floor(n)*(2*Math.PI))<0&&(o+=2*Math.PI)}if(null==this.playerPoint||this.playerPoint.x!=t.x||this.playerPoint.y!=t.y||null==this.playerAngle||this.playerAngle!=o){this.playerPoint=t,t=this.toVectorForRotate(t),t=this.toScreenXY(t),this.layer_player.destroyChildren();var r=new Konva.Group,e=new Konva.Group,a=new Konva.Circle({x:t.x,y:t.y,radius:3,fill:"#00c8af",stroke:"white",strokeWidth:2});r.add(a);var l=new Konva.Arc({x:t.x,y:t.y,innerRadius:0,outerRadius:15,angle:70,rotation:i,opacity:1,fillRadialGradientStartPoint:{x:0,y:0},fillRadialGradientStartRadius:0,fillRadialGradientEndPoint:{x:0,y:0},fillRadialGradientEndRadius:2,fillRadialGradientColorStops:[0,s[0],1,s[1]]});e.add(l),this.layer_player.add(e),this.layer_player.add(r),this.playerAngle=o}},d.prototype.drawPoint=function(){},d.prototype.toScreenXY=function(t){var o=(t.x-this.center.x)*this.resolution-this.cvs_bounding.left+a.left,i=this.cvs_bounding.top-(t.y-this.center.y)*this.resolution+a.top;return o=.5+o<<0,i=.5+i<<0,{x:Math.floor(o),y:Math.floor(i)}},d.prototype.toCvsBounding=function(){this.cvs_bounding=l(-this.width/2+a.left,-this.height/2+a.top,this.width/2-a.right,this.height/2-a.down)},d.prototype.toCadBounding=function(){for(var t=null,o=null,i=null,n=null,r=0;r<this.floor.floors.length;++r)if(this.floor.floors[r].points)for(var e in this.floor.floors[r].points)(null==t||t>this.floor.floors[r].points[e].x)&&(t=this.floor.floors[r].points[e].x),(null==o||o>this.floor.floors[r].points[e].y)&&(o=this.floor.floors[r].points[e].y),(null==i||i<this.floor.floors[r].points[e].x)&&(i=this.floor.floors[r].points[e].x),(null==n||n<this.floor.floors[r].points[e].y)&&(n=this.floor.floors[r].points[e].y);this.cad_bounding=l(t,o,i,n)},d.prototype.toMapping=function(){var t=Math.abs((this.cvs_bounding.right-this.cvs_bounding.left)/(this.cad_bounding.right-this.cad_bounding.left)),o=Math.abs((this.cvs_bounding.down-this.cvs_bounding.top)/(this.cad_bounding.top-this.cad_bounding.down));this.center={x:(this.cad_bounding.left+this.cad_bounding.right)/2,y:(this.cad_bounding.top+this.cad_bounding.down)/2},this.resolution=Math.min(t,o)},d.prototype.toVectorForRotate=function(t){var o=-1*this.angle;if(Math.abs(o)<.01||Math.abs(o-2*Math.PI)<.01)return t;var i=new THREE.Vector2(this.player.model.center.x,-1*this.player.model.center.z),n=(t.x-i.x)*Math.cos(o)-(t.y-i.y)*Math.sin(o)+i.x,r=(t.y-i.y)*Math.cos(o)+(t.x-i.x)*Math.sin(o)+i.y;return t.x=n,t.y=r,t},d.prototype.toPoints2d=function(a,s,l,h){var d=null;switch(a){case t:d=this.setSingleDoorPoints2d(s,l,h);break;case o:d=this.setDoubleDoorPoints2d(s,l,h);break;case i:d=this.setSlideDoorPoints2d(s,l,h);break;case n:d=this.setSingleWindowPoints2d(s,l);break;case e:d=this.setFrenchWindowPoints2d(s,l);break;case r:d=this.setBayWindowPoints2d(s,l,h)}return d},function(t,o){void 0===o&&(o={});var i=KanKan.Deferred(),n=null;return o.el&&(n="string"===o.el?document.querySelector(o.el):o.el),t.Scene.whenLoaded((function(){return(r=new d(t,n||t.dom,o)).$scope=n,r.$html="<div xui_mini_map> <canvas xui_mini_map_cad></canvas> </div> <style> [xui_mini_map] {\n opacity: 0;\n visibility: hidden;\n position: absolute;\n pointer-events: none;\n top: 20px;\n right: 20px;\n width: 204px;\n height: 200px;\n background-color: rgba(0, 0, 0, 0.3);\n border-radius: 10px;\n z-index: 10;\n }\n [xui_mini_map] canvas {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n }\n\n [xui_mini_map].show {\n opacity: 1;\n visibility: visible;\n pointer-events: all;\n } </style> ",r.$name="MiniMap",r.$load=function(){r.init()},void i.resolve(r);var r})),i}}();
|
