/                                                       /

  /                      How to Play                      /

 /                                                       /

/------------------------------------------------------*/

​

​

/* <-------------- 2D Platformer Controls -------------->

​

    A                :  Move the Player Left

    D                :  Move the Player Right

    Spacebar or W    :  Jump

    Q                :  Melee Attack

    Mouse Click      :  Ranged Attack

    Hold Shift       :  Run faster

    + and -          :  Zoom in and out

    E                :  Enter/exit Editor Mode

 <-------------- Editor Mode Controls -------------->

    1-8              :  Switch which object is being placed

                        [ 1 ] Platform

                        [ 2 ] Coin

                        [ 3 ] Spike

                        [ 4 ] Monster Enemy

                        [ 5 ] Ranged Enemy

                        [ 6 ] Chaser Enemy

                        [ 7 ] Health Pack

                        [ 8 ] Power-Up Item

    Arrow Keys       :  Move the Camera

    V                :  Save the Level

    Click            :  Place an Object (only when zoomed in)

    Backspace + Click:  Delete an Object (only when zoomed in)

    X                :  Toggle Instructions On/Off

​

*/

​

​

​

    /*------------------------------------------------------/

   /                                                       /

  /                      Variables                        /

 /                                                       /

/------------------------------------------------------*/

​

​

// Game Information

var myGameTitle = "Warbler in Space"; // Replace 2D Platformer Game with the title of your game

var myName = "Eevee"; // Replace Eevee with your name

var debugGame = "off"; // "on" or "off"

var defaultValues = false; // To reset values, set to true

​

// Level to Load

var currentLevel = "myLevel"; // Default

// Level Options: Blank Level, Donut Land Adventure, Donut Canyon, Ghost Heights, Hidden Donut, Spikey Spikers, Unreachable Goal, Invisible Path, Donut Mania

​

// The Canvas is just what the Camera sees

var canvasWidth = 600; //1280 is the full scene, 800 can provide a bit more space

var canvasHeight = 720;

​

// The Whole Scene

var SCENE_W = 1280;

var SCENE_H = 720;

​

​

  /*--------------------/

 /       PLAYER        /

/--------------------*/

​

// Player Variables

var playerIdleImage = "images/player_idle.png";

var idleFrames = 12; //1;

var playerX = 75; // The starting position of the player sprite

var playerY = 580;

var playerWidth = 64; // The Width and Height should match the sprite size

var playerHeight = 64;

var directionFacing = "right"; // "right" or "left"

var playerColliderX = 30;

var playerColliderY = 54;

​

// Movement

var playerWalkImage = "images/player_walk.png";

var runFrames = 5;

var walkSpeed = 5; // The higher the number, the faster the player is

var runSpeed = 10; // When Shift is held, adjust how much it speeds up/slows down by: right now this is twice the player's speed

​

// Jumping & Gravity

var playerJumpImage = "images/player_jump.png";

var jumpFrames = 8;

var jump = -15; // How high the player jumps; it must always be negative

var GRAVITY = 1; // 1 (default), 2 (heavier)

var jumpMax = 3; // Maximum number of jumps, could be 2 if you want to implement a double-jump

​

var playerAttackType = "melee"; // "ranged" or "melee"

​

// Player Melee Attack

var playerAttackImage = "images/player_attack.png";

var hitboxImage = "images/empty.png";

var playerWidthAttack = 64;

var attackFrames = 8;

var hitboxX = 50;

var hitboxColliderX = 40;

var hitboxColliderY = 40;

​

// Player Ranged Attack

var projectileImage = "images/projectile.png";

var projectileSpeed = 15; // Speed of the player attacks, for ranged weapons

var projectileColliderX = 20;

var projectileColliderY = 20;

​

​

​

  /*--------------------/

 /    MONSTER ENEMY    /

/--------------------*/

​

// Monster Enemy Variables (moves left and right)

var monsterWalkImage = "images/astronaut.png";

var monsterX = 700; // Moves right after reaching this point

var monsterY = 600;

var monsterWidth = 64;

var monsterHeight = 64;

var monsterFrames = 8;

var monsterSpeed = 3; // Higher numbers are faster, lower numbers are slower

var monsterLeft = 1100; // Moves left after reaching this point

var textMonster = "Evil Astronaut";

var monsterColliderX = 40;

var monsterColliderY = 40;

var monsterHealth = 1;

​

​

  /*--------------------/

 /    CHASER ENEMY     /

/--------------------*/

​

// Ghost Enemy Variables (moves up and down, and chases)

var chaserMoveImage = "images/bird_enemy.png";

var chaserX = 280;

var chaserY = 500;

var chaserWidth = 64;

var chaserHeight = 64;

var chaserFrames = 7;

var chaserSpeed = 2;

var chaserHigh = 400;

var chaserLow = 300;

var textChaser = "Flying Monster"; // Chaser Enemy

var chaserColliderX = 40;

var chaserColliderY = 40;

var chaserHealth = 1;

​

​

  /*--------------------/

 /    RANGED ENEMY     /

/--------------------*/

​

// Ranged Enemy Variables (sits still, throws projectiles)

var rangedEnemyAttackImage = "images/ranged_enemy_attack.png";

var rangedEnemyIdleImage = "images/ranged_enemy_idle.png";

var rangedEnemyX = 390;

var rangedEnemyY = 500;

var rangedWidth = 64;

var rangedHeight = 64;

var rangedAttackFrames = 8;

var rangedIdleFrames = 8;

var textRanged = "Sorceress Melinda";

var rangedColliderX = 40;

var rangedColliderY = 50;

var rangedHealth = 1;

var rangedAttackRange = 200; // When the player is this close to the enemy, it attacks

​

// Attacks

var enemyProjectileImage = "images/enemy_projectile.png";

var enemyProjectileDestroyImage = "images/enemy_projectile_destroy.png";

var enemyProjectileWidth = 32;

var enemyProjectileHeight = 32;

var enemyProjectileFrames = 8;

var enemyProjectileDestroyFrames = 8;

var enemyProjectileColliderX = 20;

var enemyProjectileColliderY = 20;

​

​

  /*--------------------/

 /      SPIKES         /

/--------------------*/

​

// Spikes (created in Editor Mode, sits still)

var spikeImage = "images/acid.png";

var spikeX = -80;

var spikeY = 360;

var spikeWidth = 64;

var spikeHeight = 64;

var spikeFrames = 9;

var textSpike = "Acid";

var spikeColliderX = 50;

var spikeColliderY = 45;

var spikeOffsetY = 10;

​

​

  /*--------------------/

 /       HEALTH        /

/--------------------*/

​

// Health Bar

var playerHp = 4;

var hpBarSprite = "on";

var HPBgImage = "images/hp_background.png";

var HP1Image = "images/hp_red.png";

var HP2Image = "images/hp_orange.png";

var HP3Image = "images/hp_yellow.png";

var HP4Image = "images/hp_green.png"; // Full HP

var HPBorderImage = "images/hp_border.png";

var hpPosX = 180;

var hpPosY = 320;

​

// Health Pack

var healthPackImage = "images/health_pack.png";

var healthPackX = 150;

var healthPackY = 500;

var healthPackWidth = 50;

var healthPackHeight = 50;

var healthPackFrames = 13;

var textHealthPack = "Health Pack";

var healthPackColliderX = 48;

var healthPackColliderY = 50;

​

​

  /*--------------------/

 /       WALLS         /

/--------------------*/

​

// Platform

var platformImage = "images/platform.png";

var platformX = 400;

var platformY = 600;

var platformWidth = 103;

var textPlatform = "Platform";

​

// Ground

var groundImage = "images/ground.png";

var groundX = 640;

var groundY = 675;

​

// Wall

var wall1Sprite = "on";

var wall2Sprite = "on";

var wallImage = "images/wall.png";

var wall1X = -200;

var wall2X = 1500;

var wallY = 560;

​

// Camera/Invisible Walls

var borderLeft = -63; // -336 is the edge of the left platform; decrease this number if you want your player to be able to move further left

var borderRight = 1362; // 1628 is the edge of the right platform; increase this number for further right

​

​

  /*--------------------/

 /     BACKGROUND      /

/--------------------*/

​

// Mountain

var mountainSprite = "on";

