Untitled

<!DOCTYPE html>
<html>

<head>

<meta charset="UTF-8">
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">

<title>title</title>

<script type="text/javascript">

// there are 3 levels here. you can add more
// by adding more integers to the array
var levels = ['',
        3,
        3,
        3
    ],
    level = 1, // store the level and increment it when the user finishes one
    time = levels[1], // time is set to the first level's time (10)
    t;

function cddisplay() {
    // displays time in span
    document.getElementById('timespan').innerHTML = 'Level: ' + level + '. ' + 'Time Left: ' + time;
};

function countdown() {
    // starts countdown
    cddisplay();

    if (time <= 0) {
        alert('Time\'s up for level ' + level);

        level += 1;
        if (level >= levels.length) {
            // execute code if the user has finished all of the levels
            alert('You finished all ' + (levels.length - 1) + ' levels!');
            phoneui.gotoPage('m1-HOMESCREEN', 'NONE');
            location.reload();
        } else {
            time = levels[level];
        }
    } else {
        time -= 1;
        t = setTimeout(countdown, 1000);
    }
};

function cdpause() {
    // pauses countdown
    clearTimeout(t);
};

function cdreset() {
    // resets countdown
    cdpause();
    time = levels[1];
    level = 1;
    cddisplay();
};

</script>

<style type="text/css">

body {
  background-color: #EEEEEE;
  margin: 0;
}

</style>

</head>

<body>

<span id="timespan">Level: 1. Time Left: x</span>
<input type="button" value="Start" onclick="countdown()">
<input type="button" value="Stop" onclick="cdpause()">
<input type="button" value="Reset" onclick="cdreset()">

</body>

</html>