{"name": "write", "parameters": {"content": "<style>\n/* Add some basic styling to the canvas */\nbody {\ background-color: #f0f0f0;\ }\n#canvas {\ border: 1px solid #000;\ }\n</style>\n\n<script>\n// Get the canvas element\nvar canvas = document.getElementById('canvas');\nvar ctx = canvas.getContext('2d');\n\n// Set the canvas dimensions\ncanvas.width = 400;\ncanvas.height = 400;\n\n// Function to generate a random maze using the recursive backtracker algorithm\nfunction generateMaze() {\n var cells = [];\n for (var x = 0; x < 20; x++) {\n cells[x] = [];\n for (var y = 0; y < 20; y++) {\n cells[x][y] = {\n x: x,\n y: y,\n visited: false,\n walls: {\n top: true,\n right: true,\n bottom: true,\n left: true\n }\n };\n }\n }\n\n var stack = [];\n cells[10][10].visited = true;\n stack.push(cells[10][10]);\n\n while (stack.length > 0) {\n var current = stack[stack.length - 1];\n var neighbors = getUnvisitedNeighbors(current, cells);\n\n if (neighbors.length > 0) {\n var next = neighbors[Math.floor(Math.random() * neighbors.length)];\n next.visited = true;\n next.walls.top = false;\n current.walls.bottom = false;\n stack.push(next);\n } else {\n stack.pop();\n }\n }\n\n // Draw the maze on the canvas\n for (var x = 0; x < 20; x++) {\n for (var y = 0; y < 20; y++) {\n var cell = cells[x][y];\n if (cell.walls.top) {\n ctx.beginPath();\n ctx.rect(x * 20, y * 20, 20, 1);\n ctx.stroke();\n }\n if (cell.walls.right) {\n ctx.beginPath();\n ctx.rect((x + 1) * 20 - 1, y * 20, 1, 20);\n ctx.stroke();\n }\n if (cell.walls.bottom) {\n ctx.beginPath();\n ctx.rect(x * 20, (y + 1) * 20, 20, 1);\n ctx.stroke();\n }\n if (cell.walls.left) {\n ctx.beginPath();\n ctx.rect(x * 20, y * 20, 1, 20);\n ctx.stroke();\n }\n }\n }\n\n // Find the start and end points of the maze\n var start = null;\n var end = null;\n for (var x = 0; x < 20; x++) {\n for (var y = 0; y < 20; y++) {\n var cell = cells[x][y];\n if (!cell.walls.top && y === 0) {\n start = cell;\n }\n if (!cell.walls.bottom && y === 19) {\n end = cell;\n }\n }\n }\n\n // Animate the A-star solver finding the path from start to finish\n function animateSolver() {\n var openList = [];\n openList.push(start);\n\n while (openList.length > 0) {\n var current = openList.shift();\n if (current === end) {\n break;\n }\n\n var neighbors = getUnvisitedNeighbors(current, cells);\n for (var i = 0; i < neighbors.length; i++) {\n var neighbor = neighbors[i];\n neighbor.visited = true;\n neighbor.walls.top = false;\n neighbor.walls.bottom = false;\n openList.push(neighbor);\n }\n\n // Draw the current path on the canvas\n ctx.clearRect(0, 0, canvas.width, canvas.height);\n for (var x = 0; x < 20; x++) {\n for (var y = 0; y < 20; y++) {\n var cell = cells[x][y];\n if (cell.walls.top) {\n ctx.beginPath();\n ctx.rect(x * 20, y * 20, 20, 1);\n ctx.stroke();\n }\n if (cell.walls.right) {\n ctx.beginPath();\n ctx.rect((x + 1) * 20 - 1, y * 20, 1, 20);\n ctx.stroke();\n }\n if (cell.walls.bottom) {\n ctx.beginPath();\n ctx.rect(x * 20, (y + 1) * 20, 20, 1);\n ctx.stroke();\n }\n if (cell.walls.left) {\n ctx.beginPath();\n ctx.rect(x * 20, y * 20, 1, 20);\n ctx.stroke();\n }\n }\n }\n\n // Draw the current path on the canvas\n ctx.beginPath();\n ctx.rect(current.x * 20, current.y * 20, 20, 20);\n ctx.fillStyle = 'blue';\n ctx.fill();\n\n // Update the canvas\n ctx.clearRect(0, 0, canvas.width, canvas.height);\n ctx.drawImage(canvas, 0, 0);\n\n // Request the next animation frame\n requestAnimationFrame(animateSolver);\n }\n }\n\n // Start the animation\n animateSolver();\n\n // Function to get unvisited neighbors of a cell\n function getUnvisitedNeighbors(cell, cells) {\n var neighbors = [];\n if (cell.x > 0 && !cells[cell.x - 1][cell.y].visited) {\n neighbors.push(cells[cell.x - 1][cell.y]);\n }\n if (cell.x < 19 && !cells[cell.x + 1][cell.y].visited) {\n neighbors.push(cells[cell.x + 1][cell.y]);\n }\n if (cell.y > 0 && !cells[cell.x][cell.y - 1].visited) {\n neighbors.push(cells[cell.x][cell.y - 1]);\n }\n if (cell.y < 19 && !cells[cell.x][cell.y + 1].visited) {\n neighbors.push(cells[cell.x][cell.y + 1]);\n }\n return neighbors;\n }\n</script>\n\n<canvas id=\"canvas\" width=\"400\" height=\"400\"></canvas>\n", "path": "/tmp/ws/index.html"}}