1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
|
// proxy to/from worker
Module.ctx = Module.canvas.getContext('2d');
// render
var renderFrameData = null;
function renderFrame() {
var dst = Module.canvasData.data;
if (dst.set) {
dst.set(renderFrameData);
} else {
for (var i = 0; i < renderFrameData.length; i++) {
dst[i] = renderFrameData[i];
}
}
Module.ctx.putImageData(Module.canvasData, 0, 0);
renderFrameData = null;
}
window.requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame ||
window.webkitRequestAnimationFrame || window.msRequestAnimationFrame ||
renderFrame;
// end render
var worker = new Worker('{{{ filename }}}.js');
var workerResponded = false;
worker.onmessage = function worker_onmessage(event) {
if (!workerResponded) {
workerResponded = true;
if (Module.setStatus) Module.setStatus('');
}
var data = event.data;
switch (data.target) {
case 'stdout': {
Module.print(data.content);
break;
}
case 'stderr': {
Module.printErr(data.content);
break;
}
case 'window': {
window[data.method]();
break;
}
case 'canvas': {
switch (data.op) {
case 'resize': {
Module.canvas.width = data.width;
Module.canvas.height = data.height;
Module.canvasData = Module.ctx.getImageData(0, 0, data.width, data.height);
worker.postMessage({ target: 'canvas', boundingClientRect: cloneObject(Module.canvas.getBoundingClientRect()) });
break;
}
case 'render': {
if (renderFrameData) {
// previous image was not rendered yet, just update image
renderFrameData = data.image.data;
} else {
// previous image was rendered so update image and request another frame
renderFrameData = data.image.data;
window.requestAnimationFrame(renderFrame);
}
break;
}
default: throw 'eh?';
}
break;
}
default: throw 'what?';
}
};
function cloneObject(event) {
var ret = {};
for (var x in event) {
if (x == x.toUpperCase()) continue;
var prop = event[x];
if (typeof prop === 'number' || typeof prop === 'string') ret[x] = prop;
}
return ret;
};
['keydown', 'keyup', 'keypress', 'blur', 'visibilitychange'].forEach(function(event) {
document.addEventListener(event, function(event) {
worker.postMessage({ target: 'document', event: cloneObject(event) });
event.preventDefault();
});
});
['unload'].forEach(function(event) {
window.addEventListener(event, function(event) {
worker.postMessage({ target: 'window', event: cloneObject(event) });
});
});
['mousedown', 'mouseup', 'mousemove', 'DOMMouseScroll', 'mousewheel', 'mouseout'].forEach(function(event) {
Module.canvas.addEventListener(event, function(event) {
worker.postMessage({ target: 'canvas', event: cloneObject(event) });
event.preventDefault();
}, true);
});
|
