game.js

import {update as updateSnake, draw as drawSnake,SNAKE_SPEED,getSnakeHead,snakeIntersection} from './snake.js'
import { update as updateFood, draw as drawFood} from './food.js'
import {outsideGrid} from './grid.js'
let lastRenderTime =0
let gameOver = false
const gameBoard= document.getElementById('game-board')
var timer;
var ele = document.getElementById('timer');

function main(currentTime){
    if (gameOver) {
        if (confirm('You lost. Press ok to restart.')) {
          window.location = 'front.html'
        }
        return none
    }

    window.requestAnimationFrame(main)
    const secondsSinceLastRender=(currentTime-lastRenderTime)/1000
    if (secondsSinceLastRender< 1/SNAKE_SPEED) return

    lastRenderTime= currentTime

   update()
   draw()
}


(function (){
  var sec = 0;
  timer = setInterval(()=>{
    ele.innerHTML = '00:'+sec;
    sec ++;
  }, 1000) // each 1 second
})() 


window.requestAnimationFrame(main)

function update(){
    updateSnake()
    updateFood()
    checkDeath()

}
function draw(){
    gameBoard.innerHTML= ''
    drawSnake(gameBoard)
    drawFood(gameBoard)
}
function checkDeath(){
    gameOver = outsideGrid(getSnakeHead())|| snakeIntersection()
}