3dModeling buildingCreate.js 张婷 commit at 2021-03-12

3dModeling/sygy319/buildingCreate.js

@@ -106,3 +106,196 @@ app.on(THING.EventType.LeaveLevel, ".Building", function (ev) {
     }
     else {
         removeMark();
+    }
+})
+
+/**
+ * 说明：注册事件
+ */
+function registerEvent() {
+    var _this = this
+    // 楼层横向展开按钮的点击事件，楼层展开只在建筑有2层或2层以上的楼层才会生效
+    $('#horizontalExpansion').on('click', function () {
+        stopRotate();
+        checkBtnActives(['#mapBg', '#sceneSetting']);
+        let expandState = building.getAttribute('expandState');
+        if ($(this).hasClass('active')) {
+            // 楼层横向展开关闭
+            if (expandState == 'horizontal') {
+                $(this).removeClass('active');
+                horizontalExpand(building, 'close');
+            }
+        } else {
+            // 楼层横向展开前应判断楼层是否处于垂直展开状态，是，则应先关闭垂直展开，然后横向展开
+            if (expandState != 'moving') {
+                $(this).addClass('active');
+                $('#verticalExpansion').removeClass('active');
+                if (expandState == 'vertical') {
+                    verticalToHorizontal(building);
+                } else {
+                    horizontalExpand(building, 'horizontal');
+                }
+            }
+        }
+        restarRotate();
+    });
+    // 楼层垂直展开按钮的点击事件，楼层展开只在建筑有2层或2层以上的楼层才会生效
+    $('#verticalExpansion').on('click', function () {
+        stopRotate();
+        checkBtnActives(['#mapBg', '#sceneSetting']);
+        let expandState = building.getAttribute('expandState');
+        if ($(this).hasClass('active')) {
+            // 楼层垂直展开关闭
+            if (expandState == 'vertical') {
+                $(this).removeClass('active');
+                verticalExpand(building, 'close');
+            }
+        } else {
+            // 楼层垂直展开前应判断楼层是否处于横向展开状态，是，则应先关闭横向展开，然后垂直展开
+            if (expandState != 'moving') {
+                $(this).addClass('active');
+                $('#horizontalExpansion').removeClass('active');
+                if (expandState == 'horizontal') {
+                    horizontalToVertical(building);
+                } else {
+                    verticalExpand(building, 'vertical');
+                }
+            }
+        }
+        restarRotate();
+    });
+    // 设置按钮点击事件，按钮的tip与功能面板的互相切换
+    $('#sceneSetting').on('click', function () {
+        checkBtnActives(['#mapBg']);
+        if ($(this).hasClass('active')) {
+            $(this).removeClass('active');
+            $(this).children('.control-menu').removeClass('actives');
+            $(this).find('.tooltiptext').css({ "visibility": "visible" });
+        } else {
+            $(this).addClass('active');
+            $(this).children('.control-menu').addClass('actives');
+            $(this).find('.tooltiptext').css({ "visibility": "hidden" });
+        }
+    }).hover(function () {
+        if (!$(this).hasClass('active')) {
+            $(this).find('.tooltiptext').css({ "visibility": "visible" });
+        }
+    }, function () {
+        $(this).find('.tooltiptext').css({ "visibility": "hidden" });
+    });
+    // 设置li标签添加点击事件
+    $('#sceneSetting .control-menu-pane li').on('click', function (ev) {
+        //ev.stopPropagation();
+        if ($(this).hasClass('selected')) {
+            stopRotate();
+            $(this).removeClass('selected');
+        } else {
+            $(this).addClass('selected');
+            restarRotate();
+        }
+    });
+    // 小地图的开启/关闭按钮的鼠标点击事件
+    $('#miniMap').on('click', function () {
+        if ($(this).hasClass('active')) {
+            $(this).removeClass('active');
+            destoryMiniMap();
+        } else {
+            $(this).addClass('active');
+            createMiniMap();
+        }
+        checkBtnActives(['#mapBg', '#sceneSetting']);
+    });
+    // 地图背景的开启/关闭按钮的鼠标点击事件，按钮的tip与功能面板的互相切换
+    $('#mapBg').on('click', function () {
+        checkBtnActives(['#sceneSetting']);
+        if ($(this).hasClass('active')) {
+            $(this).removeClass('active');
+            $(this).children('.control-menu').removeClass('actives');
+            $(this).find('.tooltiptext').css({ "visibility": "visible" });
+        } else {
+            $(this).addClass('active');
+            $(this).children('.control-menu').addClass('actives');
+            $(this).find('.tooltiptext').css({ "visibility": "hidden" });
+        }
+    }).hover(function () {
+        if (!$(this).hasClass('active')) {
+            $(this).find('.tooltiptext').css({ "visibility": "visible" });
+        }
+    }, function () {
+        $(this).find('.tooltiptext').css({ "visibility": "hidden" });
+    });
+    // 进入层级事件
+    app.on(THING.EventType.EnterLevel, function (ev) {
+        stopRotate();
+        // 进入建筑层级
+        if (ev.object.type == 'Building') {
+            //清除设备列表和面板
+            _this.delMydiv();
+            _this.destroy_ui();
+            let floors = ev.object.floors;
+            if (floors.length > 1) {
+                building = ev.object;
+                addFloorPos(building);
+                let expandState = building.getAttribute('expandState');
+                if (expandState == null) {
+                    building.setAttribute('expandState', 'close');
+                }
+                $('#horizontalExpansion').css({ 'display': 'block' });
+                $('#verticalExpansion').css({ 'display': 'block' });
+            }
+        } else {
+            $('#horizontalExpansion').css({ 'display': 'none' });
+            $('#verticalExpansion').css({ 'display': 'none' });
+            // 进入园区层级
+            if (ev.object.type == 'Campus') {
+                if (building != null) {
+                    exitBuildingCloseFloor(building);
+                    $('#horizontalExpansion').removeClass('active');
+                    $('#verticalExpansion').removeClass('active');
+                    building = null;
+                }
+            }
+        }
+        if (skyBox != null) {
+            app.skyBox = skyBox;
+        }
+        // 重新创建小地图
+        if ($('#miniMap').hasClass('active')) {
+            destoryMiniMap();
+            createMiniMap();
+        }
+    });
+    // 行走按钮的鼠标点击事件
+    $('#moveByFps').on('click', function () {
+        stopRotate();
+        if ($(this).hasClass('active')) {
+            $(this).removeClass('active');
+            if (box != null) {
+                // 恢复默认双击进入层级事件
+                app.resumeEvent(THING.EventType.DBLClick, '*', THING.EventTag.LevelEnterOperation);
+                // 恢复默认右键退出层级事件
+                app.resumeEvent(THING.EventType.Click, '*', THING.EventTag.LevelBackOperation);
+                box.destroy();
+                box = null;
+            }
+            if (fpsCtrl != null) {
+                exitFps();
+            }
+        } else {
+            $(this).addClass('active');
+            // 禁用默认双击进入层级事件
+            app.pauseEvent(THING.EventType.DBLClick, '*', THING.EventTag.LevelEnterOperation);
+            // 禁用默认右键退出层级事件
+            app.pauseEvent(THING.EventType.Click, '*', THING.EventTag.LevelBackOperation);
+            // 记录摄像机当前位置
+            cameraInitPos = [app.camera.position, app.camera.target];
+            createBox();
+        }
+        checkBtnActives(['#mapBg', '#sceneSetting']);
+    });
+    // 全屏按钮的鼠标抬起事件
+    $('#fullScreen').mouseup(function () {
+        if (!fullScreenState) {
+            $('.btn-full-screen').css('display', 'none');
+            $('.btn-narrow').css('display', 'block');
+            $('#fullScreen span').text('退出全屏');