Letzte Woche durchgesprochen und hier noch mal im Blog zum anschauen. Für alle Projekte die auf der Nutzereingabe von Name und Passwort basieren.

Wir nutzen dabei die von Andreas Schlegel geschriebene Bibliothek controlP5 – ideal für das Erstellen von simplen Benutzeroberflächen.
Nach dem Anlegen der beiden Textfelder im setup(), wird bei ENTER die Funktion controlEvent() aufgerufen. Innerhalb entscheidet die Länge der Text ob diese für die Verbindung zur API genutzt werden. In diesem Fall müssen beide Felder ausgefüllt sein.
Der letzte Schritt besteht im Ändern des ‘ready’ Wertes von false auf true. Dies veranlasst die Bedingung im draw() den eigentlichen Zeichenprozess (das Arbeiten mit den Daten) zu beginnen.

import utils.*;
import lastfm.*;
import controlP5.*;

ControlP5 c5;
Textfield tfName;
Textfield tfPass;
boolean ready = false;

Lastfm fm;

void setup () {
  size (580, 240);
  // Allgemeines ControlP5 Objekt
  c5 = new ControlP5 (this);
  // TextFelder für beide Werte Anlegen
  tfName = c5.addTextfield ("username", 20, 100, 200, 18);
  tfPass = c5.addTextfield ("userpass", 20, 140, 200, 18);
  // Passwort wird im Sternchenmodus angezeigt
  tfPass.setPasswordMode (true);
}

void draw () {
  background (40);
  if (ready) {
    // MAGIC!
  }
}

/**
 * Diese Funktion wird bei jeder ControlP5-Eingabe aufgerufen.
 * Das 'ControlEvent' gibt Aufschluss über den Auslöser und
 * damit über dessen Wert bzw. Zustand. In diesem Fall der Text.
 */
void controlEvent (ControlEvent theEvent) {
  String user = tfName.stringValue ();
  String pass = tfPass.stringValue ();

  // Wenn Textfeldinhalte jeweils länger als 0 sind
  if (user.length () > 0 && pass.length () > 0) {

    // GUI ausblenden
    tfName.hide ();
    tfPass.hide ();
    // API INITIALISIEREN
    fm = new Lastfm (user, pass, "xx", "xx");
    // Startschuss für den draw-Block geben
    ready = true;
  }
}