|
|
|
@ -1,5 +1,5 @@
|
|
|
|
|
!(function () { |
|
|
|
|
var scale = 1, transformY = 0, selected = true; |
|
|
|
|
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"); |
|
|
|
@ -52,8 +52,8 @@
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 进行缩放
|
|
|
|
|
function transformScale() { |
|
|
|
|
var bounds = getScaleBounds(); |
|
|
|
|
function transformScale(ratio) { |
|
|
|
|
var bounds = getScaleBounds(ratio); |
|
|
|
|
scale = bounds.scale; |
|
|
|
|
|
|
|
|
|
wrapper.style.width = bounds.width + "px"; |
|
|
|
@ -66,13 +66,11 @@
|
|
|
|
|
wrapper.style.overflowY = "auto"; |
|
|
|
|
html.style.backgroundColor = "#ffffff"; |
|
|
|
|
|
|
|
|
|
document.body.style.overflowX = "hidden"; |
|
|
|
|
document.body.style.overflowX = globalScaleRatio ? "auto" : "hidden"; |
|
|
|
|
document.body.style.overflowY = "auto"; |
|
|
|
|
fixedWrapper.style.overflow = "hidden"; |
|
|
|
|
if (scale < 1) { |
|
|
|
|
fixedWrapper.style.width = bounds.width * scale + "px"; |
|
|
|
|
fixedWrapper.style.height = bounds.height * scale + "px"; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
window.scale = Math.max(window.devicePixelRatio * scale, 1); |
|
|
|
|
} |
|
|
|
@ -102,7 +100,7 @@
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 获取缩放倍数,原模板宽高
|
|
|
|
|
function getScaleBounds() { |
|
|
|
|
function getScaleBounds(ratio) { |
|
|
|
|
var widgets = BI.designConfigure.widgets, |
|
|
|
|
layoutRatio = BI.designConfigure.layoutRatio, |
|
|
|
|
freeLayoutRatio = BI.designConfigure.freeLayoutRatio, |
|
|
|
@ -135,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 |
|
|
|
|
}; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -344,7 +357,7 @@
|
|
|
|
|
|
|
|
|
|
var selectHandler = BI.debounce(function () { |
|
|
|
|
selected && prepareEnv(); |
|
|
|
|
selected ? transformScale() : removeScale(); |
|
|
|
|
selected ? transformScale(globalScaleRatio) : removeScale(); |
|
|
|
|
!selected && restoreEnv(); |
|
|
|
|
}, 30); |
|
|
|
|
|
|
|
|
@ -382,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(); |
|
|
|
|
} |
|
|
|
|
}], |
|
|
|
|
}]) |
|
|
|
|
}); |
|
|
|
|
}()); |