var mountainImage = "images/sun.png";

var mountainX = 850;

var mountainY = 500;

var mountainWidth = 1800;

var mountainHeight = 780;

var totalMountainImages = 1;

​

// Trees

var treeSprite = "on";

var treeImage = "images/stars.png";

var treeX = 50;

var treeY = 220;

var treeWidth = 640;

var treeHeight = 500;

var totalTreeImages = 3;

//var treeFrames = 6;

​

​

  /*--------------------/

 /        GOAL         /

/--------------------*/

​

// Goal

var goalSprite = "on";

var goalImage = "images/goal.png";

var goalX = 1200;

var goalY = 450;

var goalWidth = 120;

var goalHeight = 110;

var goalFrames = 10;

​

​

  /*--------------------/

 /        COIN         /

/--------------------*/

​

// Collectible Coin

var coinImage = "images/bubble.png";

var coinX = 300;

var coinY = 500;

var coinWidth = 50;

var coinHeight = 50;

var coinFrames = 9;

var textCoin = "Bubble"; // In your game, it should be "Coin" or whatever your collectible currency is

var coinColliderX = 60;

var coinColliderY = 60;

​

​

  /*--------------------/

 /     INTERFACE       /

/--------------------*/

​

// Graphical User Interface Text

var scoreVisible = "on";

var textScore = "Score: ";

var scoreX = 50;

var scoreY = 70;

var goldVisible = "on";

var goldX = 50;

var goldY = 95;

var colorGUI = "white";

​

// Score

var goldIncrease = 1;

var goldScore = 50;

var hpScore = 50;

var enemyScore = 100;

var powerScore = 50;

​

​

  /*--------------------/

 /      POWER-UP       /

/--------------------*/

​

// Power-up Item

var powerupImage = "images/powerup.png";

var powerX = -50;

var powerY = 300;

var powerWidth = 50;

var powerHeight = 50;

var powerFrames = 8;

var textPowerUp = "Magical Star"; // Power-Up Item

var powerupColliderX = 45;

var powerupColliderY = 50;

var powerPlayerWalkImage = "images/player_walk_power.png";

var powerPlayerIdleImage = "images/player_idle_power.png";

var powerPlayerAttackImage = "images/player_attack_power.png";

var powerPlayerJumpImage = "images/player_jump_power.png";

​

​

  /*--------------------/

 /       SCENES        /

/--------------------*/

​

// Scene Background

var titleBackground = "blueviolet";

var level1Background = "black";

var youWinBackground = "orange";

var gameOverBackground = "red";

​

// Title Button

var startSprite = "on";

var startButtonImage = "images/start_button.png";

var startButtonX = 295;

var startButtonY = 450;

var startWidth = 450; // Match the image file

var startHeight = 100;

var textTitle = "Press Enter";

var colorTitle = "white";

​

// You Win Scene

var winbgSprite = "on";

var winBgImage = "images/youwin.png";

var winBgX = 300;

var winBgY = 360;

var textWin = "YOU WIN!";

var colorWin = "white";

​

// Game Over Scene

var gameoverbgSprite = "on";

var gameoverBgImage = "images/gameover.png";

var gameoverBgX = 300;

var gameoverBgY = 360;

var textGameOver = "GAME OVER";

var colorGameOver = "white";

​

​

  /*--------------------/

 /      KEYBOARD       /

/--------------------*/

​

// Keyboard Controls - Find the numbers to use here: https://keycode.info/

var leftKey = 65; // A key

var rightKey = 68; // D key

var jumpKey = 87; // W key

var jumpKey2 = 32; // Spacebar key

var attackKey = 81; // Q key

var runKey = 16; // Shift key

var proceedKey = 13; // Enter key

var reloadKey = 82; // R key

var saveKey = 86; // V key

var editorKey = 69; // E key

var deleteKey = 8; // Backspace key

var instructKey = 88; // X key

var panUpKey = 38; // Up Arrow key

var panDownKey = 40; // Down Arrow key

var panLeftKey = 37; // Left Arrow key

var panRightKey = 39; // Right Arrow key

var zoomOutKey = 189; // - key

var zoomInKey = 187; // + key

var objectKey1 = 49; // 1 key

var objectKey2 = 50; // 2 key

var objectKey3 = 51; // 3 key

var objectKey4 = 52; // 4 key

var objectKey5 = 53; // 5 key

var objectKey6 = 54; // 6 key

var objectKey7 = 55; // 7 key

var objectKey8 = 56; // 8 key

​

// Editor Mode Directions

var keyPlatform = "1";

var keyCoin = "2";

var keySpike = "3";

var keyEnemy = "4";

var keyRanged = "5";

var keyChaser = "6";

var keyHealth = "7";

var keyPowerup = "8";

var keyDelete = "Backspace";

var keyCameraMove = "Arrow Keys";

var keySave = "V";

var keyEditorMode = "E";

var keyTurnOff = "X";

var keyReload = "R";

​

​

​

​

​

​

​

​

​

​

​

​

​

/**************************************************************************

​

                    xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

   !!!!!!!!!!!!!!!    DON'T CHANGE ANY CODE BELOW HERE    !!!!!!!!!!!!!!!

                    xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx              

​

***************************************************************************/

​

​

​

​

​

// Variables with set values that shouldn't be changed

​

// Player & Abilities

var player;

var playerAttackStyle;

var playerSpeed = walkSpeed;

var moving = false;

var jumpCount = 0;

var jumpActive = "false";

var playerPower = false;

var powerup;

var healthPack;

​

// Enemy Declaration

var monster;

var monsterDirection;

var monsterRight = monsterX;

var chaserEnemy; // Ghost Chaser Enemy

var enemy;

var newEnemy;

var rangedEnemy;

var coolDown = false; // rangedEnemy can attack when this is false

var stopProjectiles;

var monsterMoveRadius = platformWidth - 5; // 100

var enemyProjectileRadiusX = 60; // When it starts the explosion animation (in relation to the player)

var enemyProjectileRadiusY = 60;

​

// Attacks

var projectiles;

var hitboxes;

var meleeAttack = false;

​

// Health Bar

var invincible = false;

var hpX;

var hpY;

var hpImg;

var hpBorder;

var hpBg;

​

// Wall & Platform Variables

var platform;

var ground;

var walls;

var allItems; // Groups of all objects from Editor Mode

var delPressed = false;

​

// Collectibles

var coin;

var collectibles;

var gold = 0;

var score = 0; // When the enemy is destroyed and when you collect coins, this number goes up

​

// Scenes & Camera

var canvas;

var camY;

var scene = "title"; // This determines what screen it's on (title, level1, youWin, or gameOver)

var gamePlay = false; // True if you're in a level, but false when it's a title screen or menu

var disableEditor = false; // Disables the Editor Mode

var zoomOut = false;

​

// Editor Mode

var editorMode = false; // Editor Mode will allow you to place sprites when it's on (or true)

var editObject = "Platform"; // The current object that you can place in Editor Mode

var editInstructX = 25; // 275

var editInstructItemX = editInstructX + 25;

var editInstructY = 100; // 175

var editorButtons = "Press " + keyPlatform + " for " + textPlatform + ", " + keyCoin + " for " + textCoin + ", " + keySpike + " for " + textSpike + ", " + keyEnemy + " for " + textMonster + ", " + keyRanged + " for " + textRanged + ", " + keyChaser + " for " + textChaser + ", " + keyHealth + " for " + textHealthPack + ", and " + keyPowerup + " for " + textPowerUp + ".";

​

// Text Variables

var font;

var showText = "";

var instructOn = true; // The Editor Mode instructions are on by default

​

// Enemy (created in Editor Mode, sits still)

var enemyImage = "images/enemy.png";

var enemyWidth = 64;

var enemyHeight = 64;

var enemyFrames = 1;

var newEnemyColliderX = 40;

var newEnemyColliderY = 60;

​

​

    /*------------------------------------------------------/

   /                                                       /

  /                      Load Assets                      /

 /                                                       /

/------------------------------------------------------*/

​

​

// <-------------- Preload: Define Images -------------->

​

