controlP5 with TUIO ?

capturevision

Hello, Does anybody knows a quick hack or a way to make TUIOCursors act like a mouse, in order to emulate a mouse clidk on controlP5 GUI elements ?

I have tried with java.awt.Robot, but without success.

Any idea ?

sojamo

Hi, you can have a look at the ControlP5pointer example.

capturevision

@sojamo : thanks for the quick answer ;)

Another question then..

In fact, I would like to emulate a mouseClick each time a TuioCursor (touch point on multitouch table) enters my scene..

The TuioCursors events are handled this way ;

public void addTuioCursor(TuioCursor tuioCursor)
public void updateTuioCursor(TuioCursor tuioCursor)
public void removeTuioCursor(TuioCursor tuioCursor)

add is when a new touch point is added.

update is when a cursor is updated (has moved).

remove is when a cursor is removed.

In each of these events, here are the infos I can get from the TuioCursorparameter :

X
Y
SessionID : a sessionID that each touch keeps for all his 'life' until removed

Here is the code I have (stripped from my code)..

In setup() :

cp5     = new ControlP5(parent);
cp5.setAutoDraw(false);
cp5.getPointer().enable();

these two methods :

    public void mousePressed()
    {
        cp5.getPointer().pressed();
    }

    public void mouseReleased()
    {
        cp5.getPointer().released();
    }

in draw()

// first draw controlP5
cp5.draw();

// draw our pointer
pushMatrix();

translate(cp5.getPointer().getX(), cp5.getPointer().getY());
stroke(255);
line(-10,0,10,0);
line(0,-10,0,10);

popMatrix();

println(cp5.isMouseOver());

And now, here is the code that handles TUIO Cursors..

public void addTuioCursor(TuioCursor tuioCursor)
{
    int x = tuioCursor.getScreenX(width);
    int y = tuioCursor.getScreenY(height);
    cp5.getPointer().set(x ,y );
    mousePressed();
}


public void updateTuioCursor(TuioCursor tuioCursor)
{
    int x = tuioCursor.getScreenX(width);
    int y = tuioCursor.getScreenY(height);

    cp5.getPointer().set(x , y);
}


public void removeTuioCursor(TuioCursor tuioCursor)
{
    mouseReleased();        
}

With this implementation, I can see that, when I enter / mouser hover a controlP controller, it is highlighted as it's supposed to be (and i see the cross drawn in draw() where it should be).

But, when doing a "finger click" (i.e. adding then quickly removing a finger) over a highlighted controlP5 Button (for example), nothing happens ;- .

I would like a "finger click" to fire the controlP5 events as if my cursor was the mouse so I can use this **marvelous controlP5 library with SMT **!!

Any Idea ? (specially @sojamo and @paluka)..

Thanks in advance.

capturevision capturevision.wordpress.com

sojamo

when you remove the cursor, also update the pointer and set the xy coordinates to a location outside of the controller area for example cp5.getPointer().set(-1000 , -1000);

Do keep in mind to only use 1 TUIO cursor at a time with cp5's pointer.

capturevision

Hm.. Ok for "just one pointer" part ..but, in regard of the above code.. what exactly do you mean by > also update the pointer ? A pseudo code example would help me..

Thanks ;)

sojamo

Hi, here is a modified version of the pointer example, please have a look at the code inside keyPressed()

import controlP5.*;

ControlP5 cp5;

void setup() {
  size(400, 600);

  cp5 = new ControlP5(this);
  // disable outodraw because we want to draw our 
  // custom cursor on to of controlP5
  cp5.setAutoDraw(false);

  cp5.addSlider("hello", 0, 100, 50, 40, 40, 100, 20);

  // enable the pointer (and disable the mouse as input) 
  cp5.getPointer().enable();
  cp5.getPointer().set(width/2, height/2);
}


void draw() {
  background(cp5.get("hello").getValue());

  cp5.draw();

  pushMatrix();
  translate(cp5.getPointer().getX(), cp5.getPointer().getY());
  stroke(255);
  line(-10, 0, 10, 0);
  line(0, -10, 0, 10);
  popMatrix();
  println(cp5.isMouseOver());
}


void keyPressed() {
  switch(key) {
    case('1'): // addTuioCursor
    cp5.getPointer().set(mouseX, mouseY);
    break;
    case('2'): // updateTuioCursor
    cp5.getPointer().set(mouseX, mouseY);
    cp5.getPointer().pressed();
    break;
    case('3'): // removeTuioCursor
    cp5.getPointer().set(-1000, -1000);
    cp5.getPointer().released();
    break;
  }
}

capturevision

Hey thanks !

It's kinda working and I can start from here :) .. I've got a little flickering when hovering the dropDownLists, but my code needs to be refactored a bit and that should do the trick.

@sojamo : thanks again ! I don't know how to mark your answer as "accepted" .....

BTW have you heard of other P5 + controlP5 + multitouch projects ?