Compare commits

...

29 Commits

Author SHA1 Message Date
fay 3447dc64c5 Pull request #40: BI-65798 feat:新增自定义缩放比功能 5 years ago
fay 0966b8ba01 BI-65798 feat:新增自定义缩放比功能 5 years ago
fay 293ec9a06d Pull request #37: 优化图表显示、修改jar时间 5 years ago
fay 67196eae1a 修改jar时间 5 years ago
fay 1b98ff51da 优化图表显示 5 years ago
fay 1adef9de69 Pull request #34: BI-65346 fix: 处理scale元素的滚动问题 5 years ago
fay d650aeef5a BI-65346 fix: 处理scale元素的滚动问题 5 years ago
fay ee5a25aa3a Pull request #32: BI-65305 fix: popup方向判断在scale影响下错误 5 years ago
fay 9bf65c6321 BI-65305 fix: popup方向判断在scale影响下错误 5 years ago
fay efbb2e4328 Pull request #29: BI-65018 & BI-65037 & BI-65031 5 years ago
fay 758850ccbf BI-65018 & BI-65037 & BI-65031 5 years ago
fay dcdff635e3 Merge pull request #28 in PG2/plugin-bi-screen-adaptive from ~FAY/plugin-bi-screen-adaptive:release/10.0 to release/10.0 5 years ago
fay 31574a5ffe Revert "适配" 5 years ago
fay 4b1e94d74f 适配 5 years ago
fay ee24b92fb4 适配 5 years ago
fay 77b5fc2e5f Merge pull request #27 in PG2/plugin-bi-screen-adaptive from ~FAY/plugin-bi-screen-adaptive:release/10.0 to release/10.0 5 years ago
fay db98df02f1 fix IE 5 years ago
fay 9d50ad12ec BI-61373 fix: 插件造成模板位置问题 5 years ago
fay f91522d350 Merge pull request #25 in PG2/plugin-bi-screen-adaptive from ~FAY/plugin-bi-screen-adaptive:release/10.0 to release/10.0 5 years ago
Fay 7c57c7ae54 fix 5 years ago
Fay 0a93969be8 BI api改动 5 years ago
fay 6f5050f22f Merge pull request #22 in PG/plugin-bi-screen-adaptive from ~FAY/plugin-bi-screen-adaptive:release/10.0 to release/10.0 5 years ago
Fay 3a9ba96698 BI-56250 fix:缩小的情况有滚动条 5 years ago
fay 0ceb555238 Merge pull request #21 in PG/plugin-bi-screen-adaptive from ~FAY/plugin-bi-screen-adaptive:release/10.0 to release/10.0 5 years ago
Fay 7fbe0760fa BI-55967 & BI-55751 & BI-55749 计算popup位置时用wrapper代替 5 years ago
windy 4c6c991919 Merge pull request #20 in PG/plugin-bi-screen-adaptive from ~FAY/plugin-bi-screen-adaptive:release/10.0 to release/10.0 5 years ago
Fay 4412413bb3 BI-55726 fix:没有局中 5 years ago
Fay d551d0aaeb Merge branch 'feature/10.0' into release/10.0 5 years ago
Fay 3342f437e6 修改plugin文件 5 years ago
  1. 7
      plugin.xml
  2. 4
      src/main/java/com/finebi/plugin/ScreenAdaptive.java
  3. 335
      src/main/resources/com/finebi/plugin/web/plugin.screen_adaptive.js
  4. 335
      src/main/resources/com/finebi/plugin/web/scripts/entry.js

7
plugin.xml

@ -3,12 +3,15 @@
<id>com.finebi.plugin.screenadaptive</id>
<name><![CDATA[BI模板屏幕自适应]]></name>
<active>yes</active>
<version>1.1.33</version>
<version>1.1.4</version>
<env-version>10.0</env-version>
<jartime>2019-08-16</jartime>
<jartime>2020-05-01</jartime>
<vendor>fay</vendor>
<description><![CDATA[预览BI模板时,根据屏幕的宽度自适应显示模板]]></description>
<change-notes><![CDATA[
[2020-05-25]支持自定义缩放比<br/>
[2020-05-21]解决部分情况下图表模糊的情况<br/>
[2020-05-09]修复IE中有空白部分的情况<br/>
[2019-10-24]修复IE中有空白部分的情况<br/>
[2019-08-28]为BI模板添加模板自适应功能。<br/>
]]></change-notes>

4
src/main/java/com/finebi/plugin/ScreenAdaptive.java

