refactor menu + some forms to use bootstrap properly

2 files changed, 685 insertions, 685 deletions

diff --git a/js/codeq/prolog.js b/js/codeq/prolog.js
index 66ab970..f2f060f 100644
--- a/js/codeq/prolog.js
+++ b/js/codeq/prolog.js
@@ -1,356 +1,356 @@
-/**
- * Created by robert on 9/17/15.
- *
- * The prolog state of the state machine. When it is entered it'll prepare the console and code editor and load a sub-state machine which represents the 4 different parts fo the screen.
- */
-
-(function() {
-    var subScreens, //this will be the actual (sub)state machine
-        stateNameTag = 'stateName', //a tag for data which is added to some html elements
-        jqScreen = $('#screen_prolog'), // the screen container element
-        //quadrants
-        jqDescription = jqScreen.find('.block1'),
-        jqCode = jqScreen.find('.block2'),
-        jqConsole = jqScreen.find('.block3'),
-        jqInfo = jqScreen.find('.block4'),
-        jqAllQuadrants = jqDescription.add(jqCode).add(jqConsole).add(jqInfo), // all the quadrants
-        // buttons
-        jqBtnPlan = jqScreen.find('.btn-plan'),
-        jqBtnHint = jqScreen.find('.btn-hint'),
-        jqBtnTest = jqScreen.find('.btn-test'),
-        jqAllButtons = jqBtnPlan.add(jqBtnHint).add(jqBtnTest), // all the buttons
-        // misc
-        currentSubState = null,
-        transitionEventName = 'mousedown',//event name of the event which will trigger the transition between these substates - the most common transition at least (there are some corner cases on the hint and test buttons -> see the code below)
-        substates = {
-            'description': {
-                'enter': function () {
-                    currentSubState = 'block1';
-                    jqScreen.addClass(currentSubState);
-                },
-                'exit': function () {
-                    jqScreen.removeClass(currentSubState);
-                    currentSubState = null;
-                }
-            },
-            'code': {
-                'enter': function () {
-                    currentSubState = 'block2';
-                    jqScreen.addClass(currentSubState);
-                },
-                'exit': function () {
-                    jqScreen.removeClass(currentSubState);
-                    currentSubState = null;
-                }
-            },
-            'info': {
-                'enter': function () {
-                    currentSubState = 'block4';
-                    jqScreen.addClass(currentSubState);
-                },
-                'exit': function () {
-                    jqScreen.removeClass(currentSubState);
-                    currentSubState = null;
-                }
-            },
-            'console': {
-                'enter': function () {
-                    currentSubState = 'block3';
-                    jqScreen.addClass(currentSubState);
-                },
-                'exit': function () {
-                    jqScreen.removeClass(currentSubState);
-                    currentSubState = null;
-                }
-            }
-        };
-    var prologHandler; //created when we enter the prolog state and destroyed once we leave it
-    codeq.globalStateMachine.register('prolog', {
-        'enter': function (data) {
-            $('#navigation-login').css('display', '');
-            $('#navigation-language').css('display', '');
-            $('#navigation-problem').css('display', '');
-            $("#navigation-prolog").addClass("active");
-            $('#navigation-prolog').css('display', '');
-
-            jqScreen.css('display', '');//we have to show the screen now so the code editor shows its initial values correctly
-            prologHandler = createPrologHandler(data.data);
-            subScreens = codeq.makeStateMachine(substates);
-            subScreens.transition(jqDescription.data(stateNameTag));
-/*            Q.delay(100).then(function(){
-                jqAllQuadrants.addClass('transition');//for smooth animations - need to be delayed, because otherwise we get some weird "animations" while the page is loading
-            }).done();*/
-            jqAllButtons.on(transitionEventName, function (event) {
-                subScreens.transition('info'); // set focus on the hints quadrant
-                event.stopPropagation(); // don't allow the event to go on and trigger further transition
-            });
-            jqAllQuadrants.on(transitionEventName, function () {
-                subScreens.transition($(this).data(stateNameTag));
-            });
-        },
-        'exit': function () {
-            jqAllButtons.off(); // unregister all event handlers
-            jqAllQuadrants.off();
-            jqScreen.css('display', 'none');
-//            jqAllQuadrants.removeClass('transition');
-            prologHandler.destroy();
-            prologHandler = null;
-            subScreens.destroy();
-            subScreens = null;
-            jqScreen.addClass('block1');
-
-            $('#navigation-login').css('display', 'none');
-            $('#navigation-language').css('display', 'none');
-            $('#navigation-problem').css('display', 'none');
-            $("#navigation-prolog").removeClass("active");
-            $('#navigation-prolog').css('display', 'none');
-        }
-    });
-
-    jqDescription.data(stateNameTag, 'description');
-    jqCode.data(stateNameTag, 'code');
-    jqConsole.data(stateNameTag, 'console');
-    jqInfo.data(stateNameTag, 'info');
-
-    // a constant
-    var firstCharacterPos = {'line': 0, 'ch': 0};
-
-    var makePrologTerminalHandler = function (jqConsole, editor, problem_id, activityHandler) {
-        var promptMode = true, // default: query composition; alternative: query result browsing
-            manualStop = false,// if the user stopped showing next answers (false) or if there are no more answers (true)
-            terminal = codeq.makeConsole(jqConsole, {
-                'greeting': 'CodeQ Prolog terminal proxy',
-                'autoHistory': true
-            }),
-            tcs = function terminalCommandSuccess (data) {
-                var t, lines, i;
-                if (data.code === 0) {
-                    t = data.terminal;
-                    terminal.append(t.messages.join('\n'), 'output');
-                    promptMode = !t.have_more;
-                }
-                else {
-                    terminal.append(data.message, 'error');
-                    promptMode = true;
-                }
-                if (promptMode) {
-                    terminal.setLineBuffered();
-                    terminal.append(manualStop ? '?- ' : '.\n?- ', 'output');
-                }
-            },
-            tcf = function terminalCommandFailed (error) {
-                promptMode = true;
-                terminal.setLineBuffered();
-                terminal.append(error + '\n', 'error');
-                terminal.append('?- ', 'output');
-            };
-
-        terminal.onKeypress = function (c) {
-            if (promptMode) return c; // query composition: return the character unchanged
-            switch (c) {
-                case ' ':
-                case ';':
-                case '\n':
-                    return ';'; // show next answer on space, semicolon or enter
-                default:
-                    return '.'; // everything else: stop searching for answers
-            }
-        };
-
-        terminal.onInput = function (command) {
-            if (promptMode) {
-                promptMode = false;
-                manualStop = false;
-                terminal.setNotBuffered();
-                return codeq.comms.sendQuery({
-                    'problem_id': problem_id,
-                    'step': 'run',
-                    'program': editor.getDoc().getValue(),
-                    'query': command,
-                    'trace': activityHandler.addAndPurge({'typ': 'slv', 'qry': command})
-                }, problem_id).then(tcs, tcf);
-            }
-            else {
-                terminal.append('\n', 'input');
-                if (command == ';') {
-                    // show next answer
-                    return codeq.comms.sendQuery({
-                        'problem_id': problem_id,
-                        'step': 'next',
-                        'trace': activityHandler.addAndPurge({'typ': 'nxt'})
-                    }, problem_id).then(tcs, tcf);
-                }
-                else {
-                    // stop searching for answers
-                    manualStop = true;
-                    return codeq.comms.sendQuery({
-                        'problem_id': problem_id,
-                        'step': 'end',
-                        'trace': activityHandler.addAndPurge({'typ': 'stp'})
-                    }, problem_id).then(tcs, tcf);
-                }
-
-            }
-        };
-
-        terminal.leftmostCol = 3;
-        terminal.append('?- ', 'output');
-
-        return terminal;
-    };
-
-    var makeActivityHandler = function (editor, problem_id) {
-        var lastActivityMillis = Date.now(),
-            deltaActivityMillis = function deltaActivityMillisFunc () {
-                var now = Date.now(),
-                    dt = now - lastActivityMillis;
-                lastActivityMillis = now;
-                return dt;
-            },
-            queue = [],
-            ts = null,
-            timer = function () {
-                var promise;
-                ts = null;
-                if (queue.length === 0) return Q(true);
-                promise = codeq.comms.sendActivity(queue, editor.getDoc().getValue(), problem_id);
-                queue.length = 0;
-                return promise;
-            },
-            flush = function () {
-                clearTimeout(ts);
-                return timer();
-            };
-
-        return {
-            'queueTrace': function (trace) {
-                trace['dt'] = deltaActivityMillis();
-                queue.push(trace);
-                if (ts === null) ts = setTimeout(timer, 10000); // flush every 10 seconds
-                return this;
-            },
-            'flush': flush,
-            'addAndPurge': function (trace) {
-                var accumulatedTrace = queue;
-                queue = [];
-                trace['dt'] = deltaActivityMillis();
-                accumulatedTrace.push(trace);
-                if (ts !== null) {
-                    clearTimeout(ts);
-                    ts = null;
-                }
-                return accumulatedTrace;
-            }
-        };
-    };
-
-    /**
-     * Creates a new handler for the given Prolog assignment definition.
-     *
-     * @param {PrologTaskDef} info
-     * @returns {{destroy: Function, processServerHints: Function}}
-     */
-    createPrologHandler = function (info) {
-        var problem = info.problem,
-            jqDescriptionContent = jqDescription.find('.description'),
-            jqEditor = jqCode.find('.code_editor'),
-            jqTerminal = jqConsole.find('.console'),
-            jqHints = jqInfo.find('.hints'),
-            editor = CodeMirror(jqEditor[0], { cursorHeight: 0.85, lineNumbers: true, matchBrackets: true }),
-            activityHandler = makeActivityHandler(editor, problem.id),
-            terminal = makePrologTerminalHandler(jqTerminal, editor, problem.id, activityHandler),
-            hinter = codeq.makeHinter(jqHints, jqEditor, editor, problem.hint, problem.plan),
-            commError = function (error) {
-                alert(error);
-            };
-
-        editor.setValue(info.solution);
-        $('#title').text(problem.slug);
-        jqDescriptionContent.html(problem.description);
-        jqBtnPlan.prop('disabled', (problem.plan || '').length == 0);
-
-        editor.on('change', function (instance, changeObj) {
-            var doc = editor.getDoc(),
-                pos = codeq.codePointCount(doc.getRange(firstCharacterPos, changeObj.from));
-
-            if (changeObj.removed) {
-                activityHandler.queueTrace({'typ': 'r', 'off': pos, 'len': codeq.codePointCount(changeObj.removed.join(''))});
-            }
-
-            if (changeObj.text) {
-                activityHandler.queueTrace({'typ': 'ins', 'off': pos, 'txt': changeObj.text});
-            }
-        });
-
-        jqBtnPlan.on('click', function () {
-            if (!hinter.planNext()) {
-                jqBtnPlan.prop('disabled', true).blur();
-            }
-        });
-        jqBtnHint.on('click', function () {
-            terminal.append('hint.\n', 'input');
-            terminal.inputDisable();
-            var doc = editor.getDoc();
-            codeq.comms.sendHint({
-                    'language': 'prolog',
-                    'program': editor.getDoc().getValue(),
-                    'problem_id': problem.id
-                })
-                .then(function (data) {
-                    if (data.code === 0) {
-                        hinter.handle(data.hints);
-                    }
-                    else {
-                        terminal.append(data.message + '\n', 'error');
-                    }
-                })
-                .fail(commError)
-                .fin(function () {
-                    terminal.inputEnable();
-                    terminal.append('?- ', 'output');
-                })
-                .done();
-        });
-        jqBtnTest.on('click', function () {
-            terminal.append('test.\n', 'input');
-            terminal.inputDisable();
-            var doc = editor.getDoc();
-            codeq.comms.sendTest({
-                    'language': 'prolog',
-                    'program': editor.getDoc().getValue(),
-                    'problem_id': problem.id
-                })
-                .then(function (data) {
-                    if (data.code === 0) {
-                        hinter.handle(data.hints);
-                    }
-                    else {
-                        terminal.append(data.message + '\n', 'error');
-                    }
-                })
-                .fail(commError)
-                .fin(function () {
-                    terminal.inputEnable();
-                    terminal.append('?- ', 'output');
-                })
-                .done();
-        });
-
-        return {
-            destroy: function () {
-                $('#title').text('');//empty the title text
-                jqAllButtons.off();
-                editor.off('change');
-                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;
-            }
-        };
-    };
-})();
+/**

+ * Created by robert on 9/17/15.

+ *

+ * The prolog state of the state machine. When it is entered it'll prepare the console and code editor and load a sub-state machine which represents the 4 different parts fo the screen.

+ */

+

+(function() {

+    var subScreens, //this will be the actual (sub)state machine

+        stateNameTag = 'stateName', //a tag for data which is added to some html elements

+        jqScreen = $('#screen_prolog'), // the screen container element

+        //quadrants

+        jqDescription = jqScreen.find('.block1'),

+        jqCode = jqScreen.find('.block2'),

+        jqConsole = jqScreen.find('.block3'),

+        jqInfo = jqScreen.find('.block4'),

+        jqAllQuadrants = jqDescription.add(jqCode).add(jqConsole).add(jqInfo), // all the quadrants

+        // buttons

+        jqBtnPlan = jqScreen.find('.btn-plan'),

+        jqBtnHint = jqScreen.find('.btn-hint'),

+        jqBtnTest = jqScreen.find('.btn-test'),

+        jqAllButtons = jqBtnPlan.add(jqBtnHint).add(jqBtnTest), // all the buttons

+        // misc

+        currentSubState = null,

+        transitionEventName = 'mousedown',//event name of the event which will trigger the transition between these substates - the most common transition at least (there are some corner cases on the hint and test buttons -> see the code below)

+        substates = {

+            'description': {

+                'enter': function () {

+                    currentSubState = 'block1';

+                    jqScreen.addClass(currentSubState);

+                },

+                'exit': function () {

+                    jqScreen.removeClass(currentSubState);

+                    currentSubState = null;

+                }

+            },

+            'code': {

+                'enter': function () {

+                    currentSubState = 'block2';

+                    jqScreen.addClass(currentSubState);

+                },

+                'exit': function () {

+                    jqScreen.removeClass(currentSubState);

+                    currentSubState = null;

+                }

+            },

+            'info': {

+                'enter': function () {

+                    currentSubState = 'block4';

+                    jqScreen.addClass(currentSubState);

+                },

+                'exit': function () {

+                    jqScreen.removeClass(currentSubState);

+                    currentSubState = null;

+                }

+            },

+            'console': {

+                'enter': function () {

+                    currentSubState = 'block3';

+                    jqScreen.addClass(currentSubState);

+                },

+                'exit': function () {

+                    jqScreen.removeClass(currentSubState);

+                    currentSubState = null;

+                }

+            }

+        };

+    var prologHandler; //created when we enter the prolog state and destroyed once we leave it

+    codeq.globalStateMachine.register('prolog', {

+        'enter': function (data) {

+            $('#navigation-login').css('display', '');

+            $('#navigation-language').css('display', '');

+            $('#navigation-problem').css('display', '');

+            $("#navigation-prolog").addClass("active");

+            $('#navigation-prolog').css('display', '');

+

+            jqScreen.css('display', '');//we have to show the screen now so the code editor shows its initial values correctly

+            prologHandler = createPrologHandler(data.data);

+            subScreens = codeq.makeStateMachine(substates);

+            subScreens.transition(jqDescription.data(stateNameTag));

+/*            Q.delay(100).then(function(){

+                jqAllQuadrants.addClass('transition');//for smooth animations - need to be delayed, because otherwise we get some weird "animations" while the page is loading

+            }).done();*/

+            jqAllButtons.on(transitionEventName, function (event) {

+                subScreens.transition('info'); // set focus on the hints quadrant

+                event.stopPropagation(); // don't allow the event to go on and trigger further transition

+            });

+            jqAllQuadrants.on(transitionEventName, function () {

+                subScreens.transition($(this).data(stateNameTag));

+            });

+        },

+        'exit': function () {

+            jqAllButtons.off(); // unregister all event handlers

+            jqAllQuadrants.off();

+            jqScreen.css('display', 'none');

+//            jqAllQuadrants.removeClass('transition');

+            prologHandler.destroy();

+            prologHandler = null;

+            subScreens.destroy();

+            subScreens = null;

+            jqScreen.addClass('block1');

+

+            $('#navigation-login').css('display', 'none');

+            $('#navigation-language').css('display', 'none');

+            $('#navigation-problem').css('display', 'none');

+            $("#navigation-prolog").removeClass("active");

+            $('#navigation-prolog').css('display', 'none');

+        }

+    });

+

+    jqDescription.data(stateNameTag, 'description');

+    jqCode.data(stateNameTag, 'code');

+    jqConsole.data(stateNameTag, 'console');

+    jqInfo.data(stateNameTag, 'info');

+

+    // a constant

+    var firstCharacterPos = {'line': 0, 'ch': 0};

+

+    var makePrologTerminalHandler = function (jqConsole, editor, problem_id, activityHandler) {

+        var promptMode = true, // default: query composition; alternative: query result browsing

+            manualStop = false,// if the user stopped showing next answers (false) or if there are no more answers (true)

+            terminal = codeq.makeConsole(jqConsole, {

+                'greeting': 'CodeQ Prolog terminal proxy',

+                'autoHistory': true

+            }),

+            tcs = function terminalCommandSuccess (data) {

+                var t, lines, i;

+                if (data.code === 0) {

+                    t = data.terminal;

+                    terminal.append(t.messages.join('\n'), 'output');

+                    promptMode = !t.have_more;

+                }

+                else {

+                    terminal.append(data.message, 'error');

+                    promptMode = true;

+                }

+                if (promptMode) {

+                    terminal.setLineBuffered();

+                    terminal.append(manualStop ? '?- ' : '.\n?- ', 'output');

+                }

+            },

+            tcf = function terminalCommandFailed (error) {

+                promptMode = true;

+                terminal.setLineBuffered();

+                terminal.append(error + '\n', 'error');

+                terminal.append('?- ', 'output');

+            };

+

+        terminal.onKeypress = function (c) {

+            if (promptMode) return c; // query composition: return the character unchanged

+            switch (c) {

+                case ' ':

+                case ';':

+                case '\n':

+                    return ';'; // show next answer on space, semicolon or enter

+                default:

+                    return '.'; // everything else: stop searching for answers

+            }

+        };

+

+        terminal.onInput = function (command) {

+            if (promptMode) {

+                promptMode = false;

+                manualStop = false;

+                terminal.setNotBuffered();

+                return codeq.comms.sendQuery({

+                    'problem_id': problem_id,

+                    'step': 'run',

+                    'program': editor.getDoc().getValue(),

+                    'query': command,

+                    'trace': activityHandler.addAndPurge({'typ': 'slv', 'qry': command})

+                }, problem_id).then(tcs, tcf);

+            }

+            else {

+                terminal.append('\n', 'input');

+                if (command == ';') {

+                    // show next answer

+                    return codeq.comms.sendQuery({

+                        'problem_id': problem_id,

+                        'step': 'next',

+                        'trace': activityHandler.addAndPurge({'typ': 'nxt'})

+                    }, problem_id).then(tcs, tcf);

+                }

+                else {

+                    // stop searching for answers

+                    manualStop = true;

+                    return codeq.comms.sendQuery({

+                        'problem_id': problem_id,

+                        'step': 'end',

+                        'trace': activityHandler.addAndPurge({'typ': 'stp'})

+                    }, problem_id).then(tcs, tcf);

+                }

+

+            }

+        };

+

+        terminal.leftmostCol = 3;

+        terminal.append('?- ', 'output');

+

+        return terminal;

+    };

+

+    var makeActivityHandler = function (editor, problem_id) {

+        var lastActivityMillis = Date.now(),

+            deltaActivityMillis = function deltaActivityMillisFunc () {

+                var now = Date.now(),

+                    dt = now - lastActivityMillis;

+                lastActivityMillis = now;

+                return dt;

+            },

+            queue = [],

+            ts = null,

+            timer = function () {

+                var promise;

+                ts = null;

+                if (queue.length === 0) return Q(true);

+                promise = codeq.comms.sendActivity(queue, editor.getDoc().getValue(), problem_id);

+                queue.length = 0;

+                return promise;

+            },

+            flush = function () {

+                clearTimeout(ts);

+                return timer();

+            };

+

+        return {

+            'queueTrace': function (trace) {

+                trace['dt'] = deltaActivityMillis();

+                queue.push(trace);

+                if (ts === null) ts = setTimeout(timer, 10000); // flush every 10 seconds

+                return this;

+            },

+            'flush': flush,

+            'addAndPurge': function (trace) {

+                var accumulatedTrace = queue;

+                queue = [];

+                trace['dt'] = deltaActivityMillis();

+                accumulatedTrace.push(trace);

+                if (ts !== null) {

+                    clearTimeout(ts);

+                    ts = null;

+                }

+                return accumulatedTrace;

+            }

+        };

+    };

+

+    /**

+     * Creates a new handler for the given Prolog assignment definition.

+     *

+     * @param {PrologTaskDef} info

+     * @returns {{destroy: Function, processServerHints: Function}}

+     */

+    createPrologHandler = function (info) {

+        var problem = info.problem,

+            jqDescriptionContent = jqDescription.find('.description'),

+            jqEditor = jqCode.find('.code_editor'),

+            jqTerminal = jqConsole.find('.console'),

+            jqHints = jqInfo.find('.hints'),

+            editor = CodeMirror(jqEditor[0], { cursorHeight: 0.85, lineNumbers: true, matchBrackets: true }),

+            activityHandler = makeActivityHandler(editor, problem.id),

+            terminal = makePrologTerminalHandler(jqTerminal, editor, problem.id, activityHandler),

+            hinter = codeq.makeHinter(jqHints, jqEditor, editor, problem.hint, problem.plan),

+            commError = function (error) {

+                alert(error);

+            };

+

+        editor.setValue(info.solution);

+        $('#screen_prolog .title').text(problem.slug);

+        jqDescriptionContent.html(problem.description);

+        jqBtnPlan.prop('disabled', (problem.plan || '').length == 0);

+

+        editor.on('change', function (instance, changeObj) {

+            var doc = editor.getDoc(),

+                pos = codeq.codePointCount(doc.getRange(firstCharacterPos, changeObj.from));

+

+            if (changeObj.removed) {

+                activityHandler.queueTrace({'typ': 'r', 'off': pos, 'len': codeq.codePointCount(changeObj.removed.join(''))});

+            }

+

+            if (changeObj.text) {

+                activityHandler.queueTrace({'typ': 'ins', 'off': pos, 'txt': changeObj.text});

+            }

+        });

+

+        jqBtnPlan.on('click', function () {

+            if (!hinter.planNext()) {

+                jqBtnPlan.prop('disabled', true).blur();

+            }

+        });

+        jqBtnHint.on('click', function () {

+            terminal.append('hint.\n', 'input');

+            terminal.inputDisable();

+            var doc = editor.getDoc();

+            codeq.comms.sendHint({

+                    'language': 'prolog',

+                    'program': editor.getDoc().getValue(),

+                    'problem_id': problem.id

+                })

+                .then(function (data) {

+                    if (data.code === 0) {

+                        hinter.handle(data.hints);

+                    }

+                    else {

+                        terminal.append(data.message + '\n', 'error');

+                    }

+                })

+                .fail(commError)

+                .fin(function () {

+                    terminal.inputEnable();

+                    terminal.append('?- ', 'output');

+                })

+                .done();

+        });

+        jqBtnTest.on('click', function () {

+            terminal.append('test.\n', 'input');

+            terminal.inputDisable();

+            var doc = editor.getDoc();

+            codeq.comms.sendTest({

+                    'language': 'prolog',

+                    'program': editor.getDoc().getValue(),

+                    'problem_id': problem.id

+                })

+                .then(function (data) {

+                    if (data.code === 0) {

+                        hinter.handle(data.hints);

+                    }

+                    else {

+                        terminal.append(data.message + '\n', 'error');

+                    }

+                })

+                .fail(commError)

+                .fin(function () {

+                    terminal.inputEnable();

+                    terminal.append('?- ', 'output');

+                })

+                .done();

+        });

+

+        return {

+            destroy: function () {

+                $('#screen_prolog .title').text('');//empty the title text

+                jqAllButtons.off();

+                editor.off('change');

+                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;

+            }

+        };

+    };

+})();

