fix text measure
This commit is contained in:
parent
01ddab9597
commit
3ec57748a9
2 changed files with 19 additions and 5 deletions
|
|
@ -6,7 +6,7 @@ ace.layer.Text = function(parentEl) {
|
||||||
parentEl.appendChild(this.element);
|
parentEl.appendChild(this.element);
|
||||||
|
|
||||||
this.$characterSize = this.$measureSizes();
|
this.$characterSize = this.$measureSizes();
|
||||||
this.$pollSizeChanges();
|
//this.$pollSizeChanges();
|
||||||
};
|
};
|
||||||
|
|
||||||
(function() {
|
(function() {
|
||||||
|
|
@ -41,27 +41,41 @@ ace.layer.Text = function(parentEl) {
|
||||||
}, 500);
|
}, 500);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
this.$fontStyles = {
|
||||||
|
fontFamily : 1,
|
||||||
|
fontSize : 1,
|
||||||
|
fontWeight : 1,
|
||||||
|
fontStyle : 1,
|
||||||
|
lineHeight : 1
|
||||||
|
},
|
||||||
|
|
||||||
this.$measureSizes = function() {
|
this.$measureSizes = function() {
|
||||||
var measureNode = document.createElement("div");
|
var measureNode = document.createElement("div");
|
||||||
var style = measureNode.style;
|
var style = measureNode.style;
|
||||||
|
|
||||||
style.width = style.height = "auto";
|
style.width = style.height = "auto";
|
||||||
style.left = style.top = "-1000px";
|
style.left = style.top = "-1000px";
|
||||||
style.visibility = "hidden";
|
style.visibility = "hidden";
|
||||||
style.position = "absolute";
|
style.position = "absolute";
|
||||||
style.overflow = "visible";
|
style.overflow = "visible";
|
||||||
|
|
||||||
measureNode.innerHTML = new Array(1000).join("Xy");
|
for (prop in this.$fontStyles) {
|
||||||
this.element.appendChild(measureNode);
|
var value = ace.computedStyle(this.element, prop);
|
||||||
|
style[prop] = value;
|
||||||
|
}
|
||||||
|
|
||||||
// in FF 3.6 monospace fonts can have a fixed sub pixel width.
|
// in FF 3.6 monospace fonts can have a fixed sub pixel width.
|
||||||
// that's why we have to measure many characters
|
// that's why we have to measure many characters
|
||||||
// Note: characterWidth can be a float!
|
// Note: characterWidth can be a float!
|
||||||
|
measureNode.innerHTML = new Array(1000).join("Xy");
|
||||||
|
document.body.insertBefore(measureNode, document.body.firstChild);
|
||||||
|
|
||||||
var size = {
|
var size = {
|
||||||
height: measureNode.offsetHeight,
|
height: measureNode.offsetHeight,
|
||||||
width: measureNode.offsetWidth / 2000
|
width: measureNode.offsetWidth / 2000
|
||||||
};
|
};
|
||||||
|
|
||||||
this.element.removeChild(measureNode);
|
document.body.removeChild(measureNode);
|
||||||
return size;
|
return size;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -47,7 +47,7 @@
|
||||||
|
|
||||||
this.computedStyle = function(element, style) {
|
this.computedStyle = function(element, style) {
|
||||||
if (window.getComputedStyle) {
|
if (window.getComputedStyle) {
|
||||||
return (window.getComputedStyle(element, null))[style];
|
return (window.getComputedStyle(element, "") || {})[style] || "";
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
return element.currentStyle[style];
|
return element.currentStyle[style];
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue