@T_D how does your picking example above compare to the Picking Library -- are they both essentially the same approach?

Those look like warnings rather than errors, and are all self explanatory. Line 1, for instance, you define a variable that you don't use. Either use it or delete it.

I can't see anywhere in the code where you are creating blocks. How are you picking the positions?

line 76, Blue is the name of the Class, defined on line 112

you want the Pos of the member blue defined on line 3

so you need blue.Pos.x rather than Blue.Pos.x

blue is a terrible name for the member variable anyway because there's a method blue() in processing, which is why the syntax highlighter is displaying it the same way it's highlighting draw(). this is ok in java processing, but in javascript it will cause you no end of pain. so get into the habit of picking better names.

Hi, i am recently doing some work using processing and arduino. i am new.. so it might be basic question. there are totally 7 videos. and two separate arrays(or playlist)? list1>videos 1, 2, 3, 4 list2> videos 5,6,7

so when it starts, list1 will be played, (1-4) and if you press the mouse, current video will stop and playlist 2 videos randomly (5~7). and after the video ends, it returns to play list1.

this code is working to playing list 1 and if i press the mouse, the movie stops for a sec and play again. not going to play list 2...

TT...

  import processing.serial.*;
  import cc.arduino.*;
  import processing.video.*;


  Serial myPort;  // Create object from Serial class
  String val;     // Data received from the serial port
  Arduino arduino;

  int buttonPin = 7;

  Movie myMovie1, myMovie2, myMovie3, myMovie4, myMovie5;
  boolean playMovie1=true;
  boolean playMovie2=false;
  boolean playMovie3=false;
  boolean playMovie4=false;
  boolean playMovie5=false;
  float movieEndDuration = 1.029719;

  int fps = 25;
  String[] moviesNames = { 
    "4.mp4", "5.mp4", "6.mp4" };
  int index = int(random(moviesNames.length));
  Movie[] movies;

  void setup() {
    myPort = new Serial(this,"/dev/cu.usbmodem1451", 9600);
    String portName = Serial.list()[0]; //change the 0 to a 1 or 2 etc. to match your port
    arduino = new Arduino(this, Arduino.list()[0], 9600);
    arduino.pinMode(buttonPin, Arduino.INPUT);
    size(1280, 360);
    frameRate(fps);
    movies = new Movie[moviesNames.length];
    for (int i = 0; i < moviesNames.length; i++) {
      movies[i] = new Movie(this, moviesNames[i]);
    }
    myMovie1 = new Movie(this, "t0.mp4");
    myMovie2 = new Movie(this, "t1.mp4");
    myMovie3 = new Movie(this, "t2.mp4");
    myMovie4 = new Movie(this, "t3.mp4");
    myMovie5 = new Movie(this, "t4.mp4");
  }

  void draw() {
    background(0);
    myMovie1.volume(10); 
    myMovie2.volume(10); 
    myMovie3.volume(10); 
    myMovie4.volume(10); 
    myMovie5.volume(10); 
    image(movies[index], 0, 0, width, height);


  if (playMovie1==true) {
    myMovie1.play();
    image(myMovie1, 0, 0, width, height);


  }


  if ((myMovie1.time() + movieEndDuration) >= myMovie1.duration()) {
    {
      myMovie1.stop();
      playMovie1=false;
      playMovie2=true;
    }
  }


  if (playMovie2==true) {

    myMovie2.play();
    image(myMovie2, 0, 0, width, height);

    if ((myMovie2.time() + movieEndDuration) >= myMovie2.duration()) {
      {
        myMovie2.stop();
        playMovie2=false;
        playMovie3=true;
      }
    }
  }

  if (playMovie3==true) {

    myMovie3.play();
    image(myMovie3, 0, 0, width, height );

    if ((myMovie3.time() + movieEndDuration) >= myMovie3.duration()) {
      {
        myMovie3.stop();
        playMovie3=false;
        playMovie4=true;
      }
    }
  }

  if (playMovie4==true) {

    myMovie4.play();
    image(myMovie4, 0, 0, width, height);
    if ((myMovie4.time() + movieEndDuration) >= myMovie4.duration()) {
      {
        playMovie4=false;
        playMovie5=true;
      }
    }
  }
  }
  void movieEvent(Movie m) {
    m.read();
  }



  // Stops the movie playback when the mouse pressed
  void mousePressed() {
     myMovie1.stop();
    myMovie2.stop();
     myMovie3.stop();
    myMovie5.stop();
     movies[index].play(); 
     // assign newly picked random value to index:
  movies[index].loop(); // and start playing it.
  // Stops the movie playback when the mouse pressed
   int rnd; // keep picking a new index till got a diff. 1:
  while ( (rnd = (int) random(movies.length)) == index );

  // assign newly picked random value to index:
  movies[index].loop(); // and start playing it.
  } 

