@ -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 = wrapp er;
arguments [ 0 ] . element = fixedContain er;
}
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 ( ) ;
}
} ] ,
} ] )
} ) ;
} ( ) ) ;