my team and i have a problem with the realization of our idea.
which is like this: processing gets images from flickr to one to three tags that you can enter in the text fields. this pretty much works somehow.
then processing should analyze the color pixels and put them out. we can see at this point the pictures that processing gets from flickr as pixel pictures.
after that we would like to sort the pixel after saturation, etc. we found this in the book »generative gestating«. final presentation should be that the pixel analyzation is shown separately  in one to three fields, depending on the amount of tags you entered.

i.e. you enter the words »snow«, »galaxy« and »forest« processing searches a certain amount of pictures from flickr, analyzes the color pixel and sorts all pixel from one word and its pictures in a rectangle. in the end you have 3 so called »color mood« rectangles from the accordingly tags, put out in a poster.

but the problem is that we can't combine all the stuff. it seems that only tag field 3 is working. and we can't accomplish sorting the pixel from ALL flickr pictures from one tag.

ok, sounds all a little bit chaotic but we hope you can help us! any hint is appreciated :)




here's our code so far:

import controlP5.*;
import generativedesign.*;

ControlP5 cp5;

ControlWindow controlWindow;

String keyWord01 = "";
String keyWord02 = "";
String keyWord03 = "";

String textValue = "";

String sortMode = null;


int colorBackround = color(175, 51, 113);


public int Slider01 = 100;
public int Slider02 = 100;
public int Slider03 = 100;

String searchWord = "wal";



String api = "http://api.flickr.com/services/rest/?method=flickr.tags.getClusterPhotos&";
PImage[] images;
color[] colors;
int imageIndex = 0;

PImage imgBgImage;


void setup() {
  size(913, 1291);

  PFont font = createFont("arial", 50);
 
 

  cp5 = new ControlP5(this);
 
imgBgImage = loadImage("bg.png");

  controlWindow = cp5.addControlWindow("controlP5window", 100, 100, 600, 320)
    .hideCoordinates()
      .setBackground(color(40))

        ;

  cp5.addSlider("Slider01")
    .setPosition(250, 35)
      .setWidth(250)
        .setRange(0, 100) // values can range from big to small as well
          .setValue(0)
            .setNumberOfTickMarks(10)
              .setSliderMode(Slider.FLEXIBLE)
                .setWindow(controlWindow);
  ;

  cp5.addSlider("Slider02")
    .setPosition(250, 105)
      .setWidth(250)
        .setRange(0, 100) // values can range from big to small as well
          .setValue(0)
            .setNumberOfTickMarks(10)
              .setSliderMode(Slider.FLEXIBLE)
                .setWindow(controlWindow);
  ;

  cp5.addSlider("Slider03")
    .setPosition(250, 175)
      .setWidth(250)
        .setRange(0, 100) // values can range from big to small as well
          .setValue(0)
            .setNumberOfTickMarks(10)
              .setSliderMode(Slider.FLEXIBLE)
                .setWindow(controlWindow);
  ;

  cp5.addTextfield("keyWord01")
    .setPosition(20, 20)
      .setSize(200, 40)
        .setFont(createFont("arial", 20))
          .setAutoClear(false)

            .setWindow(controlWindow)

              ;

  cp5.addTextfield("keyWord02")
    .setPosition(20, 90)
      .setSize(200, 40)
        .setFont(createFont("arial", 20))
          .setAutoClear(false)
            .setWindow(controlWindow)
              ;

  cp5.addTextfield("keyWord03")
    .setPosition(20, 160)
      .setSize(200, 40)
        .setFont(createFont("arial", 20))
          .setAutoClear(false)
            .setWindow(controlWindow)
              ;


  cp5.addButton("CLEAR")
    .setValue(0)
      .setPosition(140, 250)
        .setSize(80, 30)
          .setWindow(controlWindow)
            ;

  cp5.addButton("SEND")
    .setValue(0)
      .setPosition(20, 250)
        .setSize(100, 30)
          .setWindow(controlWindow)
            ;
  textFont(font);
}

