Fixed FILL video mode to allow for proper resize handling. Added some additional functionality to get the width in pixels of a string by creating, measuring, and destroying a hidden div containing the wanted string in a given Font.

master
kts 2014-08-12 17:47:41 -07:00
parent 9d5fcedf00
commit 8d1a4f86f5
1 changed files with 61 additions and 8 deletions

View File

@ -98,6 +98,34 @@ CBDL.Graphics.BaseDisplay.prototype._Font_ = function(family) {
this.family = family;
};
CBDL.Graphics.BaseDisplay.prototype._Font_.prototype.destroy = function() {};
CBDL.Graphics.BaseDisplay.prototype._Font_.prototype.getWidth = function(size) {
var test = document.createElement('div');
test.innerHTML = 'a';
//test.style.left = "-1000px";
//test.style.top = "-1000px";
test.style.visibility = "hidden";
test.style.position = "absolute";
test.style.fontFamily = this.family;
test.style.fontSize = size+"px";
document.body.appendChild(test);
var width = test.clientWidth+1;
document.body.removeChild(test);
return width;
};
CBDL.Graphics.BaseDisplay.prototype._Font_.prototype.getTextWidth = function(size, string) {
var test = document.createElement('div');
test.innerHTML = string;
test.style.left = "-1000px";
test.style.top = "-1000px";
//test.style.visibility = "hidden";
test.style.position = "absolute";
test.style.fontFamily = this.family;
test.style.fontSize = size+"px";
document.body.appendChild(test);
var width = test.clientWidth;
document.body.removeChild(test);
return width;
};
CBDL.Graphics.BaseDisplay.prototype._String_ = function(text, font, size) {
this.text = text;
@ -168,6 +196,7 @@ CBDL.Graphics.Display = function(target_element, video_mode, backend) {
return (new CBDL.Graphics.DivDisplay(target_element, video_mode));
break;
}
return false;
};
CBDL.Graphics.WebGlDisplay = function(target_element, video_mode) {
@ -219,12 +248,15 @@ CBDL.Graphics.Canvas2dDisplay.prototype.Init = function() {
this.element.style.position = "relative";
}
if (this.video_mode.flags & CBDL.Graphics.VM.FILL) {
viewport = CBDL.Graphics.getViewport();
this.video_mode.width = viewport.width;
this.video_mode.height = viewport.height;
this.element.width = viewport.width;
this.element.height = viewport.height;
this.viewport = CBDL.Graphics.getViewport();
this.video_mode.width = this.viewport.width;
this.video_mode.height = this.viewport.height;
this.element.width = this.viewport.width;
this.element.height = this.viewport.height;
} else {
this.viewport = {};
this.viewport.width = this.video_mode.width;
this.viewport.height = this.video_mode.height;
this.element.width = this.video_mode.width;
this.element.height = this.video_mode.height;
}
@ -238,6 +270,16 @@ CBDL.Graphics.Canvas2dDisplay.prototype.Init = function() {
this.offscreen_context = this.offscreen.getContext("2d");
};
CBDL.Graphics.Canvas2dDisplay.prototype.updateViewport = function() {
if (this.video_mode.flags & CBDL.Graphics.VM.FILL) {
this.viewport = CBDL.Graphics.getViewport();
this.video_mode.width = this.viewport.width;
this.video_mode.height = this.viewport.height;
this.element.width = this.viewport.width;
this.element.height = this.viewport.height;
}
};
CBDL.Graphics.Canvas2dDisplay.prototype.setWidth = function(width) {
this.video_mode.width = width;
this.element.width = width;
@ -396,10 +438,13 @@ CBDL.Graphics.DivDisplay.prototype.Init = function() {
this.element.style.position = "relative";
}
if (this.video_mode.flags & CBDL.Graphics.VM.FILL) {
viewport = CBDL.Graphics.getViewport();
this.element.style.width = viewport.width+"px";
this.element.style.height = viewport.height+"px";
this.viewport = CBDL.Graphics.getViewport();
this.element.style.width = this.viewport.width+"px";
this.element.style.height = this.viewport.height+"px";
} else {
this.viewport = {};
this.viewport.width = this.video_mode.width;
this.viewport.height = this.video_mode.height;
this.element.style.width = this.video_mode.width+"px";
this.element.style.height = this.video_mode.height+"px";
}
@ -409,6 +454,14 @@ CBDL.Graphics.DivDisplay.prototype.Init = function() {
this.current_z = 0;
};
CBDL.Graphics.DivDisplay.prototype.updateViewport = function() {
if (this.video_mode.flags & CBDL.Graphics.VM.FILL) {
this.viewport = CBDL.Graphics.getViewport();
this.element.style.width = this.viewport.width+"px";
this.element.style.height = this.viewport.height+"px";
}
};
CBDL.Graphics.DivDisplay.prototype.setWidth = function(width) {
this.element.style.width = width+"px";
};