Fruit Ninjas! with mouse controls

Make a great game and let's play!

by DavisC_WL

HTML

<p id="text">Slice the fruits, not the bombs</p>
<canvas id="myCanvas" width="500" height="500" style="border:1px solid #000000;"></canvas>

CSS

#myCanvas {
    cursor:auto;
}

JavaScript

/**
Basic drawing variables
**/
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
//set initial gravity
var gravity = 0.4;
//fruit variables
var maxNumberOfFruits = 15; //how many fruits are possible on screen at one time?
var minFruitSize = 25; //smallest fruit possible
var maxFruitSize = 150; //largest fruit possible
var maxFruitSpeed = 20;
var bombInterval = 3;  //how many fruits show before bomb comes?
//game variables
var tries = 3; //how many fruit can fall before you fail?
////////////////////////////
//images for the game
///////////////////////////
//the sword
var sImg = new Image();
sImg.src = "https://i.postimg.cc/Qd2X00kY/Fruit-Ninja-JSGame-Sword-Sprite-PNG.png";
//the fruits
var fImg = new Image();
fImg.src = "https://i.postimg.cc/6QZQXDpN/Fruit-Ninja-JSGame-Fruit-Sprites-PNG.png";
//the background
var bgImg = new Image();
bgImg.src = "https://i.postimg.cc/LXdngmbX/Fruit-Ninja-Background-Davis-C-JPG.jpg";

/////////////////////////////////////
////////////////////////////////////
////////////////////////////////////
/**
mouse controls
**/
document.addEventListener("mousedown",function(e){
    //capture the event
    e = window.event || e;
    e.preventDefault();
    //tell the sword that it is cutting vvv
		sword.cutting = true;
		/////////////////////////
});
document.addEventListener("mouseup",function(e){
    //capture the event
    e = window.event || e;
    //tell the sword that it is not cutting vvv
    sword.cutting = false;
    ///////////////////////////
    //tell the game that it should start playing vvv
   game.playing = true;
    //////////////////
});
document.addEventListener("mousemove",function(e){
    //capture the event
    e = window.event || e;
    //we use e.clinetX and e.clientY to track the mouse position
    //set the game's mouseX and mouseY to match the mouse position vvv
    document.getElementById('text').innerHTML = e.clientX;
    game.mouseX = e.clientX
    game.mouseY =...