Skip to content

Commit 5c512b2

Browse files
chriswschrisws
committed
EMCC: Emscripten version wip
1 parent 6b48346 commit 5c512b2

4 files changed

Lines changed: 64 additions & 53 deletions

File tree

‎src/platform/emcc/canvas.cpp‎

Lines changed: 47 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -60,38 +60,41 @@ const uint32_t colors_i[] = {
6060
};
6161

6262
EM_JS(int, get_screen_height, (), {
63-
return document.getElementById("canvas").height;
63+
return window.innerHeight;
6464
});
6565

6666
EM_JS(int, get_screen_width, (), {
67-
return document.getElementById("canvas").width;
67+
return window.innerWidth;
6868
});
6969

70-
EM_JS(int, get_text_size, (int id, const char *str, int len), {
71-
var c = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
70+
EM_JS(int, get_text_size, (int id, const char *str, const char *face), {
71+
var canvas = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
7272
var ctx = canvas.getContext("2d");
73-
var s = new String(str).substring(0, len);
73+
ctx.font = UTF8ToString(face);
74+
75+
var s = UTF8ToString(str);
7476
var metrics = ctx.measureText(s);
75-
var result = (metrics.width << 16) + (metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent);
77+
var height = metrics.fontBoundingBoxAscent + metrics.fontBoundingBoxDescent;
78+
var result = (metrics.width << 16) + height;
7679
return result;
7780
});
7881

7982
EM_JS(void, draw_arc, (int id, int xc, int yc, double r, double start, double end, double aspect), {
80-
var c = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
83+
var canvas = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
8184
var ctx = canvas.getContext("2d");
8285
ctx.beginPath();
8386
ctx.arc(100, 75, 50, 0, 2 * Math.PI);
8487
ctx.stroke();
8588
});
8689

8790
EM_JS(void, draw_ellipse, (int id, int xc, int yc, int rx, int ry, int fill), {
88-
var c = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
91+
var canvas = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
8992
var ctx = canvas.getContext("2d");
9093

9194
});
9295

9396
EM_JS(void, draw_line, (int id, int x1, int y1, int x2, int y2, const char *color), {
94-
var c = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
97+
var canvas = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
9598
var ctx = canvas.getContext("2d");
9699
ctx.beginPath();
97100
ctx.moveTo(x1, y1);
@@ -102,7 +105,7 @@ EM_JS(void, draw_line, (int id, int x1, int y1, int x2, int y2, const char *colo
102105
});
103106

104107
EM_JS(void, draw_pixel, (int id, int x, int y, int r, int g, int b), {
105-
var c = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
108+
var canvas = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
106109
var ctx = canvas.getContext("2d");
107110
var pxId = ctx.createImageData(1, 1);
108111
var pxData = pxId.data;
@@ -114,28 +117,28 @@ EM_JS(void, draw_pixel, (int id, int x, int y, int r, int g, int b), {
114117
});
115118

116119
EM_JS(void, draw_rect_filled, (int id, int x, int y, int w, int h, const char *color), {
117-
var c = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
120+
var canvas = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
118121
var ctx = canvas.getContext("2d");
119122
ctx.fillStyle = UTF8ToString(color);
120123
ctx.fillRect(x, y, w, h);
121124
});
122125

123-
EM_JS(void, draw_region, (int id, int x, int y, int w, int h), {
124-
var c = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
125-
var ctx = canvas.getContext("2d");
126-
126+
EM_JS(void, draw_region, (int id, int srcId, int x, int y, int w, int h, int dx, int dy), {
127+
var canvas = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
128+
var destination = canvas.getContext("2d");
129+
var source = document.getElementById(srcId == -1 ? "canvas" : "canvas_" + srcId);
130+
destination.drawImage(source, x, y, w, h, dx, dy, w, h);
127131
});
128132

129133
EM_JS(void, draw_text, (int id, int x, int y, const char *str, int len, const char *color, const char *face), {
130-
var c = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
134+
var canvas = document.getElementById(id == -1 ? "canvas" : "canvas_" + id);
131135
var ctx = canvas.getContext("2d");
132-
var s = UTF8ToString(str).substring(0, len);
133-
var width = ctx.measureText(s).width;
134-
var fontHeight = 15;
135-
var y1 = y * fontHeight;
136136
ctx.font = UTF8ToString(face);
137+
138+
var s = UTF8ToString(str).substring(0, len);
139+
var metrics = ctx.measureText(s);
137140
ctx.fillStyle = UTF8ToString(color);
138-
ctx.fillText(s, x, y1);
141+
ctx.fillText(s, x, y + metrics.fontBoundingBoxAscent + metrics.fontBoundingBoxDescent);
139142
});
140143

141144
strlib::String get_color() {
@@ -156,6 +159,18 @@ strlib::String get_color() {
156159
return result;
157160
}
158161

162+
strlib::String get_face() {
163+
strlib::String result;
164+
if (font->_italic) {
165+
result.append("italic ");
166+
}
167+
if (font->_bold) {
168+
result.append("bold ");
169+
}
170+
result.append(font->_size).append("px monospace");
171+
return result;
172+
}
173+
159174
Canvas::Canvas() :
160175
_clip(nullptr),
161176
_id(-1),
@@ -186,12 +201,14 @@ bool Canvas::create(int width, int height) {
186201
EM_ASM_({
187202
var canvas = document.createElement("canvas");
188203
canvas.id = "canvas_" + $0;
204+
canvas.width = $1;
205+
canvas.height = $2;
189206
canvas.style.zIndex = 1;
190207
canvas.style.display = "none";
191208
canvas.style.position = "absolute";
192209
canvas.className = "emscripten";
193210
document.body.appendChild(canvas);
194-
}, _id);
211+
}, _id, _w, _h);
195212
return true;
196213
};
197214

@@ -229,8 +246,8 @@ void maSetClipRect(int left, int top, int width, int height) {
229246

230247
MAExtent maGetTextSize(const char *str) {
231248
MAExtent result;
232-
if (str && str[0] && drawTarget) {
233-
result = (MAExtent)get_text_size(drawTarget->_id, str, strlen(str));
249+
if (str && str[0]) {
250+
result = (MAExtent)get_text_size(drawTarget ? drawTarget->_id : -1, str, get_face());
234251
} else {
235252
result = 0;
236253
}
@@ -245,6 +262,7 @@ MAExtent maGetScrSize(void) {
245262
}
246263

247264
void maDestroyPlaceholder(MAHandle maHandle) {
265+
logEntered();
248266
Canvas *holder = (Canvas *)maHandle;
249267
delete holder;
250268
}
@@ -268,11 +286,6 @@ int maCreateDrawableImage(MAHandle maHandle, int width, int height) {
268286
return drawable->create(width, height) ? RES_OK : -1;
269287
}
270288

271-
void maUpdateScreen(void) {
272-
logEntered();
273-
trace("%d \n", screen->_id);
274-
}
275-
276289
//
277290
// drawing
278291
//
@@ -318,23 +331,15 @@ void maFillRect(int left, int top, int width, int height) {
318331

319332
void maDrawText(int left, int top, const char *str, int length) {
320333
if (str && str[0] && drawTarget) {
321-
strlib::String face;
322-
if (font->_italic) {
323-
face.append("italic ");
324-
}
325-
if (font->_bold) {
326-
face.append("bold ");
327-
}
328-
face.append(font->_size).append("pt monospace");
329-
draw_text(drawTarget->_id, left, top, str, length, get_color(), face);
334+
draw_text(drawTarget->_id, left, top, str, length, get_color(), get_face());
330335
}
331336
}
332337

333338
void maDrawImageRegion(MAHandle maHandle, const MARect *srcRect, const MAPoint2d *dstPoint, int transformMode) {
334339
logEntered();
335340
Canvas *src = (Canvas *)maHandle;
336341
if (drawTarget && drawTarget != src) {
337-
//draw_region(drawTarget->_id, src, srcRect, dstPoint->x, dstPoint->y);
342+
draw_region(drawTarget->_id, src->_id, srcRect->left, srcRect->top, srcRect->width, srcRect->height, dstPoint->x, dstPoint->y);
338343
}
339344
}
340345

@@ -383,3 +388,6 @@ void maShowVirtualKeyboard(void) {
383388

384389
void maHideVirtualKeyboard(void) {
385390
}
391+
392+
void maUpdateScreen(void) {
393+
}

‎src/platform/emcc/main.cpp‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,8 @@ void init() {
5151
opt_autolocal = 0;
5252
os_graf_mx = 1024;
5353
os_graf_my = 768;
54+
os_graphics = 1;
55+
os_color_depth = 16;
5456
}
5557

5658
int main(int argc, char* argv[]) {

‎src/platform/emcc/runtime.cpp‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,11 +82,16 @@ Runtime::Runtime() :
8282
_output->setFontSize(11);
8383
_eventQueue = new Stack<MAEvent *>();
8484
_state = kActiveState;
85-
g_themeId = 3;
85+
g_themeId = 0;
8686
}
8787

8888
Runtime::~Runtime() {
8989
logEntered();
90+
delete _output;
91+
delete _eventQueue;
92+
runtime = NULL;
93+
_output = NULL;
94+
_eventQueue = NULL;
9095
}
9196

9297
void Runtime::alert(const char *title, const char *message) {

‎src/platform/emcc/shell.html‎

Lines changed: 9 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -6,17 +6,16 @@
66
<title>SmallBASIC</title>
77
<style>
88
body {
9-
margin: 1px;
9+
margin: 0px;
10+
width: 100%;
11+
height: 100%;
1012
}
1113
.emscripten {
1214
padding-right: 0;
1315
margin-left: auto;
1416
margin-right: auto;
1517
display: block;
1618
}
17-
textarea.emscripten {
18-
font-family: monospace; width: 80%;
19-
}
2019
div.emscripten {
2120
text-align: center;
2221
}
@@ -73,11 +72,6 @@
7372
if (element) element.value = ''; // clear browser cache
7473
return function(text) {
7574
if (arguments.length > 1) text = Array.prototype.slice.call(arguments).join(' ');
76-
// These replacements are necessary if you render to raw HTML
77-
//text = text.replace(/&/g, "&amp;");
78-
//text = text.replace(/</g, "&lt;");
79-
//text = text.replace(/>/g, "&gt;");
80-
//text = text.replace('\n', '<br>', 'g');
8175
console.log(text);
8276
if (element) {
8377
element.value += text + "\n";
@@ -87,10 +81,12 @@
8781
})(),
8882
canvas: (function() {
8983
var canvas = document.getElementById('canvas');
90-
91-
// As a default initial behavior, pop up an alert when webgl context is lost. To make your
92-
// application robust, you may want to override this behavior before shipping!
93-
// See http://www.khronos.org/registry/webgl/specs/latest/1.0/#5.15.2
84+
function resizeCanvas() {
85+
canvas.width = window.innerWidth;
86+
canvas.height = window.innerHeight;
87+
};
88+
window.addEventListener('resize', resizeCanvas, false);
89+
resizeCanvas();
9490
canvas.addEventListener("webglcontextlost", function(e) { alert('WebGL context lost. You will need to reload the page.'); e.preventDefault(); }, false);
9591
return canvas;
9692
})(),

0 commit comments

Comments
 (0)