brightness and contrast of the webcam

gius

Hello everybody, I want that while there is a live webcam it is possible to adjust the brightness and contrast of color and gray images. This is my code:

import processing.video.*;
import g4p_controls.*;
import java.awt.Font;
import gab.opencv.*;


OpenCV opencv;

PFont f;     

boolean filterT=false;


Capture cam;

GButton btnFilterT;

int n = 1;

void setup() {
  size(1024, 768); 

  f = createFont("Arial", 48, true);

  btnFilterT = new GButton(this, 740, 50, 140, 20);
  btnFilterT.setText("On");
  btnFilterT.setLocalColorScheme(GCScheme.GREEN_SCHEME);

  cam = new Capture(this, 640, 480);
  cam.start();
}


void draw() {

  if (cam.available() == true) {
    cam.read();
  }


  pushMatrix();
  scale(-1, 1);
  image(cam.get(), -width, 0, width, height);
  popMatrix();  

  opencv = new OpenCV(this, cam);
  opencv.loadImage(cam);


  if (filterT==true) {
    opencv.brightness((int)map(mouseX, 0, width, -255, 255));
    image(opencv.getOutput(),0, 0, width, height);
  }
}

public void handleButtonEvents(GButton button, GEvent event) {

  if (button == btnFilterT) {
    filterT=true;
  }
}

I have two problems:

if I press the T button to start the brightness and contrast in gray, the screen flips over and becomes no mirror.

how can I have brightness and contrast with the mirror video?

how can I have the brightness and contrast of the webcam color?

thank you

Andreas_Ref

To answer the first question: I think the reason why the the screen flips over is that you only perform push, scale and pop on cam.get() but not on openvc.getOutput().

gius

Thanks Andreas_Ref, I have tried to change:

image(opencv.getOutput(), -width, 0, width, height);

but it does not work. Anyone have any ideas to suggest?

thanks

kfrajer

I was hoping somebody in the community would have answered this question by now. I tried myself but I failed.

Next I am assuming opencv.getOutput() returns a PImage object.

The code next is a dirty test suggestion, partial code and un-tested. Also explore previous post using scale: https://forum.processing.org/two/search?Search=scale

I am interested to know if this will work.

Kf

void draw() {

  if (cam.available() == true) {
    cam.read();
  }
  // // // else{return;}

  opencv = new OpenCV(this, cam);  //MOVE this line to setup

  opencv.loadImage(cam);
  opencv.brightness((int)map(mouseX, 0, width, -255, 255));
  PImage oimg=opencv.getOutput();

  pushMatrix();
  scale(-1, 1);

  //=====================
  if (filterT==true) 
    image(cam, -width, 0, width, height);
  else
    image(oimg,-width, 0, width, height);
  //=====================

  popMatrix();  

}

public void handleButtonEvents(GButton button, GEvent event) {

  if (button == btnFilterT) {
    filterT=!filterT;
  }
}

gius

Thank you very much for your help kfrajer!

Your example works fine!

But then when I slightly changed it started to does not work Opencv.brightness ();

import processing.video.*;
import g4p_controls.*;
import java.awt.Font;
import gab.opencv.*;


OpenCV opencv;
Capture cam;

GButton btnFilterG1;
GButton btnFilterReset;
GButton btnFilterIncrement;


int n = 1;
int valore = 0;

boolean filterIncrement=false;




void setup() {
  size(1024, 768); 

  btnFilterG1 = new GButton(this, 270, 80, 60, 20);
  btnFilterG1.setText("0");
  btnFilterG1.setLocalColorScheme(GCScheme.ORANGE_SCHEME);

  btnFilterReset = new GButton(this, 740, 20, 140, 20);
  btnFilterReset.setText("Reset");
  btnFilterReset.setLocalColorScheme(GCScheme.GREEN_SCHEME);

  btnFilterIncrement = new GButton(this, 110, 80, 140, 20);
  btnFilterIncrement.setText("Increment brightness");
  btnFilterIncrement.setLocalColorScheme(GCScheme.ORANGE_SCHEME);

  String[] cameras = Capture.list();
  if (cameras.length == 0) {
    println("There are no cameras available for capture.");
    exit();
  } else {
    println("Available cameras:");
    for (int i = 0; i < cameras.length; i++) {
      println(cameras[i]);
    }
    cam = new Capture(this, 640, 480);
    cam.start();
  }
}

void draw() {
  if (cam.available() == true) {
    cam.read();
  }

  opencv = new OpenCV(this, cam);
  opencv.loadImage(cam);

  PImage oimg=opencv.getOutput();
  pushMatrix();
  scale(-1, 1);
  //=====================
  if (filterIncrement==false) 
    image(cam, -width, 0, width, height);
  else
    image(oimg, -width, 0, width, height);
  //=====================
  popMatrix();
  if (valore==0) { 
    filterIncrement=false;
    btnFilterG1.setText("0");
  }
  if (valore==1) {    
    opencv.brightness(30);
    image(opencv.getOutput(), -width, 0, width, height);
    btnFilterG1.setText("1");
  }
  if (valore==2) {    
    opencv.brightness(20);
    image(opencv.getOutput(), -width, 0, width, height);
    btnFilterG1.setText("2");
  }
  if (valore==3) {    
    opencv.brightness(10);
    btnFilterG1.setText("3");
    image(opencv.getOutput(), -width, 0, width, height);
  }
  if (valore==4) {    
    opencv.brightness(0);
    btnFilterG1.setText("4");
    image(opencv.getOutput(),-width, 0, width, height); 
  }
  if (valore==5) {    
    opencv.brightness(-100);
    btnFilterG1.setText("5");     
    image(opencv.getOutput(), -width, 0, width, height);
  }
  if (valore > 6) {  
    opencv.brightness(-100);
    image(opencv.getOutput(), -width, 0, width, height);
  }
}


public void handleButtonEvents(GButton button, GEvent event) {

  if (button == btnFilterIncrement) {
    filterIncrement=true;
    valore = valore +1;
  }
  if (button == btnFilterReset) {
    image(cam.get(), 0, 0, width, height);
    valore=0;
  }
}

Where am I wrong?

thanks

kfrajer

That is very odd. from your previous code, i notice that inversion is observed only on the image that you draw in line 113 and it is shown only for a split second. I removed G4P and openCV thinking they were changing the object and my luck didn't change. Odd enough, the previous example did work so it seems....

I kinda gave up because I couldn't get it to work using scale at the end. It is like image ignore the scale parameter despite been called before. Very very odd.

I have a solution. Sketch below. Notice I assume the sketch and image have the same size.

Kf

import processing.video.*;
Capture cam;

boolean invertFlag=false;

void setup() {
  size(640, 480);

  String[] cameras = Capture.list();
  if (cameras.length == 0) {
    println("There are no cameras available for capture.");
    exit();
  } else {
    println("Available cameras:");
    for (int i = 0; i < cameras.length; i++) {
      println(cameras[i]);
    }
    cam = new Capture(this, 640, 480);
    cam.start();
  }
}

void draw() {
  if (cam.available() == true) {
    cam.read();
    image(cam.get(), 0, 0, width, height);

    if (invertFlag) {
       invertNow() ;
    }
  }
}


void keyReleased() {

  if (key==' ') {
    invertFlag=!invertFlag;
  }
}


void invertNow() {
  loadPixels();
  cam.resize(width, height);
  cam.loadPixels();
  for (int i=0; i<width; i++)
    for (int j=0; j<height; j++) {
      int loc=i+j*width;  //Current pixel location
      int iloc=(width-i-1)+j*width;  //Pixel counting from opposite edge
      pixels[loc]=cam.pixels[iloc];  //Invert pixel positions
    }

  updatePixels();
}

jeremydouglass

Strange. I'm actually trying to understand -- should the previous issue be reported as a bug? Interesting solution, @kfrajer.

kfrajer

I re-tested all the code above and none works. I am not sure if it is a bug or if not being used properly. i think using the default imageMode leads to confusion. I came up with the following example. I create a copy of the current cam image and I display it twice, one inside the push/pop bloc and the second one outside in an untouched reference frame. Notice that I am using imageMode(CENTER). I conclude the one inside the block works.

Kf

import processing.video.*;
import g4p_controls.*;
import gab.opencv.*;


OpenCV opencv;
boolean filterT=false;
Capture cam;
GButton btnFilterT;
int n = 1;

void setup() {
  size(1024, 768); 


  btnFilterT = new GButton(this, 740, 50, 140, 20);
  btnFilterT.setText("On");
  btnFilterT.setLocalColorScheme(GCScheme.GREEN_SCHEME);

  cam = new Capture(this, 640, 480);
  cam.start();
}


void draw() {


  if (cam.available() == true) {
    cam.read();
  }


  opencv = new OpenCV(this, cam);  //MOVE this line to setup

  opencv.loadImage(cam);
  opencv.brightness((int)map(mouseX, 0, width, -255, 255));
  PImage oimg=opencv.getOutput();

  pushMatrix();
  scale(-1, 1);

  //=====================
  if (filterT==true) 
    image(cam, -width, 0, width, height);
  else
    image(oimg, -width, 0, width, height);
  //=====================

  drawRefFrame(3*height>>2);
  popMatrix();

  drawRefFrame(height>>2);
}

public void handleButtonEvents(GButton button, GEvent event) {

  if (button == btnFilterT) {
    filterT=!filterT;
  }
}

//It draws reference objects at a specified height h
//it also draws two images copied from the cam object and then resized
void drawRefFrame(int h) {

  PImage tcam=cam.get();
  tcam.resize(100, 0);

  pushStyle();
  colorMode(HSB);
  textAlign(CENTER, CENTER);
  imageMode(CENTER);
  image(tcam, width/2, h+50);
  image(tcam, -width/2, h-50);
  for (int xx= -width; xx<=width; xx+=width>>2) {
    noStroke();
    fill((int)map(xx, -width, width, 0, 255), 250, 250);
    ellipse(xx, h, 50, 50);
    fill(0);
    text(xx, xx, h);
  }

  popStyle();
}

kfrajer

This post also works for this case, related to horizontal flipping (Tested in Java but not using G4P... it should work nevertheless): https://forum.processing.org/two/discussion/22546/how-do-i-flip-video-in-canvas-horizontally-in-p5js#latest

Kf