diff --git a/assets/js/platformer3x/BackgroundCoral.js b/assets/js/platformer3x/BackgroundCoral.js deleted file mode 100644 index 8cade1d9..00000000 --- a/assets/js/platformer3x/BackgroundCoral.js +++ /dev/null @@ -1,25 +0,0 @@ -import GameEnv from './GameEnv.js'; -import Background from './Background.js'; - -export class BackgroundCoral extends Background { - constructor(canvas, image, data) { - super(canvas, image, data); - - this.parallaxSpeed = 0; - } - - // speed is used to background parallax behavior - update() { - this.speed = GameEnv.backgroundDirection * this.parallaxSpeed; - super.update(); - } - - //Cause of limited bg cutout, keeping just incase it causes issues later - draw() { - this.ctx.clearRect(0, 0, this.canvasWidth, this.canvasHeight); - super.draw(); - } - -} - -export default BackgroundCoral; \ No newline at end of file diff --git a/assets/js/platformer3x/BackgroundFish.js b/assets/js/platformer3x/BackgroundFish.js deleted file mode 100644 index c20b8c1b..00000000 --- a/assets/js/platformer3x/BackgroundFish.js +++ /dev/null @@ -1,24 +0,0 @@ -import GameEnv from './GameEnv.js'; -import Background from './Background.js'; - -export class BackgroundFish extends Background { - constructor(canvas, image, data) { - super(canvas, image, data); - - this.parallaxSpeed = 1; - } - - // speed is used to background parallax behavior - update() { - this.speed = -1 * this.parallaxSpeed; - super.update(); - } - - draw() { - this.ctx.clearRect(0, 0, this.canvasWidth, this.canvasHeight); - super.draw(); - } - -} - -export default BackgroundFish; \ No newline at end of file diff --git a/assets/js/platformer3x/BackgroundHills.js b/assets/js/platformer3x/BackgroundHills.js deleted file mode 100644 index a1e5e19c..00000000 --- a/assets/js/platformer3x/BackgroundHills.js +++ /dev/null @@ -1,25 +0,0 @@ -import GameEnv from './GameEnv.js'; -import Background from './Background.js'; - -export class BackgroundHills extends Background { - constructor(canvas, image, data) { - super(canvas, image, data); - - this.parallaxSpeed = 0.4; - } - - // speed is used to background parallax behavior - update() { - this.speed = GameEnv.backgroundDirection * this.parallaxSpeed; - super.update(); - } - - //Cause of limited bg cutout, keeping just incase it causes issues later - draw() { - this.ctx.clearRect(0, 0, this.canvasWidth, this.canvasHeight); - super.draw(); - } - -} - -export default BackgroundHills; \ No newline at end of file diff --git a/assets/js/platformer3x/BackgroundMountains.js b/assets/js/platformer3x/BackgroundMountains.js deleted file mode 100644 index 8c4e8296..00000000 --- a/assets/js/platformer3x/BackgroundMountains.js +++ /dev/null @@ -1,18 +0,0 @@ -import GameEnv from './GameEnv.js'; -import Background from './Background.js'; - -export class BackgroundMountains extends Background { - constructor(canvas, image, data) { - super(canvas, image, data); - - this.parallaxSpeed = 0.1; - } - - // speed is used to background parallax behavior - update() { - this.speed = GameEnv.backgroundDirection * this.parallaxSpeed; - super.update(); - } -} - -export default BackgroundMountains; \ No newline at end of file diff --git a/assets/js/platformer3x/BackgroundNarwhal.js b/assets/js/platformer3x/BackgroundNarwhal.js deleted file mode 100644 index 3cfa6904..00000000 --- a/assets/js/platformer3x/BackgroundNarwhal.js +++ /dev/null @@ -1,24 +0,0 @@ -import GameEnv from './GameEnv.js'; -import Background from './Background.js'; - -export class BackgroundNarwhal extends Background { - constructor(canvas, image, data) { - super(canvas, image, data); - - this.parallaxSpeed = 2; - } - - // speed is used to background parallax behavior - update() { - this.speed = this.parallaxSpeed; - super.update(); - } - - draw() { - this.ctx.clearRect(0, 0, this.canvasWidth, this.canvasHeight); - super.draw(); - } - -} - -export default BackgroundNarwhal; \ No newline at end of file diff --git a/assets/js/platformer3x/BackgroundClouds.js b/assets/js/platformer3x/BackgroundParallax.js similarity index 54% rename from assets/js/platformer3x/BackgroundClouds.js rename to assets/js/platformer3x/BackgroundParallax.js index 69ebe562..119b3f7a 100644 --- a/assets/js/platformer3x/BackgroundClouds.js +++ b/assets/js/platformer3x/BackgroundParallax.js @@ -1,16 +1,17 @@ import GameEnv from './GameEnv.js'; import Background from './Background.js'; -export class BackgroundClouds extends Background { +export class BackgroundParallax extends Background { constructor(canvas, image, data) { super(canvas, image, data); - this.parallaxSpeed = 1; + this.parallaxSpeed = data.parallaxSpeed || 1; + this.moveOnKeyAction = data.moveOnKeyAction || false; } // speed is used to background parallax behavior update() { - this.speed = this.parallaxSpeed; + this.speed = this.moveOnKeyAction ? this.parallaxSpeed * GameEnv.backgroundDirection : this.parallaxSpeed; super.update(); } @@ -21,4 +22,4 @@ export class BackgroundClouds extends Background { } -export default BackgroundClouds; \ No newline at end of file +export default BackgroundParallax; \ No newline at end of file diff --git a/assets/js/platformer3x/BackgroundPlayers.js b/assets/js/platformer3x/BackgroundPlayers.js deleted file mode 100644 index c046c3c7..00000000 --- a/assets/js/platformer3x/BackgroundPlayers.js +++ /dev/null @@ -1,24 +0,0 @@ -import GameEnv from './GameEnv.js'; -import Background from './Background.js'; - -export class BackgroundPlayers extends Background { - constructor(canvas, image, data) { - super(canvas, image, data); - - this.parallaxSpeed = -3; - } - - // speed is used to background parallax behavior - update() { - this.speed = this.parallaxSpeed; - super.update(); - } - - draw() { - this.ctx.clearRect(0, 0, this.canvasWidth, this.canvasHeight); - super.draw(); - } - -} - -export default BackgroundPlayers; \ No newline at end of file diff --git a/assets/js/platformer3x/BackgroundWinter.js b/assets/js/platformer3x/BackgroundWinter.js deleted file mode 100644 index 78face16..00000000 --- a/assets/js/platformer3x/BackgroundWinter.js +++ /dev/null @@ -1,25 +0,0 @@ -import GameEnv from './GameEnv.js'; -import Background from './Background.js'; - -export class BackgroundWinter extends Background { - constructor(canvas, image, data) { - super(canvas, image, data); - - this.parallaxSpeed = 0.4; - } - - // speed is used to background parallax behavior - update() { - this.speed = GameEnv.backgroundDirection * this.parallaxSpeed; - super.update(); - } - - //Cause of limited bg cutout, keeping just incase it causes issues later - draw() { - this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height); - super.draw(); - } - -} - -export default BackgroundWinter; \ No newline at end of file diff --git a/assets/js/platformer3x/GameSetup.js b/assets/js/platformer3x/GameSetup.js index 0ba92ed0..c9f2b36a 100644 --- a/assets/js/platformer3x/GameSetup.js +++ b/assets/js/platformer3x/GameSetup.js @@ -3,14 +3,8 @@ import GameEnv from './GameEnv.js'; import GameLevel from './GameLevel.js'; // To build GameLevels, each contains GameObjects from below imports import Background from './Background.js' -import BackgroundHills from './BackgroundHills.js'; -import BackgroundCoral from './BackgroundCoral.js'; -import BackgroundMountains from './BackgroundMountains.js'; +import BackgroundParallax from './BackgroundParallax.js'; import BackgroundTransitions from './BackgroundTransitions.js'; -import BackgroundClouds from './BackgroundClouds.js'; -import BackgroundFish from './BackgroundFish.js'; -import BackgroundWinter from './BackgroundWinter.js'; -import BackgroundNarwhal from './BackgroundNarwhal.js'; import BackgroundSnow from './BackgroundSnow.js'; import Platform from './Platform.js'; import JumpPlatform from './JumpPlatform.js'; @@ -299,20 +293,20 @@ const GameSetup = { backgrounds: { boss: { src: "/images/platformer/backgrounds/BossBackground.png" }, start: { src: "/images/platformer/backgrounds/home.png" }, - hills: { src: "/images/platformer/backgrounds/hills.png" }, + hills: { src: "/images/platformer/backgrounds/hills.png", parallaxSpeed: 0.4, moveOnKeyAction: true }, greece: { src: "/images/platformer/backgrounds/greek.png" }, - mountains: { src: "/images/platformer/backgrounds/mountains.jpg" }, - clouds: { src: "/images/platformer/backgrounds/clouds.png" }, + mountains: { src: "/images/platformer/backgrounds/mountains.jpg", parallaxSpeed: 0.1, moveOnKeyAction: true }, + clouds: { src: "/images/platformer/backgrounds/clouds.png", parallaxSpeed: 0.5 }, water: { src: "/images/platformer/backgrounds/water.png" }, - fish: { src: "/images/platformer/backgrounds/school-fish.png" }, + fish: { src: "/images/platformer/backgrounds/school-fish.png", parallaxSpeed: -0.5 }, reef: { src: "/images/platformer/backgrounds/reef.png" }, quidditch: { src: "/images/platformer/backgrounds/quidditch2.jpg" }, miniHogwarts: { src: "/images/platformer/backgrounds/miniHogwarts.png"}, space: { src: "/images/platformer/backgrounds/planet.jpg" }, castles: { src: "/images/platformer/backgrounds/castles.png" }, - winter: { src: "/images/platformer/backgrounds/winter.png" }, + winter: { src: "/images/platformer/backgrounds/winter.png", parallaxSpeed: 0.4, moveOnKeyAction: true }, snow: { src: "/images/platformer/backgrounds/snowfall.png" }, - narwhal: { src: "/images/platformer/backgrounds/narwhal.png" }, + narwhal: { src: "/images/platformer/backgrounds/narwhal.png", parallaxSpeed: 2 }, mini: { src: "/images/platformer/backgrounds/mini.png" }, }, transitions: { @@ -657,9 +651,9 @@ const GameSetup = { // Hills Game Level defintion... const allHillsGameObjects = [ - { name: 'mountains', id: 'background', class: BackgroundMountains, data: this.assets.backgrounds.mountains }, - { name: 'clouds', id: 'background', class: BackgroundClouds, data: this.assets.backgrounds.clouds }, - { name: 'hills', id: 'background', class: BackgroundHills, data: this.assets.backgrounds.hills }, + { name: 'mountains', id: 'background', class: BackgroundParallax, data: this.assets.backgrounds.mountains }, + { name: 'clouds', id: 'background', class: BackgroundParallax, data: this.assets.backgrounds.clouds }, + { name: 'hills', id: 'background', class: BackgroundParallax, data: this.assets.backgrounds.hills }, { name: 'grass', id: 'floor', class: Platform, data: this.assets.platforms.grass }, { name: 'blocks', id: 'jumpPlatform', class: MovingPlatform, data: this.assets.platforms.block, xPercentage: 0.2, yPercentage: 0.85 }, { name: 'blocks', id: 'jumpPlatform', class: MovingPlatform, data: this.assets.platforms.block, xPercentage: 0.2368, yPercentage: 0.85 }, @@ -837,8 +831,8 @@ const GameSetup = { // Under Water Game Level defintion... const allWaterGameObjects = [ { name: 'water', id: 'background', class: Background, data: this.assets.backgrounds.water }, - { name: 'fish', id: 'background', class: BackgroundFish, data: this.assets.backgrounds.fish }, - { name: 'reef', id: 'background', class: BackgroundCoral, data: this.assets.backgrounds.reef }, + { name: 'fish', id: 'background', class: BackgroundParallax, data: this.assets.backgrounds.fish }, + { name: 'reef', id: 'background', class: Background, data: this.assets.backgrounds.reef }, { name: 'sand', id: 'floor', class: Platform, data: this.assets.platforms.sand }, { name: 'blocks', id: 'jumpPlatform', class: BlockPlatform, data: this.assets.platforms.block, xPercentage: 0.2, yPercentage: 0.85 }, { name: 'blocks', id: 'jumpPlatform', class: BlockPlatform, data: this.assets.platforms.block, xPercentage: 0.2368, yPercentage: 0.85 }, @@ -996,8 +990,8 @@ const GameSetup = { const winterObjects = [ // GameObject(s), the order is important to z-index... - { name: 'winter', id: 'background', class: BackgroundWinter, data: this.assets.backgrounds.winter }, - { name: 'narwhal', id: 'background', class: BackgroundNarwhal, data: this.assets.backgrounds.narwhal }, + { name: 'winter', id: 'background', class: BackgroundParallax, data: this.assets.backgrounds.winter }, + { name: 'narwhal', id: 'background', class: BackgroundParallax, data: this.assets.backgrounds.narwhal }, { name: 'snow', id: 'background', class: BackgroundSnow, data: this.assets.backgrounds.snow }, { name: 'snowyfloor', id: 'platform', class: Platform, data: this.assets.platforms.snowyfloor }, { name: 'blocks', id: 'jumpPlatform', class: BlockPlatform, data: this.assets.platforms.snowywood, xPercentage: 0.2, yPercentage: 0.82 },