Merge pull request #10 from cloud-tinkerers/setup-brython

Added Brython sample and configured http.server
cloud-tinkerers · May 29, 2023 · cf4767e · cf4767e
2 parents c5c8871 + 4d206ee
commit cf4767e
Show file tree

Hide file tree

Showing 5 changed files with 53 additions and 9 deletions.
diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
@@ -5,7 +5,9 @@
 	// Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
 	"image": "mcr.microsoft.com/devcontainers/base:jammy",
 	"features": {
-		"ghcr.io/devcontainers/features/python:1": {},
+		"ghcr.io/devcontainers/features/python:1": {
+			"version": "3.11"
+		},
 		"ghcr.io/devcontainers-contrib/features/black:2": {},
 		"ghcr.io/devcontainers-contrib/features/coverage-py:2": {},
 		"ghcr.io/devcontainers-contrib/features/mypy:2": {},
@@ -17,12 +19,15 @@
 	},
 	"customizations": {
 		"extensions": [
-			"ms-python.vscode-pylance",
+			"ms-python.black-formatter",
+			"ms-python.pylint",
 			"ms-python.python",
+			"ms-python.vscode-pylance",
 			"alexcvzz.vscode-sqlite",
 			"donjayamanne.python-extension-pack",
 			"ms-python.black-formatter",
-			"littlefoxteam.vscode-python-test-adapter"
+			"littlefoxteam.vscode-python-test-adapter",
+			"ms-vscode.azurecli"
 		],
 	},
 	"mounts": [
@@ -34,8 +39,8 @@
 
 	// onstartcommand that installs lsd
 	"postCreateCommand": "curl -L https://github.com/lsd-rs/lsd/releases/download/0.23.1/lsd_0.23.1_amd64.deb  -o lsd_0.23.1_amd64.deb && dpkg -i lsd_0.23.1_amd64.deb && rm lsd_0.23.1_amd64.deb",
-	"postStartCommand": "pip install --root-user-action=ignore -r requirements.txt",
+	"postStartCommand": "pip install --root-user-action=ignore -r requirements.txt; python -m http.server 8080",
 
 	// Use 'forwardPorts' to make a list of ports inside the container available locally.
-	// "forwardPorts": [],
+	"forwardPorts": [8080],
 }
diff --git a/requirements.txt b/requirements.txt
@@ -1 +1 @@
-brython
+brython==3.11.2
diff --git a/src/README.md b/src/README.md
@@ -0,0 +1,32 @@
+# Configuring Brython and Getting Started with Python Puzzle Quest
+
+Welcome to Python Puzzle Quest! This is a simple game built using Brython, a Python 3 implementation for client-side web programming.
+
+## Getting Started
+
+To get started with this project, you'll need to have Python 3 installed on your machine. You can download Python 3 from the official website: https://www.python.org/downloads/
+
+Once you have Python 3 installed, you can run the game locally by following these steps:
+
+1. Clone the repository to your local machine.
+2. Navigate to the `src` directory.
+3. Start a local web server by running the command `python -m http.server 8080` in your terminal.
+
+```json
+"forwardPorts": [8080],
+```
+
+4. Be sure to forward port 8080 in the devcontainer's `forwardPorts` attribute.
+5. Open your web browser and navigate to `http://localhost:8080`.
+
+## How to Play
+
+Once you have the game running in your web browser, you can use the arrow keys to move your character around the screen. Your goal is to collect as many coins as possible while avoiding the enemies. Good luck!
+
+## Contributing
+
+If you'd like to contribute to this project, please fork the repository and submit a pull request. We welcome contributions of all kinds, including bug fixes, new features, and documentation improvements.
+
+## License
+
+This project is licensed under the MIT License. See the `LICENSE` file for more information.
diff --git a/src/home/index.html b/src/home/index.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html>
+
 <head>
     <title>Python Puzzle Quest</title>
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/brython/3.9.5/brython.min.js"></script>
@@ -10,18 +11,24 @@
             padding: 0;
             background-color: #f0f0f0;
         }
+
         #content {
             margin: 20px;
         }
     </style>
 </head>
-<body onload="brython()">
+
+<body onload="console.log('Brython is being loaded'); brython()">
     <div id="content">
         <h1>Welcome to Python Puzzle Quest!</h1>
         <p>Let's start with a simple Python code...</p>
+        <button id="mybutton">Click me!</button>
+        <script type="text/python3" src="../main.py"></script>
         <script type="text/python3">
-            print("Hello, Python Puzzle Quest!")
+            print("Hello world!")
         </script>
+
     </div>
 </body>
+
 </html>
diff --git a/src/main.py b/src/main.py
@@ -3,4 +3,4 @@
 def hello(event):
     alert("Hello, Python Puzzle Quest!")
 
-document["mybutton"].bind("click", hello)
+document["mybutton"].bind("click", hello)