xzw vor 3 Jahren
Ursprung
Commit
2dccbf571b
7 geänderte Dateien mit 149 neuen und 87 gelöschten Zeilen
  1. 46 7
      css/main.css
  2. 1 2
      edit.html
  3. 2 2
      index.html
  4. 71 60
      js/edit.js
  5. 4 5
      js/main_2020_edit.js
  6. 5 3
      js/main_2020_show.js
  7. 20 8
      js/manage.js

+ 46 - 7
css/main.css

@@ -7242,6 +7242,7 @@ a.hasHover.tag-link:hover {
   left: 50%;
   -webkit-transform: translate(-50%);
   transform: translate(-50%);
+  transition: all 0.3s;
 }
 .widgets-doll-labels .room-label a {
   display: block;
@@ -7261,9 +7262,12 @@ a.hasHover.tag-link:hover {
   border-radius: 3px;
   text-shadow: 0px 1px 3px #000000;
   min-height: 24px;
+  
     
 }
-
+.widgets-doll-labels .room-label a:hover {
+    color:#fff;
+}
 
 .widgets-doll-labels .room-label.selected a{
     background: rgb(57 72 255 / 88%);
@@ -7274,12 +7278,13 @@ a.hasHover.tag-link:hover {
 }    
 .widgets-doll-labels.noLine .room-label a{
     top: 0; 
-    translate: translate(-50%, -50%);
-    transition:all 0.5s;
+    transform: translate(-50%, -50%);
+    
 }
 
-.widgets-doll-labels.noLine .room-label:after { 
-    height:0
+.widgets-doll-labels.noLine .room-label:after {  /* 从dollhouse转到floorplan */
+    height:0;
+    bottom:-68px;
 } 
 
 .widgets-doll-labels .room-label a::before {
@@ -7293,6 +7298,10 @@ a.hasHover.tag-link:hover {
   background-repeat: no-repeat;
   background-position: top left;
 }
+.widgets-doll-labels.noCorner .room-label a::before {
+    background-image:none;
+}
+
 .widgets-doll-labels .room-label a::after {
   content: "";
   position: absolute;
@@ -7305,6 +7314,11 @@ a.hasHover.tag-link:hover {
   background-position: top left;
   transform: rotate(270deg);
 }
+.widgets-doll-labels.noCorner .room-label a::after {
+    background-image: none
+}
+
+
 .widgets-doll-labels .room-label a > p {
   margin: 0;
   padding: 6px 14px;
@@ -7324,6 +7338,10 @@ a.hasHover.tag-link:hover {
   background-position: top left;
   transform: rotate(90deg);
 }
+.widgets-doll-labels.noCorner .room-label a > p::before {
+    background-image: none;
+}
+
 .widgets-doll-labels .room-label a > p::after {
   content: "";
   position: absolute;
@@ -7336,7 +7354,9 @@ a.hasHover.tag-link:hover {
   background-position: top left;
   transform: rotate(180deg);
 }
- 
+.widgets-doll-labels.noCorner .room-label a > p::after {
+    background-image: none;
+}
 .widgets-doll-labels .room-label.noLine a {
   top: 16px;
 }
@@ -7382,4 +7402,23 @@ a.hasHover.tag-link:hover {
   /* pointer-events: auto */
   /*text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); */
 }
- 
+@-webkit-keyframes room-label {
+  0% {
+    opacity: 0;
+    margin-top: 8.75px;
+  }
+  to {
+    opacity: 1;
+    margin-top: 0;
+  }
+}
+@keyframes room-label {
+  0% {
+    opacity: 0;
+    margin-top: 8.75px;
+  }
+  to {
+    opacity: 1;
+    margin-top: 0;
+  }
+} 

+ 1 - 2
edit.html

@@ -119,8 +119,7 @@
                     <div class="webgl-inside">
                         <div class="content">
                             <div id="hot"> </div>
-                            <div class='widgets-doll-labels'> </div>
-                            <div class='widgets-plan-labels'> </div>
+                            <div class='widgets-doll-labels'> </div> 
                             
                             
                             <div id="popup">

+ 2 - 2
index.html

@@ -58,8 +58,8 @@
 </head>
 
 <body>
-    <div id="hot"> 
-    </div>
+    <div id="hot"> </div>
+    <div class='widgets-doll-labels'> </div> 
     <div id="popup">
         <div class="popup-content">
 

+ 71 - 60
js/edit.js

@@ -306,7 +306,7 @@ EditTools.prototype.initSaveAll = function() {
                 loadlogo: $("#loadlogo").is(':checked'),
                 special: $("#g_specialScene").is(':checked'),
                 vision_version: $("#twoData").is(':checked') ? "1.1.562.17209" : false,
-
+                roomLabels: that.editLabel.getSavingInfo(),
                 /************************************** 方奕卓 场景可配置项 ******************************************/
                 hotImageScale: $("#hotImgScale").is(':checked'),
                 // 热点图片可放大
@@ -352,8 +352,7 @@ EditTools.prototype.initSaveAll = function() {
             var data =  { 
                 sceneCode: number,
                 hots: reData(that.hotpoint.getSavingInfo(), '{}'),
-                //tourAudio: reData(that.editGuide.tourAudio,'{}'),//for 旧版
-                roomLabels: that.editLabel.getSavingInfo(),
+                //tourAudio: reData(that.editGuide.tourAudio,'{}'),//for 旧版 
                 name: number,
                 guides: reData(guides, '[]'),
                 info: info, 
@@ -401,6 +400,8 @@ class EditLabel{
     }
     
     init(){
+        player.model.roomLabels.forEach(e=>this.addLebelEvent(e))
+        
         
         $('.toolRight .roomLabels .addBtn button').on('click',()=>{//准备添加
             if(this.editingLabel){
@@ -425,69 +426,18 @@ class EditLabel{
                 position.y += 0.5
                 //var floorIndex = player.model.allFloorsVisible ? null : player.model.currentFloor.floorIndex
                 var floorIndex = intersect.object.parent.parent.floorIndex 
-                var label = new RoomLabel({position, title:'' , domElement:$(".widgets-doll-labels")[0], shelterByModel:true , autoUpdate : true, floorIndex/* , modes:[]   */
-                    ,clickFun:()=>{
+                var label = new RoomLabel({position, title:'' ,  floorIndex/* , modes:[]   */
+                    /* ,clickFun:()=>{
                         if(this.editing){
                             this.setEditLabel(true,label)
                         }  
-                    }  
+                    }   */
                 })
                 player.model.roomLabels.push(label)
                 this.setAddState(false)
                 this.setEditLabel(true, label) //开始编辑
+                this.addLebelEvent(label)
                 
-                
-                //拖拽
-                {
-                    let dragElemShift = {}
-                    let dragging = false
-                    const startDrag = (evt) => { 
-                        dragging = true
-                        $('#player').on("mousemove", drag); 
-                        
-                        if(player.mode != 'floorplan'){ //换算到elem的底部
-                            let lebelWidth = label.elem.children(0).width() 
-                            let lebelHeight = label.elem.children(0).height() * (68+24) / 24 ;//
-                            dragElemShift = {x: -evt.offsetX + lebelWidth/2, y: 100   /* -evt.offsetY + lebelHeight  */} //y向不准确,因为原本添加时提高了0.5,而0.5对应的像素需要根据视角,那就算了吧
-                        }else{
-                            dragElemShift = {x:0,y:0}
-                        }
-                        
-                        CursorDeal.add('moveLabel')
-                    };
-
-                    const endDrag = (evt) => {
-                        dragging = false
-
-                        $('#player').off("mousemove", drag);
-                        
-                        CursorDeal.remove('moveLabel')
-                    };
-
-                    const drag = (evt) => {
-                        if (dragging) {
-                            
-                            evt.preventDefault(); 
-                            let mouse = new THREE.Vector3()   
-                            let meshes = player.model.allFloorsVisible ? player.model.colliders : player.model.currentFloor.collider.children
-                            math.convertScreenPositionToNDC(evt.offsetX+dragElemShift.x, evt.offsetY+dragElemShift.y, mouse);
-                            var intersect = convertTool.getMouseIntersect(player.camera, meshes, mouse)
-                            if(intersect){
-                                let position = intersect.point.clone()
-                                position.y += 0.5
-                                label.setPos(position)
-                                var floorIndex = intersect.object.parent.parent.floorIndex
-                                label.floorIndex = floorIndex
-                            }  
-                            //this.dispatchEvent({type:'dragged', position: this.position})
-                            
-                        }
-                    };
-
-                    label.elem.on('mousedown', startDrag);
-                    $(document).on('mouseup', endDrag);
-                    $("#player").on('mouseup', endDrag);    
-                } 
                     
                     
                 this.adding = false
@@ -531,15 +481,76 @@ class EditLabel{
         } 
     }
     
+    addLebelEvent(label){
+        //拖拽 
+        let dragElemShift = {}
+        let dragging = false
+        const startDrag = (evt) => { 
+            dragging = true
+            $('#player').on("mousemove", drag); 
+            
+            if(player.mode != 'floorplan'){ //换算到elem的底部
+                let lebelWidth = label.elem.children(0).width() 
+                let lebelHeight = label.elem.children(0).height() * (68+24) / 24 ;//
+                dragElemShift = {x: -evt.offsetX + lebelWidth/2, y: 100   /* -evt.offsetY + lebelHeight  */} //y向不准确,因为原本添加时提高了0.5,而0.5对应的像素需要根据视角,那就算了吧
+            }else{
+                dragElemShift = {x:0,y:0}
+            }
+            
+            CursorDeal.add('moveLabel')
+        };
+
+        const endDrag = (evt) => {
+            dragging = false
+
+            $('#player').off("mousemove", drag);
+            
+            CursorDeal.remove('moveLabel')
+        };
+
+        const drag = (evt) => {
+            if (dragging) {
+                
+                evt.preventDefault(); 
+                let mouse = new THREE.Vector3()   
+                let meshes = player.model.allFloorsVisible ? player.model.colliders : player.model.currentFloor.collider.children
+                math.convertScreenPositionToNDC(evt.offsetX+dragElemShift.x, evt.offsetY+dragElemShift.y, mouse);
+                var intersect = convertTool.getMouseIntersect(player.camera, meshes, mouse)
+                if(intersect){
+                    let position = intersect.point.clone()
+                    position.y += 0.5
+                    label.setPos(position)
+                    var floorIndex = intersect.object.parent.parent.floorIndex
+                    label.floorIndex = floorIndex
+                }  
+                //this.dispatchEvent({type:'dragged', position: this.position})
+                
+            }
+        };
+
+        label.elem.on('mousedown', startDrag);
+        $(document).on('mouseup', endDrag);
+        $("#player").on('mouseup', endDrag);    
+   
+        //点击编辑:
+        label.elem.on('click',(e)=>{
+            if(this.editing){
+                this.setEditLabel(true,label)
+            }
+            e.stopPropagation()
+        })
+        
+    }
+    
     enter(){
         this.editing = true
-        
+        player.roomLebelClickUnabled = true
         
     }
     leave(){ 
         this.editing = false
         this.editingLabel && this.setEditLabel(false, this.editingLabel)
-        
+        player.roomLebelClickUnabled = false
     }
     
     getSavingInfo(){

+ 4 - 5
js/main_2020_edit.js

@@ -14002,7 +14002,6 @@ function o(a, s, l) {
                 window.editTool = new EditTools()
                 
                 
-                
                 t.hotIconScale = parseFloat(t.hotIconScale || 1) 
                 window.DATA = t
                 
@@ -16876,8 +16875,8 @@ function o(a, s, l) {
                         Hot.createHotList();
                         
                         
-                        if(e.roomLabels){
-                            e.roomLabels.forEach((data)=>{
+                        if(DATA.roomLabels){
+                            DATA.roomLabels.forEach((data)=>{
                                 this.roomLabels.push(new RoomLabel(data))
                             })
                         }
@@ -20223,7 +20222,7 @@ function o(a, s, l) {
                 this.currentCursor = '';
                 window.player = this 
                 
-                window.bus.dispatchEvent({type:'playerBuilded'})
+                
                 
             }
             var B = J("three")
@@ -20304,7 +20303,7 @@ function o(a, s, l) {
                 this.bindEvents(e.container),
                 this.updateModel()
                 
-             
+                window.bus.dispatchEvent({type:'playerAndModelReady'})
                 
             }
             ,

+ 5 - 3
js/main_2020_show.js

@@ -17637,8 +17637,8 @@ window.Modernizr = function(n, e, t) {
                         } 
                         Hot.createHotList();
                         Hot.startLoad()  
-                        if(e.roomLabels){
-                            e.roomLabels.forEach((data)=>{
+                        if(DATA.roomLabels){
+                            DATA.roomLabels.forEach((data)=>{
                                 this.roomLabels.push(new RoomLabel(data))
                             })
                         }
@@ -21249,7 +21249,7 @@ window.Modernizr = function(n, e, t) {
                 this.zoomStats = new L
                 window.player = this
                 
-                window.bus.dispatchEvent({type:'playerBuilded'})
+                
             }
             var r = e("three")
               , o = e("./util/logger")
@@ -21324,6 +21324,8 @@ window.Modernizr = function(n, e, t) {
                 this.bindEvents(e.container),
                 this.updateModel()
                 this.modeTran = ''
+                
+                window.bus.dispatchEvent({type:'playerAndModelReady'})
             }
 			 
 			

+ 20 - 8
js/manage.js

@@ -1171,8 +1171,7 @@ function initByTHREE(THREE){
         constructor(o={}){
             super()
             
-            this.position = o.position 
-            this.text = o.text || '';
+            this.position = o.position  
             this.elem = $(o.innerHTML || '<div ><a></a></div>');
               
             $(o.domElement).append(this.elem)
@@ -1196,10 +1195,10 @@ function initByTHREE(THREE){
             this.floorIndex = o.floorIndex
             
              
-            if(window.player.reticule){
+            if(window.player.model){
                 this.init()
             }else{
-                window.bus.addEventListener('playerBuilded',this.init.bind(this))
+                window.bus.addEventListener('playerAndModelReady',this.init.bind(this))
             }
             
         }
@@ -1287,7 +1286,20 @@ function initByTHREE(THREE){
     class RoomLabel extends Label2D{
         constructor(o){
             if(o.position instanceof Array) o.position = new THREE.Vector3().fromArray(o.position)
-            o.innerHTML = `<div class="room-label" ><a><p><span>${o.title}</span></p></a></div>`
+            o.innerHTML = `<div class="room-label" ><a><p><span>${o.title}</span></p></a></div>` 
+            o.domElement = $(".widgets-doll-labels")[0]
+            o.shelterByModel = true , o.autoUpdate = true
+
+            o.clickFun = ()=>{
+                if(player.roomLebelClickUnabled)return
+                let result = common.sortByScore(player.model.floors.index[this.floorIndex].panos, [], [(pano)=>{
+                    return -pano.position.distanceToSquared(this.position)
+                }]);
+                player.flyToPano({ 
+                    pano : result && result[0] && result[0].item
+                })
+            }
+             
             super(o)
             this.setTitle(o.title )
             
@@ -1327,13 +1339,13 @@ function initByTHREE(THREE){
     }
     window.RoomLabel = RoomLabel
 
-    window.bus.addEventListener('playerBuilded',()=>{
+    window.bus.addEventListener('playerAndModelReady',()=>{
         player.on("mode.changing",(currentMode, mode, pano, duration)=>{ 
             let noLine = mode == 'floorplan';
             if(noLine){
-                $('.widgets-doll-labels').addClass('noLine')
+                $('.widgets-doll-labels').addClass('noLine').addClass('noCorner')
             }else{
-                $('.widgets-doll-labels').removeClass('noLine')
+                $('.widgets-doll-labels').removeClass('noLine').removeClass('noCorner')
             }
         
         })