"use strict";
  //--------------------------------------------------------------------------------------------------------------------
  //------ Variables, Constants and Objects
  //--------------------------------------------------------------------------------------------------------------------
  const SimonSaysSheet = {
    Background: {x: 0, y: 0, w: 720, h: 720, count: 2, speed: 0, alpha: 1},
    ButtonYellow: {x: 0, y: 720, w: 314, h: 314, count: 2, speed: 0, alpha: 1, pos: {x: 29, y: 377, r1: 100, r2: 333}},
    ButtonBlue: {x: 0, y: 1034, w: 314, h: 314, count: 2, speed: 0, alpha: 1, pos: {x: 377, y: 377, r1: 100, r2: 333}},
    ButtonRed: {x: 0, y: 1348, w: 314, h: 314, count: 2, speed: 0, alpha: 1, pos: {x: 377, y: 29, r1: 100, r2: 333}},
    ButtonGreen: {x: 0, y: 1662, w: 314, h: 314, count: 2, speed: 0, alpha: 1, pos: {x: 29, y: 29, r1: 100, r2: 333}},
    ButtonStartEnd: {x: 0, y: 1976, w: 360, h: 360, count: 2, speed: 0, alpha: 1, pos: {x: 180, y: 180, r1: 1, r2: 180}
    }
  };

  const Position = {x: 0, y: 0};
  const centerGame = {x: SimonSaysSheet.Background.w/2, y: SimonSaysSheet.Background.h/2};
  const cvs = document.getElementById("cvs");
  const ctx = cvs.getContext("2d");
  const imgSheet = new Image();
  const mousePos = Object.create(Position);
  let background = null;
  const buttons = [];


  //--------------------------------------------------------------------------------------------------------------------
  //------ Classes
  //--------------------------------------------------------------------------------------------------------------------

  function TBackground() {
    const pos = Object.create(Position);
    const sp = new TSprite(imgSheet, SimonSaysSheet.Background, pos);

    this.draw = function () {
      sp.draw();
    }
  }

  function TButton(aSpi) {
    const pos = aSpi.pos;
    const sp = new TSprite(imgSheet, aSpi, pos);

    this.draw = function () {
      sp.draw();
    }

  }

  //--------------------------------------------------------------------------------------------------------------------
  //------ Function and Events
  //--------------------------------------------------------------------------------------------------------------------
  function isMouseInsideButton(aBounds,r1,r2){
    let isOver = !((mousePos.x < aBounds.left) || (mousePos.y < aBounds.top) || (mousePos.x > aBounds.right) || (mousePos.y > aBounds.bottom));
    if (isOver) {
      const hyp = Math.pow(mousePos.x - centerGame.x, 2) + Math.pow(mousePos.y - centerGame.y, 2);
      isOver = (hyp > r1) && (hyp < r2);
    }
    return isOver;
  }

  function setMousePos(aEvent) {
    const bounds = cvs.getBoundingClientRect();
    mousePos.x = aEvent.clientX - bounds.left;
    mousePos.y = aEvent.clientY - bounds.top;
  }

  function cvsMouseMove(aEvent) {
    setMousePos(aEvent);
    // Mouse move over canvas
  }

  function cvsMouseDown() {
    // Mouse button down in canvas
  }

  function cvsMouseUp() {
    // Mouse button up in canvas
  }

  function loadGame(){
    // Sprite sheet is loaded and game can start!
    background = new TBackground();
    buttons.push(
            new TButton(SimonSaysSheet.ButtonYellow),
            new TButton(SimonSaysSheet.ButtonBlue),
            new TButton(SimonSaysSheet.ButtonRed),
            new TButton(SimonSaysSheet.ButtonGreen)
    );
    drawGame();
  }

  function drawGame(){
  ctx.clearRect(0,0,cvs.width, cvs.height);
  background.draw();
  for(let i = 0; i < buttons.length; i++){
    buttons[i].draw();
  }
  }




  //--------------------------------------------------------------------------------------------------------------------
  //------ Main Code
  //--------------------------------------------------------------------------------------------------------------------
  imgSheet.addEventListener("load", loadGame);
  imgSheet.src = "SimonSaysSheet.png";
  cvs.width = SimonSaysSheet.Background.w;
  cvs.height = SimonSaysSheet.Background.h;
  cvs.addEventListener("mousemove", cvsMouseMove);
  cvs.addEventListener("mousedown", cvsMouseDown);
  cvs.addEventListener("mouseup", cvsMouseUp);
  document.addEventListener('contextmenu', aEvent => aEvent.preventDefault());