|
|
|
@ -1,11 +1,18 @@
|
|
|
|
|
!(function () { |
|
|
|
|
var scale = 1, transformY = 0, selected = false; |
|
|
|
|
var wrapper = document.getElementById("wrapper"); |
|
|
|
|
var html = document.getElementsByTagName('html')[0]; |
|
|
|
|
|
|
|
|
|
var jQuery = $ || window.jQuery; |
|
|
|
|
var injectOffset = jQuery.fn.offset; |
|
|
|
|
var injectEventFix = jQuery.event.fix; |
|
|
|
|
var injectMouseInBounds = jQuery.fn.__isMouseInBounds__; |
|
|
|
|
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; |
|
|
|
|
|
|
|
|
|
// 修正事件偏移
|
|
|
|
|
function correctEvent(e) { |
|
|
|
@ -19,6 +26,20 @@
|
|
|
|
|
return e; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
function checkInPopupView(el) { |
|
|
|
|
var t = el.parentElement; |
|
|
|
|
var flag = false; |
|
|
|
|
do { |
|
|
|
|
if (t.className && t.className.indexOf("bi-popup-view") !== -1) { |
|
|
|
|
flag = true; |
|
|
|
|
break; |
|
|
|
|
} |
|
|
|
|
t = t.parentElement |
|
|
|
|
} while (t); |
|
|
|
|
|
|
|
|
|
return flag; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 进行缩放
|
|
|
|
|
function transformScale() { |
|
|
|
|
var bounds = getScaleBounds(); |
|
|
|
@ -30,18 +51,20 @@
|
|
|
|
|
document.body.style["-ms-transform"] = "scale(" + bounds.scale+ ")"; |
|
|
|
|
document.body.style["-ms-transform-origin"] = "top left"; |
|
|
|
|
html.style.overflowY = "auto"; |
|
|
|
|
html.style.backgroundColor = "#2c3d59"; |
|
|
|
|
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; |
|
|
|
|
document.body.style.top = transformY + "px"; |
|
|
|
|
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"; |
|
|
|
|
window.scale = window.devicePixelRatio * scale; |
|
|
|
|
// scaleFixed();
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 取消缩放
|
|
|
|
@ -53,11 +76,17 @@
|
|
|
|
|
document.body.style["-ms-transform"] = ""; |
|
|
|
|
document.body.style["-ms-transform-origin"] = ""; |
|
|
|
|
document.body.style.overflowY = "hidden"; |
|
|
|
|
document.body.style.top = "0px"; |
|
|
|
|
document.body.style.top = ""; |
|
|
|
|
html.style.backgroundColor = "#ffffff"; |
|
|
|
|
|
|
|
|
|
window.scale = window.devicePixelRatio / scale; |
|
|
|
|
scale = 1; |
|
|
|
|
// document.body.style.top = "0px";
|
|
|
|
|
// document.body.style.width = "";
|
|
|
|
|
// document.body.style.height = "";
|
|
|
|
|
// document.body.style.overflowY = "";
|
|
|
|
|
window.scale = window.devicePixelRatio / scale; |
|
|
|
|
|
|
|
|
|
// revertFixed();
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 获取缩放倍数,原模板宽高
|
|
|
|
@ -83,107 +112,183 @@
|
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
var templateWidth = Math.round((right / (layoutRatio.x || 1)) || (freeRight / (freeLayoutRatio.x || 1))); |
|
|
|
|
var templateHeight = Math.round((bottom / (layoutRatio.y || 1)) || (freeBottom / (freeLayoutRatio.y || 1))); |
|
|
|
|
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)); |
|
|
|
|
return { |
|
|
|
|
scale: scaleRatio, |
|
|
|
|
width: html.clientWidth / scaleRatio, |
|
|
|
|
height: templateHeight |
|
|
|
|
height: scaleRatio === 1 ? html.clientHeight : templateHeight |
|
|
|
|
}; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 准备环境,主要是纠正事件偏移
|
|
|
|
|
function prepareEnv() { |
|
|
|
|
// IE的fixed元素不受transform:scale影响
|
|
|
|
|
if (!BI.isIE()) { |
|
|
|
|
jQuery.fn.__isMouseInBounds__ = function (e) { |
|
|
|
|
var offset2Body = this.get(0).getBoundingClientRect ? this.get(0).getBoundingClientRect() : this.offset(); |
|
|
|
|
var width = offset2Body.width || this.outerWidth(); |
|
|
|
|
var height = offset2Body.height || this.outerHeight(); |
|
|
|
|
var pageX = e.pageX * scale, |
|
|
|
|
pageY = e.pageY * scale + transformY; |
|
|
|
|
return !(pageX < Math.floor(offset2Body.left) || pageX > offset2Body.left + width |
|
|
|
|
|| pageY < Math.floor(offset2Body.top) || pageY > offset2Body.top + height); |
|
|
|
|
}; |
|
|
|
|
jQuery.fn.offset = function( options ) { |
|
|
|
|
function getWindow( elem ) { |
|
|
|
|
return jQuery.isWindow( elem ) ? |
|
|
|
|
elem : |
|
|
|
|
elem.nodeType === 9 ? |
|
|
|
|
elem.defaultView || elem.parentWindow : |
|
|
|
|
false; |
|
|
|
|
} |
|
|
|
|
injectToolTipShow = injectToolTipShow || BI.Tooltips.show; |
|
|
|
|
injectBubblesShow = injectBubblesShow || BI.Bubbles.show; |
|
|
|
|
jQuery.fn.__isMouseInBounds__ = function (e) { |
|
|
|
|
var offset2Body = this.get(0).getBoundingClientRect ? this.get(0).getBoundingClientRect() : this.offset(); |
|
|
|
|
var width = offset2Body.width || this.outerWidth(); |
|
|
|
|
var height = offset2Body.height || this.outerHeight(); |
|
|
|
|
var pageX = e.clientX * scale, |
|
|
|
|
pageY = e.clientY * scale + transformY; |
|
|
|
|
return !(pageX < Math.floor(offset2Body.left) || pageX > offset2Body.left + width |
|
|
|
|
|| pageY < Math.floor(offset2Body.top) || pageY > offset2Body.top + height); |
|
|
|
|
}; |
|
|
|
|
jQuery.fn.offset = function( options ) { |
|
|
|
|
function getWindow( elem ) { |
|
|
|
|
return jQuery.isWindow( elem ) ? |
|
|
|
|
elem : |
|
|
|
|
elem.nodeType === 9 ? |
|
|
|
|
elem.defaultView || elem.parentWindow : |
|
|
|
|
false; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
if ( arguments.length ) { |
|
|
|
|
return options === undefined ? |
|
|
|
|
this : |
|
|
|
|
this.each(function( i ) { |
|
|
|
|
jQuery.offset.setOffset( this, options, i ); |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
if ( arguments.length ) { |
|
|
|
|
return options === undefined ? |
|
|
|
|
this : |
|
|
|
|
this.each(function( i ) { |
|
|
|
|
jQuery.offset.setOffset( this, options, i ); |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
var docElem, win, |
|
|
|
|
box = { top: 0, left: 0 }, |
|
|
|
|
elem = this[ 0 ], |
|
|
|
|
doc = elem && elem.ownerDocument; |
|
|
|
|
|
|
|
|
|
if ( !doc ) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
var docElem, win, |
|
|
|
|
box = { top: 0, left: 0 }, |
|
|
|
|
elem = this[ 0 ], |
|
|
|
|
doc = elem && elem.ownerDocument; |
|
|
|
|
|
|
|
|
|
docElem = doc.documentElement; |
|
|
|
|
if ( !doc ) { |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// Make sure it's not a disconnected DOM node
|
|
|
|
|
if ( !jQuery.contains( docElem, elem ) ) { |
|
|
|
|
return box; |
|
|
|
|
} |
|
|
|
|
docElem = doc.documentElement; |
|
|
|
|
|
|
|
|
|
// Make sure it's not a disconnected DOM node
|
|
|
|
|
if ( !jQuery.contains( docElem, elem ) ) { |
|
|
|
|
return box; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
var el = elem, |
|
|
|
|
offsetLeft = 0, |
|
|
|
|
offsetTop = 0; |
|
|
|
|
var el = elem, |
|
|
|
|
offsetLeft = 0, |
|
|
|
|
offsetTop = 0; |
|
|
|
|
|
|
|
|
|
do{ |
|
|
|
|
offsetLeft += el.offsetLeft; |
|
|
|
|
offsetTop += el.offsetTop; |
|
|
|
|
el = el.offsetParent; |
|
|
|
|
} while( el ); |
|
|
|
|
do{ |
|
|
|
|
offsetLeft += el.offsetLeft; |
|
|
|
|
offsetTop += el.offsetTop; |
|
|
|
|
el = el.offsetParent; |
|
|
|
|
} while( el ); |
|
|
|
|
|
|
|
|
|
var elm = elem; |
|
|
|
|
var elm = elem; |
|
|
|
|
// 不知道该怎么写代码了,就这样了
|
|
|
|
|
if (!checkInPopupView(elm)) { |
|
|
|
|
do{ |
|
|
|
|
offsetLeft -= elm.scrollLeft || 0; |
|
|
|
|
offsetTop -= elm.scrollTop || 0; |
|
|
|
|
elm = elm.parentNode; |
|
|
|
|
} while( elm ); |
|
|
|
|
win = getWindow( doc ); |
|
|
|
|
return { |
|
|
|
|
top: offsetTop + ( win.pageYOffset || docElem.scrollTop ) - ( docElem.clientTop || 0 ), |
|
|
|
|
left: offsetLeft + ( win.pageXOffset || docElem.scrollLeft ) - ( docElem.clientLeft || 0 ) |
|
|
|
|
}; |
|
|
|
|
} |
|
|
|
|
win = getWindow( doc ); |
|
|
|
|
return { |
|
|
|
|
top: offsetTop + ( win.pageYOffset || docElem.scrollTop ) - ( docElem.clientTop || 0 ), |
|
|
|
|
left: offsetLeft + ( win.pageXOffset || docElem.scrollLeft ) - ( docElem.clientLeft || 0 ) |
|
|
|
|
}; |
|
|
|
|
jQuery.event.fix = function ( e ) { |
|
|
|
|
return correctEvent(injectEventFix.call(this, e)); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
jQuery.event.fix = function ( e ) { |
|
|
|
|
return correctEvent(injectEventFix.call(this, e)); |
|
|
|
|
}; |
|
|
|
|
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"; |
|
|
|
|
} else { |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
this.popupView.element[0].style.transform = "scale(" + scale+ ")"; |
|
|
|
|
this.popupView.element[0].style.transformOrigin = "top left"; |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
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.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.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)
|
|
|
|
|
// };
|
|
|
|
|
// }
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// document.body.onmousedown = scaleFixed;
|
|
|
|
|
window.addEventListener('resize', updateScale); |
|
|
|
|
window.matchMedia && window.matchMedia('screen and (min-resolution: 2dppx)'). |
|
|
|
|
addListener(selectHandler); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
function restoreEnv() { |
|
|
|
|
if (!BI.isIE()) { |
|
|
|
|
jQuery.fn.__isMouseInBounds__ = injectMouseInBounds; |
|
|
|
|
jQuery.fn.offset = injectOffset; |
|
|
|
|
jQuery.event.fix = injectEventFix; |
|
|
|
|
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;
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
document.body.onmousedown = null; |
|
|
|
|
window.removeEventListener('resize', updateScale); |
|
|
|
|
window.matchMedia && window.matchMedia('screen and (min-resolution: 2dppx)'). |
|
|
|
|
removeListener(selectHandler); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
function selectHandler () { |
|
|
|
|
var selectHandler = BI.debounce(function () { |
|
|
|
|
selected && prepareEnv(); |
|
|
|
|
selected ? transformScale() : removeScale(); |
|
|
|
|
!selected && restoreEnv(); |
|
|
|
|
} |
|
|
|
|
}, 30); |
|
|
|
|
|
|
|
|
|
function updateScale () { |
|
|
|
|
if (html.getBoundingClientRect().width !== document.body.getBoundingClientRect().width) { |
|
|
|
@ -205,6 +310,30 @@
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
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 = "";
|
|
|
|
|
// }
|
|
|
|
|
// })
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
BI.config("bi.constant.dashboard.toolbar.left.items", function (config) { |
|
|
|
|
return BI.concat(config, [{ |
|
|
|
|