diff --git a/_posts/2023-10-06-Background.md b/_posts/2023-10-06-Background.md index 6d77c53..c0ac6e9 100644 --- a/_posts/2023-10-06-Background.md +++ b/_posts/2023-10-06-Background.md @@ -36,9 +36,9 @@ courses: { compsci: {week: 7} } y: -2000 } var interval = setInterval(function() { - bg1.y +=5; - bg2.y +=5; - bg3.y +=5; + bg1.y +=3; + bg2.y +=3; + bg3.y +=3; if (bg1.y == 2000) { bg1.y = 0; } diff --git a/_posts/2023-10-10-game_framework.md b/_posts/2023-10-10-game_framework.md index 81e3b5c..0b34738 100644 --- a/_posts/2023-10-10-game_framework.md +++ b/_posts/2023-10-10-game_framework.md @@ -44,7 +44,7 @@ comments: False - + @@ -205,13 +205,8 @@ backgroundImg.onload = function () { const defaultFilter = getComputedStyle(document.documentElement).getPropertyValue('--default-canvas-filter'); toggleCanvasEffect.addEventListener("click", function () { if (isFilterEnabled) { -<<<<<<< HEAD - canvas.style.filter = "none"; // remove filter - goblinCanvas.style.filter = "none"; -======= canvas.style.filter = "invert(100%)"; // remove filter dogCanvas.style.filter = "invert(100%)"; ->>>>>>> 1654a8b5be40f12a1f967be7cbdb7eb8c086cc78 } else { canvas.style.filter = defaultFilter; // Apply the default filter value goblinCanvas.style.filter = defaultFilter; diff --git a/_posts/2023-10-11-MainGameFile.md b/_posts/2023-10-11-MainGameFile.md new file mode 100644 index 0000000..dad8a1d --- /dev/null +++ b/_posts/2023-10-11-MainGameFile.md @@ -0,0 +1,130 @@ +--- +layout: post +title: Main Game! +description: Jump with Link! +author: Katelyn Gelle, Gabriel Gravin, Kaden Vo, Daisy Zhang +courses: {'compsci': {'week': 6}} +type: hacks +comments: True +--- + +**Directions** +Freeplay with Link! Use "D" to make him move right, use the "A" to make him move left, and use the space bar to jump. + + + + + Flip or Freeze! + + + + + + \ No newline at end of file diff --git a/_posts/2023-10-11-minigame.md b/_posts/2023-10-11-minigame.md index 0eeeaa3..d2138ca 100644 --- a/_posts/2023-10-11-minigame.md +++ b/_posts/2023-10-11-minigame.md @@ -1,6 +1,6 @@ --- layout: post -title: Freeplay Minigame! +title: Freeplay Minigame ! description: Jump with Link! author: Katelyn Gelle, Gabriel Gravin, Kaden Vo, Daisy Zhang courses: {'compsci': {'week': 6}} @@ -45,6 +45,7 @@ Freeplay with Link! Use "D" to make him move right, use the "A" to make him move let maxFrame = 2; let isMovingLeft = false; let isMovingRight = false; + let isIdle = true; // Function to update sprite animation function updateSpriteAnimation() { if (frameX < maxFrame) { @@ -63,12 +64,14 @@ Freeplay with Link! Use "D" to make him move right, use the "A" to make him move // Function to handle moving left when a is pressed function moveLeft() { isMovingLeft = true; + isIdle = false; frameY = 5; maxFrame = 9; } // Function to handle moving right when d is pressed function moveRight() { isMovingRight = true; + isIdle = false; frameY = 7; maxFrame = 9; } @@ -86,8 +89,6 @@ Freeplay with Link! Use "D" to make him move right, use the "A" to make him move moveLeft(); } else if (event.key === 'd') { moveRight(); - } else { - idle(); } }); // Event listener for key ups diff --git a/_posts/2023-10-12-gameframework_2.md b/_posts/2023-10-12-gameframework_2.md index 4c3d389..5db8f9e 100644 --- a/_posts/2023-10-12-gameframework_2.md +++ b/_posts/2023-10-12-gameframework_2.md @@ -211,7 +211,11 @@ backgroundImg.onload = function () { toggleCanvasEffect.addEventListener("click", function () { if (isFilterEnabled) { canvas.style.filter = "invert(100%)"; // remove filter +<<<<<<< HEAD linkCanvas.style.filter = "invert(100%)"; +======= + goblinCanvas.style.filter = "invert(100%)"; +>>>>>>> f70e2562aa112f946c7cf37a843b8e41d50d92a2 } else { canvas.style.filter = defaultFilter; // Apply the default filter value linkCanvas.style.filter = defaultFilter; diff --git a/_posts/2023-10-12-teamwork.md b/_posts/2023-10-12-teamwork.md index ceb7e2e..81a6d70 100644 --- a/_posts/2023-10-12-teamwork.md +++ b/_posts/2023-10-12-teamwork.md @@ -41,20 +41,85 @@ courses: { compsci: {week: 7} } // Create an array to hold platform information var platforms = []; - // Function to generate random platforms + // Constants for jump behavior + const gravity = 0.5; + const jumpStrength = -10; + + // Function to generate random platforms throughout the screen function generateRandomPlatform() { // Define the platform properties var platform = { - width: 150, // Increased width - height: 20, // Increased height - x: Math.random() * (canvas.width - 150), // Adjusted width - y: -50 // Start platforms off-screen + width: 150, + height: 20, + x: Math.random() * (canvas.width - 150), + y: canvas.height - Math.random() * (canvas.height) // Platforms appear at various vertical positions + }; + platforms.push(platform); + + // Add a trampoline on some platforms randomly + if (Math.random() < 0.2) { // Adjust the probability as needed + var trampoline = { + x: platform.x + platform.width / 2 - 10, // Adjust for the trampoline's width + y: platform.y - 10, // Adjust for the trampoline's height + width: 20, // Adjust to match the trampoline's width + height: 5, // Adjust to match the trampoline's height + }; + platforms.push(trampoline); + } + } + + // Function to generate platforms at the top of the screen + function generateTopPlatform() { + var platform = { + width: 150, + height: 20, + x: Math.random() * (canvas.width - 150), + y: -20 // Platforms appear at the top of the screen + }; + platforms.push(platform); + + // Add a trampoline on some platforms randomly + if (Math.random() < 0.2) { // Adjust the probability as needed + var trampoline = { + x: platform.x + platform.width / 2 - 10, // Adjust for the trampoline's width + y: platform.y - 10, // Adjust for the trampoline's height + width: 20, // Adjust to match the trampoline's width + height: 5, // Adjust to match the trampoline's height + }; + platforms.push(trampoline); + } + } + + // function to generate platforms at bottom of screen + function generateBottomPlatform() { + var platform = { + width: 150, + height: 20, + x: Math.random() * (canvas.width - 150), + y: canvas.height + 20 }; platforms.push(platform); + + // add trampoline on some platforms randomly + if (Math.random() < 0.2) { // Adjust probability as needed + var trampoline = { + x: platform.x + platform/width / 2 - 10, // Adjust for trampoline width + y: platform.y - 10, // Adjust for trampoline height + width: 20, // Adjust to match trampoline width + height: 5, // Adjust to match trampoline height + }; + platforms.push(trampoline); + } } - // Call the platform generation function at regular intervals - setInterval(generateRandomPlatform, 3000); // Adjust the interval as needed + // Call the platform generation function initially to ensure a platform is within jumping distance + generateRandomPlatform(); + + // Call the platform generation function more frequently to have more platforms + setInterval(generateRandomPlatform, 700); // Decreased interval for more platforms + + // Call the top platform generation function at regular intervals + setInterval(generateTopPlatform, 3000); // Platforms at the top every 2 seconds // Main game loop var interval = setInterval(function () { @@ -81,17 +146,23 @@ courses: { compsci: {week: 7} } c.drawImage(bgImage, bg2.x, bg2.y); c.drawImage(bgImage, bg3.x, bg3.y); - // Move and draw the platforms + // Move and draw the platforms, including trampolines platforms.forEach(function (platform) { - platform.y += 5; // Adjust the platform's speed - c.fillStyle = "yellow"; // Changed platform color to yellow - c.fillRect(platform.x, platform.y, platform.width, platform.height); - - // Remove platforms that are off-screen - if (platform.y > canvas.height) { - platforms.splice(platforms.indexOf(platform), 1); + if (platform.width === 20) { + // Draw a green line for the trampoline + c.strokeStyle = "cyan"; + c.lineWidth = 5; + c.beginPath(); + c.moveTo(platform.x, platform.y + 5); + c.lineTo(platform.x + platform.width, platform.y + 5); + c.stroke(); + } else { + // Draw a yellow platform + c.fillStyle = "yellow"; + c.fillRect(platform.x, platform.y, platform.width, platform.height); } + platform.y += 5; }); - }, 50); + }, 90); }; diff --git a/_posts/2023-10-19-minigametest.md b/_posts/2023-10-19-minigametest.md new file mode 100644 index 0000000..023ad77 --- /dev/null +++ b/_posts/2023-10-19-minigametest.md @@ -0,0 +1,148 @@ +--- +layout: post +title: Freeplay Minigame test ! +description: Jump with Link! +courses: {'compsci': {'week': 7}} +type: hacks +comments: True +--- + +**Directions** +Freeplay with Link! Use "D" to make him move right, use the "A" to make him move left, and use "W" to make him jump. + + + + + Flip or Freeze! + + + + + + \ No newline at end of file diff --git a/_posts/2023-10-19-sprite_classes.md b/_posts/2023-10-19-sprite_classes.md new file mode 100644 index 0000000..94e2dc1 --- /dev/null +++ b/_posts/2023-10-19-sprite_classes.md @@ -0,0 +1,181 @@ +--- +toc: false +comments: false +layout: post +title: Platform test +description: Testing platforms for sprites +type: hacks +courses: { compsci: {week: 7} } +--- + + + + + + diff --git a/assets/js/Background.js b/assets/js/Background.js new file mode 100644 index 0000000..85a714b --- /dev/null +++ b/assets/js/Background.js @@ -0,0 +1,22 @@ +class background { + constructor() { + this.bg1 = { + width: 500, + height: 1000, + x: 0, + y: 0 + } + this.bg2 = { + width: 500, + height: 1000, + x: 0, + y: -1000 + } + this.bg3 = { + width: 500, + height: 1000, + x: 0, + y: -2000 + } + } +}; \ No newline at end of file diff --git a/assets/js/Character.js b/assets/js/Character.js new file mode 100644 index 0000000..5e8224a --- /dev/null +++ b/assets/js/Character.js @@ -0,0 +1,20 @@ +export class Character { + constructor(spriteURL, spritewidth, spriteheight, x, y, jump, gravity, maxFrame) { + this.frameX = 0; + this.frameY = 0; + this.maxFrame = maxFrame; + this.spriteX = x; + this.spriteY = y; + this.spritewidth = spritewidth; + this.spriteheight = spriteheight; + this.isMovingLeft = false; + this.isMovingRight = false; + this.isJumping = false; + this.isIdle = true; + this.spriteImage = new Image(); + this.spriteImage.src = spriteURL; + this.spriteVelocityY = 0; + this.gravity = gravity; + this.jumpStrength = jump; + } +}; \ No newline at end of file diff --git a/assets/js/GameObject.js b/assets/js/GameObject.js new file mode 100644 index 0000000..b78ae03 --- /dev/null +++ b/assets/js/GameObject.js @@ -0,0 +1,11 @@ +export class gameObject { + constructor(canvas, image,) { + this.x = 0; + this.y = 0; + this.canvas = canvas; + this.ctx = getContext('2D'); + this.image = image; + this.width = image.width; + this.height = image.height; + } +}; \ No newline at end of file diff --git a/images/bubbleyum.png b/images/bubbleyum.png new file mode 100644 index 0000000..6ef3f56 Binary files /dev/null and b/images/bubbleyum.png differ diff --git a/images/starburst.png b/images/starburst.png new file mode 100644 index 0000000..ce9a313 Binary files /dev/null and b/images/starburst.png differ diff --git a/images/throneroom.jpeg b/images/throneroom.jpeg new file mode 100644 index 0000000..9f179ce Binary files /dev/null and b/images/throneroom.jpeg differ diff --git a/scripts/__pycache__/convert_notebooks.cpython-310.pyc b/scripts/__pycache__/convert_notebooks.cpython-310.pyc index d8addb8..5e21285 100644 Binary files a/scripts/__pycache__/convert_notebooks.cpython-310.pyc and b/scripts/__pycache__/convert_notebooks.cpython-310.pyc differ