@ -1,6 +1,6 @@
package com.finebi.plugin;
import com.finebi.conf.internalimp.component.ShowComponent;
import com.finebi.foundation.api.web.component.AssembleComponentFactory;
import com.fr.decision.fun.impl.AbstractWebResourceProvider;
import com.fr.intelli.record.Focus;
import com.fr.intelli.record.Original;
@ -12,7 +12,7 @@ public class ScreenAdaptive extends AbstractWebResourceProvider {
@Override
public Atom attach() {
return ShowComponent.KEY;
return AssembleComponentFactory.getShowComponent();
}
@Override

335
src/main/resources/com/finebi/plugin/web/plugin.screen_adaptive.js

@ -1,7 +1,17 @@
!(function () {
var scale = 1, transformY = 0, selected = true;
var wrapper = document.getElementById("wrapper");
var scale = 1, transformY = 0, selected = true, globalScaleRatio = parseFloat(BI.Cache.getItem('scaleRatio')) || null;
var html = document.getElementsByTagName('html')[0];
var wrapper = document.getElementById("wrapper");
var fixedWrapper = document.createElement("div");
var fixedContainer = document.createElement('div');
fixedContainer.style.position = "absolute";
fixedContainer.style.top = "0";
fixedContainer.style.left = "0";
fixedContainer.style.width = "100%";
document.body.appendChild(fixedWrapper);
fixedWrapper.appendChild(wrapper);
wrapper.appendChild(fixedContainer);
var jQuery = $ || window.jQuery;
var injectOffset = jQuery.fn.offset;
@ -10,9 +20,8 @@
var injectToolTipShow = null;
var injectBubblesShow = null;
var adjustHeight = BI.Combo.prototype.adjustHeight;
var injectOuterWidth = jQuery.fn.outerWidth;
var injectOuterHeight = jQuery.fn.outerHeight;
var injectBounds = jQuery.fn.bounds;
var originalRender = BI.Widget._renderEngine;
var injectSearch = BI.Searcher.prototype._assertPopupView;
var injectCreate = BI.createWidget;
@ -43,8 +52,8 @@
}
// 进行缩放
function transformScale() {
var bounds = getScaleBounds();
function transformScale(ratio) {
var bounds = getScaleBounds(ratio);
scale = bounds.scale;
wrapper.style.width = bounds.width + "px";
@ -53,21 +62,17 @@
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";
fixedContainer.style.height = (document.body.clientHeight / scale) + "px";
wrapper.style.overflowY = "auto";
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.overflowX = globalScaleRatio ? "auto" : "hidden";
document.body.style.overflowY = "auto";
fixedWrapper.style.overflow = "hidden";
fixedWrapper.style.width = bounds.width * scale + "px";
fixedWrapper.style.height = bounds.height * scale + "px";
// document.body.style.height = (bounds.height * scale) + "px";
// document.body.style.overflow = "hidden";
// document.body.style.top = transformY + "px";
window.scale = window.devicePixelRatio * scale;
// scaleFixed();
window.scale = Math.max(window.devicePixelRatio * scale, 1);
}
// 取消缩放
@ -80,20 +85,22 @@
wrapper.style["-ms-transform-origin"] = "";
wrapper.style.overflowY = "hidden";
wrapper.style.top = "";
fixedContainer.style.height = "0px";
html.style.backgroundColor = "#ffffff";
scale = 1;
// document.body.style.top = "0px";
// document.body.style.width = "";
// document.body.style.height = "";
// document.body.style.overflowY = "";
window.scale = window.devicePixelRatio / scale;
document.body.style.overflow = "hidden";
document.body.style.width = "100%";
document.body.style.height = "100%";
fixedWrapper.style.overflow = "hidden";
fixedWrapper.style.width = "100%";
fixedWrapper.style.height = "100%";
// revertFixed();
scale = 1;
window.scale = window.devicePixelRatio;
}
// 获取缩放倍数,原模板宽高
function getScaleBounds() {
function getScaleBounds(ratio) {
var widgets = BI.designConfigure.widgets,
layoutRatio = BI.designConfigure.layoutRatio,
freeLayoutRatio = BI.designConfigure.freeLayoutRatio,
@ -126,12 +133,27 @@
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;
var resultWidth = 0;
var resultHeight = 0;
var bHeight = 0;
if (ratio) {
scaleRatio = ratio;
bHeight = html.clientHeight / scaleRatio;
resultWidth = templateWidth;
resultHeight = Math.max(bHeight, templateHeight);
} else {
bHeight = html.clientHeight / scaleRatio;
resultWidth = html.clientWidth / scaleRatio;
resultHeight = Math.max(bHeight, scaleRatio === 1 ? html.clientHeight : templateHeight);
}
return {
scale: scaleRatio,
width: html.clientWidth / scaleRatio,
height: Math.max(bHeight, scaleRatio === 1 ? html.clientHeight : templateHeight)
width: resultWidth,
height: resultHeight
};
}
@ -188,18 +210,20 @@
offsetTop = 0;
do{
offsetLeft += el.offsetLeft;
offsetTop += el.offsetTop;
offsetLeft += ( BI.isIE() ? window.getComputedStyle(el).position === "fixed" ? el.offsetLeft / scale : el.offsetLeft : el.offsetLeft );
offsetTop += ( BI.isIE() ? window.getComputedStyle(el).position === "fixed" ? el.offsetTop / scale : el.offsetTop : el.offsetTop );
el = el.offsetParent;
} while( el );
var elm = elem;
// 不知道该怎么写代码了,就这样了
if (!checkInPopupView(elm)) {
do{
if (elm === document.body) {
break;
}
offsetLeft -= elm.scrollLeft || 0;
offsetTop -= elm.scrollTop || 0;
elm = elm.parentNode;
elm = elm.offsetParent;
} while( elm );
}
win = getWindow( doc );
@ -212,17 +236,33 @@
jQuery.event.fix = function ( e ) {
return correctEvent(injectEventFix.call(this, e));
};
if (BI.isIE()) {
// Popovers
BI.Popovers = new BI.PopoverController({render: fixedContainer});
if (BI.isIE()) {
BI.Combo.prototype.adjustHeight = function (e) {
adjustHeight.call(this, e);
if (this.popupView) {
if (!checkInPopupView(this.popupView.element[0])) {
this.popupView.element[0].style.left = parseInt(this.popupView.element[0].style.left) * scale + "px";
this.popupView.element[0].style.top = parseInt(this.popupView.element[0].style.top) * scale + transformY + "px";
this.popupView.element[0].style.left = (parseInt(this.popupView.element[0].style.left) * scale - document.body.scrollLeft) + "px";
this.popupView.element[0].style.top = (parseInt(this.popupView.element[0].style.top) * scale + transformY - document.body.scrollTop) + "px";
} else {
var cBounds = this.popupView.element[0].getBoundingClientRect();
var pBounds = this.popupView.element[0].parentElement.getBoundingClientRect();
if (cBounds.left + cBounds.width > body.clientWidth * scale) {
this.popupView.element[0].style.top = (parseInt(pBounds.top) + transformY - document.body.scrollTop) + "px";
this.popupView.element[0].style.left = (parseInt(this.popupView.element[0].style.left) * scale) + "px";
} else if (this.options.direction === "right") {
this.popupView.element[0].style.top = (parseInt(pBounds.top) + transformY - document.body.scrollTop) + "px";
this.popupView.element[0].style.left = (parseInt(pBounds.right) + transformY - document.body.scrollTop) + "px";
} else if (parseInt(cBounds.top) >= parseInt(pBounds.top) && parseInt(cBounds.left) >= parseInt(pBounds.left)) {
this.popupView.element[0].style.top = (parseInt(pBounds.bottom) + transformY - document.body.scrollTop) + "px";
this.popupView.element[0].style.left = (parseInt(pBounds.left) + transformY - document.body.scrollTop) + "px";
}else if (parseInt(cBounds.top) >= parseInt(pBounds.top) && parseInt(cBounds.left) < parseInt(pBounds.left)) {
this.popupView.element[0].style.top = (parseInt(pBounds.bottom) + transformY - document.body.scrollTop) + "px";
this.popupView.element[0].style.left = (parseInt(pBounds.left) + transformY - document.body.scrollTop) + "px";
}
}
this.popupView.element[0].style.transform = "scale(" + scale+ ")";
this.popupView.element[0].style.transformOrigin = "top left";
@ -231,55 +271,62 @@
BI.Tooltips.show = function (e, name, text, level, context, opt) {
injectToolTipShow.call(this, e, name, text, level, context, opt);
var tooltip = this.get(name);
tooltip.element[0].style.left = parseInt(tooltip.element[0].style.left) * scale + "px";
tooltip.element[0].style.top = parseInt(tooltip.element[0].style.top) * scale + transformY + "px";
tooltip.element[0].style.left = parseInt(tooltip.element[0].style.left) * scale - document.body.scrollLeft + "px";
tooltip.element[0].style.top = parseInt(tooltip.element[0].style.top) * scale + transformY - document.body.scrollTop + "px";
tooltip.element[0].style.transform = "scale(" + scale+ ")";
tooltip.element[0].style.transformOrigin = "top left";
}
BI.Bubbles.show = function (name, text, context, opt) {
injectBubblesShow.call(this, name, text, context, opt);
var tooltip = this.get(name);
tooltip.element[0].style.left = parseInt(tooltip.element[0].style.left) * scale + "px";
tooltip.element[0].style.top = parseInt(tooltip.element[0].style.top) * scale + transformY + "px";
tooltip.element[0].style.left = parseInt(tooltip.element[0].style.left) * scale - document.body.scrollLeft + "px";
tooltip.element[0].style.top = parseInt(tooltip.element[0].style.top) * scale + transformY - document.body.scrollTop + "px";
tooltip.element[0].style.transform = "scale(" + scale+ ")";
tooltip.element[0].style.transformOrigin = "top left";
}
// jQuery.fn.outerWidth = function () {
// var wdith = injectOuterWidth.apply(this, arguments);
// if (this[0] === document.body) {
// return wdith / scale;
// }
// return wdith;
// }
// jQuery.fn.outerHeight = function () {
// var height = injectOuterHeight.apply(this, arguments);
// if (this[0] === document.body) {
// return height / scale;
// }
// return height;
// }
// BI.DOM.getBottomPosition = function (combo, popup, extraHeight) {
// var el = combo.element;
// return {
// top: el.offset().top + el.outerHeight() * (1 - checkInPopupView(el[0]) ? scale : 0) + (extraHeight || 0)
// };
// }
// BI.DOM.getRightPosition = function (combo, popup, extraWidth) {
// var el = combo.element;
// return {
// left: el.offset().left + el.outerWidth() * (1-checkInPopupView(el[0]) ? scale : 0) + (extraWidth || 0)
// };
// }
var tempAdd = BI.Popovers.add;
BI.Popovers.add = function (name, popover, options, context) {
tempAdd.call(this, name, popover, options, context);
if (this.floatContainer[name].options.cls && this.floatContainer[name].options.cls.includes("bi-popup-view")) {
this.floatContainer[name].element[0].style.setProperty("position", "absolute", "important");
}
}
// Searcher
BI.Searcher.prototype._assertPopupView = function () {
injectSearch.call(this);
var self = this;
if (this.popupView) {
BI.defer(function () {
self.popupView.element[0].parentElement.style.left = parseInt(self.popupView.element[0].parentElement.style.left) * scale + "px";
self.popupView.element[0].parentElement.style.top = parseInt(self.popupView.element[0].parentElement.style.top) * scale + "px";
self.popupView.element[0].parentElement.style.transform = "scale(" + scale + ")";
self.popupView.element[0].parentElement.style.transformOrigin = "left top";
})
}
}
}
BI.createWidget = function () {
if (arguments[0] && arguments[0].element === "body") {
arguments[0].element = wrapper;
arguments[0].element = fixedContainer;
}
return injectCreate.apply(this, arguments);
};
// document.body.onmousedown = scaleFixed;
BI.Widget.registerRenderEngine({
createElement: function (widget) {
if (widget === "body") {
return BI.$(wrapper);
}
return originalRender.createElement(widget);
},
createFragment: function () {
return originalRender.createFragment();
}
});
window.addEventListener('resize', updateScale);
window.matchMedia && window.matchMedia('screen and (min-resolution: 2dppx)').
addListener(selectHandler);
@ -289,16 +336,19 @@
jQuery.fn.__isMouseInBounds__ = injectMouseInBounds;
jQuery.fn.offset = injectOffset;
jQuery.event.fix = injectEventFix;
// jQuery.fn.bounds = injectBounds;
if (BI.isIE()) {
BI.Combo.prototype.adjustHeight = adjustHeight;
BI.Tooltips.show = injectToolTipShow;
BI.Bubbles.show = injectBubblesShow;
// jQuery.fn.outerWidth = injectOuterWidth;
// jQuery.fn.outerHeight = injectOuterHeight;
}
BI.createWidget = injectCreate;
// Popovers
BI.Popovers = new BI.PopoverController();
BI.Widget.registerRenderEngine(originalRender);
BI.Searcher.prototype._assertPopupView = injectSearch;
document.body.onmousedown = null;
window.removeEventListener('resize', updateScale);
window.matchMedia && window.matchMedia('screen and (min-resolution: 2dppx)').
@ -307,7 +357,7 @@
var selectHandler = BI.debounce(function () {
selected && prepareEnv();
selected ? transformScale() : removeScale();
selected ? transformScale(globalScaleRatio) : removeScale();
!selected && restoreEnv();
}, 30);
@ -331,30 +381,6 @@
}
}
injectMouseMoveTracker();
// popupview
// function scaleFixed() {
// if (BI.isIE()) {
// var fixedList = document.getElementsByClassName("bi-popup-view");
// BI.each(fixedList, function (i, el) {
// if (window.getComputedStyle(el).position === 'fixed') {
// el.style.transformOrigin = "top left";
// el.style.transform = "scale(" + scale + ")";
// }
// })
// }
// }
//
// function revertFixed() {
// if (BI.isIE()) {
// var fixedList = document.getElementsByClassName("bi-popup-view");
// BI.each(fixedList, function (i, el) {
// if (window.getComputedStyle(el).position === 'fixed') {
// el.style.transformOrigin = "";
// el.style.transform = "";
// }
// })
// }
// }
selectHandler();
BI.config("bi.constant.dashboard.toolbar.left.items", function (config) {
@ -369,6 +395,119 @@
selectHandler();
}
}]
}, {
type: 'bi.text_value_combo',
text: '自定义缩放比例',
width: 120,
value: globalScaleRatio,
items: [
{
text: '自动',
value: null,
lgap: 10,
},
{
text: '50%',
value: 0.5,
lgap: 10,
},
{
text: '60%',
value: 0.6,
lgap: 10,
},
{
text: '70%',
value: 0.7,
lgap: 10,
},
{
lgap: 10,
text: '80%',
value: 0.8,
lgap: 10,
},
{
lgap: 10,
text: '90%',
value: 0.9,
lgap: 10,
},
{
lgap: 10,
text: '100%',
value: 1.0,
lgap: 10,
},
{
lgap: 10,
text: '110%',
value: 1.1,
lgap: 10,
},
{
lgap: 10,
text: '120%',
value: 1.2,
lgap: 10,
},
{
lgap: 10,
text: '130%',
value: 1.3,
lgap: 10,
},
{
lgap: 10,
text: '140%',
value: 1.4,
lgap: 10,
},
{
lgap: 10,
text: '150%',
value: 1.5,
lgap: 10,
},
{
lgap: 10,
text: '160%',
value: 1.6,
lgap: 10,
},
{
lgap: 10,
text: '170%',
value: 1.7,
lgap: 10,
},
{
lgap: 10,
text: '180%',
value: 1.8,
lgap: 10,
},
{
lgap: 10,
text: '190%',
value: 1.9,
lgap: 10,
},
{
lgap: 10,
text: '200%',
value: 2.0,
lgap: 10,
},
],
listeners: [{
eventName: "EVENT_CHANGE",
action: function (v) {
BI.Cache.setItem('scaleRatio', v);
globalScaleRatio = v;
selectHandler();
}
}],
}])
});
}());

