It only took me a couple of minutes for the whole thing. You must have a slow PC or something.
Edit: I had a look at the documentation for the JS library used. This explains the speed difference.
> If the processor is not fast enough to maintain the specified rate, the frame rate will not be achieved. Setting the frame rate within setup() is recommended. The default rate is 60 frames per second.
Unlike Processing.js it is officially approved and supported by the Processing Foundation. And as always, Dan Shiffman has made a great tutorial series.
Java applets are dead.
Are you sure you want to do this in Processing? While possible it’s a lot of work. Don’t know what’s the thing you are trying to build but HTML/CSS/JS would make this a lot easier. Ans if you need Processing in there, you can always use P5.js.
As an alternative to processing, check out P5.js: http://p5js.org/ It was created by the same group that created Processing, but is JavaScript-based, which means it plays nicely with other JavaScript libraries that are out there.
As soon as you get into maps, things get a bit more difficult. Tools like http://mapbox.com/ and https://cartodb.com/ help quite a bit, however.
http://p5js.org/examples/ - On this webpage, there is a column that says "simulations."
I essentially want to make a physics video where I have written my own simulations. Ideally, I will take the 20 or so simulations I've written and export them as .mp4. I will then use a traditional video-editing software (final cut pro) to do the transitions and arrangements of the clips.
Immersives and workshops are great! On another note, all of Dan Shiffman's wonderful videos on Processing are on his youtube, and he is in the middle of recording his series for p5.js (javascript reinterpretation of Processing) and is updating them very regularly.
To answer the sidenote: I came to NYU ITP where Dan Shiffman, Lauren McCarthy, Kyle McDonald etc are faculty so I was kind of thrown into my community.
here it is: https://gist.github.com/anonymous/681933b3dacf9dd3afc7
I will admit to it not being the most readable. but basically when recording is set to false you control time by mouseX. when recording is true it spits out frames into the sketch folder.
there's a brand new javascript library that has ported a load of processing's functionality; it's worth checking out — http://p5js.org/
>No Hassle Coding
>
>Code away your ideas in seconds with intuitive editor and p5js, enable common libraries with ease, and share your work with the community.
>
>Create a sketch
Note the p5js
bit. That's basically Processing on javascript. You're trying to put a Java-shaped peg into a javascript-shaped shaped hole. In case you didn't know, Java is basically an entirely different language to javascript.
You are trying to run this script on your own? Outside of KhanAcademy right? None of the code you have will work because it uses a lot of functions and structure that's unique to Khan. They have a lot of code that they include under yours to make it all work. They do this all behind the scenes to make it much easier and abstract a lot of the complexity. As such, this means that if you take the same code out of Khan's environment, it won't work at all.
Some examples:
* fill
, textSize
, text
, etc aren't functions in JavaScript. Those are functions which they wrote and make available for you to use.
* The draw
function which you created won't ever be called because their underlying code isn't there to call it.
More technically, they are using a library called P5.js. You can also use this too if you include this library in your .html
page before your <script>
. But you can also learn how to do all of the same things with just vanilla JavaScript and really understand how it works.
Indeed there are more problems in your class definition:
fill(self.r, self.g, self.b);
this
instead?: fill(this.r, this.g, this.b);
this.cell = square(...
Here's some re-writing attempt I did for your class
:
class Cell { constructor(x, y, num, r, g, b) { this.x = x; this.y = y; this.num = num; this.radius = width / diameter; this.colour = color(r, g, b); }
draw() { const { x, y, radius, colour } = this; fill(colour).noStroke(); square(x * radius, y * radius, radius); } }
actually spoke to soon i wrote reply did you see..
at first i cp your var link; function setup{ link = createA("http://p5js.org/", "This is a normal HTML hyperlink."); }
which worked fine but then stopped all the rest of my code
i am using mouse clicked and pressed and not pressed allot.
i then tried instead of having two setup functions put it into mine and it worked as in it showed me the txt but then wont link me anywhere
is it possible that mouspresssed and all that jazz is interfering or have i done something silly?
ta much
this all wokred greate but now
i put it to try in a seperate setup function and it worked i was linked and it counted but now it does link it just shows me the letters i cant click it is this because i am also using mouse pressed and mousedragged?
is there a way to use all ?cause now i dont understand why it doesnt work when i copy to my own function ?
function setup() { link = createA("http://p5js.org/", "This is a normal HTML hyperlink."); canvas = createCanvas(windowWidth, windowHeight); canvas.position(0, 0); frameRate(100); clear();
ascii = createP(HI!
);
ascii.style('font-size', '25px');
ascii.mouseOver(over);
ascii.mouseOut(notover);
ascii.position(750,750);
ascii.mouseClicked(linky);
}
and just below this i have another function using clicked?
mouseClicked = function() { ellipse(mouseX, mouseY, 20, 20); }
it works weirdly if i create two function setups{} if i put it in one above it just shows txt and im no longer able to click if i put but i can use all the other functions...any idea?
In JavaScript you can change the page by changing the window.location.href object. So:
window.location.href = "http://p5js.org";
Should do the trick, unless I'm totally wrong about the object.
No, there is p5.js and also a Python and Android mode but Processing itself is a simplified language and IDE based on Java. It has different 2D-drawing backends and a 3D renderer based on JOGL.
That was a default thing with the JavaScript library I'm using p5.js. I had completely forgotten about it. I'll get rid of it, as there's no point in keeping it.
Edit: removed that stuff
No it is not that simple. You can add a 'mode' to your Processing 2 interface (I don't think it is available in Processing 3), by clicking on 'Java' in the upper right corner, select 'Add mode' and choose JavaScript. Once it is installed, launching the sketch will actually open it in a browser ! And you can use the generated code to embed it in a web page. Cool isn't it? HOWEVER, this is where problems begin. Some api calls, or functionalities, will not work in JavaScript mode, ie in you browser. You'll get more detailed information here.
As I mentioned before, you can also download P5JS, developped by the same team so you won't get suprised by the IDE. Yet the code is basically JavaScript, and not Processing... But this will definitely work in a web page.
Hope this helps, even though I get lost in this ecosystem myself sometimes :-S
Hi! There reason there are only 12 readers is probably because I have made 0 attempts to promote the subreddit.
I made it because I actually work with the working group at NYU. I figured It'd be worth making just so somebody with a link to the project would be around.
I don't think that processing and P5 are really in competition as they sort of accomplish different tasks.
Unfortunately the community doesn't seem to have a massive online presence. If you want to get into developing the library it troll around the github page.
Also read through this page if you haven't already.
A little webpage that visualises the moments in movies where the title of the movie itself is mentioned in dialog. Hover over the bars to see the actual sentence and timecode.
This visualisation is programmed entirely generative, meaning no hardcoding whatsoever. It reads .srt
files (subtitle files) for mention of the title and then looks up the timecode with some Regular Expression. I first made a prototype in Java/Processing and then rewrote it with the p5 JavaScript library.
For the near future I'm planning on implementing a features to upload your own .srt
files and enter your own search queries. Until then I'm open for suggestions of movies you like to see included.