void draw() {
  background(0);
  fill(255);
  noStroke();

  text(cp5.get(Textfield.class, "keyWord01").getText(), 20, 70);
  text(cp5.get(Textfield.class, "keyWord02").getText(), 20, 130);
  text(cp5.get(Textfield.class, "keyWord03").getText(), 20, 190);
  text(textValue, 360, 180);

  text(keyWord01, 360, 180);

  if (imageIndex > 0) {
    if (images[imageIndex] != null) {

      smashImage(images[imageIndex]);
    }
    fill(0);
    ellipse(15, 15, 20, 20);
    fill(255);
    text(imageIndex, 16, 14);
    if (frameCount % 60 == 0) { 
      imageIndex++;
      if (imageIndex >= images.length) {
        imageIndex = 1;
      }
    }
  }
}

void myTextfield(String theValue) {
  println(theValue);
}

void myWindowTextfield(String theValue) {
  println("from controlWindow: "+theValue);
}



public void CLEAR() {
  cp5.get(Textfield.class, "keyWord01").clear();
  cp5.get(Textfield.class, "keyWord02").clear();
  cp5.get(Textfield.class, "keyWord03").clear();
}


public void controlEvent(ControlEvent theEvent) {
  if (theEvent.getController().getName() == "SEND") {
    searchFlickr(cp5.get(Textfield.class, "keyWord01").getText());
  }
  if (theEvent.getController().getName() == "SEND") {
    searchFlickr(cp5.get(Textfield.class, "keyWord02").getText());
  }
  if (theEvent.getController().getName() == "SEND") {
    searchFlickr(cp5.get(Textfield.class, "keyWord03").getText());
  }
}


public void input(String theText) {
  // automatically receives results from controller input
  //println("a textfield event for controller 'input' : "+theText);
}

void searchFlickr(String theText) {
  String query = api + "tag=" + theText + "&cluster_id=1&format=rest&extras=url_o&api_key=bd7435660785b923332b224789d33c93";
  XMLElement xml = new XMLElement(this, query);
  XMLElement[] photoTag = xml.getChildren("photos/photo");
  println(photoTag.length + " images");

  images = new PImage[photoTag.length];

  // alte anzahl bilder
  // plus 5 neue bilder
  for (int i = 0; i < photoTag.length; i++) {
    String farm = photoTag[i].getString("farm");
    String server = photoTag[i].getString("server");
    String id = photoTag[i].getString("id");
    String secret = photoTag[i].getString("secret");
    String img = "http://farm"+farm+".static.flickr.com/"+server+"/"+id+"_"+secret+".jpg";
    images[i] = requestImage(img);
  }

  imageIndex = photoTag.length-1;
}


void smashImage(PImage originalImage) {


  PImage editedImage = originalImage;
  // FUNKTION ZUM BILD VERÄNDERN -> SORTIERALGORHITHMUS

  int tileCount = width / max(10, 10);
  float rectSize = width / float(tileCount);

  // get colors from image
  int i = 0;
  colors = new color[tileCount*tileCount];
  for (int gridY=0; gridY<tileCount; gridY++) {
    for (int gridX=0; gridX<tileCount; gridX++) {
      int px = (int) (gridX * rectSize);
      int py = (int) (gridY * rectSize);
      colors[i] = editedImage.get(px, py);
      i++;
    }
  }

  // sort colors
  if (sortMode != null) colors = GenerativeDesign.sortColors(this, colors, sortMode);

  // draw grid
  i = 0;
  for (int gridY=0; gridY<tileCount; gridY++) {
    for (int gridX=0; gridX<tileCount; gridX++) {
      fill(colors[i]);
      rect(gridX*rectSize, gridY*rectSize, rectSize, rectSize);
      i++;
    }




    // VERÄNDERTES BILD STATT DES ORIGINALS AUSGEBEN
    //image(images[imageIndex], 0, 0);
    //image(editedImage, 0, 0);
  }
}