[broken] Javascript Game No.1 - the coffee calculator

This javascript game is out of date

I’ve been learning Javascript and Jquery over the last six months - from Codeacademy, from two books and from a course at City university. All recommended. Though, the books are hardest. I made this calculator using vanilla javascript which went onto be the guts of an interactive we did on Ampp3d. In fact the first interactive we’ve done. (I guess though you could count our live counters eg. the Wayne Rooney salary counter as taking the “input” of user time spent on page.) </p> The end result was the ampp3d coffee machine story.

How much does your coffee cost you?

What coffee do you buy each day?

<div id = “wrapper”; style=”float: left; width: 400px; height: 150px”> <div class="button" id="cappuccino"></div> <div class="button" id="latte"></div> <div class="button" id="americano"></div> <div class="button" id="expresso"></div> <div class="button" id="flatwhite"></div> <div id = “day-wrapper”; style=”float: right; width: 400px; height: 150px”> <h2 id="cupsTotal"> You drink cups a day</h2> <h2 id="dayCostResult">You spend £ </h2> <div class="button" id="calculate"></div> <div id="results-wrapper"> <h3 id="yearCostResult" class="red">You will spend £ on coffee a year</h3> <h3 id="lifeCostResult" class="red">You will spend £ on coffee in your 47-year caffeine-addled working life </h3> </p></div>

Our designer Dave drew it to make it look good, added some internet game tricks he'd learnt from UsVsTh3m and our developer added the CSS so it all fitted behind the design. So it ended up looking like this.

Ampp3d coffee machine

To see it work properly - check it out on the Ampp3d site here.


Follow me on Twitter: