| <html> |
| <head> |
| <title> |
| Emscripten: Raytracing |
| </title> |
| <script src="raytrace.js"></script> |
| <script type="text/javascript"> |
| // print function which the runtime will call |
| function print(text) { |
| document.getElementById('output').innerHTML = text; |
| } |
| |
| var drawingNow = false; |
| var calcedDepth = -1; |
| // Do everything - initialize SDL, set up canvas, render |
| function render(size, depth) { |
| var startTime = Date.now(); |
| |
| if (drawingNow) return; |
| drawingNow = true; |
| if (calcedDepth != depth) { |
| print('<b>Generating scene data, please wait...</b>'); |
| } |
| setTimeout(function() { |
| if (calcedDepth != depth) { |
| run([depth.toString()]); |
| calcedDepth = depth; |
| } |
| _SDL_Init(size); |
| var canvas = document.getElementById('canvas'); |
| canvas.width = canvas.height = size; |
| IHEAP[_screen] = _SDL_SetVideoMode(canvas.width, canvas.height, 32, 0, canvas); |
| var y = canvas.height-1; |
| function drawLine() { |
| print("Raytracing line: <b>" + (canvas.height-y) + "/" + canvas.height + '</b>'); |
| __ZL10trace_lineiii(canvas.width, canvas.width, y); |
| y--; |
| if (y >= 0) { |
| setTimeout(arguments.callee, 1); |
| } else { |
| print('Finished in ' + (Date.now() - startTime)/1000 + ' seconds.'); |
| drawingNow = false; |
| } |
| } |
| drawLine(); |
| }); |
| } |
| </script> |
| </head> |
| <body> |
| <canvas id='canvas' width=1 height=1></canvas> |
| <hr> |
| <form onsubmit="setTimeout(function() { render(parseInt(size.value), parseInt(depth.value)) }); return false"> |
| Rendered width/height (pixels): <input type="text" name="size" value="128">(use less for slower machines)<br> |
| Scene recursion (child spheres/sphere): <input type="text" name="depth" value="5">(use less for slower machines; careful with values > 6!)<br> |
| <input type="submit" value="Go!"> |
| </form> |
| <div id="output" style="font-family: Courier New,Courier,monospace;"></div> |
| <hr> |
| Simple raytracing demo. The <a href="http://ompf.org/ray/sphereflake/">original C++ source</a> was |
| automatically converted to JavaScript using <a href="http://emscripten.org">Emscripten</a>. |
| </body> |
| </html> |
| |
