diff --git a/Gemini_Generated_Image_60mila60mila60mi.png b/Gemini_Generated_Image_60mila60mila60mi.png deleted file mode 100644 index 67c48ad..0000000 Binary files a/Gemini_Generated_Image_60mila60mila60mi.png and /dev/null differ diff --git a/Gemini_Generated_Image_bw4vqvbw4vqvbw4v.png b/Gemini_Generated_Image_bw4vqvbw4vqvbw4v.png deleted file mode 100644 index 1cd6eaf..0000000 Binary files a/Gemini_Generated_Image_bw4vqvbw4vqvbw4v.png and /dev/null differ diff --git a/Gemini_Generated_Image_d2uiz4d2uiz4d2ui.png b/Gemini_Generated_Image_d2uiz4d2uiz4d2ui.png deleted file mode 100644 index 35ce726..0000000 Binary files a/Gemini_Generated_Image_d2uiz4d2uiz4d2ui.png and /dev/null differ diff --git a/Gemini_Generated_Image_kefpnykefpnykefp.png b/Gemini_Generated_Image_kefpnykefpnykefp.png deleted file mode 100644 index 7d6057f..0000000 Binary files a/Gemini_Generated_Image_kefpnykefpnykefp.png and /dev/null differ diff --git a/customer_right.png b/customer_right.png deleted file mode 100644 index 358540d..0000000 Binary files a/customer_right.png and /dev/null differ diff --git a/cuttingboard.png b/cuttingboard.png new file mode 100644 index 0000000..4e71c1f Binary files /dev/null and b/cuttingboard.png differ diff --git a/grass_generated.png b/grass_generated.png deleted file mode 100644 index 58c7efd..0000000 Binary files a/grass_generated.png and /dev/null differ diff --git a/ice_generated.png b/ice_generated.png deleted file mode 100644 index b03eb4c..0000000 Binary files a/ice_generated.png and /dev/null differ diff --git a/index.html b/index.html index a10d7d6..7993e0d 100644 --- a/index.html +++ b/index.html @@ -25,6 +25,8 @@
  • Ice:
  • Cups:
  • + +
    diff --git a/index.js b/index.js index d78028b..3f2952f 100644 --- a/index.js +++ b/index.js @@ -66,11 +66,23 @@ const sprites = { ice: createSprite({ source: 'ice.png' }), + pitcher: createSprite({ + source: 'pitcher_full.png' + }), lemons: createSprite({ source: 'lemons.png' }), grass: createSprite({ source: 'grass.png' + }), + tree: createSprite({ + source: 'tree.png' + }), + slide: createSprite({ + source: 'slide.png' + }), + seesaw: createSprite({ + source: 'seesaw.png' }) }; @@ -112,10 +124,10 @@ function createCup(x, y, scale = 0.1) { // Game objects const cups = [ - createCup(455, 250), - createCup(485, 250), - createCup(515, 250), - createCup(545, 250), + createCup(455, 325, 0.15), + createCup(495, 325, 0.15), + createCup(535, 325, 0.15), + createCup(575, 325, 0.15), ] @@ -237,28 +249,54 @@ function drawInstance(instance) { function drawGround() { if (!sprites.grass.ready) return; - const pattern = ctx.createPattern(sprites.grass.image, 'repeat') + const pattern = ctx.createPattern(sprites.grass.image, 'repeat'); ctx.fillStyle = pattern; const groundHeight = 250; - ctx.fillRect(0, canvas.height - groundHeight, canvas.width, groundHeight) + ctx.fillRect(0, canvas.height - groundHeight, canvas.width, groundHeight); +} + +/** + * Draws an oval shadow. + * + * @param {number} x - Center x position + * @param {number} y - Center y position + * @param {number} radiusX - Horizontal radius + * @param {number} radiusY - Vertical radius + * @param {string} [color='rgba(0, 0, 0, 0.25)'] - Shadow color + */ +function drawShadow(x, y, radiusX, radiusY, color = 'rgba(0, 0, 0, 0.3)') { + ctx.beginPath(); + ctx.ellipse(x, y, radiusX, radiusY, 0, 0, Math.PI * 2); + ctx.fillStyle = color; + ctx.fill(); } function render() { ctx.clearRect(0, 0, canvas.width, canvas.height); drawGround(); + drawSprite(sprites.tree, 600, 50, 0.25); + drawSprite(sprites.tree, 200, 50, 0.2); + + // Slide on the right + drawSprite(sprites.slide, 880, 80, 0.4); + + // Seesaw + drawSprite(sprites.seesaw, 200, 280, 0.30); + - drawSprite(sprites.maker, 430, 140, 0.4); - drawSprite(sprites.stand, 350, 50, 0.5); - drawSprite(sprites.ice, 550, 190, 0.125); + // Shadow under the stand + drawShadow(500, 360, 180, 50); + + drawSprite(sprites.maker, 430, 160, 0.6); + drawSprite(sprites.stand, 350, 50, 0.7); + drawSprite(sprites.pitcher, 620, 290, 0.3); // Draw all cup instances cups.forEach(cup => drawInstance(cup)); - drawSprite(sprites.lemons, 360, 220, 0.1); - } render(); @@ -268,5 +306,4 @@ setTimeout(() => { cups[0].fill(); sprites.maker.frameIndex = 1; render(); - }, 1000); diff --git a/knife.png b/knife.png new file mode 100644 index 0000000..64860a4 Binary files /dev/null and b/knife.png differ diff --git a/person_generated.png b/person_generated.png deleted file mode 100644 index 0d9aee4..0000000 Binary files a/person_generated.png and /dev/null differ diff --git a/pitcher_full.png b/pitcher_full.png new file mode 100644 index 0000000..6c52d36 Binary files /dev/null and b/pitcher_full.png differ diff --git a/seesaw.png b/seesaw.png new file mode 100644 index 0000000..65106da Binary files /dev/null and b/seesaw.png differ diff --git a/signpost.png b/signpost.png new file mode 100644 index 0000000..8c76458 Binary files /dev/null and b/signpost.png differ diff --git a/slide.png b/slide.png new file mode 100644 index 0000000..a756769 Binary files /dev/null and b/slide.png differ diff --git a/stand.jpg b/stand.jpg deleted file mode 100644 index 347c592..0000000 Binary files a/stand.jpg and /dev/null differ diff --git a/style.css b/style.css index 50dc2e5..7afb521 100644 --- a/style.css +++ b/style.css @@ -64,3 +64,30 @@ canvas { display: block; pointer-events: none; } + +.go-shopping-btn { + font-family: 'Fredoka', sans-serif; + font-size: 16px; + font-weight: 600; + background: linear-gradient(180deg, #FDB813 0%, #f5a800 100%); + color: #5C4632; + border: 3px solid #3f7a33; + border-radius: 12px; + padding: 10px 20px; + cursor: pointer; + box-shadow: 0 4px 0 #3f7a33; + transition: all 0.1s ease; + margin: 12px auto 0; + display: block; +} + +.go-shopping-btn:hover { + background: linear-gradient(180deg, #ffe066 0%, #FDB813 100%); + transform: translateY(-2px); + box-shadow: 0 6px 0 #3f7a33; +} + +.go-shopping-btn:active { + transform: translateY(2px); + box-shadow: 0 2px 0 #3f7a33; +} diff --git a/tree.png b/tree.png new file mode 100644 index 0000000..86c8f72 Binary files /dev/null and b/tree.png differ diff --git a/tree_generated.png b/tree_generated.png deleted file mode 100644 index 5193a96..0000000 Binary files a/tree_generated.png and /dev/null differ diff --git a/white_stand.png b/white_stand.png deleted file mode 100644 index dabe5e7..0000000 Binary files a/white_stand.png and /dev/null differ diff --git a/white_stand_1.png b/white_stand_1.png deleted file mode 100644 index 3640f30..0000000 Binary files a/white_stand_1.png and /dev/null differ