Merge branch 'feature/10.0' into release/10.0

5 years ago · d551d0aaeb
3 changed files with 86 additions and 57 deletions
--- a/plugin.xml
+++ b/plugin.xml
@ -3,12 +3,13 @@
    <id>com.finebi.plugin.screenadaptive</id>
    <name><![CDATA[BI模板屏幕自适应]]></name>
    <active>yes</active>
-    <version>1.1.31</version>
+    <version>1.1.33</version>
    <env-version>10.0</env-version>
    <jartime>2019-08-16</jartime>
    <vendor>fay</vendor>
    <description><![CDATA[预览BI模板时，根据屏幕的宽度自适应显示模板]]></description>
    <change-notes><![CDATA[
+        [2019-10-24]修复IE中有空白部分的情况<br/>
        [2019-08-28]为BI模板添加模板自适应功能。<br/>
    ]]></change-notes>
    <extra-decision>
--- a/src/main/resources/com/finebi/plugin/web/plugin.screen_adaptive.js
+++ b/src/main/resources/com/finebi/plugin/web/plugin.screen_adaptive.js
@ -1,5 +1,5 @@
 !(function () {
-    var scale = 1, transformY = 0, selected = false;
+    var scale = 1, transformY = 0, selected = true;
    var wrapper = document.getElementById("wrapper");
    var html = document.getElementsByTagName('html')[0];

@ -14,6 +14,8 @@
    var injectOuterHeight = jQuery.fn.outerHeight;
    var injectBounds = jQuery.fn.bounds;

+    var injectCreate = BI.createWidget;
+
    // 修正事件偏移
    function correctEvent(e) {
        if (e && !e.corrected) {
@ -44,39 +46,40 @@
    function transformScale() {
        var bounds = getScaleBounds();
        scale = bounds.scale;
-        document.body.style.width = bounds.width + "px";
-        document.body.style.height = bounds.height + "px";
-        document.body.style.transform = "scale(" + bounds.scale+ ")";
-        document.body.style.transformOrigin = "top left";
-        document.body.style["-ms-transform"] = "scale(" + bounds.scale+ ")";
-        document.body.style["-ms-transform-origin"] = "top left";
-        html.style.overflowY = "auto";
-        html.style.backgroundColor = document.getElementsByClassName('bi-theme-dark').length === 0 ? "#2c3d59" : "#ffffff";
-
-        if (bounds.height * bounds.scale < html.clientHeight) {
-            transformY = (html.clientHeight - bounds.height * bounds.scale) / 2;
-            html.style.overflowY = "hidden";
-        } else {
-            transformY = 0;
-        }
+
+        wrapper.style.width = bounds.width + "px";
+        wrapper.style.height = bounds.height + "px";
+        wrapper.style.transform = "scale(" + bounds.scale+ ")";
+        wrapper.style.transformOrigin = "top left";
+        wrapper.style["-ms-transform"] = "scale(" + bounds.scale+ ")";
+        wrapper.style["-ms-transform-origin"] = "top left";
+        // html.style.backgroundColor = document.getElementsByClassName('bi-theme-dark').length === 0 ? "#2c3d59" : "#ffffff";
+        html.style.backgroundColor = "#ffffff";
+
+        // if (bounds.height * bounds.scale < html.clientHeight) {
+        //     transformY = (html.clientHeight - bounds.height * bounds.scale) / 2;
+        //     html.style.overflowY = "hidden";
+        // } else {
+        //     transformY = 0;
+        // }

        // document.body.style.height = (bounds.height * scale) + "px";
        // document.body.style.overflow = "hidden";
-        document.body.style.top = transformY + "px";
+        // document.body.style.top = transformY + "px";
        window.scale = window.devicePixelRatio * scale;
        // scaleFixed();
    }

    // 取消缩放
    function removeScale() {
-        document.body.style.width = "100%";
-        document.body.style.height = "100%";
-        document.body.style.transform = "";
-        document.body.style.transformOrigin = "";
-        document.body.style["-ms-transform"] = "";
-        document.body.style["-ms-transform-origin"] = "";
-        document.body.style.overflowY = "hidden";
-        document.body.style.top = "";
+        wrapper.style.width = "100%";
+        wrapper.style.height = "100%";
+        wrapper.style.transform = "";
+        wrapper.style.transformOrigin = "";
+        wrapper.style["-ms-transform"] = "";
+        wrapper.style["-ms-transform-origin"] = "";
+        wrapper.style.overflowY = "hidden";
+        wrapper.style.top = "";
        html.style.backgroundColor = "#ffffff";

        scale = 1;
@ -123,10 +126,12 @@
        var templateWidth = (Math.round((right / (layoutRatio.x || 1)) || (freeRight / (freeLayoutRatio.x || 1)))) + 60;
        var templateHeight = (Math.round((bottom / (layoutRatio.y || 1)) || (freeBottom / (freeLayoutRatio.y || 1)))) + 30;
        var scaleRatio = parseFloat((html.clientWidth / templateWidth).toFixed(1));
+        var bHeight = html.clientHeight / scaleRatio;
+
        return {
            scale: scaleRatio,
            width: html.clientWidth / scaleRatio,
-            height: scaleRatio === 1 ?  html.clientHeight : templateHeight
+            height: Math.max(bHeight, scaleRatio === 1 ?  html.clientHeight : templateHeight)
        };
    }

@ -267,6 +272,13 @@
            // }
        }

+        BI.createWidget = function () {
+            if (arguments[0] && arguments[0].element === "body") {
+                arguments[0].element = wrapper;
+            }
+            return injectCreate.apply(this, arguments);
+        };
+
        // document.body.onmousedown = scaleFixed;
        window.addEventListener('resize', updateScale);
        window.matchMedia && window.matchMedia('screen and (min-resolution: 2dppx)').
@ -285,6 +297,7 @@
            // jQuery.fn.outerWidth = injectOuterWidth;
            // jQuery.fn.outerHeight = injectOuterHeight;
        }
+        BI.createWidget = injectCreate;

        document.body.onmousedown = null;
        window.removeEventListener('resize', updateScale);
@ -299,7 +312,7 @@
    }, 30);

    function updateScale () {
-        if (html.getBoundingClientRect().width !== document.body.getBoundingClientRect().width) {
+        if (html.getBoundingClientRect().width !== wrapper.getBoundingClientRect().width) {
            selectHandler();
        }
    }
@ -343,11 +356,12 @@
    //     }
    // }

+    selectHandler();
    BI.config("bi.constant.dashboard.toolbar.left.items", function (config) {
        return BI.concat(config, [{
            type: "bi.multi_select_item",
            text: BI.i18nText("BI-Plugin-Scale_Adaptive"),
-            selected: false,
+            selected: true,
            listeners: [{
                eventName: BI.MultiSelectItem.EVENT_CHANGE,
                action: function () {
--- a/src/main/resources/com/finebi/plugin/web/scripts/entry.js
+++ b/src/main/resources/com/finebi/plugin/web/scripts/entry.js
@ -1,5 +1,5 @@
 !(function () {
-    var scale = 1, transformY = 0, selected = false;
+    var scale = 1, transformY = 0, selected = true;
    var wrapper = document.getElementById("wrapper");
    var html = document.getElementsByTagName('html')[0];

@ -14,6 +14,8 @@
    var injectOuterHeight = jQuery.fn.outerHeight;
    var injectBounds = jQuery.fn.bounds;

+    var injectCreate = BI.createWidget;
+
    // 修正事件偏移
    function correctEvent(e) {
        if (e && !e.corrected) {
@ -44,39 +46,40 @@
    function transformScale() {
        var bounds = getScaleBounds();
        scale = bounds.scale;
-        document.body.style.width = bounds.width + "px";
-        document.body.style.height = bounds.height + "px";
-        document.body.style.transform = "scale(" + bounds.scale+ ")";
-        document.body.style.transformOrigin = "top left";
-        document.body.style["-ms-transform"] = "scale(" + bounds.scale+ ")";
-        document.body.style["-ms-transform-origin"] = "top left";
-        html.style.overflowY = "auto";
-        html.style.backgroundColor = document.getElementsByClassName('bi-theme-dark').length === 0 ? "#2c3d59" : "#ffffff";
-
-        if (bounds.height * bounds.scale < html.clientHeight) {
-            transformY = (html.clientHeight - bounds.height * bounds.scale) / 2;
-            html.style.overflowY = "hidden";
-        } else {
-            transformY = 0;
-        }
+
+        wrapper.style.width = bounds.width + "px";
+        wrapper.style.height = bounds.height + "px";
+        wrapper.style.transform = "scale(" + bounds.scale+ ")";
+        wrapper.style.transformOrigin = "top left";
+        wrapper.style["-ms-transform"] = "scale(" + bounds.scale+ ")";
+        wrapper.style["-ms-transform-origin"] = "top left";
+        // html.style.backgroundColor = document.getElementsByClassName('bi-theme-dark').length === 0 ? "#2c3d59" : "#ffffff";
+        html.style.backgroundColor = "#ffffff";
+
+        // if (bounds.height * bounds.scale < html.clientHeight) {
+        //     transformY = (html.clientHeight - bounds.height * bounds.scale) / 2;
+        //     html.style.overflowY = "hidden";
+        // } else {
+        //     transformY = 0;
+        // }

        // document.body.style.height = (bounds.height * scale) + "px";
        // document.body.style.overflow = "hidden";
-        document.body.style.top = transformY + "px";
+        // document.body.style.top = transformY + "px";
        window.scale = window.devicePixelRatio * scale;
        // scaleFixed();
    }

    // 取消缩放
    function removeScale() {
-        document.body.style.width = "100%";
-        document.body.style.height = "100%";
-        document.body.style.transform = "";
-        document.body.style.transformOrigin = "";
-        document.body.style["-ms-transform"] = "";
-        document.body.style["-ms-transform-origin"] = "";
-        document.body.style.overflowY = "hidden";
-        document.body.style.top = "";
+        wrapper.style.width = "100%";
+        wrapper.style.height = "100%";
+        wrapper.style.transform = "";
+        wrapper.style.transformOrigin = "";
+        wrapper.style["-ms-transform"] = "";
+        wrapper.style["-ms-transform-origin"] = "";
+        wrapper.style.overflowY = "hidden";
+        wrapper.style.top = "";
        html.style.backgroundColor = "#ffffff";

        scale = 1;
@ -123,10 +126,12 @@
        var templateWidth = (Math.round((right / (layoutRatio.x || 1)) || (freeRight / (freeLayoutRatio.x || 1)))) + 60;
        var templateHeight = (Math.round((bottom / (layoutRatio.y || 1)) || (freeBottom / (freeLayoutRatio.y || 1)))) + 30;
        var scaleRatio = parseFloat((html.clientWidth / templateWidth).toFixed(1));
+        var bHeight = html.clientHeight / scaleRatio;
+
        return {
            scale: scaleRatio,
            width: html.clientWidth / scaleRatio,
-            height: scaleRatio === 1 ?  html.clientHeight : templateHeight
+            height: Math.max(bHeight, scaleRatio === 1 ?  html.clientHeight : templateHeight)
        };
    }

@ -267,6 +272,13 @@
            // }
        }

+        BI.createWidget = function () {
+            if (arguments[0] && arguments[0].element === "body") {
+                arguments[0].element = wrapper;
+            }
+            return injectCreate.apply(this, arguments);
+        };
+
        // document.body.onmousedown = scaleFixed;
        window.addEventListener('resize', updateScale);
        window.matchMedia && window.matchMedia('screen and (min-resolution: 2dppx)').
@ -285,6 +297,7 @@
            // jQuery.fn.outerWidth = injectOuterWidth;
            // jQuery.fn.outerHeight = injectOuterHeight;
        }
+        BI.createWidget = injectCreate;

        document.body.onmousedown = null;
        window.removeEventListener('resize', updateScale);
@ -299,7 +312,7 @@
    }, 30);

    function updateScale () {
-        if (html.getBoundingClientRect().width !== document.body.getBoundingClientRect().width) {
+        if (html.getBoundingClientRect().width !== wrapper.getBoundingClientRect().width) {
            selectHandler();
        }
    }
@ -343,11 +356,12 @@
    //     }
    // }

+    selectHandler();
    BI.config("bi.constant.dashboard.toolbar.left.items", function (config) {
        return BI.concat(config, [{
            type: "bi.multi_select_item",
            text: BI.i18nText("BI-Plugin-Scale_Adaptive"),
-            selected: false,
+            selected: true,
            listeners: [{
                eventName: BI.MultiSelectItem.EVENT_CHANGE,
                action: function () {