text: const Engine = Matter.Engine;
  const World = Matter.World;
  const Bodies = Matter.Bodies;
  const Constraint = Matter.Constraint;
  
  var engine , world;
  var canvas;
  var palyer, playerBase;
  var computer, computerBase;
  
  var arrow;
  
  
  function setup() {
    canvas = createCanvas(windowWidth, windowHeight);
  
    engine = Engine.create();
    world = engine.world;
    angleMode(DEGREES)
  
    var options={
      isStatic : true
    };
  
    playerBase = Bodies.rectangle(200,350,180,150,options);
    World.add(World, playerBase)
  
    playerBase = Bodies.rectangle(250,playerBase.position.y - 160,50,180,options);
    World.add(World, player)
  
    playerBase = new PlayerBase(300, random(450, height - 300), 180, 150);
    player = new Player(285, playerBase.body.position.y - 153, 50, 180);
    playerArcher = new PlayerArcher(
      340,
      playerBase.body.position.y - 180,
      120,
      120
    );
  
    computerBase = new ComputerBase(
      width - 300,
      random(450, height - 300),
      180,
      150
    );
    computer = new Computer(
      width - 280,
      computerBase.body.position.y - 153,
      50,
      180
    );
    computerArcher = new ComputerArcher(
      width - 340,
      computerBase.body.position.y - 180,
      120,
      120
    );
    
    arrow = new PlayerArrow(playerArcher.body.position.x, playerArcher.body.position.y, 100, 10);
    
  }
  
  function draw() {
    background(backgroundImg);
    image(baseimage,playerBase.position.x,playerBase.position.y,180,150);
    image(playerimage,player.position.x,player.position.y,50,180)
  
    Engine.update(engine);
  
    // Title
    fill("#FFFF");
    textAlign("center");
    textSize(40);
    text("EPIC ARCHERY", width / 2, 100);
  
   
    playerBase.display();
    player.display();
    
  
    computerBase.display();
    computer.display();
    
    playerArcher.display();
    computerArcher.display()
    arrow.display()
    if(keyCode === 32){
     arrow.shoot(playerArcher.body.angle);
    }
  }