@neilcsmith_net Awesome! I'm trying to swallow the GStreamer key concepts and have studied the Capture and Movie classes in the processing-video library. I'm trying to make small changes and see if I can compile and use it in the Processing. I'll get back to you with questions...

An LWJGL backend would be really good! Although, it seems JOGL development may finally be picking up again.

I'm interested to look at that project as well. But if the community thinks so, I can only focus on the processing-video project.

As the maintainer of the Java bindings for GStreamer, I'm happy to help out too if you want to look at that - that would be working with JNA not JNI directly though.

An LWJGL backend would be really good! Although, it seems JOGL development may finally be picking up again.

koogs I think this is to reset the animation when it's clicked on. Would that make sense? Unfortunately I'm picking this code up from an ex-employee so I'm not 100% on everything.

Hi,

I'm an undergraduate student of CET, Bhubaneswar. I went through your ideas list and found this idea an interesting one. I have a prior experience in working with NodeJs , JavaScript & ReactJs and have been doing quite a lot of projects using these frameworks since a couple of years. I would like to know about the approach and tasks that need to be done as part of GSoC for this project and I seek your suggestions for picking up my first issue to contribute.

Thank you.

For people working in related problems in Processing, I want to mention that one way to make 3D mesh tweening satisfying to watch is to designate meaningful parts of each mesh that are equivalent -- for example, the handle of the teapot = the tail of the cat, or the lid of the teapot = the head of the cat. This is how people often imagine 3D tweens as morphing -- they feel intuitively that the headlights and grill of the car should become the eyes and face of the animal, no matter what the closes points are on the car roof to the animal's head.

Done raw this can be laborious to designate points and it can create ragged results between groups of points. However, if you pick correspondences and then do smoothing, it works well. This process of picking correspondence points and then inferring from them is more or less the exact approach that also creates the most satisfying morphs in 2D.

Unless you are picking an image to use as the background at random (and thus the dimensions are random), you can know how large your image is before you load it.

If you are picking a random image and thus a random size... let us know.

Hi all,

This may not be possible but i get a feeling there must be a way....

So i am extracting an object from a JSON using processing and its all fine when i manually select the array element from which to extract the object, thats the easy part right...

What i would like to do is for processing to trawl through the elements within an Array and then if it matches a set object in that array with a previously defined object from another array (eg: object id =1 and object id = 1) it should then get a particular defined object from that element.

Does that make sense? Basically picking out a particular object from the array based on pre defined circumstances.

Any help would be greatly appreciated. Cheers

There's no ready answer for it! In Java, all variables have a datatype in which we've gotta specify when declaring them. #:-S

Also, Java arrays have a fixed length. If you need to change its length later, you're better off picking another container type. For example, the ArrayList: >-)
https://Processing.org/reference/ArrayList.html

Again, pay attention on the diffs. between the Java & JS versions of the sketch links I've posted on Reddit. O:-)

Who says you can't use libraries when you have an online sketch?

Anyway, the Picking library works by rendering the scene a second time, using false coloring so that each object with an ID has a unique color, and determining the color of the pixel at the position that was clicked, thus yielding information about what was clicked. You can do this yourself if you try hard and can render to an off-screen buffer (can P5.js do that?).

See: https://www.openprocessing.org/sketch/7707

If your object is a cube with a fixed rotation - only around the Y axis, say - You might be able to get the screenX and screenY positions of the four corners, and then determine if the mouse's screenX and screenY is withing the quad those four corners define. You would have to take the rotation amount of the box into consideration too, however, because there would be no way to tell if you clicked the front face or the back face of the cube (unless you numbered the corners too and knew when a face was showing... hmm...)

Wait, what are you having trouble with?

Picking one of the values from your list?

Or showing text in the sketch window?

`import picking.*;

Picker picker;

float moveX;
float moveY;
float varx;
float vary;
float varinc;
int id;

boolean ms;

void setup() {
  size(displayWidth, displayHeight, P3D);
  picker = new Picker(this);
}

void draw() {
  background(100);
  translate(width/2, height/2);
  moveCube();
  cubeNoise();
  newBox();
  choose();
}

void newBox() {
  fill(255, 0, 0);
  picker.start(0);
  beginShape();
  vertex(-100, -100, 0);
  vertex(100, -100, 0);
  vertex(100, 100, 0);
  vertex(-100, 100, 0);
  endShape();

  fill(0, 255, 0);
  picker.start(1);
  beginShape();
  vertex(-100, -100, 0);
  vertex(-100, -100, -200);
  vertex(-100, 100, -200);
  vertex(-100, 100, 0);
  endShape();

  fill(0, 0, 255);
  picker.start(2);
  beginShape();
  vertex(-100, -100, 0);
  vertex(-100, -100, -200);
  vertex(100, -100, -200);
  vertex(100, -100, 0);
  endShape();

  fill(120, 200, 50);
  picker.start(3);
  beginShape();
  vertex(100, -100, 0);
  vertex(100, 100, 0);
  vertex(100, 100, -200);
  vertex(100, -100, -200);
  endShape();

  fill(30, 180, 30);
  picker.start(4);
  beginShape();
  vertex(-100, -100, -200);
  vertex(100, -100, -200);
  vertex(100, 100, -200);
  vertex(-100, 100, -200);
  endShape();

  fill(200, 0, 55);
  picker.start(5);
  beginShape();
  vertex(-100, 100, 0);
  vertex(-100, 100, -200);
  vertex(100, 100, -200);
  vertex(100, 100, 0);
  endShape();

  picker.stop();
}

void moveCube() {
  moveX= map(mouseX, 0, width, 0, 360);
  moveY= map(mouseY, 0, height, 0, 360);
  rot();
  cubeNoise();
}

void rot() {
  rotateX(-moveY * 0.01);
  rotateY(-moveX * 0.01);
  rotateZ(frameCount*0.03);
}

void cubeNoise() {
  varx = map(noise(varinc), 0, 1, -100, 100);
  vary = map(noise(varinc), 0, 1, -100, 100);
  translate(varx, vary);
  varinc+=0.003;
}

void choose() {
  id = picker.get(mouseX, mouseY);

  if (mousePressed == true) {
  switch (id) {
  case 0:
    println("1st");
  case 1:
    println("2nd");
  case 2:
    println("3rd");
  case 3:
    println("4th");
  case 4:
    println("5th");
  case 5:
    println("6th");
    break;
  }
  }
}`

Hi, I created a box beginShape, endShape and vertex. I want to be able to click on each one of the sides of the box. I was able to do it by using the picking library, but because i want to use it in an html file i want to find a way to do it with no library using screenX and screen Y. Thanks

When a car enters the lot, pick one of the parking lot sections for it to park in. Keep picking sections until you find one that has a free space. There must be one because the car was allowed into the lot, right? Then pick a parking spot in that lot. Keep picking them until you find a free space. There must be one because you picked a section that had a space!

Then generate a random number that will represent the total time that car is going to be parked in that space for. Add that amount of time to the current simulation time to get the time the car will exit. You can store this value with the car, or you could associate it with the parking space instead. In either case, every time the simulation time changes, you should be checking all the spots to see if it is time for any of their cars to leave.

I think you have two options:
- Ray Picking (shooting a Ray and see what it hits)
- Color Picking (see if the MousePostion match with a deserved Color)

I don't think either one is implemented in p5js direcly.

i found this via goole, (if you know what to searing for)

https://gist.github.com/sixhat/5bcf3b8d159e7285e247a96c1cbf055f#file-sketch-js-L137

If you want to do web stuff you'd better get in the habit of picking up and dropping libraries on a whim :D ...that's just the way it is in webland: they come and go at a phenomenal rate and even established libraries might pull the rug from under you - I'm looking at you Angular 2.0 or is it v.5 now? :((

Actually graphics libraries seem a little more stable than application frameworks ;)

I'm probably biased towards pixiJS because I found it so easy to pick up the basics - but I never had time to really get into it in depth; and nowadays I earn my bread and butter writing web apps and don't get to play like I used to :(

Anyway 2D feels like an easier place to start... Less hard maths.

One suggestion I would make is to take the time to learn some modern JS dev practices. It's well worth learning to write modules; use build tools; and package managers as they'll make it easier to structure, manage and deploy your code. See:

• The Anatomy of a Modern JavaScript Application
• A Map To Modern JavaScript Development

Once you get into writing modular JS code you'll never want to go back to Java again :P

Thanks quark.

I wanted to give each shape a clicked or not clicked status, and allow the user to toggle these by picking a shape and changing its colour.

The boolean for the toggle was originally the shape's colour, but I've now discovered the tag member variable.

Cheers,

Jim