{"id":577,"date":"2025-02-27T07:12:54","date_gmt":"2025-02-27T07:12:54","guid":{"rendered":"https:\/\/kreisberger-helena.web.kslinz.at\/kreisberger.h2024\/?page_id=577"},"modified":"2025-03-20T06:56:31","modified_gmt":"2025-03-20T06:56:31","slug":"spieleprojekte-javascript","status":"publish","type":"page","link":"https:\/\/kreisberger-helena.webserver.kslinz.at\/kreisberger.h2024\/index.php\/spieleprojekte-javascript\/","title":{"rendered":"Spieleprojekte JavaScript"},"content":{"rendered":"\n

<\/p>\n\n\n\n

<\/h2>\n\n\n\n
\n
\n
\n
\n
\n
Flappy Bird<\/h2>\n<\/div>\n<\/div>\n\n\n\n
\n
\n
<\/iframe><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p>Dr\u00fccke die <strong>Leertaste<\/strong>, um den Vogel in der Luft zu halten. Jeder Tastendruck l\u00e4sst ihn kurz nach oben flattern, bevor er wieder sinkt. Navigiere ihn durch enge L\u00fccken zwischen gr\u00fcnen R\u00f6hren, ohne sie zu ber\u00fchren. Kollidierst du mit einer R\u00f6hre oder dem Boden, ist das Spiel vorbei. F\u00fcr jede erfolgreich durchflogene L\u00fccke erh\u00e4ltst du einen Punkt.<\/p>\n\n\n\n<p><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div><\/div>\n\n\n\n<div class=\"wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-6c531013 wp-block-group-is-layout-flex\">\n<div class=\"wp-block-group is-nowrap is-layout-flex wp-container-core-group-is-layout-6c531013 wp-block-group-is-layout-flex\">\n<p class=\"has-text-align-left\"><\/p>\n<\/div>\n\n\n\n<p><\/p>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\"> Snake<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-gutenbergp5-p5js gutenbergp5-align-center\"><iframe srcdoc=\"\n <!DOCTYPE html>\n <html>\n <body style="padding: 0; margin: 0;"><\/body>\n <script src="https:\/\/kreisberger-helena.web.kslinz.at\/kreisberger.h2024\/wp-content\/plugins\/easy-p5-js-block\/\/assets\/js\/p5.min.js"><\/script>\n <script>\n let snake = [];\nlet direction = [0, 0]; \/\/ Bewegungsrichtung als Array [x,y]\nlet food;\nlet gridSize = 20;\nlet resolution = 20; \/\/ Pixelgr\u00f6\u00dfe\nlet hasEaten = false;\nlet headPosition;\nlet score;\nlet restartButton;\n\nfunction setup() {\n createCanvas(400, 400);\n frameRate(7);\n\n snake.push([floor(gridSize \/ 2), floor(gridSize \/ 2)]);\n spawnFood();\n score = 0;\n\n \/\/ Neustart-Button erstellen (zuerst versteckt)\n restartButton = createButton("Neu Start");\n restartButton.position(width \/ 2 - 40, height \/ 2 + 40);\n restartButton.mousePressed(resetGame);\n restartButton.hide();\n}\n\nfunction draw() {\n background(220);\n fill(0);\n textSize(16);\n text("Score: " + String(score), 30, 30);\n\n drawGrid();\n\n fill("#674F2D");\n rect(food[0] * resolution, food[1] * resolution, resolution, resolution);\n updateSnake();\n drawSnake();\n\n headPosition = snake[snake.length - 1];\n if (headPosition[0] == food[0] && headPosition[1] == food[1]) {\n hasEaten = true;\n score++;\n spawnFood();\n }\n\n if (isDead()) {\n endGame();\n }\n}\n\nfunction endGame() {\n noLoop();\n restartButton.show(); \/\/ Neustart-Button anzeigen\n textAlign(CENTER, CENTER);\n textSize(32);\n fill(0);\n text("Game Over", width \/ 2, height \/ 2);\n}\n\nfunction resetGame() {\n snake = [[floor(gridSize \/ 2), floor(gridSize \/ 2)]];\n direction = [0, 0];\n score = 0;\n hasEaten = false;\n spawnFood();\n restartButton.hide(); \/\/ Button verstecken\n loop();\n}\n\nfunction isDead() {\n let head = snake[snake.length - 1];\n\n if (head[0] < 0 || head[0] >= gridSize || head[1] < 0 || head[1] >= gridSize) {\n return true;\n }\n\n for (let i = 0; i < snake.length - 1; i++) {\n if (snake[i][0] == head[0] && snake[i][1] == head[1]) {\n return true;\n }\n }\n return false;\n}\n\nfunction drawSnake() {\n for (let i = 0; i < snake.length; i++) {\n fill("#CFB997");\n rect(snake[i][0] * resolution, snake[i][1] * resolution, resolution, resolution);\n }\n}\n\nfunction updateSnake() {\n if (direction[0] == 0 && direction[1] == 0) {\n return;\n }\n\n let head = [\n snake[snake.length - 1][0] + direction[0],\n snake[snake.length - 1][1] + direction[1]\n ];\n\n snake.push(head);\n\n if (!hasEaten) {\n snake.shift();\n } else {\n hasEaten = false;\n }\n}\n\nfunction drawGrid() {\n stroke("#91683C");\n for (let i = 0; i < gridSize; i++) {\n line(i * resolution, 0, i * resolution, height);\n line(0, i * resolution, width, i * resolution);\n }\n}\n\nfunction spawnFood() {\n food = [floor(random(gridSize)), floor(random(gridSize))];\n}\n\nfunction keyPressed() {\n if (key == "W" || key == "w") {\n if (direction[1] == 0) {\n direction = [0, -1];\n }\n } else if (key == "S" || key == "s") {\n if (direction[1] == 0) {\n direction = [0, 1];\n }\n } else if (key == "A" || key == "a") {\n if (direction[0] == 0) {\n direction = [-1, 0];\n }\n } else if (key == "D" || key == "d") {\n if (direction[0] == 0) {\n direction = [1, 0];\n }\n }\n}\n\n <\/script>\n <\/html>\" sandbox=\"allow-scripts allow-same-origin\" scrolling=\"no\" style=\"overflow:hidden;\" width=\"\" height=\"\" class=\"\" title=\"p5.js canvas\"><\/iframe><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p>Steuere die Schlange mit <strong>W, A, S und D<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>W<\/strong> f\u00fcr oben<\/li>\n\n\n\n<li><strong>A<\/strong> f\u00fcr links<\/li>\n\n\n\n<li><strong>S<\/strong> f\u00fcr unten<\/li>\n\n\n\n<li><strong>D<\/strong> f\u00fcr rechts<\/li>\n<\/ul>\n\n\n\n<p>Bewege die Schlange, um Futter einzusammeln und zu wachsen. Vermeide Kollisionen mit den W\u00e4nden und deinem eigenen K\u00f6rper \u2013 sonst ist das Spiel vorbei. Ziel ist es, so lange wie m\u00f6glich zu \u00fcberleben und eine lange Schlange zu bilden<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"> Tiktakto<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-gutenbergp5-p5js gutenbergp5-align-center\"><iframe srcdoc=\"\n <!DOCTYPE html>\n <html>\n <body style="padding: 0; margin: 0;"><\/body>\n <script src="https:\/\/kreisberger-helena.web.kslinz.at\/kreisberger.h2024\/wp-content\/plugins\/easy-p5-js-block\/\/assets\/js\/p5.min.js"><\/script>\n <script>\n \n\/\/f\u00fcr website\n\nlet board;\nlet currentPlayer;\nlet gameOver;\nlet winnerMessage = "";\n \nfunction setup() {\n createCanvas(400, 400);\n currentPlayer = "X";\n gameOver = false;\n winnerMessage = ""; \/\/ Nachricht f\u00fcr den Gewinner\n board = [\n ["", "", ""],\n ["", "", ""],\n ["", "", ""]\n ];\n}\n \nfunction draw() {\n drawBackground();\n drawBoard();\n \n if (!gameOver) {\n checkWinner();\n } else {\n \/\/ Zeige die Gewinner- oder Unentschiedenmeldung dauerhaft an\n displayWinnerMessage();\n }\n}\n \nfunction drawBackground() {\n \/\/ Farbverlauf\n for (let i = 0; i < height; i++) {\n let inter = map(i, 0, height, 0, 1);\n let c = lerpColor(color('#A9957B'), color("#F5F5DC"), inter);\n stroke(c);\n line(0, i, width, i);\n }\n}\n \nfunction drawBoard() {\n \/\/ Raster\n strokeWeight(8);\n stroke(50, 50, 50, 150);\n for (let i = 1; i < 3; i++) {\n line(i * width \/ 3, 0, i * width \/ 3, height);\n line(0, i * height \/ 3, width, i * height \/ 3);\n }\n \n \/\/ Xs und Os\n textSize(64);\n textAlign(CENTER, CENTER);\n textFont("Arial");\n \n for (let row = 0; row < 3; row++) {\n for (let col = 0; col < 3; col++) {\n let x = col * width \/ 3 + width \/ 6;\n let y = row * height \/ 3 + height \/ 6;\n \n if (board[row][col] === "X") {\n fill("white");\n noStroke();\n text(board[row][col], x, y);\n } else if (board[row][col] === "O") {\n fill("#5E503F");\n noStroke();\n text(board[row][col], x, y);\n }\n }\n }\n}\n \nfunction mousePressed() {\n if (gameOver) {\n return;\n }\n \n let row;\n let col;\n \n if (mouseY < height \/ 3) {\n row = 0;\n } else if (mouseY < (height \/ 3) * 2) {\n row = 1;\n } else if (mouseY < height) {\n row = 2;\n }\n \n if (mouseX < width \/ 3) {\n col = 0;\n } else if (mouseX < (width \/ 3) * 2) {\n col = 1;\n } else if (mouseX < width) {\n col = 2;\n }\n \n if (board[row][col] == "") {\n board[row][col] = currentPlayer;\n \n if (currentPlayer == "X") {\n currentPlayer = "O";\n } else {\n currentPlayer = "X"\n }\n \n }\n \n \/\/console.log(board[0])\n \/\/console.log(board[1])\n \/\/console.log(board[2])\n}\n \nfunction checkWinner() {\n let winner = null;\n \n \/\/ Reihen und Spalten pr\u00fcfen\n for (let i = 0; i < 3; i++) {\n if (board[i][0] !== "" && board[i][0] === board[i][1] && board[i][1] === board[i][2]) {\n winner = board[i][0];\n }\n if (board[0][i] !== "" && board[0][i] === board[1][i] && board[1][i] === board[2][i]) {\n winner = board[0][i];\n }\n }\n \n \/\/ Diagonalen pr\u00fcfen\n if (board[0][0] !== "" && board[0][0] === board[1][1] && board[1][1] === board[2][2]) {\n winner = board[0][0];\n }\n if (board[0][2] !== "" && board[0][2] === board[1][1] && board[1][1] === board[2][0]) {\n winner = board[0][2];\n }\n \n \/\/ Unentschieden pr\u00fcfen\n let openSpots = 0;\n for (let row = 0; row < 3; row++) {\n for (let col = 0; col < 3; col++) {\n if (board[row][col] === "") {\n openSpots++;\n }\n }\n }\n \n \/\/ Gewinner oder Unentschieden anzeigen\n if (winner) {\n winnerMessage = winner + " gewinnt!";\n gameOver = true;\n } else if (openSpots === 0) {\n winnerMessage = "Unentschieden!";\n gameOver = true;\n }\n}\n \nfunction displayWinnerMessage() {\n textSize(40);\n textFont("Arial");\n fill("#0A0908");\n noStroke();\n text(winnerMessage, width \/ 2, height \/ 2);\n}\n \n \n \n \n <\/script>\n <\/html>\" sandbox=\"allow-scripts allow-same-origin\" scrolling=\"no\" style=\"overflow:hidden;\" width=\"\" height=\"\" class=\"\" title=\"p5.js canvas\"><\/iframe><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p>Klicke mit der <strong>Maus<\/strong> auf ein freies Feld, um dein Symbol (<strong>X<\/strong> oder <strong>O<\/strong>) zu platzieren.<\/p>\n\n\n\n<p>Das Ziel ist es, drei deiner Symbole in einer <strong>Reihe, Spalte oder Diagonale<\/strong> zu setzen, bevor dein Gegner es schafft. Ist das Spielfeld voll und niemand hat drei in einer Reihe, endet das Spiel unentschieden.<\/p>\n<\/div>\n<\/div>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">MineSwiper<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-gutenbergp5-p5js gutenbergp5-align-center\"><iframe srcdoc=\"\n <!DOCTYPE html>\n <html>\n <body style="padding: 0; margin: 0;"><\/body>\n <script src="https:\/\/kreisberger-helena.web.kslinz.at\/kreisberger.h2024\/wp-content\/plugins\/easy-p5-js-block\/\/assets\/js\/p5.min.js"><\/script>\n <script>\n let cols, rows;\nlet w = 40; \/\/ Gr\u00f6\u00dfe der Zellen\nlet grid = [];\nlet mines = [];\nlet revealed = [];\nlet flagged = [];\nlet mineCount = 10;\nlet gameOver = false;\nlet won = false;\n \nfunction setup() {\n createCanvas(400, 400);\n cols = floor(width \/ w);\n rows = floor(height \/ w);\n \n canvas.oncontextmenu = function (e) { \/\/Unterdr\u00fccken des Kontextmen\u00fcs, Rechtsklick\n e.preventDefault();\n };\n \n \n for (let i = 0; i < rows; i++) { \/\/Variablen f\u00fcllen mit dynamischen Spalten und Zeilen,\n grid[i] = [];\n mines[i] = [];\n revealed[i] = [];\n flagged[i] = [];\n for (let j = 0; j < cols; j++) { \/\/ Standwardwerte setzen\n grid[i][j] = 0;\n mines[i][j] = false;\n revealed[i][j] = false;\n flagged[i][j] = false;\n }\n }\n \n \/\/ Minen zuf\u00e4llig platzieren\n for (let n = 0; n < mineCount; n++) {\n let i, j;\n do {\n i = floor(random(cols));\n j = floor(random(rows));\n } while (mines[i][j]); \/\/Mine neu platzieren falls Feld schon Besetzt\n mines[i][j] = true;\n }\n \n \/\/ Zahlen berechnen\n for (let i = 0; i < rows; i++) {\n for (let j = 0; j < cols; j++) {\n if (!mines[i][j]) {\n let count = 0;\n for (let xOff = -1; xOff <= 1; xOff++) {\n for (let yOff = -1; yOff <= 1; yOff++) {\n let ni = i + xOff;\n let nj = j + yOff;\n if (ni >= 0 && ni < cols && nj >= 0 && nj < rows && mines[ni][nj]) {\n count++;\n }\n }\n }\n grid[i][j] = count;\n }\n }\n }\n}\n \nfunction draw() {\n background(220);\n if (gameOver) {\n fill("#E8DCCA");\n textSize(32);\n textAlign(CENTER, CENTER);\n text("Game Over", width \/ 2, height \/ 2);\n return;\n }\n \n if (won) {\n fill(0, 255, 0);\n textSize(32);\n textAlign(CENTER, CENTER);\n text("You Win!", width \/ 2, height \/ 2);\n return;\n }\n \n for (let i = 0; i < cols; i++) {\n for (let j = 0; j < rows; j++) {\n stroke(0);\n fill(200);\n rect(i * w, j * w, w, w);\n \n if (flagged[i][j]) {\n fill(255, 255, 0);\n triangle(i * w + w * 0.2, j * w + w * 0.8, i * w + w * 0.5, j * w + w * 0.2, i * w + w * 0.8, j * w + w * 0.8);\n } else if (revealed[i][j]) {\n if (mines[i][j]) {\n fill(255, 0, 0);\n ellipse(i * w + w \/ 2, j * w + w \/ 2, w * 0.5);\n } else {\n fill(255);\n rect(i * w, j * w, w, w);\n if (grid[i][j] > 0) {\n fill(0);\n textSize(16);\n textAlign(CENTER, CENTER);\n text(grid[i][j], i * w + w \/ 2, j * w + w \/ 2);\n }\n }\n }\n }\n }\n checkWin();\n}\n \nfunction mousePressed() {\n if (gameOver || won) return;\n let i = floor(mouseX \/ w);\n let j = floor(mouseY \/ w);\n if (i >= 0 && i < cols && j >= 0 && j < rows) {\n if (mouseButton === LEFT) {\n if (mines[i][j]) {\n gameOver = true;\n }\n reveal(i, j);\n } else if (mouseButton === RIGHT) {\n flagged[i][j] = !flagged[i][j];\n }\n }\n}\n \nfunction reveal(i, j) {\n if (i < 0 || i >= cols || j < 0 || j >= rows || revealed[i][j] || flagged[i][j]) {\n return;\n }\n revealed[i][j] = true;\n if (grid[i][j] === 0) {\n for (let xOff = -1; xOff <= 1; xOff++) {\n for (let yOff = -1; yOff <= 1; yOff++) {\n reveal(i + xOff, j + yOff);\n }\n }\n }\n}\n \nfunction checkWin() {\n let unrevealedCount = 0;\n for (let i = 0; i < cols; i++) {\n for (let j = 0; j < rows; j++) {\n if (!revealed[i][j] && !mines[i][j]) {\n unrevealedCount++;\n }\n }\n }\n if (unrevealedCount == 0) {\n won = true;\n }\n}\n <\/script>\n <\/html>\" sandbox=\"allow-scripts allow-same-origin\" scrolling=\"no\" style=\"overflow:hidden;\" width=\"\" height=\"\" class=\"\" title=\"p5.js canvas\"><\/iframe><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p>In <strong>MineSweeper<\/strong> klickst du auf Felder, um sie zu \u00f6ffnen. Zeigt ein Feld eine Zahl, verr\u00e4t sie dir, wie viele Minen in den benachbarten Feldern sind. Klicke auf leere Felder, um benachbarte Felder automatisch zu \u00f6ffnen. Setze mit <strong>Rechtsklick<\/strong> Warnsymbole, um Minen zu markieren. Dein Ziel ist es, alle Felder ohne Minen zu \u00f6ffnen. Wenn du auf eine Mine klickst, verlierst du<\/p>\n<\/div>\n<\/div>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">DodgeMaster<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-gutenbergp5-p5js gutenbergp5-align-center\"><iframe srcdoc=\"\n <!DOCTYPE html>\n <html>\n <body style="padding: 0; margin: 0;"><\/body>\n <script src="https:\/\/kreisberger-helena.web.kslinz.at\/kreisberger.h2024\/wp-content\/plugins\/easy-p5-js-block\/\/assets\/js\/p5.min.js"><\/script>\n <script>\n \/\/ Variablen f\u00fcr den Spieler\nlet playerX = 50;\nlet playerY = 200;\nlet playerWidth = 50;\nlet playerHeight = 50;\nlet playerSpeed = 5;\n\n\/\/ Variablen f\u00fcr Hindernisse\nlet obstacles = [];\nlet obstacleWidth = 50;\nlet obstacleSpeed = 4;\nlet obstacleGap = 200;\nlet lastObstacleType = null;\nlet frameCountSpeed = 80;\nlet scoreChange = 10;\n\n\/\/ Variable f\u00fcr den Score\nlet score = 0;\nlet gameOver = false;\nlet restartButton;\n\nfunction setup() {\n createCanvas(600, 400);\n restartButton = createButton("Neustart");\n restartButton.position(width \/ 2 - 40, height \/ 2 + 20);\n restartButton.mousePressed(resetGame);\n restartButton.hide();\n}\n\nfunction draw() {\n background(200);\n\n if (!gameOver) {\n \/\/ Spieler aktualisieren\n if (keyIsDown(UP_ARROW) && playerY > 0) {\n playerY -= playerSpeed;\n }\n if (keyIsDown(87) && playerY > 0) { \/\/ W =\n playerY -= playerSpeed; \/\/ Bewegt den Spieler nach oben\n }\n \n if (keyIsDown(83) && playerY < height - playerHeight) { \/\/ S \n playerY += playerSpeed; \/\/ Bewegt den Spieler nach unten\n }\n\n fill("#E8DCCA");\n rect(playerX, playerY, playerWidth, playerHeight);\n\n \/\/ Hindernisse aktualisieren\n if (frameCount % 60 == 0) {\n obstacles.push(createObstacle());\n }\n\n for (let i = obstacles.length - 1; i >= 0; i--) {\n obstacles[i][0] -= obstacleSpeed;\n\n fill("#A9957B");\n rect(obstacles[i][0], obstacles[i][1], obstacleWidth, obstacles[i][2] - obstacles[i][1]);\n\n \/\/ Kollisionserkennung\n if (\n playerX + playerWidth > obstacles[i][0] &&\n playerX < obstacles[i][0] + obstacleWidth &&\n playerY < obstacles[i][2] &&\n playerY + playerHeight > obstacles[i][1]\n ) {\n gameOver = true;\n restartButton.show();\n noLoop();\n textSize(32);\n textAlign(CENTER, CENTER);\n fill(0);\n text("Game Over", width \/ 2, height \/ 2);\n }\n\n \/\/ Hindernisse entfernen und Punkte vergeben\n if (obstacles[i][0] + obstacleWidth < 0) {\n obstacles.splice(i, 1);\n score++;\n }\n }\n\n \/\/ Score anzeigen\n textAlign(LEFT, CENTER);\n fill(0);\n textSize(16);\n text("Score: " + score, 10, 20);\n\n if (score == scoreChange) {\n obstacleSpeed += 2;\n playerSpeed += 2;\n scoreChange += 5;\n }\n }\n}\n\nfunction createObstacle() {\n let positionType;\n\n if (lastObstacleType === "top") {\n positionType = "bottom";\n } else if (lastObstacleType === "bottom") {\n positionType = "middle";\n } else {\n positionType = "top";\n }\n\n lastObstacleType = positionType;\n\n if (positionType === "top") {\n let topHeight = random(250, 150);\n return [width, 0, topHeight];\n } else if (positionType === "bottom") {\n let bottomStart = height - random(250, 150);\n return [width, bottomStart, height];\n } else {\n let topHeight = random(20, height \/ 2);\n let bottomHeight = topHeight + random(200, 150);\n return [width, topHeight, bottomHeight];\n }\n}\n\nfunction resetGame() {\n playerX = 50;\n playerY = 200;\n obstacles = [];\n score = 0;\n obstacleSpeed = 4;\n playerSpeed = 5;\n gameOver = false;\n restartButton.hide();\n loop();\n}\n\n <\/script>\n <\/html>\" sandbox=\"allow-scripts allow-same-origin\" scrolling=\"no\" style=\"overflow:hidden;\" width=\"\" height=\"\" class=\"\" title=\"p5.js canvas\"><\/iframe><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p>Um das Spiel zu spielen, steuerst du den Spieler mit den <strong>W & S<\/strong>. Dr\u00fcckst du <strong>W<\/strong> , bewegt sich der Spieler nach oben, und dr\u00fcckst du <strong>S<\/strong>, bewegt er sich nach unten. Dein Ziel ist es, Hindernissen auszuweichen, die sich von rechts nach links \u00fcber den Bildschirm bewegen. Wenn der Spieler mit einem Hindernis kollidiert, endet das Spiel sofort, und es erscheint der <strong>„Game Over“-Text<\/strong>. Du kannst das Spiel wieder starten, indem du auf den <strong>„Neustart“-Button<\/strong> klickst, der nach dem Spielende eingeblendet wird<\/p>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Flappy Bird Dr\u00fccke die Leertaste, um den Vogel in der Luft zu halten. Jeder Tastendruck l\u00e4sst ihn kurz nach oben flattern, bevor er wieder sinkt. Navigiere ihn durch enge L\u00fccken […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pgc_sgb_lightbox_settings":"","footnotes":""},"class_list":["post-577","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/kreisberger-helena.webserver.kslinz.at\/kreisberger.h2024\/index.php\/wp-json\/wp\/v2\/pages\/577","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kreisberger-helena.webserver.kslinz.at\/kreisberger.h2024\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/kreisberger-helena.webserver.kslinz.at\/kreisberger.h2024\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/kreisberger-helena.webserver.kslinz.at\/kreisberger.h2024\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kreisberger-helena.webserver.kslinz.at\/kreisberger.h2024\/index.php\/wp-json\/wp\/v2\/comments?post=577"}],"version-history":[{"count":47,"href":"https:\/\/kreisberger-helena.webserver.kslinz.at\/kreisberger.h2024\/index.php\/wp-json\/wp\/v2\/pages\/577\/revisions"}],"predecessor-version":[{"id":644,"href":"https:\/\/kreisberger-helena.webserver.kslinz.at\/kreisberger.h2024\/index.php\/wp-json\/wp\/v2\/pages\/577\/revisions\/644"}],"wp:attachment":[{"href":"https:\/\/kreisberger-helena.webserver.kslinz.at\/kreisberger.h2024\/index.php\/wp-json\/wp\/v2\/media?parent=577"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}