2.2.1 - Loop preventing draw window from displaying anything

edited December 2015 in Arduino

Hey folks!

I have something that used to work when it was running inside of a serial event _(mostly not my code, I think it was on Adafruit):

void serialEvent( Serial myPort) {
  //put the incoming data into a String - 
  //the '\n' is our end delimiter indicating the end of a complete packet
  val = myPort.readStringUntil('\n');
  //make sure our data isn't empty before continuing
  if (val != null) {
    //trim whitespace and formatting characters (like carriage return)
    val = trim(val);
    println(val);

    //look for our 'A' string to start the handshake
    //if it's there, clear the buffer, and send a request for data
    if (firstContact == false) {
      if (val.equals("A")) {
        myPort.clear();
        firstContact = true;
        myPort.write("A");
        println("contact");
        fetchTweets();
      }
    } else { //if we've already established contact, keep getting and parsing data
      println(val);

      // ***These four lines are the only lines I added***
      // newNumber ensures that we don’t parse a tweet until we have one
      if (newNumber == true) {    
        drawTweets();
      }

     // when you've parsed the data you have, ask for more:
      myPort.write("A");

    }
  }
}

....but Processing would occasionally throw Serial errors, and it was pointed out to me that I was sending AND receiving to/from my Arduino, but all I really needed to do was send. I found some code from Dana Moser (http://www.curiousart.org/electronic2/code/34_Serial_Send_Arduino.html) which works a treat for sending.... but now I can’t put drawTweets(); in a Serial event and it seems that if I put it in the draw loop I get a blank screen (presumably because it’s working on sending all of the data I have to the Arduino until it draws the screen.

Even when I wrap it in the 'if' statement -- and immediately set newNumber to false -- no luck.

Any thoughts? Thanks!

Answers

  • Thanks GTL: that explains why it would throw errors -- but the problem is actually worse now that I’m not using serial event to do the drawing. Now I don’t even get a window at all UNLESS I comment out the fetchTweets() line:

    /**
    * ControlP5 Textfield
    * FROM https://forum.processing.org/two/discussion/1576/controlp5-basic-example-text-input-field
    * by Andreas Schlegel, 2013
    * www.sojamo.de/libraries/controlp5
    */
    
    import controlP5.*;
    ControlP5 cp5;
    
    ConfigurationBuilder cb = new ConfigurationBuilder();
    Twitter twitterInstance;
    Query queryForTwitter;
    
    import processing.serial.*; //import the Serial library
    Serial myPort;  //the Serial port object
    
    // If I comment out the below line I get a draw window
    // otherwise I get the tweets and everything runs
    // except the draw window
      fetchTweets(); // fetch tweets once initially
    
      cp5 = new ControlP5(this);
      cp5.addTextfield(".").setPosition(115, 240).setSize(800, 100).setAutoClear(true) .setFocus(true) .setFont(myFont);   
      // make the enter key a trigger
      cp5.mapKeyFor(new ControlKey() {public void keyEvent() { Submit(); }}, ENTER);
    
    }
    
    void draw() {
    
      // draw a box so that the type doesn’t continually draw over itself
      noStroke();
      fill(0,45,90);
      rect(100, 50, 1000, 200);
      // draw the text asking for a tweet, in white
      textAlign(CENTER, CENTER);
      noStroke();
      fill(255,255,255);
      textSize(40);
      text("Please enter a hashtag\nCurrent hashtag is #" + hashTag, width*0.5, height*0.5-180);
    
      // draw a box so that the hash doesn’t continually draw over itself
      noStroke();
      fill(0,45,90);
      rect(20,250,100,100);
      // draw the hash in front of the text field, in white
      fill(255,255,255);
      textSize(72);
      text("#", 75, 280);
    
      if (newHashTag.equals("not yet")) {
        // draw the blocking rectangle
        noStroke();
        fill(0,45,90);
        rect(100, 300, 1000, 200);
      } else {
        // if we do have a new tag, display the on-deck message
        noStroke();
        fill(0,45,90);
        rect(100, 300, 1000, 200);
    
        textAlign(CENTER, CENTER);
        noStroke();
        fill(255,255,255);
        textSize(40);
        text("Next hashtag will be\n#" + newHashTag, width*0.5, height*0.5 + 150);
      }
    
    }
    

    Obviously I’m leaving out a bunch of variables and functions, but as I say, everything works (println, adruino) except getting a draw window.

    Any more thoughts?

  • edited December 2015

    ... now that I’m not using serialEvent() to do the drawing.

    I hope you haven't actually removed serialEvent(). :-S
    The idea is we just notify that the event happened in some variable.
    And in turn, draw() checks out for that variable in some if () {...} block.
    Turn it off by assigning false to it and then act upon it.

  • I miss this line:

    void setup() {
    
  • draw a box so that the type doesn’t continually draw over itself

    ---> use

    background(0); 
    
  • GTL, I think I understand (and yes, I DID remove SerialEvent() entirely!) but I’m obviously still doing something wrong because even after moving the code out I still can’t get a draw window to show up (although everything else with the Arduino chugs along fine)...

    Here’s the code that works (it HAS a draw window and it accepts a new hashtag) ...until it throws a SerialEvent error. Maybe you can tell me how to remove it?

    /* * * ControlP5 Textfield * FROM https://forum.processing.org/two/discussion/1576/controlp5-basic-example-text-input-field * by Andreas Schlegel, 2013 * www.sojamo.de/libraries/controlp5 */

    import controlP5.*;
    ControlP5 cp5;
    
    PFont myFont;
    
    ConfigurationBuilder cb = new ConfigurationBuilder();
    Twitter twitterInstance;
    Query queryForTwitter;
    
    import processing.serial.*; //import the Serial library
    Serial myPort;  //the Serial port object
    
    Boolean didSerialEvent = false; // set a Boolean until we have serial contact
    
    ArrayList tweets;
    
    String hashTag = "happy";
    String newHashTag = "not yet";
    
    void setup() {
      size(1024, 600);
      background (0,45,90);
    
       // Open the port that the Arduino board is connected to (in this case #5)
       // Make sure to open the port at the same speed Arduino is using (9600bps)
        myPort = new Serial(this, Serial.list()[5], 9600);
    
      // TWITTER stuff here that works
    
      fetchTweets(); // fetch tweets once initially
    
      cp5 = new ControlP5(this);
      cp5.addTextfield(".").setPosition(115, 240).setSize(800, 100).setAutoClear(true) .setFocus(true) .setFont(myFont);   
      // make the enter key a trigger
      cp5.mapKeyFor(new ControlKey() {public void keyEvent() { Submit(); }}, ENTER);
    
    }
    
    void draw() {
    
      // draw a box so that the type doesn’t continually draw over itself
      noStroke();
      fill(0,45,90);
      rect(100, 50, 1000, 200);
      // draw the text asking for a tweet, in white
      textAlign(CENTER, CENTER);
      noStroke();
      fill(255,255,255);
      textSize(40);
      text("Please enter a hashtag\nCurrent hashtag is #" + hashTag, width*0.5, height*0.5-180);
    
      // draw a box so that the hash doesn’t continually draw over itself
      noStroke();
      fill(0,45,90);
      rect(20,250,100,100);
      // draw the hash in front of the text field, in white
      fill(255,255,255);
      textSize(72);
      text("#", 75, 280);
    
      if (newHashTag.equals("not yet")) {
        // draw the blocking rectangle
        noStroke();
        fill(0,45,90);
        rect(100, 300, 1000, 200);
      } else {
        // if we do have a new tag, display the on-deck message
        noStroke();
        fill(0,45,90);
        rect(100, 300, 1000, 200);
    
        textAlign(CENTER, CENTER);
        noStroke();
        fill(255,255,255);
        textSize(40);
        text("Next hashtag will be\n#" + newHashTag, width*0.5, height*0.5 + 150);
      }
    
    }
    
    // ******************************************************************
    // ******************************************************************
    // *** I know that this is the stuff that I need to take out of here, 
    // *** but how exactly?
    // ******************************************************************
    // ******************************************************************
    
    void serialEvent( Serial myPort) {
      //put the incoming data into a String - 
      //the '\n' is our end delimiter indicating the end of a complete packet
      val = myPort.readStringUntil('\n');
      //make sure our data isn't empty before continuing
      if (val != null) {
        //trim whitespace and formatting characters (like carriage return)
        val = trim(val);
        println(val);
    
        //look for our 'A' string to start the handshake
        //if it's there, clear the buffer, and send a request for data
        if (firstContact == false) {
          if (val.equals("A")) {
            myPort.clear();
            firstContact = true;
            myPort.write("A");
            println("contact");
            fetchTweets();
          }
        } else { //if we've already established contact, keep getting and parsing data
          println(val);
    
          // newNumber ensures that we don’t parse a tweet until we have one
          if (newNumber == true) {    
            parseTweets();
            drawTweets();
          }
    
         // when you've parsed the data you have, ask for more:
          myPort.write("A");
    
        }
      }
    }
    
    // ******************************************************************
    // ******************************************************************
    
    void fetchTweets() {
      println("fetching tweets...");
      // add the Hash so that user only needs to enter a tag
      queryForTwitter = new Query("#" + hashTag);
      println("hashTag " + hashTag + " should be the same as " + newHashTag);
      try {
        QueryResult result = twitterInstance.search(queryForTwitter);
        tweets = (ArrayList) result.getTweets();
        // set newNumber to true since we have a tweet
        drawTweets();
      } 
      catch(TwitterException te) {
        println("Couldn't connect: "+te);
      }
    }
    
    void drawTweets() {
      //stuff here that works
      // **********************  fetchTweets() after everything is done
    }
    
    void Submit() {
      //stuff here that works
    }
    
    
    void transToBinary() {
        //stuff here that works
    }
    

    I tried just moving it out like so, but that didn’t quite work -- I get a window but nothing drawn in it:

    /**
    * ControlP5 Textfield
    * FROM https://forum.processing.org/two/discussion/1576/controlp5-basic-example-text-input-field
    * by Andreas Schlegel, 2013
    * www.sojamo.de/libraries/controlp5
    */
    
    import controlP5.*;
    ControlP5 cp5;
    
    PFont myFont;
    
    ConfigurationBuilder cb = new ConfigurationBuilder();
    Twitter twitterInstance;
    Query queryForTwitter;
    
    import processing.serial.*; //import the Serial library
    Serial myPort;  //the Serial port object
    String val;
    boolean serialTrigger = false;
    
    boolean newNumber = false;
    
    ArrayList tweets;
    
    String hashTag = "happy";
    String newHashTag = "not yet";
    
    void setup() {
      size(1024, 600);
      background (0,45,90);
    
      //stuff here that works
    
      fetchTweets(); // fetch tweets once initially
    
      cp5 = new ControlP5(this);
      cp5.addTextfield(".").setPosition(115, 240).setSize(800, 100).setAutoClear(true) .setFocus(true) .setFont(myFont);   
      // make the enter key a trigger
      cp5.mapKeyFor(new ControlKey() {public void keyEvent() { Submit(); }}, ENTER);
    
    }
    
    void draw() {
      //we can leave the draw method empty, 
      //because all our programming happens in the serialEvent (see below)
    
      // draw a box so that the type doesn’t continually draw over itself
      noStroke();
      fill(0,45,90);
      rect(100, 50, 1000, 200);
      // draw the text asking for a tweet, in white
      textAlign(CENTER, CENTER);
      noStroke();
      fill(255,255,255);
      textSize(40);
      text("Please enter a hashtag\nCurrent hashtag is #" + hashTag, width*0.5, height*0.5-180);
    
      // draw a box so that the hash doesn’t continually draw over itself
      noStroke();
      fill(0,45,90);
      rect(20,250,100,100);
      // draw the hash in front of the text field, in white
      fill(255,255,255);
      textSize(72);
      text("#", 75, 280);
    
      if (newHashTag.equals("not yet")) {
        // draw the blocking rectangle
        noStroke();
        fill(0,45,90);
        rect(100, 300, 1000, 200);
      } else {
        // if we do have a new tag, display the on-deck message
        noStroke();
        fill(0,45,90);
        rect(100, 300, 1000, 200);
    
        textAlign(CENTER, CENTER);
        noStroke();
        fill(255,255,255);
        textSize(40);
        text("Next hashtag will be\n#" + newHashTag, width*0.5, height*0.5 + 150);
      }
    
      if (serialTrigger == true) {
        serialCode();
      }
    
    }
    
    void serialEvent( Serial myPort) {
      serialTrigger = true;
    }
    
    void serialCode() {
      serialTrigger = false;
        fetchTweets();
        println(val);
    
          // newNumber ensures that we don’t parse a tweet until we have one
          if (newNumber == true) {    
            drawTweets();
          }
    
         serialTrigger = true;
    
    }
    
    void fetchTweets() {
      //stuff here that works
    }
    
    void drawTweets() {
        //stuff here that works
        fetchTweets();
    }
    
    void Submit() {
      //stuff here that works
    }
    

    Thanks for all the help!

  • And Chrisir -- I accidentally deleted setup when I was cutting my code, but it IS in the real stuff; and it doesn’t matter what color the background is, if you put type in the draw window without covering it each time it comes around it draws over itself until there’s no anti-aliasing and it’s just crummy jagged type. At least, in my experience.

Sign In or Register to comment.