var score = {
    "Design and build quality": 3.5,
    "Display": 4.5,
    "Battery life": 4.5,
    "Audio": 5.0,
    "Photo camera": 5.0,
    "Video camera": 5.0,
    "Software": 5.0,
    "Benchmark performance": 5.0,
    "Coolness": 4.0
 }



var fillScores = function(score) {
    // get the elements

    var scoreCard = document.querySelectorAll('.score-card');
    //console.log(scoreCard.length);
    // each score card

    for (var i = 0; i < scoreCard.length; i++) {
        if (scoreCard[i].className.indexOf('score-card-total') > -1) continue

            var scoreCardTitle = scoreCard[i].querySelector('.score-card-title > b').innerHTML;


            //console.log(scoreCardTitle, score[scoreCardTitle].toFixed(1));
            var scoreCardFill = scoreCard[i].querySelector('.score-fill');
            scoreCardFill.setAttribute("data-score", score[scoreCardTitle]);
            var scoreNum = scoreCardFill.querySelector('.score-fill-num');
            scoreNum.innerHTML = score[scoreCardTitle].toFixed(1);
    }


    // final score
    var scoreCardTotal = document.querySelector('.score-card-total');
    var finalNum = scoreCardTotal.querySelector('.final-num');
    var total = 0, count = 0;
    for (k in score) {
        total += score[k];
        count++;
    }
    var average = (total / count).toFixed(1);
    finalNum.innerHTML = average + ' / 5';


    var scoreAll = document.querySelectorAll('.score-all tr');

    for(i=0; i<scoreAll.length; i++) {
        var scoreFinalFill = scoreAll[i].querySelector('.score-total-rating .score-fill');

        var scoreCardTitle = scoreAll[i].querySelector('.score-total-section').innerHTML;

        scoreFinalFill.setAttribute("data-score", score[scoreCardTitle].toFixed(1))
        var scoreFinalFillText = scoreAll[i].querySelector('td:last-child');
        scoreFinalFillText.innerHTML = score[scoreCardTitle].toFixed(1);
    }



}

window.addEventListener("load", function(){
    fillScores(score);
});