From 924ac26d3842dea5606a199f22086c64cf8f051e Mon Sep 17 00:00:00 2001
From: Hugo H <hugo@haaxman.co.uk>
Date: Thu, 25 Dec 2025 20:04:58 +0000
Subject: [PATCH] Updated quickstart instructions in the readme

---
 README.md | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 73f112c..e1ef7a1 100644
--- a/README.md
+++ b/README.md
@@ -8,14 +8,27 @@ To use PyCanvas, you can add the following to the top of your skulpt builtInRead
 
 ```javascript
 if (x === 'screen' || x === './screen.js') {
+    const url = new URL('screen.js', window.location.href).href;
     const xhr = new XMLHttpRequest();
-    xhr.open("GET", "path/to/screen.js", false);
+    xhr.open("GET", url, false);
     xhr.send();
     if (xhr.status === 200) return xhr.responseText;
     else throw "Could not load screen.js";
 }
 ```
 
+And set these variables before running the code:
+```javascript
+const canvas = document.getElementById('canvas');
+const container = document.getElementById('preview-container');
+if (canvas && container) {
+    const w = Math.floor(container.clientWidth);
+    const h = Math.floor(container.clientHeight);
+    canvas.width = w;
+    canvas.height = h;
+}
+```
+
 Then you can use it in your code like this:
 
 ```python