So I am new to HTML and Javscript, and I 'm trying to setup p5.js , however I received windows script host problem Code 800A0405 source microsoft JScript compilation error…how can I fix this ? Please help me!!! Thanks!!!
Mary, can you provide details of what you were trying to do there? Are you working on an online p5.js editor? If you share your link/resources and tell us what you did, we would be in a better position to help.
To get started with p5.js you can look into other options like this one. In a nutshell, you use any text editor. You setup a folder in your personal document section in your computer. In this folder, you need to have two files (based on the link I just shared), one file named index.html an another file named sketch.js and that’s it. For the html, add the code:
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.6.1/p5.js"></script>
<script src="sketch.js"></script>
</head>
<body>
</body>
</html>
for the javascript file, you start with this, which you can change as you progress in you learning:
function setup() {
}
function draw() {
ellipse(50, 50, 80, 80);
}
So for instance, you can modify the above code so to change the background every second:
function setup() {
createCanvas(600,400);
frameRate(30);
}
function draw() {
ellipse(50, 50, 80, 80);
}
function setBackgorund(){
if(frameCount%30==0){
let r=random(220); //Red
let g=0; //Green
let b=random(100,180); //Blue
background(r,g,b);
}
}
After you saved both files, you click on the idex.html and it should launch in a browser and you should see a canvas where its background changes color every second.
You can check another modified version of the code above here next:
See the Pen p5js-BasicDemo by kfrajer (@kfrajer) on CodePen.
Kf
Easiest & fastest recipe to run “.js” sketches under p5.js:
- Install any Firefox-based browser in your OS and use it to open your “index.html” file:
- Install Notepad2 or Notepad++ (or both) in your OS and use it to type in your “sketch.js” file there:
- You can setup those text editors to use UTF-8 and LF line endings for better compatibility.
- Here’s my minimum “index.html” template file which can run most “sketch.js” files out there:
<!DOCTYPE html>
<meta charset=utf-8>
<meta name=viewport content=width=device-width,initial-scale=1>
<script defer src=https://cdn.JsDelivr.net/npm/p5></script>
<script defer src=https://cdn.JsDelivr.net/npm/p5/lib/addons/p5.dom.min.js></script>
<script defer src=sketch.js></script>
- Now you can create a folder and place both “index.html” & “sketch.js” files inside it.
- W/ Firefox opened, drag & drop the “index.html” file into it.
- It should automatically run your “sketch.js” code there.
- Otherwise, if there’s anything wrong in your code, hit the F12 key or the key combo CTRL + SHIFT + J in order to open the browser’s console, and check for any error messages there.
Here’s some p5.js sketch running online w/ both “index.html” über minimum file & the “sketch.js” code file:
i’m having the same problem i downloaded p5 zip and trying to open any file inside result in the same
"error message "
what should i do
please help us with more details,
esp. as you post in a one year old topic.
- what exactly you download
- how unzip
- and start what / how
++ also tell us more about your environment / OS …
example, for a other topic i play
https://editor.p5js.org/kll/sketches/I_NCyfDYR
i select / File / Download /
and save local xxx.zip
- on a WIN 10 PC unzip
- and double click on index.html
and select my firefox browser to run it.
i went to the offecial p5* site i downloaded both the complete and the single uncompressed files
both resulting on error in every try to open any file
It works fine here:
- Download:
https://p5js.org/download/ -
Extract files in downloaded ZIP to a folder.
You MUST do this and work with the extracted folder! - I used this example:
https://p5js.org/examples/3d-sine-cosine-in-3d.html
I copied it to the sketch.js example in the “empty-example” folder. - The sketch worked; I opened index.html in Firefox, Chrome, Edge and Internet Explorer successfully.
- You MUST open the index.html file.
You WILL get an error if you click on any JavaScript file (one example):
your video shows / explains nothing about
- what action ( start program?? ) you made and
- what ERROR you got.
also you not explained what you want to do?
if you want learn processing in browser with P5.js
please start with the online editor
https://editor.p5js.org/
later, when you have some working code,
what for ever reason you want run “OFF_LINE”
you can download the project zip to your PC.
and run it with double click on index.html.
and also note that you have a good working environment
if you download processing 3.5.3 here and install p5.js MODE
in both cases you not need to do what you just try to do
and as @glv already told you, you not ( try to ) start ( double click )
p5.js
but here a snap of doing that under Win 10:
-1- download
-2- extract
-3- get
-4- reproduce you mistake ( and get error )
-5- go down to the provided empty example
and double click
index.html
and see a empty browser window ( here firefox ) open.
hope that gives you the right idea how to use/start p5.js
sorry her’s the vedio
you want to say that p5 writes on text file?
ok Sirine Benyounes,
we told you 2 times already that
you NOT have to try to execute p5.js … like a app
as it is called from HTML ? like a library? sorry that poor wording.
hm, could do, but that is not the point here.
you do what i show in the pictures, call
index.html
- by browser
- by double click
and you make a sketch.js file by any editor with your code.
again if you not get the basics running you please work in the online editor
to learn the coding … of p5.js “language”
your way is not good for a beginner start
as it misses the working environment what is provided
by the online editor or by the processing 3.5.3 p5.js mode…
i’m sorry i still don’t get this dealing with a libary means the code would work on any text file?
"my way is not good as a biginner " what do you mean ?
i watched the coding train and i thought i could find a similar program at the site he provided
u said there’s a p5 mode on processing any info about how to enable that ?
i hope i didn’t any how disturb you i’m just trying to undrestand …
well, i see that
http://p5js.org/get-started/
might be much too complicated for a very start.
also forget the processing IDE p5.js mode, as it might be also too difficult to install.
work only here:
you can make an account ( sign up )
https://editor.p5js.org/signup
to save your code ( online )
and in a month, if you still think you need to work offline / local
show me the link to your running project, and we try from there again.
Clearly the official tutorials are too confusing for @tcach55 .
You can forget all about those and try out my “easiest” recipe posted in this very forum thread:
Here’s the example sketch’s source code: