split the selection of the language and the selection of the problem into two seperate screens (this update also required some changes at the codeq-server, so that one needs to be up to date as well for this to work)

1 files changed, 104 insertions, 0 deletions

diff --git a/js/codeq/problem.js b/js/codeq/problem.js
new file mode 100644
index 0000000..6debf6d
--- /dev/null
+++ b/js/codeq/problem.js
@@ -0,0 +1,104 @@
+/**
+ * Created by robert on 9/18/15.
+ */
+
+/**
+ * Created by robert on 9/18/15.
+ */
+
+(function(){
+    codeq.globalStateMachine.register('problem',{
+        'enter': function(language){
+            $('#disabled').css('display', '');
+            $('#disabled').css('cursor', 'wait');
+            codeq.comms.send({'action': 'list_problems', 'language':language})
+                .then(
+                function success(data) {
+                    var i, groups, group, problems, problem, first_group,
+                        jqGroup = $('#problem_group'),
+                        jqProblems = $('#problems'),
+                        html = [],
+                        mapping = {},
+                        onGroupChange = function () {
+                            var problems = mapping[jqGroup.val()],
+                                html = [],
+                                i, p;
+                            if (problems) {
+                                for (i = 0; i < problems.length; i++) {
+                                    p = problems[i];
+                                    html.push('<option value="', p.identifier, '">', p.name, '</option>\n')
+                                }
+                            }
+                            jqProblems.html(html.join(''));
+                        };
+
+                    if (data && (data.code === 0)) {
+                        $('#disabled').css('display', 'none');
+                        groups = data.problems;
+                        for (i = 0; i < groups.length; i++) {
+                            group = groups[i];
+                            var identifier = group.identifier.group;
+                            html.push('<option value="', identifier, '">', group.name.group, '</option>\n');
+                            mapping[identifier] = group.problems;
+                        }
+                        jqGroup.html(html.join(''));
+                        first_group = html[1];
+                        html = null;
+
+                        jqGroup.on('click', onGroupChange);
+                        jqGroup.val(first_group);
+                        onGroupChange();
+
+                        $("#submit_problem").on('click', function(){
+                            var identifier = $('#problem_group').val(),//.split('/'),
+                                problem = $('#problems').val();
+                            if(!identifier) alert('Choose a problem group');
+                            else if (!problem) alert('Choose a problem');
+                            else {
+                                $('#disabled').css('display', '');
+                                codeq.comms.getProblem(language, identifier, problem)
+                                    .then(function (data) {
+                                        if (data.code !== 0) throw new Error('Failed to obtain problem data, code: ' + data.code + ', message: ' + data.message);
+                                        $('#disabled').css('display', 'none');
+                                        switch (language) {//(identifier[0]) {
+                                            case 'prolog':
+                                                codeq.globalStateMachine.transition('prolog', data);
+                                                break;
+                                            case 'python':
+                                                codeq.globalStateMachine.transition('python', data);
+                                                break;
+                                            default:
+                                                alert('Unknown language: ' + language);
+                                                break;
+                                        }
+                                    })
+                                    .fail(function (reason) {
+                                        $('#disabled').css('display', 'none');
+                                        alert('Login request failed: ' + reason);
+                                    })
+                                    .done();
+                            }
+                        });
+                        $('#screen_problem').css('display', '');
+                    }
+                    else {
+                        $('#disabled').css('cursor', '');
+                        alert('Obtaining list of problems failed: code=' + data.code + ', reason=' + data.message);
+                    }
+                },
+
+                function failure(reason) {
+                    $('#disabled').css('cursor', '');
+                    alert('Request to obtain list of problems failed: ' + reason);
+                }
+            ).done();
+        },
+        'exit' : function(){
+            $('#problem_group').off();
+            $("#submit_problem").off();
+            $("#problem_group option").remove();//empty the selects
+            $("#problems option").remove();
+            $("#screen_problem").css('display', 'none');
+        }
+    });
+})();
\ No newline at end of file