import org.gamecontrolplus.gui.*;
import org.gamecontrolplus.*;
import net.java.games.input.*;
import g4p_controls.*;
// This one is essential
ControlIO control;
// You will need some of the following depending on the sketch.
float px; 
float py;
float Rubber;
float Reset;
float XBTN;
int pageNumber=1;
int brushDiameter = 10;
int r=0;
int g=0;
int b=0;
float redrect;
boolean OKtoDraw =false;
GImageButton btnGhost, btnCoins, btnTJ, btnInfo;
GLabel lblOut;
// A ControlDevice might be a joystick, gamepad, mouse etc.
ControlDevice device;
// A device will have some combination of buttons, hats and sliders
ControlButton button;
ControlHat hat;
ControlSlider slider;
GCustomSlider sdr1, sdr2, sdr3, sdr4, sdr5, sdr6, sdr7;
boolean trailOn;
ArrayList<PVector>  shadows = new ArrayList<PVector>();
ArrayList<PVector>  trail = new ArrayList<PVector>();
void setup() {
  size (1920, 1080);
  control = ControlIO.getInstance(this);
  device = control.getMatchedDevice("GamePadPaint");
  PFont a = createFont ("Georgia", 90);
  String b = ("Welcome to GamePaint");
  textFont (a);
  textSize (90);
  fill (255, 100, 255);
  text (b, 275, 250);
  sdr1 = new GCustomSlider(this, 20, 20, 260, 50, null);
  // show          opaque  ticks value limits
  sdr1.setShowDecor(false, true, true, true);
  sdr1.setNbrTicks(5);
  sdr1.setLimits(40, -100, 100);
  if (device== null) {
    println("No suitable device configured");
    System.exit(-1); // End the program NOW!
  }
  button = device.getButton("0");
  hat = device.getHat("pov");
}
public void getUserInput () {
  px = map(device.getSlider("X").getValue(), -1, 1, 0, width);
  py = map(device.getSlider("Y").getValue(), -1, 1, 0, height);
  trailOn = device.getButton("XBTN").pressed();
}
void draw() {
  String a = ("Welcome to GamePaint");
  textSize (30);
  fill (255, 300, 255);
  text (a, 110, 850);
  if (pageNumber==1) {
    fill(255, 0, 0);
    rect(0, 0, 200, 100);
    fill(0, 255, 0);
    rect(0, 400, 200, 100);  
    fill(0, 0, 255);
    rect(0, 800, 200, 100);
  }
  if (OKtoDraw == true) {
    if (device.getButton("XBTN").pressed()) {
      r=255;
      g=0;
      b=0;
      OKtoDraw=true;
      brushDiameter = 20;
      fill(r, g, b);
      ellipse(px, py, brushDiameter, brushDiameter);
    }
  }
  getUserInput();
  if (device.getButton("XBTN").pressed()) 
    rect (300, 400, 400, 200);
  r=255;
  g=0;
  b=0;                                         // So this is the part im struggling on.
  OKtoDraw=true;                             //The aim is so when i press X over the rect                              
  brushDiameter = 20;                        //with those coordinates, the px and py will 
  fill(r, g, b);                                 //leave a trail of red ellipses. 
  ellipse (px, py, brushDiameter, brushDiameter);
}
void handleButtonEvents(GImageButton button, GEvent event) {
  if (button == btnGhost)
    lblOut.setText("Ghosts - png images using transparency");
  else if (button == btnCoins)
    lblOut.setText("Coins -  png images using transparency");
}