335
src/main/resources/com/finebi/plugin/web/scripts/entry.js

@ -1,7 +1,17 @@
!(function () {
var scale = 1, transformY = 0, selected = true;
var wrapper = document.getElementById("wrapper");
var scale = 1, transformY = 0, selected = true, globalScaleRatio = parseFloat(BI.Cache.getItem('scaleRatio')) || null;
var html = document.getElementsByTagName('html')[0];
var wrapper = document.getElementById("wrapper");
var fixedWrapper = document.createElement("div");
var fixedContainer = document.createElement('div');
fixedContainer.style.position = "absolute";
fixedContainer.style.top = "0";
fixedContainer.style.left = "0";
fixedContainer.style.width = "100%";
document.body.appendChild(fixedWrapper);
fixedWrapper.appendChild(wrapper);
wrapper.appendChild(fixedContainer);
var jQuery = $ || window.jQuery;
var injectOffset = jQuery.fn.offset;
@ -10,9 +20,8 @@
var injectToolTipShow = null;
var injectBubblesShow = null;
var adjustHeight = BI.Combo.prototype.adjustHeight;
var injectOuterWidth = jQuery.fn.outerWidth;
var injectOuterHeight = jQuery.fn.outerHeight;
var injectBounds = jQuery.fn.bounds;
var originalRender = BI.Widget._renderEngine;
var injectSearch = BI.Searcher.prototype._assertPopupView;
var injectCreate = BI.createWidget;
@ -43,8 +52,8 @@
}
// 进行缩放
function transformScale() {
var bounds = getScaleBounds();
function transformScale(ratio) {
var bounds = getScaleBounds(ratio);
scale = bounds.scale;
wrapper.style.width = bounds.width + "px";
@ -53,21 +62,17 @@
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";
fixedContainer.style.height = (document.body.clientHeight / scale) + "px";
wrapper.style.overflowY = "auto";
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.overflowX = globalScaleRatio ? "auto" : "hidden";
document.body.style.overflowY = "auto";
fixedWrapper.style.overflow = "hidden";
fixedWrapper.style.width = bounds.width * scale + "px";
fixedWrapper.style.height = bounds.height * scale + "px";
// document.body.style.height = (bounds.height * scale) + "px";
// document.body.style.overflow = "hidden";
// document.body.style.top = transformY + "px";
window.scale = window.devicePixelRatio * scale;
// scaleFixed();
window.scale = Math.max(window.devicePixelRatio * scale, 1);
}
// 取消缩放
@ -80,20 +85,22 @@
wrapper.style["-ms-transform-origin"] = "";
wrapper.style.overflowY = "hidden";
wrapper.style.top = "";
fixedContainer.style.height = "0px";
html.style.backgroundColor = "#ffffff";
scale = 1;
// document.body.style.top = "0px";
// document.body.style.width = "";
// document.body.style.height = "";
// document.body.style.overflowY = "";
window.scale = window.devicePixelRatio / scale;
document.body.style.overflow = "hidden";
document.body.style.width = "100%";
document.body.style.height = "100%";
fixedWrapper.style.overflow = "hidden";
fixedWrapper.style.width = "100%";
fixedWrapper.style.height = "100%";
// revertFixed();
scale = 1;
window.scale = window.devicePixelRatio;
}
// 获取缩放倍数,原模板宽高
function getScaleBounds() {
function getScaleBounds(ratio) {
var widgets = BI.designConfigure.widgets,
layoutRatio = BI.designConfigure.layoutRatio,
freeLayoutRatio = BI.designConfigure.freeLayoutRatio,
@ -126,12 +133,27 @@
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;
var resultWidth = 0;
var resultHeight = 0;
var bHeight = 0;
if (ratio) {
scaleRatio = ratio;
bHeight = html.clientHeight / scaleRatio;
resultWidth = templateWidth;
resultHeight = Math.max(bHeight, templateHeight);
} else {
bHeight = html.clientHeight / scaleRatio;
resultWidth = html.clientWidth / scaleRatio;
resultHeight = Math.max(bHeight, scaleRatio === 1 ? html.clientHeight : templateHeight);
}
return {
scale: scaleRatio,
width: html.clientWidth / scaleRatio,
height: Math.max(bHeight, scaleRatio === 1 ? html.clientHeight : templateHeight)
width: resultWidth,
height: resultHeight
};
}
@ -188,18 +210,20 @@
offsetTop = 0;
do{
offsetLeft += el.offsetLeft;
offsetTop += el.offsetTop;
offsetLeft += ( BI.isIE() ? window.getComputedStyle(el).position === "fixed" ? el.offsetLeft / scale : el.offsetLeft : el.offsetLeft );
offsetTop += ( BI.isIE() ? window.getComputedStyle(el).position === "fixed" ? el.offsetTop / scale : el.offsetTop : el.offsetTop );
el = el.offsetParent;
} while( el );
var elm = elem;
// 不知道该怎么写代码了,就这样了
if (!checkInPopupView(elm)) {
do{
if (elm === document.body) {
break;
}
offsetLeft -= elm.scrollLeft || 0;
offsetTop -= elm.scrollTop || 0;
elm = elm.parentNode;
elm = elm.offsetParent;
} while( elm );
}
win = getWindow( doc );
@ -212,17 +236,33 @@
jQuery.event.fix = function ( e ) {
return correctEvent(injectEventFix.call(this, e));
};
if (BI.isIE()) {
// Popovers
BI.Popovers = new BI.PopoverController({render: fixedContainer});
if (BI.isIE()) {
BI.Combo.prototype.adjustHeight = function (e) {
adjustHeight.call(this, e);
if (this.popupView) {
if (!checkInPopupView(this.popupView.element[0])) {
this.popupView.element[0].style.left = parseInt(this.popupView.element[0].style.left) * scale + "px";
this.popupView.element[0].style.top = parseInt(this.popupView.element[0].style.top) * scale + transformY + "px";
this.popupView.element[0].style.left = (parseInt(this.popupView.element[0].style.left) * scale - document.body.scrollLeft) + "px";
this.popupView.element[0].style.top = (parseInt(this.popupView.element[0].style.top) * scale + transformY - document.body.scrollTop) + "px";
} else {
var cBounds = this.popupView.element[0].getBoundingClientRect();
var pBounds = this.popupView.element[0].parentElement.getBoundingClientRect();
if (cBounds.left + cBounds.width > body.clientWidth * scale) {
this.popupView.element[0].style.top = (parseInt(pBounds.top) + transformY - document.body.scrollTop) + "px";
this.popupView.element[0].style.left = (parseInt(this.popupView.element[0].style.left) * scale) + "px";
} else if (this.options.direction === "right") {
this.popupView.element[0].style.top = (parseInt(pBounds.top) + transformY - document.body.scrollTop) + "px";
this.popupView.element[0].style.left = (parseInt(pBounds.right) + transformY - document.body.scrollTop) + "px";
} else if (parseInt(cBounds.top) >= parseInt(pBounds.top) && parseInt(cBounds.left) >= parseInt(pBounds.left)) {
this.popupView.element[0].style.top = (parseInt(pBounds.bottom) + transformY - document.body.scrollTop) + "px";
this.popupView.element[0].style.left = (parseInt(pBounds.left) + transformY - document.body.scrollTop) + "px";
}else if (parseInt(cBounds.top) >= parseInt(pBounds.top) && parseInt(cBounds.left) < parseInt(pBounds.left)) {
this.popupView.element[0].style.top = (parseInt(pBounds.bottom) + transformY - document.body.scrollTop) + "px";
this.popupView.element[0].style.left = (parseInt(pBounds.left) + transformY - document.body.scrollTop) + "px";
}
}
this.popupView.element[0].style.transform = "scale(" + scale+ ")";
this.popupView.element[0].style.transformOrigin = "top left";
@ -231,55 +271,62 @@
BI.Tooltips.show = function (e, name, text, level, context, opt) {
injectToolTipShow.call(this, e, name, text, level, context, opt);
var tooltip = this.get(name);
tooltip.element[0].style.left = parseInt(tooltip.element[0].style.left) * scale + "px";
tooltip.element[0].style.top = parseInt(tooltip.element[0].style.top) * scale + transformY + "px";
tooltip.element[0].style.left = parseInt(tooltip.element[0].style.left) * scale - document.body.scrollLeft + "px";
tooltip.element[0].style.top = parseInt(tooltip.element[0].style.top) * scale + transformY - document.body.scrollTop + "px";
tooltip.element[0].style.transform = "scale(" + scale+ ")";
tooltip.element[0].style.transformOrigin = "top left";
}
BI.Bubbles.show = function (name, text, context, opt) {
injectBubblesShow.call(this, name, text, context, opt);
var tooltip = this.get(name);
tooltip.element[0].style.left = parseInt(tooltip.element[0].style.left) * scale + "px";
tooltip.element[0].style.top = parseInt(tooltip.element[0].style.top) * scale + transformY + "px";
tooltip.element[0].style.left = parseInt(tooltip.element[0].style.left) * scale - document.body.scrollLeft + "px";
tooltip.element[0].style.top = parseInt(tooltip.element[0].style.top) * scale + transformY - document.body.scrollTop + "px";
tooltip.element[0].style.transform = "scale(" + scale+ ")";
tooltip.element[0].style.transformOrigin = "top left";
}
// jQuery.fn.outerWidth = function () {
// var wdith = injectOuterWidth.apply(this, arguments);
// if (this[0] === document.body) {
// return wdith / scale;
// }
// return wdith;
// }
// jQuery.fn.outerHeight = function () {
// var height = injectOuterHeight.apply(this, arguments);
// if (this[0] === document.body) {
// return height / scale;
// }
// return height;
// }
// BI.DOM.getBottomPosition = function (combo, popup, extraHeight) {
// var el = combo.element;
// return {
// top: el.offset().top + el.outerHeight() * (1 - checkInPopupView(el[0]) ? scale : 0) + (extraHeight || 0)
// };
// }
// BI.DOM.getRightPosition = function (combo, popup, extraWidth) {
// var el = combo.element;
// return {
// left: el.offset().left + el.outerWidth() * (1-checkInPopupView(el[0]) ? scale : 0) + (extraWidth || 0)
// };
// }
var tempAdd = BI.Popovers.add;
BI.Popovers.add = function (name, popover, options, context) {
tempAdd.call(this, name, popover, options, context);
if (this.floatContainer[name].options.cls && this.floatContainer[name].options.cls.includes("bi-popup-view")) {
this.floatContainer[name].element[0].style.setProperty("position", "absolute", "important");
}
}
// Searcher
BI.Searcher.prototype._assertPopupView = function () {
injectSearch.call(this);
var self = this;
if (this.popupView) {
BI.defer(function () {
self.popupView.element[0].parentElement.style.left = parseInt(self.popupView.element[0].parentElement.style.left) * scale + "px";
self.popupView.element[0].parentElement.style.top = parseInt(self.popupView.element[0].parentElement.style.top) * scale + "px";
self.popupView.element[0].parentElement.style.transform = "scale(" + scale + ")";
self.popupView.element[0].parentElement.style.transformOrigin = "left top";
})
}
}
}
BI.createWidget = function () {
if (arguments[0] && arguments[0].element === "body") {
arguments[0].element = wrapper;
arguments[0].element = fixedContainer;
}
return injectCreate.apply(this, arguments);
};
// document.body.onmousedown = scaleFixed;
BI.Widget.registerRenderEngine({
createElement: function (widget) {
if (widget === "body") {
return BI.$(wrapper);
}
return originalRender.createElement(widget);
},
createFragment: function () {
return originalRender.createFragment();
}
});
window.addEventListener('resize', updateScale);
window.matchMedia && window.matchMedia('screen and (min-resolution: 2dppx)').
addListener(selectHandler);
@ -289,16 +336,19 @@
jQuery.fn.__isMouseInBounds__ = injectMouseInBounds;
jQuery.fn.offset = injectOffset;
jQuery.event.fix = injectEventFix;
// jQuery.fn.bounds = injectBounds;
if (BI.isIE()) {
BI.Combo.prototype.adjustHeight = adjustHeight;
BI.Tooltips.show = injectToolTipShow;
BI.Bubbles.show = injectBubblesShow;
// jQuery.fn.outerWidth = injectOuterWidth;
// jQuery.fn.outerHeight = injectOuterHeight;
}
BI.createWidget = injectCreate;
// Popovers
BI.Popovers = new BI.PopoverController();
BI.Widget.registerRenderEngine(originalRender);
BI.Searcher.prototype._assertPopupView = injectSearch;
document.body.onmousedown = null;
window.removeEventListener('resize', updateScale);
window.matchMedia && window.matchMedia('screen and (min-resolution: 2dppx)').
@ -307,7 +357,7 @@
var selectHandler = BI.debounce(function () {
selected && prepareEnv();
selected ? transformScale() : removeScale();
selected ? transformScale(globalScaleRatio) : removeScale();
!selected && restoreEnv();
}, 30);
@ -331,30 +381,6 @@
}
}
injectMouseMoveTracker();
// popupview
// function scaleFixed() {
// if (BI.isIE()) {
// var fixedList = document.getElementsByClassName("bi-popup-view");
// BI.each(fixedList, function (i, el) {
// if (window.getComputedStyle(el).position === 'fixed') {
// el.style.transformOrigin = "top left";
// el.style.transform = "scale(" + scale + ")";
// }
// })
// }
// }
//
// function revertFixed() {
// if (BI.isIE()) {
// var fixedList = document.getElementsByClassName("bi-popup-view");
// BI.each(fixedList, function (i, el) {
// if (window.getComputedStyle(el).position === 'fixed') {
// el.style.transformOrigin = "";
// el.style.transform = "";
// }
// })
// }
// }
selectHandler();
BI.config("bi.constant.dashboard.toolbar.left.items", function (config) {
@ -369,6 +395,119 @@
selectHandler();
}
}]
}, {
type: 'bi.text_value_combo',
text: '自定义缩放比例',
width: 120,
value: globalScaleRatio,
items: [
{
text: '自动',
value: null,
lgap: 10,
},
{
text: '50%',
value: 0.5,
lgap: 10,
},
{
text: '60%',
value: 0.6,
lgap: 10,
},
{
text: '70%',
value: 0.7,
lgap: 10,
},
{
lgap: 10,
text: '80%',
value: 0.8,
lgap: 10,
},
{
lgap: 10,
text: '90%',
value: 0.9,
lgap: 10,
},
{
lgap: 10,
text: '100%',
value: 1.0,
lgap: 10,
},
{
lgap: 10,
text: '110%',
value: 1.1,
lgap: 10,
},
{
lgap: 10,
text: '120%',
value: 1.2,
lgap: 10,
},
{
lgap: 10,
text: '130%',
value: 1.3,
lgap: 10,
},
{
lgap: 10,
text: '140%',
value: 1.4,
lgap: 10,
},
{
lgap: 10,
text: '150%',
value: 1.5,
lgap: 10,
},
{
lgap: 10,
text: '160%',
value: 1.6,
lgap: 10,
},
{
lgap: 10,
text: '170%',
value: 1.7,
lgap: 10,
},
{
lgap: 10,
text: '180%',
value: 1.8,
lgap: 10,
},
{
lgap: 10,
text: '190%',
value: 1.9,
lgap: 10,
},
{
lgap: 10,
text: '200%',
value: 2.0,
lgap: 10,
},
],
listeners: [{
eventName: "EVENT_CHANGE",
action: function (v) {
BI.Cache.setItem('scaleRatio', v);
globalScaleRatio = v;
selectHandler();
}
}],
}])
});
}());
Loading…
Cancel
Save