var animationSpeed = "medium";
var activeQuestionId = 1;
var numberCorrect = 0;
var numberOfQuestions;
var nationalAverages;
var graphTitle;
var doneAlreadyClicked = false;

$(function() {
    hideAllButQuestion1();

    var resultsToCompare = $("#resultsToCompare");
    var graphTitle = $("#graphTitle");
    if (inputIsInvalid(resultsToCompare, graphTitle)) {
        return;
    }
    var inputStringOfAverages = resultsToCompare.html();
    var inputNationalAverages = buildArrayFromInputAverages(inputStringOfAverages);
    var inputGraphTitle = graphTitle.html();
    setGraphVariables(inputNationalAverages, inputGraphTitle);

    numberOfQuestions = $(".question").length;

    wireUpSubmitButtons();
    wireUpNextButtons();
    wireUpDistrictGraphLink();
});

function hideAllButQuestion1() {
    $(".question").hide();
    $(".answerDetails").hide();
    $("#summary").hide();
    $("#districtSummary").hide();
    $("#question1").show(animationSpeed);
}

function inputIsInvalid(resultsToCompare, graphTitle) {
    if (resultsToCompare.length == 0) {
        alert("The content is missing the 'resultsToCompare' span");
        return true;
    }
    if (graphTitle.length == 0) {
        alert("The content is missing the 'graphTitle' span");
        return true;
    }
    return false;
}

function wireUpSubmitButtons() {
    var submitMyAnswer = $(".submitMyAnswer");
	submitMyAnswer.click(function() {
        submitAnswer();
    });
	submitMyAnswer.keypress(function(e){
		if(e.which == 32) {//space bar 
			submitAnswer();
		}
	});
}

function submitAnswer(){
    if (inputIsValid()) {
        disableAnswers();
		showAnswerDetails("#answerDetails" + activeQuestionId);
    }
    else {
        requireAnAnswer();
    }	
}

function wireUpNextButtons() {
    var testYourselfNavigation = $(".testYourselfNavigation");
	testYourselfNavigation.click(function() {
        moveNext();
    });
	testYourselfNavigation.keypress(function(e){
		if(e.which == 32) { //space bar
			moveNext();
		}
	});
}

function moveNext(){
	enableAnswers();
	evaluateAnswer("q" + activeQuestionId);
	var previousQuestionId = activeQuestionId;
	activeQuestionId++;
	var nextQuestionId = activeQuestionId;
	hideQuestion(previousQuestionId);
	showQuestion(nextQuestionId);
	putFocusOnAnswers();	
}

function wireUpDistrictGraphLink() {
    var districtLink = $("#districtLink");
    var districtSummary = $("#districtSummary");
    districtLink.click(function() {
        districtLink.hide();
        drawGraph("districtSummary", 850, 350);
        districtSummary.show();
    });
}

function evaluateAnswer(answerListId) {
    var selectedValue = $('input[name=' + answerListId + ']:checked').val();
    if (selectedValue == "1") {
        numberCorrect++;
    }
}

function inputIsValid() {
    var checkedInput = $(".answerInput:visible:checked");
    if (!checkedInput.length) {
        return false;
    }
    return true;
}

function showAnswerDetails(detailsId) {
    $(".submitMyAnswer").hide(animationSpeed);
    $(detailsId).show(animationSpeed);
    putFocusOnButton();
}

function hideQuestion(questionId) {
    $("#question" + questionId).hide(animationSpeed);
}

function showQuestion(questionId) {
    var question = $("#question" + questionId)
    var questionExists = question.length;
    if (questionExists) {
        question.show(animationSpeed);
    }
    else {
        showSummary();
    }
}

function showSummary() {
    if (!doneAlreadyClicked) {
        nationalAverages.unshift(['You', calculatedScore()]);
        drawGraph("graph");
        $("#summary").show(animationSpeed);
        doneAlreadyClicked = true;
    }
}

function enableAnswers() {
    $(".answerInput").attr("disabled", false);
}

function disableAnswers() {
    $(".answerInput").attr("disabled", true);
}

function requireAnAnswer() {
    alert("Please select an answer.");
}

function putFocusOnAnswers() {
    $("#question" + activeQuestionId + " .answerInput:first").focus();
}

function putFocusOnButton() {
    $(".testYourselfNavigation a:visible").focus();
}

function calculatedScore() {
    return Math.round((numberCorrect / numberOfQuestions) * 100);
}

function setGraphVariables(inputNationalAverages, inputGraphTitle) {
    nationalAverages = inputNationalAverages;
    graphTitle = inputGraphTitle;
}

function drawGraph(containerId) {
    var colors = ['#FF9900', '#87BEE7', '#87BEE7', '#87BEE7', '#87BEE7', '#87BEE7', '#87BEE7', '#87BEE7', '#87BEE7'];
    var myChart = new JSChart(containerId, 'bar');
    myChart.setDataArray(nationalAverages);
    myChart.colorizeBars(colors);
    myChart.setTitle(graphTitle);
    myChart.setTitleColor('#8E8E8E');
    myChart.setAxisNameX('');
    myChart.setAxisNameY('');
    myChart.setAxisColor('#C4C4C4');
    myChart.setAxisNameFontSize(16);
    myChart.setAxisNameColor('#999');
    myChart.setAxisValuesColor('#777');
    myChart.setAxisColor('#B5B5B5');
    myChart.setAxisWidth(1);
    myChart.setBarValuesColor('#2F6D99');
    myChart.setBarOpacity(0.5);
    myChart.setAxisPaddingTop(60);
    myChart.setAxisPaddingBottom(40);
    myChart.setAxisPaddingLeft(45);
    myChart.setTitleFontSize(10);
    myChart.setBarBorderWidth(0);
    myChart.setBarSpacingRatio(50);
    myChart.setBarOpacity(0.9);
    myChart.setFlagRadius(6);
    myChart.setSize(616, 321);
    myChart.setBackgroundImage('/math_2009/images/chart_bg.jpg');
    myChart.draw();
}

function buildArrayFromInputAverages(inputStringOfAverages) {
    var tempArray = inputStringOfAverages.split(",");
    var arrayOfAverages = new Array();
    jQuery.each(tempArray, function(i, val) {
        var splitResult = tempArray[i].split('|');
        var label = splitResult[0].replace('[', '');
        var score = parseInt(splitResult[1].replace(']', ''));
        arrayOfAverages.push([label, score]);
    });
    return arrayOfAverages;
}