# Press a key to play a new video over an existing video

**URL:** <https://discourse.processing.org/t/press-a-key-to-play-a-new-video-over-an-existing-video/38646>\
**Category:** Libraries\
**Created:** [September 4, 2022, 9:15pm UTC](https://discourse.processing.org/t/press-a-key-to-play-a-new-video-over-an-existing-video/38646 "2022-09-04T21:15:29Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![nitrocaphane](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/nitrocaphane/32/16885_2.png) [@nitrocaphane](https://discourse.processing.org/u/nitrocaphane)\
**Post date:** [September 4, 2022, 9:15pm UTC](https://discourse.processing.org/t/press-a-key-to-play-a-new-video-over-an-existing-video/38646/1 "2022-09-04T21:15:29Z")

</div>

Hi, total newbie here. I’m creating a [mouth closed / mouth open] prototype that eventually would be triggered by an infrared (IR) sensor on a Raspberry Pi.  
mouth0 = mouth closed  
mouth1 = mouth open  
It should play mouth1 over mouth0 when a specific key is pressed.  
But with the following code it has two problems:

1. the mouth1 video is blocked by the mouth0 video;
2. mouth1 only plays once upon key pressing.

Anybody can help me fix this?

btw I have a [p5.js sketch of the same project](https://editor.p5js.org/nitrocaphane/sketches/oluDrnkb1) that I’m trying to convert. But I couldn’t find the .hide() equivalent in Processing. I know that there’s a Processing to p5.js converter, but not the other way around.🤔

```auto
import processing.video.*;
Movie mouth0, mouth1;

void setup() {
  size(480, 270);
  background(0);
  mouth1 = new Movie(this, "mouth1.mov");
  mouth0 = new Movie(this, "mouth0.mov");
  mouth0.loop();
}

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

void draw() {
  image(mouth0, 0, 0, width, height);
}

void keyPressed() {
  if (key == CODED) {
    if (keyCode == UP) {
      mouth1.play();
    }
  } else {
      mouth0.loop();
  }
}

```

---

<div class="post-metadata">

**Author:** ![JSGauthier](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jsgauthier/32/9910_2.png) [@JSGauthier](https://discourse.processing.org/u/JSGauthier)\
**Post date:** [September 5, 2022, 4:18pm UTC](https://discourse.processing.org/t/press-a-key-to-play-a-new-video-over-an-existing-video/38646/2 "2022-09-05T16:18:31Z")

</div>

Hello,

Your draw() loop is only drawing mouth0.

image(mouth0, 0, 0, width, height);

if you want to draw a different video in its place you have to use  
image(mouth1, 0,0,width,height) to either draw over it or instead of it.

Best of luck.

---

<div class="post-metadata">

**Author:** ![nitrocaphane](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/nitrocaphane/32/16885_2.png) [@nitrocaphane](https://discourse.processing.org/u/nitrocaphane)\
**Post date:** [September 5, 2022, 6:11pm UTC](https://discourse.processing.org/t/press-a-key-to-play-a-new-video-over-an-existing-video/38646/3 "2022-09-05T18:11:53Z")

</div>

Thanks. I changed a few other things too. Here is my modified code that works:

```auto
import processing.video.*;

Movie mouth0, mouth1;
boolean m0 = true;
boolean m1 = false;
int VideoPlaying;

void setup() {
  size(480, 270);
  background(0);
  mouth0 = new Movie(this, "mouth0.mov");
  mouth1 = new Movie(this, "mouth1.mov");
}

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

void draw() {
  toogle();
  //println("m0:"+m0);
  //println("m1:"+m1);
  if (m1) {
    mouth0.stop();
    mouth1.play(); 
    image(mouth1, 0, 0, width, height);
    println("mouth1 playing");
    if (abs(mouth1.duration()-mouth1.time()) < .05){
      m1 = false; 
      mouth1.stop();
      VideoPlaying = 0;
    }
  }
  if (m0) {
    //mouth1.stop();
    mouth0.loop();
    image(mouth0, 0, 0, width, height);
    println("mouth0 playing");
  }
}

void keyPressed() {
   if (key == '1') {
    VideoPlaying = 1 ;
    println(VideoPlaying);
  }else{
    VideoPlaying = 0 ;
    println(VideoPlaying);
  }
}

void toogle() {
  if (VideoPlaying == 0) {
    m0 = true;
    m1 = false;
  }
  if (VideoPlaying == 1) {
    m0 = false;
    m1 = true;
  }
}

```