javascript - Tracking time and display it at next game -
i have assignment , bit stuck. assignment states:
modify game time tracked , best time (or time beat) stored , displayed @ end of game , @ beginning of next game played. functionality assumes browser not closed , each successive game begun through "play again?" link. display of time beat shown below.
i have files necessary, stuck in part. here code:
<!doctype html> <html> <head> <title>recipe: drawing square</title> <script src="easel.js"></script> <script type="text/javascript"> var canvas; var stage; var placementarray = []; var tileclicked; var timeallowable; var totalmatchespossible; var matchesfound; var txt; var matchesfoundtext; var tileheight = 30; var tilewidth = 45; var border = 1; var globalpadding = 10; var margin = 10; var padding = 5; var texttiles; var flashcards = [ ["a", "\u3042"], ["i", "\u3044"], ["u", "\u3046"], ["e", "\u3048"], ["o", "\u304a"], ["ka", "\u304b"], ["ki", "\u304d"], ["ku", "\u304f"], ["ke", "\u3051"], ["ko", "\u3053"], ["sa", "\u3055"], ["shi", "\u3057"], ["su", "\u3059"], ["se", "\u305b"], ["so", "\u305d"], ["ta", "\u305f"], ["chi", "\u3061"], ["tsu", "\u3064"], ["te", "\u3066"], ["to", "\u3068"], ["na", "\u306a"], ["ni", "\u306b"], ["nu", "\u306c"], ["ne", "\u306d"], ["no", "\u306e"], ["ha", "\u306f"], ["hi", "\u3072"], ["fu", "\u3075"], ["he", "\u3078"], ["ho", "\u307b"], ["ma", "\u307e"], ["mi", "\u307f"], ["mu", "\u3080"], ["me", "\u3081"], ["mo", "\u3082"], ["ya", "\u3084"], ["yu", "\u3086"], ["yo", "\u3088"], ["ra", "\u3089"], ["ri", "\u308a"], ["ru", "\u308b"], ["re", "\u308c"], ["ro", "\u308d"], ["wa", "\u308f"], ["wo", "\u3092"], ["n", "\u3093"] ]; function init() { canvas = document.getelementbyid('mycanvas'); stage = new stage(canvas); totalmatchespossible = flashcards.length; var numberoftiles = totalmatchespossible * 2; matchesfound = 0; var columns = 12; timeallowable = 500; txt = new text(timeallowable, "30px monospace", "#000"); txt.textbaseline = "top"; txt.x = 700; txt.y = 0; stage.addchild(txt); texttiles = []; matchesfoundtext = new text(matchesfound + "/" + totalmatchespossible, "30px monospace", "#000"); matchesfoundtext.textbaseline = "top"; matchesfoundtext.x = 700; matchesfoundtext.y = 40; stage.addchild(matchesfoundtext); ticker.init(); ticker.addlistener(window); ticker.setpaused(false); setplacementarray(numberoftiles); (var = 0; < numberoftiles; i++) { var placement = getrandomplacement(placementarray); var pairindex = math.floor(i / 2); text = flashcards[pairindex][i % 2]; var texttile = drawtexttile(text, pairindex); texttile.x = (tilewidth + margin) * (placement % columns) + globalpadding; texttile.y = (tileheight + margin) * math.floor(placement / columns) + globalpadding; stage.addchild(texttile); background = new shape(); background.x = texttile.x - padding; background.y = texttile.y - padding; background.graphics.setstrokestyle(border).beginstroke("#000").beginfill('#eee').drawrect(0, 0, tilewidth, tileheight); texttiles.push(background); stage.addchildat(background); background.text = texttile; background.onpress = handleonpress; stage.update(); }; } function drawtexttile(text, pairindex) { texttile = new text(text, "20px monospace", "#000"); texttile.pairindex = pairindex; texttile.textbaseline = "top"; return texttile; } function randomcolor() { var color = math.floor(math.random() * 255); var color2 = math.floor(math.random() * 255); var color3 = math.floor(math.random() * 255); return graphics.getrgb(color, color2, color3) } function setplacementarray(numberoftiles) { (var = 0; < numberoftiles; i++) { placementarray.push(i); } } function getrandomplacement(placementarray) { randomnumber = math.floor(math.random() * placementarray.length); return placementarray.splice(randomnumber, 1)[0]; } function handleonpress(event) { var tile = event.target; if (!!tileclicked === false || tileclicked === tile) { tileclicked = tile; } else { tileclicked.graphics.beginfill('#eee').drawrect(0, 0, tilewidth, tileheight); tile.graphics.beginfill('#aae').drawrect(0, 0, tilewidth, tileheight); if (tileclicked.text.pairindex === tile.text.pairindex && tileclicked.id != tile.id) { tileclicked.visible = false; tile.visible = false; matchesfound++; matchesfoundtext.text = matchesfound + "/" + totalmatchespossible; if (matchesfound === totalmatchespossible) { gameover(true); } } tileclicked = tile; } stage.update(); } function tick() { secondsleft = math.floor((timeallowable - ticker.gettime() / 1000)); txt.text = secondsleft; if (secondsleft <= 0) { gameover(false); } stage.update(); } function gameover(win) { ticker.setpaused(true); var replayparagraph = document.getelementbyid("replay"); replayparagraph.innerhtml = "<a href='#' onclick='history.go(0);'>play again?</a>"; (var = 0; < texttiles.length; i++) { texttiles[i].onpress = null; } if (win === true) { matchesfoundtext.text = "you win!" } else { txt.text = secondsleft + "... game over"; } } function replay() { init(); } </script> </head> <body onload="init()"> <header id="header"> <p id="replay"></p> </header> <canvas id="mycanvas" width="960" height="400"></canvas> </body> </html>
i give 1 option this, though can in other ways, declare global variables are
var prev_time; var best_time;
add global variable declarations, give value when compute time guess had here:
function tick() { secondsleft = math.floor((timeallowable - ticker.gettime() / 1000)); txt.text = secondsleft; if (secondsleft <= 0) { gameover(false); } //compute here total time player had , give prev_time //var totaltimeplayerplayed = computation here should allowed time per player - secondsleft prev_time = totaltimeplayerplayed; stage.update(); } function gameover(win) { ticker.setpaused(true); var replayparagraph = document.getelementbyid("replay"); replayparagraph.innerhtml = "<a href='#' onclick='history.go(0);'>play gain?</a>"; (var = 0; < texttiles.length; i++) { texttiles[i].onpress = null; } if (win === true) { matchesfoundtext.text = "you win!" if(best_time !== null){ best_time = prev_time; //we assume last player best scorer } } else { //if there existing top scorer if(best_time < prev_time){ best_time = prev_time } txt.text = secondsleft + "... game over"; } } then give time of first player prev_time. upon game on or game ended validate here if best_time has value if not, give value of value of prev_time, else validate if score higher previous best_time , here's tip, when player trigger "play again" can't seem find right now, variable best_time's value , display score beat. hope concept , somehow helped accomplished you're intended do, said before have other options this.
Comments
Post a Comment