function preload() {

    // Font

    font = loadFont("fonts/Poppins-Bold.ttf");

    // Still Images

    startImg = loadImage(startButtonImage);

    winbgImg = loadImage(winBgImage);

    gameoverbgImg = loadImage(gameoverBgImage);

    titleBackground = loadImage("images/title.png"); // This is an example of changing the title screen to an image instead of a color

    // Player

    // Load Images

    playerWalkImg = loadSpriteSheet(playerWalkImage, playerWidth, playerHeight, runFrames);

    playerIdleImg = loadSpriteSheet(playerIdleImage, playerWidth, playerHeight, idleFrames);

    playerAttackImg = loadSpriteSheet(playerAttackImage, playerWidthAttack, playerHeight, attackFrames); // playerWidth, playerHeight, attackFrames

    playerJumpImg = loadSpriteSheet(playerJumpImage, playerWidth, playerHeight, jumpFrames);

    // Load Animations

    playerWalk = loadAnimation(playerWalkImg);

    playerIdle = loadAnimation(playerIdleImg);

    playerAttack = loadAnimation(playerAttackImg);

    playerJump = loadAnimation(playerJumpImg);

​

    // Enemies

    monsterImg = loadSpriteSheet(monsterWalkImage, monsterWidth, monsterHeight, monsterFrames);

    enemyImg = loadSpriteSheet(enemyImage, enemyWidth, enemyHeight, enemyFrames);

    rangedImg = loadSpriteSheet(rangedEnemyAttackImage, rangedWidth, rangedHeight, rangedAttackFrames);

    rangedIdleImg = loadSpriteSheet(rangedEnemyIdleImage, rangedWidth, rangedHeight, rangedIdleFrames);

    spikeImg = loadSpriteSheet(spikeImage, spikeWidth, spikeHeight, spikeFrames);

    chaserImg = loadSpriteSheet(chaserMoveImage, chaserWidth, chaserHeight, chaserFrames);

    // Load Animations

    monsterWalk = loadAnimation(monsterImg);

    rangedAttack = loadAnimation(rangedImg);

    rangedIdle = loadAnimation(rangedIdleImg);

    enemyWalk = loadAnimation(enemyImg);

    spikeAnim = loadAnimation(spikeImg);

    chaserMove = loadAnimation(chaserImg);

    // Level Background

    platformImg = loadImage(platformImage);

    groundImg = loadImage(groundImage);

    wallImg = loadImage(wallImage);

    mountainImg = loadImage(mountainImage);

    treeImg = loadImage(treeImage);

​

    // Attacks

    hitboxImg = loadImage(hitboxImage);

    projectileImg = loadImage(projectileImage);

    // Enemy Attacks

    enemyProjectileImg = loadSpriteSheet(enemyProjectileImage, enemyProjectileWidth, enemyProjectileHeight, enemyProjectileFrames);

    enemyProjectileDestroyImg = loadSpriteSheet(enemyProjectileDestroyImage, enemyProjectileWidth, enemyProjectileHeight, enemyProjectileDestroyFrames);

    enemyProjectileIdleAnim = loadAnimation(enemyProjectileImg);

    enemyProjectileDestroyAnim = loadAnimation(enemyProjectileDestroyImg);

    // Items

    // Load Item Images

    coinImg = loadSpriteSheet(coinImage, coinWidth, coinHeight, coinFrames);

    goalImg = loadSpriteSheet(goalImage, goalWidth, goalHeight, goalFrames);

    powerupImg = loadSpriteSheet(powerupImage, powerWidth, powerHeight, powerFrames);

    healthPackImg = loadSpriteSheet(healthPackImage, healthPackWidth, healthPackHeight, healthPackFrames);

    // Load Item Animations

    coinSpin = loadAnimation(coinImg);

    goalAnim = loadAnimation(goalImg);

    powerUp = loadAnimation(powerupImg);

    healthPack = loadAnimation(healthPackImg);

​

    // Power-up Images/Animations for the Player

    playerWalkPowerImg = loadSpriteSheet(powerPlayerWalkImage, playerWidth, playerHeight, runFrames);

    playerIdlePowerImg = loadSpriteSheet(powerPlayerIdleImage, playerWidth, playerHeight, idleFrames);

    playerAttackPowerImg = loadSpriteSheet(powerPlayerAttackImage, playerWidthAttack, playerHeight, attackFrames); // playerWidth, playerHeight, attackFrames

    playerJumpPowerImg = loadSpriteSheet(powerPlayerJumpImage, playerWidth, playerHeight, jumpFrames);

    playerWalkPower = loadAnimation(playerWalkPowerImg);

    playerIdlePower = loadAnimation(playerIdlePowerImg);

    playerAttackPower = loadAnimation(playerAttackPowerImg);

    playerJumpPower = loadAnimation(playerJumpPowerImg);

    // Health Bar

    hpBgImg = loadImage(HPBgImage);

    hp4Img = loadImage(HP4Image);

    hp3Img = loadImage(HP3Image);

    hp2Img = loadImage(HP2Image);

    hp1Img = loadImage(HP1Image);

    hpBorderImg = loadImage(HPBorderImage);

}

​

​

// <-------------- Setup: Place Assets -------------->

​

function setup() {

    canvas = createCanvas(canvasWidth, canvasHeight);

​

    // Background

    mountains = new Group();

    if (mountainSprite == "on" || mountainSprite == true) {

        makeMountainTiles();

    }

    trees = new Group();

    if (treeSprite == "on" || treeSprite == true) {

        if (currentLevel !== "Donut Canyon") {

            makeTreeTiles();

        }

    }

    if (defaultValues == true) {

        loadDefault();

    }

    // Create Player

    player = createSprite(playerX, playerY);

    player.addAnimation("idle", playerIdle);

    player.addAnimation("walk", playerWalk);

    player.addAnimation("attack", playerAttack);

    player.addAnimation("jump", playerJump);

    player.setCollider("rectangle", 0, 0, playerColliderX, playerColliderY);

    player.visible = false;

    // Powered up Player

    player.addAnimation("idlePower", playerIdlePower);

    player.addAnimation("walkPower", playerWalkPower);

    player.addAnimation("attackPower", playerAttackPower);

    player.addAnimation("jumpPower", playerJumpPower);

​

    // Create Ground, Platforms, and Walls

    ground = createSprite(groundX, groundY);

    ground.addImage(groundImg);

    ground.setCollider("rectangle");

    ground.visible = true;

​

    wall1 = createSprite(wall1X, wallY);

    wall1.addImage(wallImg);

    wall1.setCollider("rectangle");

    wall1.visible = true;

    wall2 = createSprite(wall2X, wallY);

    wall2.addImage(wallImg);

    wall2.setCollider("rectangle");

    wall2.visible = true;

​

    walls = new Group();

    walls.add(ground);

    walls.add(wall1);

    walls.add(wall2);

    goal = createSprite(goalX, goalY);

    goal.addAnimation("animated", goalAnim);

    goal.visible = false;

    /*------------------------------------------------------/

   /                                                       /

  /                      Level Setup                      /

 /                                                       /

/------------------------------------------------------*/

​

    // Default Level

    if (currentLevel == "Default") {

        levelInformation = {

          "platforms": [

            {

              "x": platformX,

              "y": platformY

            }

          ],

          "enemies": [

            {

              "x": monsterX,

              "y": monsterY,

              "type": "monster",

              "start": monsterX,

              "left": monsterLeft

            },

            {

              "x": chaserX,

              "y": chaserY,

              "type": "chaser"

            },

            {

              "x": rangedEnemyX,

              "y": rangedEnemyY,

              "type": "ranged"

            },

            {

              "x": spikeX,

              "y": spikeY,

              "type": "spike"

            }

          ],

          "coins": [

            {

              "x": coinX,

              "y": coinY

            }

          ],

          "healths": [

            {

              "x": healthPackX,

              "y": healthPackY

            }

          ],

          "powerups": [

            {

              "x": powerX,

              "y": powerY

            }

          ]

        }

    } 

    // Blank Level

    if (currentLevel == "Blank Level") {

        levelInformation = {

            "platforms": [],

            "enemies": [],

            "coins": [],

            "healths": [],

            "powerups": []

        }

    }

    // Donut Land Adventure

    if (currentLevel == "Donut Land Adventure") {

        loadDefault();

        myGameTitle = "Donut Land Adventure";

        myName = "Eevee";

        levelInformation = {

          "platforms": [

            {