# Mirror webcam image

**URL:** <https://openrndr.discourse.group/t/mirror-webcam-image/672>\
**Category:** Beginners\
**Created:** [August 22, 2024, 12:44pm UTC](https://openrndr.discourse.group/t/mirror-webcam-image/672 "2024-08-22T12:44:08Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![amymc](https://avatars.discourse-cdn.com/v4/letter/a/96bed5/32.png) [@amymc](https://openrndr.discourse.group/u/amymc)\
**Post date:** [August 22, 2024, 12:44pm UTC](https://openrndr.discourse.group/t/mirror-webcam-image/672/1 "2024-08-22T12:44:08Z")

</div>

I’m getting video from a regular webcam like this:

```auto
    program {
        val videoPlayer = VideoPlayerFFMPEG.fromDevice()
        videoPlayer.play()
    }
     extend {
        videoPlayer.draw(drawer, 0.0, 0.0, 320.0, 240.0)
   }

```

I would like to flip the image horizontally. I see for Kinect cameras there’s a built in mirror property  
`kinect.depthCamera.mirror = true`

Is there something similar for `VideoPlayerFFMPEG` or how would you approach it?

Thanks

---

<div class="post-metadata">

**Author:** ![kazik](https://yyz2.discourse-cdn.com/free1/user_avatar/openrndr.discourse.group/kazik/32/7_2.png) [@kazik](https://openrndr.discourse.group/u/kazik)\
**Post date:** [August 22, 2024, 2:13pm UTC](https://openrndr.discourse.group/t/mirror-webcam-image/672/2 "2024-08-22T14:13:14Z")

</div>

Maybe not the most optimal way, but it should work:

```kotlin
fun main() = application {
  program {
    val videoPlayer = VideoPlayerFFMPEG.fromDevice()
    videoPlayer.play()
    val renderTarget = renderTarget(width, height) {
      colorBuffer()
    }
    extend {
      drawer.withTarget(renderTarget) {
        videoPlayer.draw(drawer)
      }
      drawer.isolated {
        scale(-1.0, 1.0)
        translate(-width.toDouble(), 0.0)
        image(renderTarget.colorBuffer(0))
      }
    }
  }
}

```

---

<div class="post-metadata">

**Author:** ![amymc](https://avatars.discourse-cdn.com/v4/letter/a/96bed5/32.png) [@amymc](https://openrndr.discourse.group/u/amymc)\
**Post date:** [August 22, 2024, 2:23pm UTC](https://openrndr.discourse.group/t/mirror-webcam-image/672/3 "2024-08-22T14:23:37Z")

</div>

Worked like a charm. Thanks!

---

<div class="post-metadata">

**Author:** ![abe](https://yyz2.discourse-cdn.com/free1/user_avatar/openrndr.discourse.group/abe/32/700_2.png) [@abe](https://openrndr.discourse.group/u/abe)\
**Post date:** [August 22, 2024, 2:36pm UTC](https://openrndr.discourse.group/t/mirror-webcam-image/672/4 "2024-08-22T14:36:12Z")

</div>

You can also draw it with negative width:

```kotlin
import org.openrndr.application
import org.openrndr.drawImage

fun main() = application {
    program {
        val cb = drawImage(400, 400) {
            circle(0.0, 0.0, 200.0)
        }
        extend {
            drawer.image(cb, cb.width.toDouble(), 0.0, -cb.width.toDouble(), cb.height.toDouble())
        }
    }
}

```

Or… maybe not with `videoPlayer.draw`? I’ll try…

Works too (The “:0” part works on Linux for screen grabbing):

```kotlin
import org.openrndr.application
import org.openrndr.ffmpeg.PlayMode
import org.openrndr.ffmpeg.VideoPlayerFFMPEG

fun main() = application {
    program {
        val videoPlayer = VideoPlayerFFMPEG.fromScreen(":0", PlayMode.VIDEO, 30.0, 640, 480)
        videoPlayer.play()
        extend {
            videoPlayer.draw(drawer, videoPlayer.width.toDouble(), 0.0, -videoPlayer.width.toDouble(), videoPlayer.height.toDouble())
        }
    }
}

```

Basically, draw the image where the top right corner should be and use it’s negative width as the width value. Like flipping left the right page of a book.