(function(){
    var jqScreen = $('#screen_problem'),
        jqLanguageTitle = jqScreen.find('.language-title'),
        jqLanguageDescription = jqScreen.find('.language-description'),
        jqLanguageProblems = jqScreen.find('.language-problems'),
        languageCache = {}, // keyed by language identifier
        currentData = null, // currently active data
        createLanguageData = function (data, languageIdentifier, lang) { // data is the content of language.json
            var trLanguage = codeq.chooseTranslation(data.translations, lang),
                groups = data.groups || {},
                languageHints = trLanguage.hint || {},
                html = [],
                problemReferences = [],
                groupIdentifier, group, trGroup, problems, problemIdentifier, problem, trProblem;
            for (groupIdentifier in groups) {
                if (!groups.hasOwnProperty(groupIdentifier)) continue;
                group = groups[groupIdentifier] || {};
                trGroup = codeq.chooseTranslation(group.translations, lang);
                html.push('<li><div class="group-title">', codeq.escapeHtml(trGroup.name || 'Group name not set: ' + groupIdentifier), '</div>');
                html.push('<div class="group-description">', codeq.escapeHtml(trGroup.description || 'Group description not set: ' + groupIdentifier), '</div>');
                html.push('<ul class="group-problems">');
                problems = group.problems || {};
                for (problemIdentifier in problems) {
                    if (!problems.hasOwnProperty(problemIdentifier)) continue;
                    problem = problems[problemIdentifier];
                    trProblem = codeq.chooseTranslation(problem.translations, lang);
                    html.push('<li><a class="problem-', '' + problemReferences.length, '">', codeq.escapeHtml(trProblem.name || 'Problem name not set: ' + problemIdentifier), '</a></li>');
                    problemReferences.push({'g': groupIdentifier, 'p': problemIdentifier});
                }
                html.push('</ul></li>');
            }
            return {
                'name': trLanguage.name || 'Language name not set: ' + languageIdentifier,
                'description': trLanguage.description || 'Description not set: ' + languageIdentifier,
                'html': html.join(''),
                'refs': problemReferences,
                'hints': trLanguage.hint || {}
            };
        },
        onLangChange = function (args) {
            purgeDom();
            createDom(currentData);
        },
        createDom = function (languageData) {
            var lang = codeq.getLang(),
                language = languageData.identifier,
                data = languageData[lang];
            if (!data) {
                data = createLanguageData(languageData.raw, language, lang);
                languageData[lang] = data;
            }
            jqLanguageTitle.html(data.name);
            jqLanguageDescription.html(data.description);
            jqLanguageProblems.html(data.html);
            jqLanguageProblems.find('a').on('click', function () {
                var index = +$(this).attr('class').split('-')[1],
                    ref = data.refs[index];
                if (!ref) {
                    codeq.log.error('Clicked on a problem link having erroneous index: ' + index);
                    return;
                }
                // transition
                codeq.wait(
                    codeq.comms.getProblem(language, ref.g, ref.p)
                        .then(function (data) {
                            if (data.code !== 0) throw new Error('Failed to obtain problem data, code: ' + data.code + ', message: ' + data.message);
                            codeq.globalStateMachine.transition(language, data);
                        })
                    )
                    .fail(function (reason) {
                        codeq.log.error('Failed to obtain the problem definition: ' + reason, reason);
                        alert('Failed to obtain the problem definition: ' + reason);
                    })
                    .done();
            });
            codeq.on('langchange', onLangChange);
        },
        purgeDom = function () {
            jqLanguageProblems.find('a').off();
            jqLanguageProblems.empty();
            jqLanguageDescription.empty();
            jqLanguageTitle.empty();
            codeq.off('langchange', onLangChange);
        },
        lastLanguage;

    codeq.globalStateMachine.register('problem',{
        'enter': function(language){
            if (language) lastLanguage = language;
            else language = lastLanguage; // This happens when we hit this with the back button

            $('#navigation-login').css('display', '');
            $('#navigation-language').css('display', '');
            $("#navigation-problem").addClass("active").css('display', '');
            jqScreen.css('display', '');

            currentData = languageCache[language];
            if (currentData) {
                createDom(currentData);
            }
            else {
                codeq.wait(codeq.comms.getLanguageDef(language).then(function (rawData) {
                    currentData = {'raw': rawData, 'identifier': language};
                    languageCache[language] = currentData;
                    createDom(currentData);
                })).done();
            }

/*            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(){
            purgeDom();
/*            $('#problem_group').off();
            $("#submit_problem").off();
            $("#problem_group option").remove();//empty the selects
            $("#problems option").remove();
            $("#screen_problem").css('display', 'none');*/

            jqScreen.css('display', 'none');
            $('#navigation-login').css('display', 'none');
            $('#navigation-language').css('display', 'none');
            $('#navigation-problem').css('display', 'none').removeClass("active");
        }
    });
})();