diff options
author | Sean Whitton <spwhitton@spwhitton.name> | 2014-11-28 18:20:41 +0900 |
---|---|---|
committer | Sean Whitton <spwhitton@spwhitton.name> | 2014-11-28 18:21:21 +0900 |
commit | 84894580f56911e687fd8bc6eeb6c1694f3a31d9 (patch) | |
tree | 4ce50a0e301f6f869890ca1b0d8829d44d4d4e3e /js | |
parent | b02a5df2cb46008699200a69187dd94c9b640081 (diff) | |
download | schoolclock-84894580f56911e687fd8bc6eeb6c1694f3a31d9.tar.gz |
attempt to make updateClasses follow javascript OO idioms
Diffstat (limited to 'js')
-rw-r--r-- | js/main.js | 155 |
1 files changed, 66 insertions, 89 deletions
@@ -10,6 +10,8 @@ var Class = function (grade, clas, total) { this.grade = grade; this.clas = clas; + // human-readable ID + this.id = this.grade + '-' + this.clas; this.total = total; this.points = $.jStorage.get(this.grade + "_" + this.clas + "_" + "points", 0); this.time = $.jStorage.get(this.grade + "_" + this.clas + "_" + "time", 0); @@ -43,118 +45,93 @@ var classes = [ new Class(6, 3, 19) ]; -function classesComparison(a, b) -{ - if (a.points < b.points) - return 1; - if (b.points < a.points) - return -1; - return 0; -} -function sortClasses() -{ - classes.sort(classesComparison); +// method to sort them +classes.sortClasses = function () { + function classesComparison(a, b) + { + if (a.points < b.points) + return 1; + if (b.points < a.points) + return -1; + return 0; + } + this.sort(classesComparison); } // function to update the HTML display of classes function updateClasses () { // first update the HTML displayed - sortClasses(); - var i = 0; - $('#classes').html(""); - for (i = 0; i < classes.length; i++) + + classes.sortClasses(); + $classes = $('#classes'); + $classes.html(""); + + function appendClassHTML (clas, index, array) { - var classstring = classes[i].grade + '-' + classes[i].clas; - var minutes = Math.floor(classes[i].time / 60); - var seconds = classes[i].time - minutes * 60; - seconds = seconds.toString(); + // strings for display + + // background colour should be green for two classes with the highest points (and our array is sorted by points) + var colour = index < 2 ? ' style="background-color: lightgreen;"' : ''; + + // time + var minutes = '' + Math.floor(clas.time / 60); + var seconds = '' + (clas.time - minutes * 60); if (seconds.length == 1) seconds = "0" + seconds; - if (i < 2) - var colour = " style=\"background-color: lightgreen;\""; - else - var colour = ""; - $('#classes').append('<div class="col-md-2"' + colour + '> \ -<h1>' + classstring + '</h1> \ -<p class="text-center"> \ -<a id="' + classstring + 'points" class="btn btn-info btn-lg">' + classes[i].points + ' points</a> \ -</p> \ -<p class="text-center"> \ -<a id="' + classstring + 'time" class="btn btn-warning">' + minutes + ':' + seconds + ' this week</a> \ -</p> \ -<p class="text-center"> \ -<a id="' + classstring + 'random" class="btn btn-success">Lucky number</a> \ -</p> \ -</div>'); + + // build and append HTML + + var html = '<div class="col-md-2"' + colour + '>' + + '<h1>' + clas.id + '</h1>' + + '<p class="text-center">' + + '<a id="' + clas.id + 'points" class="btn btn-info btn-lg">' + clas.points + ' points</a>' + + '</p>' + + '<p class="text-center">' + + '<a id="' + clas.id + 'time" class="btn btn-warning">' + minutes + ':' + seconds + ' this week</a>' + + '</p>' + + '<p class="text-center">' + + '<a id="' + clas.id + 'random" class="btn btn-success">Lucky number</a>' + + '</p>' + + '</div>'; + + $classes.append(html); } + classes.forEach(appendClassHTML); - // now put functions on the buttons - var i = 0; - for (i = 0; i < classes.length; i++) - { - var classstring = classes[i].grade + '-' + classes[i].clas; + // now put functions on the buttons we just added to our HTML - // put a function on the each class's points button - $('#' + classstring + 'points').button(); - $('#' + classstring + 'points').click(function (){ - var classToUpdateGrade = parseInt(this.id.substring(0, 1)); - var classToUpdateClas = parseInt(this.id.substring(2, 3)); + function powerClassButtons (clas, index, array) + { + var $pointsbutton = $('#' + clas.id + 'points'); + $pointsbutton.button(); + $pointsbutton.click(function () { + // get the change from user var change = parseInt(prompt("Change points by how much?", 0)); - // look up the class to modify - var j = 0; - for (j = 0; j < classes.length; j++) - { - if (classes[j].grade == classToUpdateGrade && classes[j].clas == classToUpdateClas) - break - } - // give grade 5 their bonus - if (classToUpdateGrade == 5) + if (clas.grade == 5) change = change * 1.5; - // modify it - classes[j].changePoints(change); + // modify class points + classes[index].changePoints(change); }); - // put a function on the each class's time button - $('#' + classstring + 'time').button(); - $('#' + classstring + 'time').click(function (){ - var classToUpdateGrade = parseInt(this.id.substring(0, 1)); - var classToUpdateClas = parseInt(this.id.substring(2, 3)); - var change = parseInt(prompt("Change time by how many seconds?", timeWastingClock.getTime().time - 1)); - - // look up the class to modify - var j = 0; - for (j = 0; j < classes.length; j++) - { - if (classes[j].grade == classToUpdateGrade && classes[j].clas == classToUpdateClas) - break - } - - classes[j].changeTime(change); + var $timebutton = $('#' + clas.id + 'time'); + $timebutton.button(); + $timebutton.click(function () { + var change = parseInt(prompt("Change time by how many seconds?", + timeWastingClock.getTime().time - 1)); + classes[index].changeTime(change); }); - // put a function on the each class's lucky number button - $('#' + classstring + 'random').button(); - $('#' + classstring + 'random').click(function (){ - var classToUseGrade = parseInt(this.id.substring(0, 1)); - var classToUseClas = parseInt(this.id.substring(2, 3)); - - // look up the class to use - var j = 0; - for (j = 0; j < classes.length; j++) - { - if (classes[j].grade == classToUseGrade && classes[j].clas == classToUseClas) - break - } - - // modify it - var max = classes[j].total; - alert(getRandomInt(1, max)); + var $randombutton = $('#' + clas.id + 'random'); + $randombutton.button(); + $randombutton.click(function () { + alert(getRandomInt(1, clas.total)); }); } + classes.forEach(powerClassButtons); } $.ionSound({ |