diff --git a/app/assets/javascripts/editor.js.erb b/app/assets/javascripts/editor.js.erb index b5eefbf5..2da4a37b 100644 --- a/app/assets/javascripts/editor.js.erb +++ b/app/assets/javascripts/editor.js.erb @@ -30,7 +30,7 @@ $(function() { numMessages = 0, turtlecanvas = $('#turtlecanvas'), prompt = $('#prompt'), - commands = ['input', 'write', 'turtle', 'turtlebatch', 'exit', 'timeout', 'status'], + commands = ['input', 'write', 'turtle', 'turtlebatch', 'render', 'exit', 'timeout', 'status'], streams = ['stdin', 'stdout', 'stderr']; var ENTER_KEY_CODE = 13; @@ -245,6 +245,18 @@ $(function() { } }; + var findOrCreateRenderElement = function(index) { + if ($('#render-' + index).isPresent()) { + return $('#render-' + index); + } else { + var element = $('
').attr('id', 'render-' + index); + $('#render').append(element); + return element; + } + }; + + + var getPanelClass = function(result) { if (result.stderr && !result.score) { return 'panel-danger'; @@ -1172,6 +1184,9 @@ $(function() { showCanvas(); handleTurtlebatchCommand(msg); break; + case 'render': + renderWebsocketOutput(msg); + break; case 'exit': killWebsocketAndContainer(); break; @@ -1185,6 +1200,11 @@ $(function() { } }; + var renderWebsocketOutput = function(msg){ + var element = findOrCreateRenderElement(0); + element.append(msg.data); + }; + var printWebsocketOutput = function(msg) { if (!msg.data) { return;