Book Image

WebRTC Cookbook

By : Andrii Sergiienko
Book Image

WebRTC Cookbook

By: Andrii Sergiienko

Overview of this book

Table of Contents (15 chapters)
WebRTC Cookbook
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Inverting colors


This recipe covers the process of using a pretty simple filter: inversion of colors. It will hardly be useful for you in most normal cases, but it might be helpful if for some reason your peer sends you a broken video with inverted colors, or you get one from your web camera. Some cameras might work that way due to hardware incompatibility or due to the incorrect installation of software drivers.

How to do it…

Perform the following steps:

  1. Add a control button to your application's main web page:

    Inversion
    <input type="range" oninput="invertColors(this.valueAsNumber);" value="0" step="0.1" min="0" max="1">
  2. Add an appropriate JavaScript function:

    function invertColors(val) {
      var v = document.getElementById("localVideo");
      v.style.webkitFilter="invert(" + val + ")";
    };

    Here localVideo is the ID property of the HTML video tag for the local video playback.

  3. Navigate your browser to the web page. You will first see an unprocessed video from the web camera. The following screenshot...