Skip to content

Commit

Permalink
platform initial
Browse files Browse the repository at this point in the history
  • Loading branch information
@NicholasRamos5
NicholasRamos5 committed Aug 1, 2023
1 parent 865e6ac commit 8f39ce4
Showing 1 changed file with 331 additions and 0 deletions.
331 changes: 331 additions & 0 deletions _notebooks/2023-08-01-Mario-Platform.ipynb
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,331 @@
{
"cells": [
{
"cell_type": "code",
"execution_count": 3,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
"<style>\n",
" #canvas {\n",
" margin: 0;\n",
" border: 1px solid black;\n",
" }\n",
"</style>\n",
"<canvas id=\"canvas\"></canvas>\n",
"<script>\n",
" let canvas = document.getElementById('canvas');\n",
" let c = canvas.getContext('2d');\n",
" canvas.width = 770;\n",
" canvas.height = 300;\n",
"\n",
" let gravity = 1.5;\n",
"\n",
" class Player {\n",
" constructor() {\n",
" this.position = {\n",
" x: 100,\n",
" y: 100\n",
" };\n",
" this.velocity = {\n",
" x: 0,\n",
" y: 0\n",
" };\n",
" this.width = 30;\n",
" this.height = 30;\n",
" }\n",
"\n",
" draw() {\n",
" c.fillStyle = 'red';\n",
" c.fillRect(this.position.x, this.position.y, this.width, this.height);\n",
" }\n",
"\n",
" update() {\n",
" this.draw();\n",
" this.position.y += this.velocity.y;\n",
" this.position.x += this.velocity.x;\n",
"\n",
" if (this.position.y + this.height + this.velocity.y <= canvas.height)\n",
" this.velocity.y += gravity;\n",
" else \n",
" this.velocity.y = 0;\n",
" }\n",
" }\n",
"\n",
" class Platform {\n",
" constructor(image) {\n",
" this.position = {\n",
" x: 0,\n",
" y: 200\n",
" }\n",
" this.image = image;\n",
" this.width = 540;\n",
" this.height = 160;\n",
" }\n",
" draw() {\n",
" c.drawImage(this.image, this.position.x, this.position.y);\n",
" }\n",
" }\n",
"\n",
" let image = new Image();\n",
" let platform = new Platform(image);\n",
" player = new Player();\n",
" let keys = {\n",
" right: {\n",
" pressed: false\n",
" },\n",
" left: {\n",
" pressed: false\n",
" }\n",
" }\n",
" if (\n",
" player1.position.y + player1.height <= platform.position.y &&\n",
" player1.position.y + player1.height + player1.velocity.y > platform.position.y &&\n",
" player1.position.x + player1.width >= platform.position.x &&\n",
" player1.position.x <= platform.position.x + platform.width\n",
" ) {\n",
" player1.velocity.y = 0;\n",
" }\n",
"\n",
" function animate() {\n",
" requestAnimationFrame(animate);\n",
" c.clearRect(0, 0, canvas.width, canvas.height);\n",
"\n",
" platform.draw();\n",
" player.update();\n",
"\n",
" if (keys.right.pressed && player.position.x + player.width <= canvas.width - 50) {\n",
" player.velocity.x = 15;\n",
" } else if (keys.left.pressed && player.position.x >= 50) {\n",
" player.velocity.x = -15;\n",
" } else {\n",
" player.velocity.x = 0;\n",
" }\n",
" }\n",
"\n",
" animate();\n",
"\n",
" addEventListener('keydown', ({ keyCode }) => {\n",
" switch (keyCode) {\n",
" case 65:\n",
" console.log('left');\n",
" keys.left.pressed = true;\n",
" break;\n",
" case 83:\n",
" console.log('down');\n",
" break;\n",
" case 68:\n",
" console.log('right');\n",
" keys.right.pressed = true;\n",
" break;\n",
" case 87:\n",
" console.log('up');\n",
" player.velocity.y -= 20;\n",
" break;\n",
" }\n",
" });\n",
"\n",
" addEventListener('keyup', ({ keyCode }) => {\n",
" switch (keyCode) {\n",
" case 65:\n",
" console.log('left');\n",
" keys.left.pressed = false;\n",
" break;\n",
" case 83:\n",
" console.log('down');\n",
" break;\n",
" case 68:\n",
" console.log('right');\n",
" keys.right.pressed = false;\n",
" break;\n",
" case 87:\n",
" console.log('up');\n",
" player.velocity.y = -20;\n",
" break;\n",
" }\n",
" })\n",
"\n",
" image.src = 'https://samayass.github.io/samayaCSA/images/platform.png'\n",
"\n",
"</script>\n"
],
"text/plain": [
"<IPython.core.display.HTML object>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"%%html\n",
"<style>\n",
" #canvas {\n",
" margin: 0;\n",
" border: 1px solid black;\n",
" }\n",
"</style>\n",
"<canvas id=\"canvas\"></canvas>\n",
"<script>\n",
" let canvas = document.getElementById('canvas');\n",
" let c = canvas.getContext('2d');\n",
" canvas.width = 770;\n",
" canvas.height = 300;\n",
"\n",
" let gravity = 1.5;\n",
"\n",
" class Player {\n",
" constructor() {\n",
" this.position = {\n",
" x: 100,\n",
" y: 100\n",
" };\n",
" this.velocity = {\n",
" x: 0,\n",
" y: 0\n",
" };\n",
" this.width = 30;\n",
" this.height = 30;\n",
" }\n",
"\n",
" draw() {\n",
" c.fillStyle = 'red';\n",
" c.fillRect(this.position.x, this.position.y, this.width, this.height);\n",
" }\n",
"\n",
" update() {\n",
" this.draw();\n",
" this.position.y += this.velocity.y;\n",
" this.position.x += this.velocity.x;\n",
"\n",
" if (this.position.y + this.height + this.velocity.y <= canvas.height)\n",
" this.velocity.y += gravity;\n",
" else \n",
" this.velocity.y = 0;\n",
" }\n",
" }\n",
"\n",
" class Platform {\n",
" constructor(image) {\n",
" this.position = {\n",
" x: 0,\n",
" y: 200\n",
" }\n",
" this.image = image;\n",
" this.width = 540;\n",
" this.height = 160;\n",
" }\n",
" draw() {\n",
" c.drawImage(this.image, this.position.x, this.position.y);\n",
" }\n",
" }\n",
"\n",
" let image = new Image();\n",
" let platform = new Platform(image);\n",
" player = new Player();\n",
" let keys = {\n",
" right: {\n",
" pressed: false\n",
" },\n",
" left: {\n",
" pressed: false\n",
" }\n",
" }\n",
" if (\n",
" player1.position.y + player1.height <= platform.position.y &&\n",
" player1.position.y + player1.height + player1.velocity.y > platform.position.y &&\n",
" player1.position.x + player1.width >= platform.position.x &&\n",
" player1.position.x <= platform.position.x + platform.width\n",
" ) {\n",
" player1.velocity.y = 0;\n",
" }\n",
"\n",
" function animate() {\n",
" requestAnimationFrame(animate);\n",
" c.clearRect(0, 0, canvas.width, canvas.height);\n",
"\n",
" platform.draw();\n",
" player.update();\n",
"\n",
" if (keys.right.pressed && player.position.x + player.width <= canvas.width - 50) {\n",
" player.velocity.x = 15;\n",
" } else if (keys.left.pressed && player.position.x >= 50) {\n",
" player.velocity.x = -15;\n",
" } else {\n",
" player.velocity.x = 0;\n",
" }\n",
" }\n",
"\n",
" animate();\n",
"\n",
" addEventListener('keydown', ({ keyCode }) => {\n",
" switch (keyCode) {\n",
" case 65:\n",
" console.log('left');\n",
" keys.left.pressed = true;\n",
" break;\n",
" case 83:\n",
" console.log('down');\n",
" break;\n",
" case 68:\n",
" console.log('right');\n",
" keys.right.pressed = true;\n",
" break;\n",
" case 87:\n",
" console.log('up');\n",
" player.velocity.y -= 20;\n",
" break;\n",
" }\n",
" });\n",
"\n",
" addEventListener('keyup', ({ keyCode }) => {\n",
" switch (keyCode) {\n",
" case 65:\n",
" console.log('left');\n",
" keys.left.pressed = false;\n",
" break;\n",
" case 83:\n",
" console.log('down');\n",
" break;\n",
" case 68:\n",
" console.log('right');\n",
" keys.right.pressed = false;\n",
" break;\n",
" case 87:\n",
" console.log('up');\n",
" player.velocity.y = -20;\n",
" break;\n",
" }\n",
" })\n",
"\n",
" image.src = 'https://samayass.github.io/samayaCSA/images/platform.png'\n",
"\n",
"</script>"
]
}
],
"metadata": {
"kernelspec": {
"display_name": "Python 3",
"language": "python",
"name": "python3"
},
"language_info": {
"codemirror_mode": {
"name": "ipython",
"version": 3
},
"file_extension": ".py",
"mimetype": "text/x-python",
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython3",
"version": "3.10.9"
},
"orig_nbformat": 4
},
"nbformat": 4,
"nbformat_minor": 2
}

0 comments on commit 8f39ce4

Please sign in to comment.