diff --git a/js/codeq/python.js b/js/codeq/python.js
index b745a20..e80bbb7 100644
--- a/js/codeq/python.js
+++ b/js/codeq/python.js
@@ -1,329 +1,329 @@
-/**
- * Created by robert on 9/17/15.
- *
- * The python state of the state machine. When it is entered it'll prepare the console and code editor and load a sub-state machine which represents the 4 different parts fo the screen.
- *
- * Currentyl it is mostly a copy of the prolog state (the exception is of course the makePythonTerminalHandler instead of makePrologTerminalHandler)
- */
-
-(function() {
-    var subScreens, //this will be the actual (sub)state machine
-        stateNameTag = 'stateName', //a tag for data which is added to some html elements
-        jqScreen = $('#screen_python'), // the screen container element
-        //quadrants
-        jqDescription = jqScreen.find('.block1'),
-        jqCode = jqScreen.find('.block2'),
-        jqConsole = jqScreen.find('.block3'),
-        jqInfo = jqScreen.find('.block4'),
-        jqAllQuadrants = jqDescription.add(jqCode).add(jqConsole).add(jqInfo), // all the quadrants
-        // buttons
-        jqBtnPlan = jqScreen.find('.btn-plan'),
-        jqBtnHint = jqScreen.find('.btn-hint'),
-        jqBtnTest = jqScreen.find('.btn-test'),
-        jqBtnRun = jqScreen.find('.btn-run'),
-        jqBtnStop = jqScreen.find('.btn-stop'),
-        jqInfoButtons = jqBtnPlan.add(jqBtnHint).add(jqBtnTest), // all info-focusing buttons
-        jqAllButtons = jqInfoButtons.add(jqBtnRun).add(jqBtnStop), // all buttons
-        // misc
-        currentSubState = null,
-        transitionEventName = 'mousedown',//event name of the event which will trigger the transition between these substates - the most common transition at least (there are some corner cases on the hint and test buttons -> see the code below)
-        substates = {
-            'description': {
-                'enter': function () {
-                    currentSubState = 'block1';
-                    jqScreen.addClass(currentSubState);
-                },
-                'exit': function () {
-                    jqScreen.removeClass(currentSubState);
-                    currentSubState = null;
-                }
-            },
-            'code': {
-                'enter': function () {
-                    currentSubState = 'block2';
-                    jqScreen.addClass(currentSubState);
-                },
-                'exit': function () {
-                    jqScreen.removeClass(currentSubState);
-                    currentSubState = null;
-                }
-            },
-            'info': {
-                'enter': function () {
-                    currentSubState = 'block4';
-                    jqScreen.addClass(currentSubState);
-                },
-                'exit': function () {
-                    jqScreen.removeClass(currentSubState);
-                    currentSubState = null;
-                }
-            },
-            'console': {
-                'enter': function () {
-                    currentSubState = 'block3';
-                    jqScreen.addClass(currentSubState);
-                },
-                'exit': function () {
-                    jqScreen.removeClass(currentSubState);
-                    currentSubState = null;
-                }
-            }
-        };
-    var pythonHandler; //created when we enter the python state and destroyed once we leave it
-    codeq.globalStateMachine.register('python', {
-        'enter': function (data) {
-            $('#navigation-login').css('display', '');
-            $('#navigation-language').css('display', '');
-            $('#navigation-problem').css('display', '');
-            $("#navigation-python").addClass("active");
-            $('#navigation-python').css('display', '');
-
-            jqScreen.css('display', '');//we have to show the screen now so the code editor shows its initial values correctly
-            pythonHandler = createPythonHandler(data.data);
-            subScreens = codeq.makeStateMachine(substates);
-            subScreens.transition(jqDescription.data(stateNameTag));
-/*            Q.delay(100).then(function(){
-             jqAllQuadrants.addClass('transition');//for smooth animations - need to be delayed, because otherwise we get some weird "animations" while the page is loading
-             }).done();*/
-            jqInfoButtons.on(transitionEventName, function (event) {
-                subScreens.transition('info'); // set focus on the hints quadrant
-                event.stopPropagation(); // don't allow the event to go on and trigger further transition
-            });
-            jqBtnRun.on(transitionEventName, function (event) {
-                subScreens.transition('console'); // set focus on the hints quadrant
-                event.stopPropagation(); // don't allow the event to go on and trigger further transition
-            });
-
-            jqAllQuadrants.on(transitionEventName, function () {
-                subScreens.transition($(this).data(stateNameTag));
-            });
-        },
-        'exit': function () {
-            jqAllButtons.off(); // unregister all event handlers
-            jqAllQuadrants.off();
-            jqScreen.css('display', 'none');
-//            jqAllQuadrants.removeClass('transition');
-            pythonHandler.destroy();
-            pythonHandler = null;
-            subScreens.destroy();
-            subScreens = null;
-            jqScreen.addClass('block1');
-
-            $('#navigation-login').css('display', 'none');
-            $('#navigation-language').css('display', 'none');
-            $('#navigation-problem').css('display', 'none');
-            $("#navigation-python").removeClass("active");
-            $('#navigation-python').css('display', 'none');
-        }
-    });
-
-    jqDescription.data(stateNameTag, 'description');
-    jqCode.data(stateNameTag, 'code');
-    jqConsole.data(stateNameTag, 'console');
-    jqInfo.data(stateNameTag, 'info');
-
-    // a constant
-    var firstCharacterPos = {'line': 0, 'ch': 0};
-
-    var makePythonTerminalHandler = function (jqConsole, editor, problem_id, activityHandler) {
-        var terminal = codeq.makeConsole(jqConsole, {
-                'greeting': 'CodeQ Python terminal proxy',
-                'autoHistory': true
-            }),
-            tcs = function terminalCommandSuccess (data) {
-                if (data.code !== 0) {
-                    terminal.append(data.message, 'error');
-                }
-            },
-            tcf = function terminalCommandFailed (error) {
-                terminal.append(error + '\n', 'error');
-            };
-
-        terminal.onInput = function (text) {
-            terminal.leftmostCol = 0;
-            return codeq.comms.sendPythonPush({
-                'text': text + '\n'
-            }).then(tcs, tcf);
-        };
-
-        codeq.comms.on('terminal_output', function (data) {
-            var text = data.text,
-                lines = text.split('\n');
-            terminal.append(text, 'output');
-            terminal.leftmostCol = lines[lines.length-1].length;
-        });
-
-        terminal.leftmostCol = 1;
-
-        return terminal;
-    };
-
-    var makeActivityHandler = function (editor, problem_id) {
-        var lastActivityMillis = Date.now(),
-            deltaActivityMillis = function deltaActivityMillisFunc () {
-                var now = Date.now(),
-                    dt = now - lastActivityMillis;
-                lastActivityMillis = now;
-                return dt;
-            },
-            queue = [],
-            ts = null,
-            timer = function () {
-                var promise;
-                ts = null;
-                if (queue.length === 0) return Q(true);
-                promise = codeq.comms.sendActivity(queue, editor.getDoc().getValue(), problem_id);
-                queue.length = 0;
-                return promise;
-            },
-            flush = function () {
-                clearTimeout(ts);
-                return timer();
-            };
-
-        return {
-            'queueTrace': function (trace) {
-                trace['dt'] = deltaActivityMillis();
-                queue.push(trace);
-                if (ts === null) ts = setTimeout(timer, 10000); // flush every 10 seconds
-                return this;
-            },
-            'flush': flush,
-            'addAndPurge': function (trace) {
-                var accumulatedTrace = queue;
-                queue = [];
-                trace['dt'] = deltaActivityMillis();
-                accumulatedTrace.push(trace);
-                if (ts !== null) {
-                    clearTimeout(ts);
-                    ts = null;
-                }
-                return accumulatedTrace;
-            }
-        };
-    };
-
-
-
-    /**
-     * Creates a new handler for the given Prolog assignment definition.
-     *
-     * @param {PrologTaskDef} info
-     * @returns {{destroy: Function, processServerHints: Function}}
-     */
-    var createPythonHandler = function (info) {
-        var problem = info.problem,
-            jqDescriptionContent = jqDescription.find('.description'),
-            jqEditor = jqCode.find('.code_editor'),
-            jqTerminal = jqConsole.find('.console'),
-            jqHints = jqInfo.find('.hints'),
-            editor = CodeMirror(jqEditor[0], { cursorHeight: 0.85, lineNumbers: true, matchBrackets: true, mode: 'python' }),
-            activityHandler = makeActivityHandler(editor, problem.id),
-            terminal = makePythonTerminalHandler(jqTerminal, editor, problem.id, activityHandler),
-            hinter = codeq.makeHinter(jqHints, jqEditor, editor, problem.hint, problem.plan),
-            commError = function (error) {
-                alert(error);
-            };
-
-        editor.setValue(info.solution);
-        $('#title').text(problem.slug);
-        jqDescriptionContent.html(problem.description);
-        jqBtnPlan.prop('disabled', (problem.plan || '').length == 0);
-
-        editor.on('change', function (instance, changeObj) {
-            var doc = editor.getDoc(),
-                pos = codeq.codePointCount(doc.getRange(firstCharacterPos, changeObj.from));
-
-            if (changeObj.removed) {
-                activityHandler.queueTrace({'typ': 'rm', 'off': pos, 'len': codeq.codePointCount(changeObj.removed.join(''))});
-            }
-
-            if (changeObj.text) {
-                activityHandler.queueTrace({'typ': 'ins', 'off': pos, 'txt': changeObj.text});
-            }
-        });
-
-        jqBtnPlan.on('click', function () {
-            if (!hinter.planNext()) {
-                jqBtnPlan.prop('disabled', true).blur();
-            }
-        });
-        jqBtnHint.on('click', function () {
-            var doc = editor.getDoc();
-            codeq.comms.sendHint({
-                'language': 'python',
-                'program': editor.getDoc().getValue(),
-                'problem_id': problem.id
-            })
-            .then(function (data) {
-                if (data.code === 0) {
-                    hinter.handle(data.hints);
-                }
-                else {
-                    terminal.append('error: ' + data.message);
-                }
-            })
-            .fail(commError)
-            .done();
-        });
-        jqBtnTest.on('click', function () {
-            var doc = editor.getDoc();
-            codeq.comms.sendTest({
-                'language': 'python',
-                'program': editor.getDoc().getValue(),
-                'problem_id': problem.id
-            })
-            .then(function (data) {
-                if (data.code === 0) {
-                    hinter.handle(data.hints);
-                }
-                else {
-                    terminal.append('error: ' + data.message);
-                }
-            })
-            .fail(commError)
-            .done();
-        });
-        jqBtnRun.on('click', function () {
-            var program = editor.getDoc().getValue();
-            codeq.comms.sendPythonStop({})
-            .then(function () {
-                codeq.comms.sendPythonExec({
-                    'program': program
-                });
-            })
-            .fail(commError)
-            .done();
-            // focus the terminal
-            jqTerminal.click();
-        });
-        jqBtnStop.on('click', function () {
-            codeq.comms.sendPythonStop({})
-            .fail(commError)
-            .done();
-        });
-
-        // TODO first line of interpreter output is buffered without this, why?
-        codeq.comms.sendPythonPush({
-            'text': ''
-        });
-
-        return {
-            destroy: function () {
-                $('#title').text('');//empty the title text
-                jqAllButtons.off();
-                editor.off('change');
-                codeq.comms.off('terminal_output'); // stop listening for the terminal events from server
-                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;
-            }
-        };
-    };
-})();
+/**

+ * Created by robert on 9/17/15.

+ *

+ * The python state of the state machine. When it is entered it'll prepare the console and code editor and load a sub-state machine which represents the 4 different parts fo the screen.

+ *

+ * Currentyl it is mostly a copy of the prolog state (the exception is of course the makePythonTerminalHandler instead of makePrologTerminalHandler)

+ */

