Hello,

I would like to see a video through a circle. The video is running, and the mouse' movement would display a small circle through which one can see part of the video.
To do that, I need to apply an alpha mask to the video.
I have been trying to copy the frame into a temporary tif image to process it, but it is very CPU extensive.

My guess is that I should need to draw a circle where the mouse is pointing at, save the image as a mask and blend it with the video frame. But I don't know how to do that.

Do you have some suggestions?

Many thanks,
Jean-Baptiste

here is the code :

import processing.video.*;
Movie myMovie;

PImage masque;
PImage display;

void setup()
{
 masque = loadImage("masque.jpg");
 size(400, 400);
 background(0);
 // Load and play the video in a loop
 myMovie = new Movie(this, "station.mov");
 myMovie.loop();
 framerate(30);
}

void movieEvent(Movie myMovie) {
 myMovie.read();
}


void draw()
{

 background(0);

 tint(255, 255);
 image(myMovie, width/2-myMovie.width/2,height/2-myMovie.height/2);
 save("tmp.tif");
 display = loadImage("tmp.tif");
   
 
 //  tint(255, 255);
// image(masque, mouseX //-masque.width/2,mouseY-masque.height/2);

 
}

Hi there,

thanks a lot for your help. The PGraphics3 references wasn't where I was looking at!

I still have a problem tho.  
I incorporated your code into mine and have this error:

"The PImage used with mask() must be the same size as the applet."

So I adapted the size of the applet to the size of the video (160 / 120) but it still doesn't work.

--

import processing.video.*;
Movie myMovie;


PGraphics3 gBuffer;//the mask


void setup(){
 size(160,120);
 background(0);
 // Load and play the video in a loop
 myMovie = new Movie(this, "station.mov");
 myMovie.loop();

 framerate(30);
gBuffer = new PGraphics3(width, height,null); // should be 160 120 ?
gBuffer.defaults();
gBuffer.ellipseMode(CENTER);

}
void draw(){
 gBuffer.background(0);//clear the mask
 gBuffer.fill(255);
 gBuffer.ellipse(mouseX,mouseY,20,20);//draw a new circle
 gBuffer.updatePixels();
 myMovie.mask(gBuffer);// problem occurs here
 image(myMovie,0,0);//set the image  
 
}
void movieEvent(Movie myMovie) {
 myMovie.read();
}

Thanks for your concern.

It is working now. Actually, it was not straigthfoward. I printed out the size of the Movie object. Its width and heigth were 1. So the movie wasn't initiated when the draw() function was accessed. I add the instruction myMovie.read() in the setup function and it is working now.

many thanks again!

Code:

import processing.video.*;
Movie myMovie;

PGraphics3 gBuffer;//the mask


void setup(){
 size(160,120);
 background(0);
 // Load and play the video in a loop
 myMovie = new Movie(this, "station.mov");
 myMovie.loop();
 myMovie.read();

 framerate(30);
gBuffer = new PGraphics3(160, 120,this);
gBuffer.defaults();
gBuffer.ellipseMode(CENTER);

}
void draw(){
 
    background(255);
 gBuffer.background(0);
 gBuffer.stroke(255);
 gBuffer.ellipse(mouseX,mouseY,80,80);
 gBuffer.updatePixels();
 PImage p=myMovie.get(0,0,myMovie.width,myMovie.height);
 println(myMovie.width+ " " +myMovie.height);
 p.mask(gBuffer);
 image(p,0,0);
 
}
void movieEvent(Movie myMovie) {
 myMovie.read();
}