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.
Perform the following steps:
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">
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.Navigate your browser to the web page. You will first see an unprocessed video from the web camera. The following screenshot...