+

+(function() {

+    var subScreens, //this will be the actual (sub)state machine

+        stateNameTag = 'stateName', //a tag for data which is added to some html elements

+        jqScreen = $('#screen_python'), // the screen container element

+        //quadrants

+        jqDescription = jqScreen.find('.block1'),

+        jqCode = jqScreen.find('.block2'),

+        jqConsole = jqScreen.find('.block3'),

+        jqInfo = jqScreen.find('.block4'),

+        jqAllQuadrants = jqDescription.add(jqCode).add(jqConsole).add(jqInfo), // all the quadrants

+        // buttons

+        jqBtnPlan = jqScreen.find('.btn-plan'),

+        jqBtnHint = jqScreen.find('.btn-hint'),

+        jqBtnTest = jqScreen.find('.btn-test'),

+        jqBtnRun = jqScreen.find('.btn-run'),

+        jqBtnStop = jqScreen.find('.btn-stop'),

+        jqInfoButtons = jqBtnPlan.add(jqBtnHint).add(jqBtnTest), // all info-focusing buttons

+        jqAllButtons = jqInfoButtons.add(jqBtnRun).add(jqBtnStop), // all buttons

+        // misc

+        currentSubState = null,

+        transitionEventName = 'mousedown',//event name of the event which will trigger the transition between these substates - the most common transition at least (there are some corner cases on the hint and test buttons -> see the code below)

+        substates = {

+            'description': {

+                'enter': function () {

+                    currentSubState = 'block1';

+                    jqScreen.addClass(currentSubState);

+                },

+                'exit': function () {

+                    jqScreen.removeClass(currentSubState);

+                    currentSubState = null;

+                }

+            },

+            'code': {

+                'enter': function () {

+                    currentSubState = 'block2';

+                    jqScreen.addClass(currentSubState);

+                },

+                'exit': function () {

+                    jqScreen.removeClass(currentSubState);

+                    currentSubState = null;

+                }

+            },

+            'info': {

+                'enter': function () {

+                    currentSubState = 'block4';

+                    jqScreen.addClass(currentSubState);

+                },

+                'exit': function () {

+                    jqScreen.removeClass(currentSubState);

+                    currentSubState = null;

+                }

+            },

+            'console': {

+                'enter': function () {

+                    currentSubState = 'block3';

+                    jqScreen.addClass(currentSubState);

+                },

+                'exit': function () {

+                    jqScreen.removeClass(currentSubState);

+                    currentSubState = null;

+                }

+            }

+        };

+    var pythonHandler; //created when we enter the python state and destroyed once we leave it

+    codeq.globalStateMachine.register('python', {

+        'enter': function (data) {

+            $('#navigation-login').css('display', '');

+            $('#navigation-language').css('display', '');

+            $('#navigation-problem').css('display', '');

+            $("#navigation-python").addClass("active");

+            $('#navigation-python').css('display', '');

+

+            jqScreen.css('display', '');//we have to show the screen now so the code editor shows its initial values correctly

+            pythonHandler = createPythonHandler(data.data);

+            subScreens = codeq.makeStateMachine(substates);

+            subScreens.transition(jqDescription.data(stateNameTag));

+/*            Q.delay(100).then(function(){

+             jqAllQuadrants.addClass('transition');//for smooth animations - need to be delayed, because otherwise we get some weird "animations" while the page is loading

+             }).done();*/

+            jqInfoButtons.on(transitionEventName, function (event) {

+                subScreens.transition('info'); // set focus on the hints quadrant

+                event.stopPropagation(); // don't allow the event to go on and trigger further transition

+            });

+            jqBtnRun.on(transitionEventName, function (event) {

+                subScreens.transition('console'); // set focus on the hints quadrant

+                event.stopPropagation(); // don't allow the event to go on and trigger further transition

+            });

+

+            jqAllQuadrants.on(transitionEventName, function () {

+                subScreens.transition($(this).data(stateNameTag));

+            });

+        },

+        'exit': function () {

+            jqAllButtons.off(); // unregister all event handlers

+            jqAllQuadrants.off();

+            jqScreen.css('display', 'none');

+//            jqAllQuadrants.removeClass('transition');

+            pythonHandler.destroy();

+            pythonHandler = null;

+            subScreens.destroy();

+            subScreens = null;

+            jqScreen.addClass('block1');

+

+            $('#navigation-login').css('display', 'none');

+            $('#navigation-language').css('display', 'none');

+            $('#navigation-problem').css('display', 'none');

+            $("#navigation-python").removeClass("active");

+            $('#navigation-python').css('display', 'none');

+        }

+    });

+

+    jqDescription.data(stateNameTag, 'description');

+    jqCode.data(stateNameTag, 'code');

+    jqConsole.data(stateNameTag, 'console');

+    jqInfo.data(stateNameTag, 'info');

+

+    // a constant

+    var firstCharacterPos = {'line': 0, 'ch': 0};

+

+    var makePythonTerminalHandler = function (jqConsole, editor, problem_id, activityHandler) {

+        var terminal = codeq.makeConsole(jqConsole, {

+                'greeting': 'CodeQ Python terminal proxy',

+                'autoHistory': true

+            }),

+            tcs = function terminalCommandSuccess (data) {

+                if (data.code !== 0) {

+                    terminal.append(data.message, 'error');

+                }

+            },

+            tcf = function terminalCommandFailed (error) {

+                terminal.append(error + '\n', 'error');

+            };

+

+        terminal.onInput = function (text) {

+            terminal.leftmostCol = 0;

+            return codeq.comms.sendPythonPush({

+                'text': text + '\n'

+            }).then(tcs, tcf);

+        };

+

+        codeq.comms.on('terminal_output', function (data) {

+            var text = data.text,

+                lines = text.split('\n');

+            terminal.append(text, 'output');

+            terminal.leftmostCol = lines[lines.length-1].length;

+        });

+

+        terminal.leftmostCol = 1;

+

+        return terminal;

+    };

+

+    var makeActivityHandler = function (editor, problem_id) {

+        var lastActivityMillis = Date.now(),

+            deltaActivityMillis = function deltaActivityMillisFunc () {

+                var now = Date.now(),

+                    dt = now - lastActivityMillis;

+                lastActivityMillis = now;

+                return dt;

+            },

+            queue = [],

+            ts = null,

+            timer = function () {

+                var promise;

+                ts = null;

+                if (queue.length === 0) return Q(true);

+                promise = codeq.comms.sendActivity(queue, editor.getDoc().getValue(), problem_id);

+                queue.length = 0;

+                return promise;

+            },

+            flush = function () {

+                clearTimeout(ts);

+                return timer();

+            };

+

+        return {

+            'queueTrace': function (trace) {

+                trace['dt'] = deltaActivityMillis();

+                queue.push(trace);

+                if (ts === null) ts = setTimeout(timer, 10000); // flush every 10 seconds

+                return this;

+            },

+            'flush': flush,

+            'addAndPurge': function (trace) {

+                var accumulatedTrace = queue;

+                queue = [];

+                trace['dt'] = deltaActivityMillis();

+                accumulatedTrace.push(trace);

+                if (ts !== null) {

+                    clearTimeout(ts);

+                    ts = null;

+                }

+                return accumulatedTrace;

+            }

+        };

+    };

+

+

+

+    /**

+     * Creates a new handler for the given Prolog assignment definition.

+     *

+     * @param {PrologTaskDef} info

+     * @returns {{destroy: Function, processServerHints: Function}}

+     */

+    var createPythonHandler = function (info) {

+        var problem = info.problem,

+            jqDescriptionContent = jqDescription.find('.description'),

+            jqEditor = jqCode.find('.code_editor'),

+            jqTerminal = jqConsole.find('.console'),

+            jqHints = jqInfo.find('.hints'),

+            editor = CodeMirror(jqEditor[0], { cursorHeight: 0.85, lineNumbers: true, matchBrackets: true, mode: 'python' }),

+            activityHandler = makeActivityHandler(editor, problem.id),

+            terminal = makePythonTerminalHandler(jqTerminal, editor, problem.id, activityHandler),

+            hinter = codeq.makeHinter(jqHints, jqEditor, editor, problem.hint, problem.plan),

+            commError = function (error) {

+                alert(error);

+            };

+

+        editor.setValue(info.solution);

+        $('#screen_python .title').text(problem.slug);

+        jqDescriptionContent.html(problem.description);

+        jqBtnPlan.prop('disabled', (problem.plan || '').length == 0);

+

+        editor.on('change', function (instance, changeObj) {

+            var doc = editor.getDoc(),

+                pos = codeq.codePointCount(doc.getRange(firstCharacterPos, changeObj.from));

+

+            if (changeObj.removed) {

+                activityHandler.queueTrace({'typ': 'rm', 'off': pos, 'len': codeq.codePointCount(changeObj.removed.join(''))});

+            }

+

+            if (changeObj.text) {

+                activityHandler.queueTrace({'typ': 'ins', 'off': pos, 'txt': changeObj.text});

+            }

+        });

+

+        jqBtnPlan.on('click', function () {

+            if (!hinter.planNext()) {

+                jqBtnPlan.prop('disabled', true).blur();

+            }

+        });

+        jqBtnHint.on('click', function () {

+            var doc = editor.getDoc();

+            codeq.comms.sendHint({

+                'language': 'python',

+                'program': editor.getDoc().getValue(),

+                'problem_id': problem.id

+            })

+            .then(function (data) {

+                if (data.code === 0) {

+                    hinter.handle(data.hints);

+                }

+                else {

+                    terminal.append('error: ' + data.message);

+                }

+            })

+            .fail(commError)

+            .done();

+        });

+        jqBtnTest.on('click', function () {

+            var doc = editor.getDoc();

+            codeq.comms.sendTest({

+                'language': 'python',

+                'program': editor.getDoc().getValue(),

+                'problem_id': problem.id

+            })

+            .then(function (data) {

+                if (data.code === 0) {

+                    hinter.handle(data.hints);

+                }

+                else {

+                    terminal.append('error: ' + data.message);

+                }

+            })

+            .fail(commError)

+            .done();

+        });

+        jqBtnRun.on('click', function () {

+            var program = editor.getDoc().getValue();

+            codeq.comms.sendPythonStop({})

+            .then(function () {

+                codeq.comms.sendPythonExec({

+                    'program': program

+                });

+            })

+            .fail(commError)

+            .done();

+            // focus the terminal

+            jqTerminal.click();

+        });

+        jqBtnStop.on('click', function () {

+            codeq.comms.sendPythonStop({})

+            .fail(commError)

+            .done();

+        });

+

+        // TODO first line of interpreter output is buffered without this, why?

+        codeq.comms.sendPythonPush({

+            'text': ''

+        });

+

+        return {

+            destroy: function () {

+                $('#screen_python .title').text('');//empty the title text

+                jqAllButtons.off();

+                editor.off('change');

+                codeq.comms.off('terminal_output'); // stop listening for the terminal events from server

+                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;

+            }

+        };

+    };

+})();