diff options
| -rw-r--r-- | css/codeq.css | 10 | ||||
| -rw-r--r-- | css/codeq/hint.css | 22 | ||||
| -rw-r--r-- | index.html | 3 | ||||
| -rw-r--r-- | js/codeq/prolog.js | 11 | ||||
| -rw-r--r-- | js/codeq/python.js | 16 | ||||
| -rw-r--r-- | js/codeq/robot.js | 78 |
6 files changed, 60 insertions, 80 deletions
diff --git a/css/codeq.css b/css/codeq.css index c3f3634..e66ecd4 100644 --- a/css/codeq.css +++ b/css/codeq.css @@ -149,6 +149,10 @@ body { transition: all 1s ease; } +.block > .scrollable-content-container { + padding-left: 0.5em; + padding-right: 0.5em; +} /***** responsiveness *****/ /* lg */ @@ -172,8 +176,6 @@ body { #screen_python .block.block3 { min-height: 100%; height: 100%; } - - } /* md */ @@ -202,7 +204,6 @@ body { #screen_python .block.block3 { min-height: 50%; height: 50%; } - } /* md & ld */ @@ -254,7 +255,6 @@ body { .CodeMirror-scroll { height: 100%; } - } /* sm */ @@ -267,12 +267,10 @@ body { /* xs & sm */ @media (max-width: 991px) { - /* info */ .block.block4 { border-bottom: 1px solid #ddd; } - } /* codeq hints */ diff --git a/css/codeq/hint.css b/css/codeq/hint.css index 676d1aa..6e5fd25 100644 --- a/css/codeq/hint.css +++ b/css/codeq/hint.css @@ -2,14 +2,6 @@ a.hint-static-link { cursor: pointer; } -div.hint-static-group, -div:not(.hint-static-group) > div.hint-static { - border: 1px solid gray; - border-radius: 4px; - margin-bottom: 0.5em; - padding: 0.5em; -} - .hint-static img { max-width: 80%; /* center img trick */ @@ -18,6 +10,14 @@ div:not(.hint-static-group) > div.hint-static { margin-right: auto; } -.hints > :first-child { - font-weight: bold; -}
\ No newline at end of file +.hints > div { + border: 1px solid gray; + border-radius: 4px; + margin-bottom: 0.5em; + margin-top: 0.5em; + padding: 0.5em; +} + +.hints > div:first-child { + border: 2px solid black; +} @@ -135,17 +135,14 @@ <div class="col-lg-4" id="choose-prolog"> <img class="img-circle" src=res/prolog.png alt="Generic placeholder image" width="140" height="140"> <h2>Prolog</h2> - <p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p> </div><!-- /.col-lg-4 --> <div class="col-lg-4" id="choose-python"> <img class="img-circle" src=res/python.png alt="Generic placeholder image" width="140" height="140"> <h2>Python</h2> - <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.</p> </div><!-- /.col-lg-4 --> <div class="col-lg-4" id="choose-robot"> <img class="img-circle" src=res/eve.png alt="Generic placeholder image" width="140" height="140"> <h2>Robot</h2> - <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.</p> </div><!-- /.col-lg-4 --> </div><!-- /.row --> </div> diff --git a/js/codeq/prolog.js b/js/codeq/prolog.js index ef7a089..2aeede4 100644 --- a/js/codeq/prolog.js +++ b/js/codeq/prolog.js @@ -202,15 +202,8 @@ codeq.tr.registerDictionary('prolog', codeq.tr.emptyDictionary); // to make the translator happy, when this screen is not active }); - /** - * Creates a new handler for the given Prolog assignment definition. - * - * @param {PrologTaskDef} info - * @returns {{destroy: Function, processServerHints: Function}} - */ createPrologHandler = function (problemDef, commonDef, currentSolution) { - var //problem = info.problem, - jqDescriptionContent = jqDescription.find('.description'), + var jqDescriptionContent = jqDescription.find('.description'), jqEditor = jqCode.find('.code_editor'), jqTerminal = jqConsole.find('.console'), jqHints = jqInfo.find('.hints'), @@ -228,8 +221,6 @@ codeq.tr.registerDictionary('prolog', problemDef.translations); codeq.tr.translateDom(jqScreen); -// $('#screen_prolog .title').text(problem.slug); -// jqDescriptionContent.html(problem.description); jqBtnPlan.prop('disabled', !hinter.hasNextPlan()); editor.on('change', function (instance, changeObj) { diff --git a/js/codeq/python.js b/js/codeq/python.js index e67ec09..4d6ace3 100644 --- a/js/codeq/python.js +++ b/js/codeq/python.js @@ -160,15 +160,8 @@ codeq.tr.registerDictionary('python', codeq.tr.emptyDictionary); // to make the translator happy, when this screen is not active }); - /** - * Creates a new handler for the given Prolog assignment definition. - * - * @param {PrologTaskDef} info - * @returns {{destroy: Function, processServerHints: Function}} - */ var createPythonHandler = function (problemDef, commonDef, currentSolution) { - var //problem = info.problem, - jqDescriptionContent = jqDescription.find('.description'), + var jqDescriptionContent = jqDescription.find('.description'), jqEditor = jqCode.find('.code_editor'), jqTerminal = jqConsole.find('.console'), jqHints = jqInfo.find('.hints'), @@ -186,8 +179,6 @@ codeq.tr.registerDictionary('python', problemDef.translations); codeq.tr.translateDom(jqScreen); -// $('#screen_python .title').text(problem.slug); -// jqDescriptionContent.html(problem.description); jqBtnPlan.prop('disabled', !hinter.hasNextPlan()); editor.on('change', function (instance, changeObj) { @@ -266,11 +257,6 @@ .done(); }); - // TODO first line of interpreter output is buffered without this, why? -// codeq.comms.sendPythonPush({ -// 'text': '' -// }); - codeq.comms.loadProblem(problemDef.id).done(); return { diff --git a/js/codeq/robot.js b/js/codeq/robot.js index 51965d4..0a62a2a 100644 --- a/js/codeq/robot.js +++ b/js/codeq/robot.js @@ -135,10 +135,8 @@ }); var createRobotHandler = function (problemDef, commonDef, currentSolution) { - var //problem = info.problem, - jqDescriptionContent = jqDescription.find('.description'), + var jqDescriptionContent = jqDescription.find('.description'), jqEditor = jqCode.find('.code_editor'), - jqTerminal = jqConsole.find('.console'), jqHints = jqInfo.find('.hints'), editor = codeq.makeEditor(jqEditor[0], { mode: 'python', @@ -146,11 +144,36 @@ value: currentSolution || '' }), activityHandler = codeq.makeActivityHandler(editor, problemDef.id), - terminal = makeRobotTerminalHandler(jqTerminal, editor, problemDef.id, activityHandler), hinter = codeq.makeHinter(jqHints, jqEditor, editor, 'robot_hints', problemDef, commonDef), commError = function (error) { alert(error); - }; + }, + reconnectTimer = null, + address = '192.168.1.174:8000', // TODO get this from settings + url = 'ws://' + address + '/', + socket = eio(url); + + // set up the websocket events + socket.on('close', function (data) { + console.log('websocket closed, trying to reopen in 1 s'); + reconnectTimer = setTimeout(function () { + reconnectTimer = null; + socket.open(); + }, 1000); + }); + socket.on('message', function(data) { + //console.log('Received: ' + data); + var json_obj = JSON.parse(data), + sensors, sensor, text = ''; + if (json_obj.event == 'update') { + sensors = json_obj.sensors; + for (sensor in sensors) { + if (!sensors.hasOwnProperty(sensor)) continue; + text += sensor + ': ' + sensors[sensor] + '<br />\n' + } + $('div.console').html('<p style="color: lightgreen; font-family: monospace;">'+text+'</p>'); + } + }); codeq.tr.registerDictionary('robot', problemDef.translations); codeq.tr.translateDom(jqScreen); @@ -189,7 +212,7 @@ hinter.handle(data.hints); } else { - terminal.append('error: ' + data.message); + commError('error: ' + data.message); } }) .fail(commError) @@ -199,35 +222,12 @@ var url = 'http://' + $('#robot_ip').val() + ':8000/run', doc = editor.getDoc(); - $.ajax(url, { - method: 'POST', - data: JSON.stringify({program: doc.getValue()}) - }).done(function (data) { - if (data.code === 0) { - terminal.append('<run>\n', 'output'); - } - else { - terminal.append('error: ' + data.message + '\n'); - } - }).fail(function (jqXHR, textStatus, err) { - commError('Could not access '+url); - }); + socket.send(JSON.stringify({action: 'run', program: doc.getValue()})); }); jqBtnStop.on('click', function () { var url = 'http://' + $('#robot_ip').val() + ':8000/stop'; - $.ajax(url, { - method: 'POST' - }).done(function (data) { - if (data.code === 0) { - terminal.append('<stop>\n', 'output'); - } - else { - terminal.append('error: ' + data.message + '\n'); - } - }).fail(function (jqXHR, textStatus, err) { - commError('Could not access '+url); - }); + socket.send(JSON.stringify({action: 'stop'})); }); codeq.comms.loadProblem(problemDef.id).done(); @@ -235,19 +235,27 @@ return { destroy: function () { codeq.comms.endProblem().done(); + + if (socket) { + socket.off('close'); + socket.off('message'); + socket.close(); + socket = null; + } + if (reconnectTimer !== null) { + clearTimeout(reconnectTimer); + reconnectTimer = null; + } + $('#screen_robot .title').text('');//empty the title text jqAllButtons.off(); editor.off('change'); - codeq.comms.off('terminal_output'); // stop listening for the terminal events from server activityHandler.flush(); hinter.destroy(); - terminal.destroy(); jqDescriptionContent.empty(); jqEditor.empty(); // TODO: perhaps you do not want to "free" the editor, just empty it - jqTerminal.empty(); // TODO: the same with the console jqDescriptionContent = null; jqEditor = null; - jqTerminal = null; jqHints = null; codeq.tr.registerDictionary('robot', codeq.tr.emptyDictionary); } |