QB64/qbjs
QB64/qbjs
1
1
Fork 0
mirror of https://github.com/boxgaming/qbjs.git synced 2024-09-20 04:24:45 +00:00
Code Issues Releases Wiki Activity

wrap text lines longer than display in print method. fixed input method to work with variable width fonts

Browse source
This commit is contained in:
boxgaming 2023-05-17 00:50:18 -05:00
parent 8c7b0a3739
commit c005873aa1
1 changed files with 86 additions and 64 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

150
qb.js
View file

@ -36,6 +36,7 @@ var QB = new function() {
var _lastLimitTime; var _lastLimitTime;
var _lastKey = null; var _lastKey = null;
var _locX = 0; var _locX = 0;
var _lastTextX = 0;
var _locY = 0; var _locY = 0;
var _nextImageId = 1000; var _nextImageId = 1000;
var _nextFontId = 1000; var _nextFontId = 1000;
@ -379,6 +380,7 @@ var QB = new function() {
} }
_font = fnt; _font = fnt;
_locX = 0; _locX = 0;
_lastTextX = 0;
_locY = 0; _locY = 0;
}; };
@ -1052,7 +1054,6 @@ var QB = new function() {
this.sub_ChDir = function(path) { this.sub_ChDir = function(path) {
var node = GX.vfs().getNode(path, GX.vfsCwd()); var node = GX.vfs().getNode(path, GX.vfsCwd());
//alert("CHDIR: " + path + " node: " + node);
if (node) { if (node) {
GX.vfsCwd(node); GX.vfsCwd(node);
} }
@ -1094,6 +1095,7 @@ var QB = new function() {
// reset the text position // reset the text position
_locX = 0; _locX = 0;
_lastTextX = 0;
_locY = 0; _locY = 0;
}; };
@ -1481,6 +1483,9 @@ var QB = new function() {
}; };
function _textColumns() { function _textColumns() {
if (!_font.monospace) {
return Math.floor(_width() / QB.func__FontWidth(8));
}
return Math.floor(_width() / QB.func__FontWidth()); return Math.floor(_width() / QB.func__FontWidth());
} }
@ -1528,23 +1533,27 @@ var QB = new function() {
_locY = _textRows()-1; _locY = _textRows()-1;
} }
var ctx = _images[_activeImage].ctx;
while (_lastKey != "Enter") { while (_lastKey != "Enter") {
if (_lastKey == "Backspace" && str.length > 0) { if (_lastKey == "Backspace" && str.length > 0) {
_locX--; _locX--;
var ctx = _images[_activeImage].ctx; var tm = ctx.measureText(str);
str = str.substring(0, str.length-1);
ctx.beginPath(); ctx.beginPath();
ctx.fillStyle = _bgColor.rgba(); ctx.fillStyle = _bgColor.rgba();
ctx.fillRect(_locX * QB.func__FontWidth(), _locY * QB.func__FontHeight(), QB.func__FontWidth() , QB.func__FontHeight()); //ctx.fillRect(_locX * QB.func__FontWidth(), _locY * QB.func__FontHeight(), QB.func__FontWidth() , QB.func__FontHeight());
str = str.substring(0, str.length-1); ctx.fillRect(_lastTextX, _locY * QB.func__FontHeight(), tm.width, QB.func__FontHeight());
QB.sub__PrintString(_lastTextX, _locY * QB.func__FontHeight(), str);
} }
else if (_lastKey && _lastKey.length < 2) { else if (_lastKey && _lastKey.length < 2) {
QB.sub__PrintString(_locX * QB.func__FontWidth(), _locY * QB.func__FontHeight(), _lastKey);
_locX++;
str += _lastKey; str += _lastKey;
//QB.sub__PrintString(_locX * QB.func__FontWidth(), _locY * QB.func__FontHeight(), _lastKey);
QB.sub__PrintString(_lastTextX, _locY * QB.func__FontHeight(), str);
_locX++;
} }
_lastKey = null; _lastKey = null;
@ -1553,6 +1562,11 @@ var QB = new function() {
if (!preventNewline) { if (!preventNewline) {
_locY++; _locY++;
_locX = 0; _locX = 0;
_lastTextX = 0;
}
else {
var tm = ctx.measureText(str);
_lastTextX += tm.width;
} }
if (values.length < 2) { if (values.length < 2) {
@ -2168,7 +2182,6 @@ var QB = new function() {
locX += chars; locX += chars;
} }
else { else {
//alert(args[ai]);
locX = args[ai].length; locX = args[ai].length;
GX.vfs().writeText(file, args[ai]); GX.vfs().writeText(file, args[ai]);
} }
@ -2192,67 +2205,60 @@ var QB = new function() {
var ctx = _images[_activeImage].ctx; var ctx = _images[_activeImage].ctx;
var preventNewline = (args[args.length-1] == QB.PREVENT_NEWLINE || args[args.length-1] == QB.COLUMN_ADVANCE); var preventNewline = (args[args.length-1] == QB.PREVENT_NEWLINE || args[args.length-1] == QB.COLUMN_ADVANCE);
var x = _locX * QB.func__FontWidth(); var x = _lastTextX;
for (var ai = 0; ai < args.length; ai++) { for (var ai = 0; ai < args.length; ai++) {
if (args[ai] == QB.PREVENT_NEWLINE) { if (args[ai] == QB.PREVENT_NEWLINE) {
// ignore as we will just concatenate the next arg // ignore as we will just concatenate the next arg
} }
else if (args[ai] == QB.COLUMN_ADVANCE) { else if (args[ai] == QB.COLUMN_ADVANCE) {
// advance to the next column offset // advance to the next column offset
_locX += 14 - _locX % 13; _locX += 14 - _locX % 14;
x = _locX * QB.func__FontWidth(8);
} }
else { else {
var str = args[ai]; var str = args[ai];
var lines = String(str).split("\n"); var lines = String(str).split("\n");
for (var i=0; i < lines.length; i++) { for (var i=0; i < lines.length; i++) {
if (_locX > _textColumns()-1 || _locX + lines[i].length > _textColumns()) {
_locX = 0;
if (_locY < _textRows()-1) {
_locY = _locY + 1;
}
else {
await _printScroll();
}
}
x = _locX * QB.func__FontWidth();
var y = -1;
// scroll the screen
if (_locY < _textRows()-1) {
y = _locY * QB.func__FontHeight();
}
else {
y = (_locY) * QB.func__FontHeight();
}
// Draw the text background
ctx.beginPath(); ctx.beginPath();
var f = _fonts[_font]; var f = _fonts[_font];
ctx.font = f.size + " " + f.name; //"16px dosvga"; ctx.font = f.size + " " + f.name;
var tm = ctx.measureText(lines[i]);
if (_printMode != QB._KEEPBACKGROUND) {
ctx.fillStyle = _bgColor.rgba();
//ctx.fillRect(x, y, QB.func__FontWidth() * lines[i].length, QB.func__FontHeight());
ctx.fillRect(x, y, tm.width, QB.func__FontHeight());
}
if (_printMode != QB._ONLYBACKGROUND) {
//var f = _fonts[_font];
//ctx.font = f.size + " " + f.name; //"16px dosvga";
ctx.fillStyle = _fgColor.rgba();
//if (_font < 1000) {
// ctx.fillText(lines[i], x, (y+QB.func__FontHeight()-6));
//}
//else {
ctx.fillText(lines[i], x, (y + QB.func__FontHeight() - f.offset));
//}
}
x += tm.width; var sublines = _fitLines(x, lines[i], ctx);
_locX += lines[i].length;
for (var j=0; j < sublines.length; j++) {
var subline = sublines[j];
if (j > 0) {
if (_locY < _textRows()-2) {
_locY++;
_locX = 0;
x = 0;
}
else {
_locY--;
await _printScroll();
}
}
var y = _locY * QB.func__FontHeight();
// Draw the text background
var tm = ctx.measureText(subline);
if (_printMode != QB._KEEPBACKGROUND) {
ctx.fillStyle = _bgColor.rgba();
ctx.fillRect(x, y, tm.width, QB.func__FontHeight());
}
if (_printMode != QB._ONLYBACKGROUND) {
ctx.fillStyle = _fgColor.rgba();
ctx.fillText(subline, x, (y + QB.func__FontHeight() - f.offset));
}
x += tm.width;
_locX += subline.length;
}
if (i < lines.length-1) { if (i < lines.length-1) {
if (_locY < _textRows()-1) { if (_locY < _textRows()-1) {
_locY = _locY + 1; _locY++;
_locX = 0; _locX = 0;
x = 0; x = 0;
} }
@ -2264,8 +2270,11 @@ var QB = new function() {
} }
} }
_lastTextX = x;
if (!preventNewline) { if (!preventNewline) {
_locX = 0; _locX = 0;
_lastTextX = 0;
if (_locY < _textRows()-1) { if (_locY < _textRows()-1) {
_locY = _locY + 1; _locY = _locY + 1;
} }
@ -2275,26 +2284,38 @@ var QB = new function() {
} }
}; };
async function _printScroll() { function _fitLines(startX, line, ctx) {
/* // TODO: could be optimized for fixed width fonts which would not require measureText
var img = new Image(); var lines = [];
img.src = GX.canvas().toDataURL("image/png"); var tm = ctx.measureText(line);
while (!img.complete) { if (tm.width < QB.func__Width() - startX) {
await GX.sleep(10); lines.push(line);
return lines;
} }
var ctx = _images[_activeImage].ctx; var start = 0; end = 1;
ctx.beginPath(); for (var i=0; i < line.length; i++) {
ctx.fillStyle = _bgColor.rgba(); var s = line.substring(start, end);
ctx.fillRect(0, 0, _width(), _height()); tm = ctx.measureText(s);
ctx.drawImage(img, 0, -QB.func__FontHeight()); if (tm.width > QB.func__Width() - startX) {
*/ lines.push(line.substring(start, end-1));
start = end - 1;
startX = 0;
}
else {
end++;
}
}
lines.push(line.substring(start));
return lines;
}
async function _printScroll() {
var ctx = _images[_activeImage].ctx; var ctx = _images[_activeImage].ctx;
ctx.globalCompositeOperation = "copy"; ctx.globalCompositeOperation = "copy";
ctx.imageSmoothingEnabled = false; ctx.imageSmoothingEnabled = false;
ctx.drawImage(ctx.canvas, 0, -QB.func__FontHeight(), ctx.canvas.width, ctx.canvas.height); ctx.drawImage(ctx.canvas, 0, -QB.func__FontHeight(), ctx.canvas.width, ctx.canvas.height);
ctx.globalCompositeOperation = "source-over"; ctx.globalCompositeOperation = "source-over";
//await GX.sleep(1);
} }
this.sub_PSet = function(sstep, x, y, color) { this.sub_PSet = function(sstep, x, y, color) {
@ -2720,6 +2741,7 @@ var QB = new function() {
_fgColor = _color(15); _fgColor = _color(15);
} }
_bgColor = _color(0); _bgColor = _color(0);
_lastTextX = 0;
_locX = 0; _locX = 0;
_locY = 0; _locY = 0;