diff --git a/CitizenClass.pde b/CitizenClass.pde
index 63491ee..2f7e5dd 100644
--- a/CitizenClass.pde
+++ b/CitizenClass.pde
@@ -7,7 +7,7 @@ class Citizen {
   int i_home;
   String S_name;
   float f_xPos, f_yPos;
-  float f_movementSpeed = 0.1;
+  float f_movementSpeed = 10;
   //0-100:
   //motivation (bei arbeiter montag ~40, freitag ~80 - 100)
   //7 emotionen?
@@ -38,7 +38,7 @@ class Citizen {
     f_yPos = i_ySpawn;
     rNodes = pathFinder.getRoute(); 
 
-    if (b_randomRun) goTo(int(random(0, width)), int(random(0, height)));
+    if (b_randomRun) goTo(int(random(0, pg_map.width)), int(random(0, pg_map.height)));
     b_linked = true;
   }
 
@@ -82,33 +82,32 @@ class Citizen {
       } else {
         b_moving = false;
         nextNode = 0;
-        if (b_randomRun)goTo(int(random(0, width)), int(random(0, height)));
+        if (b_randomRun)goTo(int(random(0, pg_map.width)), int(random(0, pg_map.height)));
       }
     }
   }
 
   void display() {
-    ellipse(f_xPos, f_yPos, i_diameter, i_diameter);
-    textSize(10);
-    text(S_name, f_xPos, f_yPos-10);
-
     //draw Route
     if (rNodes.length >= 2 && (b_drawPathLine || b_drawPathDestination)) {
-      pushStyle();
+      pg_map.pushStyle();
       if (b_drawPathLine) {
-        stroke(color(100, 100, 100));
-        strokeWeight(1);
-        noFill();
+        pg_map.stroke(color(100, 100, 100));
+        pg_map.strokeWeight(1);
+        pg_map.noFill();
         for (int i = 1; i < rNodes.length; i++)
-          line(rNodes[i-1].xf(), rNodes[i-1].yf(), rNodes[i].xf(), rNodes[i].yf());
+          pg_map.line(rNodes[i-1].xf(), rNodes[i-1].yf(), rNodes[i].xf(), rNodes[i].yf());
       }
       if (b_drawPathDestination) {
-        stroke(160, 0, 0);
-        fill(255, 0, 0);
-        ellipse(rNodes[rNodes.length-1].xf(), rNodes[rNodes.length-1].yf(), nodeSize, nodeSize);
+        pg_map.stroke(160, 0, 0);
+        pg_map.fill(255, 0, 0);
+        pg_map.ellipse(rNodes[rNodes.length-1].xf(), rNodes[rNodes.length-1].yf(), nodeSize, nodeSize);
       }
-      popStyle();
+      pg_map.popStyle();
     }
+    pg_map.ellipse(f_xPos, f_yPos, i_diameter, i_diameter);
+    pg_map.textSize(10);
+    pg_map.text(S_name, f_xPos, f_yPos-10);
   }
 
   GraphNode startNode, endNode;
@@ -145,7 +144,7 @@ class Citizen {
         rNodesList.add(rNodes[i]);
       }
     } else {
-      if (b_randomRun) goTo(int(random(0, width)), int(random(0, height)));
+      if (b_randomRun) goTo(int(random(0, pg_map.width)), int(random(0, pg_map.height)));
     }
   }
 }
diff --git a/Map.pde b/Map.pde
index 2ec1657..35ffc07 100644
--- a/Map.pde
+++ b/Map.pde
@@ -3,6 +3,8 @@ import pathfinder.*;
 
 PImage img_houses;
 PImage img_streets;
+PGraphics pg_map;
+int i_mapOffsetX, i_mapOffsetY, i_mapOffsetStartX, i_mapOffsetStartY;
 int i_biggestHouseSize;
 
 ArrayList<House> houses = new ArrayList<House>();
@@ -21,8 +23,8 @@ void initHouses() {
     }
   }
   img_houses.updatePixels();
-  for(House house : houses){
-    house.i_size = int(map(house.i_size,0,i_biggestHouseSize,0,100));
+  for (House house : houses) {
+    house.i_size = int(map(house.i_size, 0, i_biggestHouseSize, 0, 100));
   }
 }
 
@@ -30,13 +32,13 @@ class House {
   PVector v2_center;
   int i_size;
   int i_ID;
-  
-  void display(){
+
+  void display() {
     //text(i_size,v2_center.x,v2_center.y);
-    text(i_ID,v2_center.x,v2_center.y);
+    text(i_ID, v2_center.x, v2_center.y);
   }
-  
-  
+
+
   ArrayDeque<PVector> v2d_selected = new ArrayDeque<PVector>();
   ArrayList<PVector> v2d_points = new ArrayList<PVector>();
   boolean isToSelect(int px, int py, int[] pxl, int pw, int ph, int orgColor) {
@@ -44,10 +46,10 @@ class House {
       return false;
     return pxl[px + py * pw] == orgColor;
   }
-  PVector v2_randomSpawnPoint(){
-    return v2d_points.get(int(random(0,v2d_points.size())));
+  PVector v2_randomSpawnPoint() {
+    return v2d_points.get(int(random(0, v2d_points.size())));
   }
-  
+
   House(int startX, int startY) {
     i_ID = houses.size();
     int [] pxl = img_houses.pixels;
@@ -75,14 +77,13 @@ class House {
       }
     }
     i_size = v2d_points.size();
-    PVector avgPoint = new PVector(0,0);
+    PVector avgPoint = new PVector(0, 0);
     for (PVector point : v2d_points) {
       avgPoint.add(point);
     }
     avgPoint.x = avgPoint.x/i_size;
     avgPoint.y = avgPoint.y/i_size;
     v2_center = avgPoint;
-    if(i_size > i_biggestHouseSize) i_biggestHouseSize = i_size;
+    if (i_size > i_biggestHouseSize) i_biggestHouseSize = i_size;
   }
-  
 }
diff --git a/PathFinding.pde b/PathFinding.pde
index 6580c95..fd2f544 100644
--- a/PathFinding.pde
+++ b/PathFinding.pde
@@ -132,12 +132,12 @@ IGraphSearch makePathFinder(Graph graph, int pathFinder) {
 }
 
 void drawNodes(){
-  pushStyle();
-  noStroke();
-  fill(255,0,255,72);
+  pg_map.pushStyle();
+  pg_map.noStroke();
+  pg_map.fill(255,0,255,72);
   for(GraphNode node : gNodes)
-    ellipse(node.xf(), node.yf(), nodeSize, nodeSize);
-  popStyle();
+    pg_map.ellipse(node.xf(), node.yf(), nodeSize, nodeSize);
+  pg_map.popStyle();
 }
 
 
@@ -166,16 +166,16 @@ void drawArrow(GraphNode fromNode, GraphNode toNode, float nodeRad, float arrowS
   awidthx = - (ey - ay);
   awidthy = ex - ax;
 
-  noFill();
-  strokeWeight(4.0f);
-  stroke(160, 128);
-  line(sx,sy,ax,ay);
+  pg_map.noFill();
+  pg_map.strokeWeight(4.0f);
+  pg_map.stroke(160, 128);
+  pg_map.line(sx,sy,ax,ay);
 
-  noStroke();
-  fill(48, 128);
-  beginShape(TRIANGLES);
-  vertex(ex, ey);
-  vertex(ax - awidthx, ay - awidthy);
-  vertex(ax + awidthx, ay + awidthy);
-  endShape();
+  pg_map.noStroke();
+  pg_map.fill(48, 128);
+  pg_map.beginShape(TRIANGLES);
+  pg_map.vertex(ex, ey);
+  pg_map.vertex(ax - awidthx, ay - awidthy);
+  pg_map.vertex(ax + awidthx, ay + awidthy);
+  pg_map.endShape();
  }
diff --git a/UI.pde b/UI.pde
index 1494c16..5315b60 100644
--- a/UI.pde
+++ b/UI.pde
@@ -1,10 +1,102 @@
-void UI() {
+void initUI() {
+  i_uiX = 0;
+  i_uiY = 420;
+  i_uiW = width;
+  i_uiH = height - i_uiY;
+}
 
+int i_uiX, i_uiY, i_uiW, i_uiH;
+int i_uiOffsetX, i_uiOffsetY, i_uiOffsetStartX, i_uiOffsetStartY, i_initUiY;
+void drawUI() {
+  strokeWeight(1);
+  line(i_uiX, i_uiY, i_uiX+i_uiW, i_uiY);
+  strokeWeight(0);
+  fill(255, 230);
+  rect(i_uiX, i_uiY, i_uiW, i_uiH);
+
+
+  fill(0);
   textSize(30);
   textAlign(LEFT);
+  text(String.format("%02d", hour()) + ":" + String.format("%02d", minute()) + ":" + String.format("%02d", second()), 10, 30);
 
-  text(String.format("%02d",hour()) + ":" + String.format("%02d",minute()) + ":" + String.format("%02d",second()), 10, 30);
   textSize(15);
-  text("FPS: " + int(frameRate), 10, 45);
-  
+  text("FPS: " + int(frameRate), 10, i_uiY + 15);
+}
+
+boolean b_mouseChangeMapOffset, b_mouseChangeUiHeight;
+boolean b_hoverUI;
+
+void mousePressed() {
+  if (mouseButton == LEFT) {
+    if (mouseX >= i_uiX && mouseX <= i_uiX+i_uiW && mouseY >= i_uiY-10 && mouseY <= i_uiY+10) {
+      b_mouseChangeUiHeight = true;
+      i_uiOffsetStartY = mouseY;
+      i_initUiY = i_uiY;
+    } else {
+    }
+  }
+  if (mouseButton == CENTER) {
+    b_mouseChangeMapOffset = true;
+    i_mapOffsetStartX = mouseX - i_mapOffsetX;
+    i_mapOffsetStartY = mouseY - i_mapOffsetY;
+  }
+  if (mouseButton == RIGHT) {
+    if (b_mapZoom)
+      citizen[0].goTo(constrain((mouseX-i_mapOffsetX)*2, 0, pg_map.width), constrain((mouseY-i_mapOffsetY)*2, 0, pg_map.height));
+    else 
+    citizen[0].goTo(constrain(mouseX-i_mapOffsetX, 0, pg_map.width), constrain(mouseY-i_mapOffsetY, 0, pg_map.height));
+  }
+}
+void mouseDragged() {
+  if (b_mouseChangeMapOffset) {
+    i_mapOffsetX = (mouseX - i_mapOffsetStartX);
+    i_mapOffsetY = (mouseY - i_mapOffsetStartY);
+  }
+  if (b_mouseChangeUiHeight) {
+    i_uiY = mouseY - i_uiOffsetStartY + i_initUiY;
+    if (i_uiY > height) i_uiY = height;
+    i_uiH = height - i_uiY;
+  }
+}
+void mouseReleased() {
+  b_mouseChangeMapOffset = false;
+  b_mouseChangeUiHeight = false;
+}
+
+
+//bad
+//int maxScale = 5;
+//float zoomFactor = 0.4;
+//int i_imgCenterX;
+//int i_imgCenterY;
+int i_mapScale = 1;
+boolean b_mapZoom;
+float e;
+void mouseWheel(MouseEvent event) {
+  e = event.getAmount();
+
+  if (e == -1) {
+    i_mapScale+=1;
+  }
+  if (e == 1) {
+    i_mapScale-=1;
+  }
+  constrain(i_mapScale, 0, 2);
+  switch(int(e)) {
+  case 1:
+    if (!b_mapZoom) {
+      i_mapW = pg_map.width/2;
+      i_mapH = pg_map.height/2;
+      i_mapOffsetX -= 3*i_mapOffsetX/4;
+      i_mapOffsetY -= 3*i_mapOffsetY/4;
+      b_mapZoom = true;
+    }
+    break;
+  case -1:
+    i_mapW = pg_map.width;
+    i_mapH = pg_map.height;
+    b_mapZoom = false;
+    break;
+  }
 }
diff --git a/archive/citizen_pgraph/archive/citizen_blobdetect/citizen_blobdetect.pde b/archive/citizen_pgraph/archive/citizen_blobdetect/citizen_blobdetect.pde
deleted file mode 100644
index 133cb13..0000000
--- a/archive/citizen_pgraph/archive/citizen_blobdetect/citizen_blobdetect.pde
+++ /dev/null
@@ -1,74 +0,0 @@
-PImage img_houses;
-
-void setup() {
-  size(400, 300);
-  textSize(30);
-  fill(0);
-
-  img_houses = loadImage(dataPath("map/houses_with_borders.png"));
-
-  surface.setSize(img_houses.width, img_houses.height);
-}
-
-void mousePressed() {
-  img_houses.loadPixels();
-  if (int(red(img_houses.pixels[mouseY*img_houses.width+mouseX])) == 187) {
-    println("clicked on house");
-    spawnAreas.add(new SpawnArea(mouseX, mouseY));
-  }
-  img_houses.updatePixels();
-}
-
-ArrayList<SpawnArea> spawnAreas = new ArrayList<SpawnArea>();
-
-
-class SpawnArea {
-  //simplified hull?
-  ArrayList<PVector> v2_points = new ArrayList<PVector>();
-
-  SpawnArea(int startX, int startY) {
-    int x = startX;
-    int y = startY;
-    
-    v2_points.add(new PVector(x, y));
-    
-   
-    
-    //while (int(red(img_houses.pixels[y*img_houses.width+x])) == 187) {
-    //  y++;
-    //  v2_points.add(new PVector(x, y));
-
-    //  while (int(red(img_houses.pixels[y*img_houses.width+x])) == 187) {
-    //    v2_points.add(new PVector(x, y)); 
-    //    y++;
-    //  }
-      
-    //  y = startY;
-
-    //  x++;
-    //}
-
-    //x = startX-1;
-    //y = startY+1;
-    //while(int(red(img_houses.pixels[y*img_houses.width+x])) == 187){
-    //  v2_points.add(new PVector(x, y));
-    //  x--;
-    //}
-    
-    
-  }
-}
-
-
-void draw() {
-  background(255);
-  image(img_houses, 0, 0, img_houses.width, img_houses.height);
-  for (SpawnArea spawn : spawnAreas) {
-
-    for (PVector point : spawn.v2_points) {
-      point(point.x, point.y);
-    }
-  }
-
-  text(int(frameRate), 0, 30);
-}
diff --git a/archive/citizen_pgraph/archive/citizen_blobdetect/data/map/houses_with_borders.png b/archive/citizen_pgraph/archive/citizen_blobdetect/data/map/houses_with_borders.png
deleted file mode 100644
index 0796857..0000000
Binary files a/archive/citizen_pgraph/archive/citizen_blobdetect/data/map/houses_with_borders.png and /dev/null differ
diff --git a/archive/citizen_pgraph/archive/citizen_blobdetect2/Houses.pde b/archive/citizen_pgraph/archive/citizen_blobdetect2/Houses.pde
deleted file mode 100644
index 970ae9c..0000000
--- a/archive/citizen_pgraph/archive/citizen_blobdetect2/Houses.pde
+++ /dev/null
@@ -1,90 +0,0 @@
-import java.util.ArrayDeque;
-
-PImage img_houses;
-PImage img_spawnPoints;
-int i_biggestHouse;
-
-ArrayList<SpawnArea> spawnAreas = new ArrayList<SpawnArea>();
-
-void initHouses() {
-  
-  //get houses from image
-  img_houses = loadImage(dataPath("map/houses_with_borders.png"));
-
-
-  img_houses.loadPixels();
-  for (int x = 0; x < img_houses.width; x++) {
-    for (int y = 0; y < img_houses.height; y++) {
-      if (int(red(img_houses.pixels[y*img_houses.width+x])) == 187) { //red must be 187 for a pixel to be part of a house
-        spawnAreas.add(new SpawnArea(x, y));
-        img_houses.updatePixels();
-        img_houses.loadPixels();
-      }
-    }
-  }
-  img_houses.updatePixels();
-  for(SpawnArea spawn : spawnAreas){
-    spawn.i_size = int(map(spawn.i_size,0,i_biggestHouse,0,100));
-  }
-  
-}
-
-class SpawnArea {
-  
-  
-  PVector v2_center;
-  int i_size;
-  
-  void display(){
-    text(i_size,v2_center.x,v2_center.y);
-  }
-  
-  
-  
-  ArrayDeque<PVector> v2d_selected = new ArrayDeque<PVector>();
-  ArrayList<PVector> v2d_points = new ArrayList<PVector>();
-  boolean isToSelect(int px, int py, int[] pxl, int pw, int ph, int orgColor) {
-    if (px < 0 || px >= pw || py < 0 || py >= ph)
-      return false;
-    return pxl[px + py * pw] == orgColor;
-  }
-  
-  SpawnArea(int startX, int startY) {
-    int [] pxl = img_houses.pixels;
-    int pw = img_houses.width;
-    int ph = img_houses.height;
-    int orgColor = pxl[startX + startY * pw];
-    PVector v2_p = new PVector(startX, startY);
-    color randCol = color(int(random(0, 255)), int(random(0, 255)), int(random(0, 255)));
-    v2d_selected.add(v2_p);
-    int west, east;
-    while (!v2d_selected.isEmpty () ) { //&& q.size() < 500) {
-      v2_p = v2d_selected.removeFirst();
-      if (isToSelect(int(v2_p.x), int(v2_p.y), pxl, pw, ph, orgColor)) {
-        west = east = int(v2_p.x);
-        while (isToSelect(--west, int(v2_p.y), pxl, pw, ph, orgColor));
-        while (isToSelect(++east, int(v2_p.y), pxl, pw, ph, orgColor));
-        for (int x = west + 1; x < east; x++) {
-          v2d_points.add(new PVector(x, int(v2_p.y)));
-          pxl[x + int(v2_p.y) * pw] = color(188, 188, 188); //important for not selecting the same area more than once
-          if (isToSelect(x, int(v2_p.y) - 1, pxl, pw, ph, orgColor))
-            v2d_selected.add(new PVector(x, int(v2_p.y) - 1));
-          if (isToSelect(x, int(v2_p.y) + 1, pxl, pw, ph, orgColor))
-            v2d_selected.add(new PVector(x, v2_p.y + 1));
-        }
-      }
-    }
-    i_size = v2d_points.size();
-    PVector avgPoint = new PVector(0,0);
-    for (PVector point : v2d_points) {
-      avgPoint.add(point);
-    }
-    avgPoint.x = avgPoint.x/i_size;
-    avgPoint.y = avgPoint.y/i_size;
-    v2_center = avgPoint;
-    
-    if(i_size > i_biggestHouse) i_biggestHouse = i_size;
-    
-  }
-  
-}
diff --git a/archive/citizen_pgraph/archive/citizen_blobdetect2/UI.pde b/archive/citizen_pgraph/archive/citizen_blobdetect2/UI.pde
deleted file mode 100644
index 500064a..0000000
--- a/archive/citizen_pgraph/archive/citizen_blobdetect2/UI.pde
+++ /dev/null
@@ -1,5 +0,0 @@
-void UI() {
-
-  textSize(30);
-  text(int(frameRate), 30, 30);
-}
diff --git a/archive/citizen_pgraph/archive/citizen_blobdetect2/citizen_blobdetect2.pde b/archive/citizen_pgraph/archive/citizen_blobdetect2/citizen_blobdetect2.pde
deleted file mode 100644
index 5797336..0000000
--- a/archive/citizen_pgraph/archive/citizen_blobdetect2/citizen_blobdetect2.pde
+++ /dev/null
@@ -1,24 +0,0 @@
-
-void setup() {
-  size(400, 300);
-  textAlign(CENTER);
-  fill(0);
-  
-  
-  initHouses();
-  
-  surface.setSize(img_houses.width, img_houses.height);
-}
-
-
-void draw() {
-  background(255);
-  image(img_houses, 0, 0, img_houses.width, img_houses.height);
-  textSize(7);
-  for (SpawnArea spawn : spawnAreas) {
-    spawn.display();
-  }
-  
-
-  UI();
-}
diff --git a/archive/citizen_pgraph/archive/citizen_blobdetect2/data/map/houses_with_borders_small.png b/archive/citizen_pgraph/archive/citizen_blobdetect2/data/map/houses_with_borders_small.png
deleted file mode 100644
index 0796857..0000000
Binary files a/archive/citizen_pgraph/archive/citizen_blobdetect2/data/map/houses_with_borders_small.png and /dev/null differ
diff --git a/archive/citizen_pgraph/archive/citizen_floodfill/citizen_floodfill.pde b/archive/citizen_pgraph/archive/citizen_floodfill/citizen_floodfill.pde
deleted file mode 100644
index 6a58977..0000000
--- a/archive/citizen_pgraph/archive/citizen_floodfill/citizen_floodfill.pde
+++ /dev/null
@@ -1,91 +0,0 @@
-import java.util.ArrayDeque;
- 
-PImage img;
-ArrayDeque<Point> q = new ArrayDeque<Point>();
- 
-public void setup() {
-  size(400, 400, P2D);
-  img = makeImage();
-}
- 
-public void draw() {
-  background(255);
-  image(img, 0, 0);
-}
- 
-public void mouseClicked() {
-  // Flood fill with random colour
-  int c = (int)(random(1, 0xFFFFFF)) | 0xFF000000;
-  floodFill(img, mouseX, mouseY, c);
-}
- 
-void floodFill(PImage picture, int orgX, int orgY, int newColor) {
-  int pw = picture.width;
-  int ph = picture.height;
-  if (orgX < 0 || orgX >= pw || orgY < 0 || orgY >= ph)
-    return;
-  picture.loadPixels();
-  int [] pxl = picture.pixels;
-  int orgColor = pxl[orgX + orgY * pw];
-  // Stop if the color is not being changed.
-  if (newColor == orgColor)
-    return;
-  // Proceed with flood fill
-  Point p = new Point(orgX, orgY);
-  q.add(p);
-  int west, east;
-  while (!q.isEmpty () ) { //&& q.size() < 500) {
-    p = q.removeFirst();
-    if (isToFill(p.x, p.y, pxl, pw, ph, orgColor)) {
-      west = east = p.x;
-      while (isToFill(--west, p.y, pxl, pw, ph, orgColor));
-      while (isToFill(++east, p.y, pxl, pw, ph, orgColor));
-      for (int x = west + 1; x < east; x++) {
-        pxl[x + p.y * pw] = newColor;
-        if (isToFill(x, p.y - 1, pxl, pw, ph, orgColor))
-          q.add(new Point(x, p.y - 1));
-        if (isToFill(x, p.y + 1, pxl, pw, ph, orgColor))
-          q.add(new Point(x, p.y + 1));
-      }
-    }
-  }
-  picture.updatePixels();
-}
- 
-// Returns true if the specified pixel requires filling
-boolean isToFill(int px, int py, int[] pxl, int pw, int ph, int orgColor) {
-  if (px < 0 || px >= pw || py < 0 || py >= ph)
-    return false;
-  return pxl[px + py * pw] == orgColor;
-}
- 
-// Make a simple image to test the flood fill function
-PImage makeImage() {
-  PGraphics pg = createGraphics(width, height, P2D);
-  pg.noSmooth();
-  pg.beginDraw();
-  pg.background(255);
-  pg.fill(255, 200, 200);
-  pg.noStroke();
-  pg.ellipse(width/2, height/3, 0.4f*width, 0.4f*height);
-  pg.ellipse(width/3, height/1.8f, 0.4f*width, 0.4f*height);
-  pg.ellipse(2*width/3, height/1.8f, 0.4f*width, 0.4f*height);
-  pg.fill(255, 255, 200);
-  pg.ellipse(width/2, height/2, 0.2f*width, 0.2f*height);
-  pg.endDraw();
-  return pg.get();
-}
- 
-// Could use java.awt.Point instead
-class Point {
-  int x, y;
- 
-  public Point(int x, int y) {
-    this.x = x;
-    this.y = y;
-  }
- 
-  public String toString() {
-    return "[" + x + ", " + y + "]";
-  }
-}
diff --git a/archive/citizen_pgraph/archive/citizen_floodfill/data/map/houses_with_borders.png b/archive/citizen_pgraph/archive/citizen_floodfill/data/map/houses_with_borders.png
deleted file mode 100644
index 0796857..0000000
Binary files a/archive/citizen_pgraph/archive/citizen_floodfill/data/map/houses_with_borders.png and /dev/null differ
diff --git a/archive/citizen_pgraph/archive/citizen_floodfill2/citizen_floodfill2.pde b/archive/citizen_pgraph/archive/citizen_floodfill2/citizen_floodfill2.pde
deleted file mode 100644
index e471143..0000000
--- a/archive/citizen_pgraph/archive/citizen_floodfill2/citizen_floodfill2.pde
+++ /dev/null
@@ -1,57 +0,0 @@
-PImage img;
-
-int diff;
-int px;
-color fillC;
-color test;
-
-void setup()
-{
-  size(400, 300);
-  img = loadImage("map/houses_with_borders.png");
-  surface.setSize(img.width, img.height);
-  stroke(255,0,0);
-  noFill();
-  px = width*height;
-  fillC = color(255,0,0);
-  diff = 50;
-}
-
-int l(int x, int y){
-  return x + (y * width);
-}
-
-color[] flood(int x, int y, color[] pixel){
-  if(x<0 || x>= width || y < 0 || y >= height) return pixel;
-  
-  float rt = red(test);
-  float gt = green(test);
-  float bt = blue(test);
-  
-  float rc = red(pixel[l(x, y)]);
-  float gc = green(pixel[l(x, y)]);
-  float bc = blue(pixel[l(x, y)]);
-  
-  if(dist(rt, gt, bt, rc, gc, bc) <= diff){
-    println(dist(rt, gt, bt, rc, gc, bc));
-    pixel[l(x, y)] = fillC;
-    
-    pixel = flood(x+1, y, pixel);
-    pixel = flood(x-1, y, pixel);
-    pixel = flood(x, y+1, pixel);
-    pixel = flood(x, y-1, pixel);
-  }
-  return pixel;
-}
-
-void draw() {
-  if(mousePressed){
-    img.loadPixels();
-    
-    test = img.pixels[l(mouseX, mouseY)];
-    img.pixels = flood(mouseX, mouseY, img.pixels);
-    
-    img.updatePixels();
-  }
-  image(img, 0, 0, width, height);
-}
diff --git a/archive/citizen_pgraph/archive/citizen_floodfill2/data/map/houses_with_borders.png b/archive/citizen_pgraph/archive/citizen_floodfill2/data/map/houses_with_borders.png
deleted file mode 100644
index 0796857..0000000
Binary files a/archive/citizen_pgraph/archive/citizen_floodfill2/data/map/houses_with_borders.png and /dev/null differ
diff --git a/archive/citizen_pgraph/archive/citizen_pathfinding/citizen_pathfinding.pde b/archive/citizen_pgraph/archive/citizen_pathfinding/citizen_pathfinding.pde
deleted file mode 100644
index f97e8d2..0000000
--- a/archive/citizen_pgraph/archive/citizen_pathfinding/citizen_pathfinding.pde
+++ /dev/null
@@ -1,73 +0,0 @@
-Citizen mensch;
-
-
-
-PImage img_houses;
-
-void setup() {
-  size(400, 300);
-  fill(0);
-  //ft = new SimpleDateFormat ("HH:mm:ss");
-
-  img_houses = loadImage(dataPath("houses_with_borders_small.png"));
-
-
-  blendMode(MULTIPLY);
-
-  surface.setSize(img_houses.width, img_houses.height);
-  
-}
-
-class Citizen{
-  int i_xSpawn, i_ySpawn, i_xPos, i_yPos, i_diameter;
-  boolean b_linked;
-  int i_home;
-  String S_name;
-  
-  
-  //0-100:
-  //motivation (bei arbeiter montag ~40, freitag ~80 - 100)
-  //7 emotionen?
-  
- // berufsfeld: webdesigner, pädagoge, schmuckdesigner, schmied
- // berufsstatus: beamter, selbstständiger, unternehmer, angestellter, grundschüler, gymnasiast, hauptschüler, realschüler, azubi, student, rentner
- 
- // identität: gelbhemd, lokal, regional, national, international, fremd, 
-
-  //names of pathfinding algorithms: greedy best first search, uniform cost search, a star search
-
-  Citizen(int home, String name){
-    i_home = home;
-    S_name = name;
-    i_diameter = 15;
-  }
-  
-  void goTo(int house){
-    println("want to go to house " + house);
-  }
-  
-  void spawn(int house){
-    PVector v2_spawnPoint = spawnAreas.get(house).v2_randomSpawnPoint();
-    i_xSpawn = int(v2_spawnPoint.x);
-    i_ySpawn = int(v2_spawnPoint.y);
-    i_xPos = i_xSpawn;
-    i_yPos = i_ySpawn;
-    b_linked = true;
-  }
-  
-  void despawn(){
-    b_linked = false;
-  }
-  
-  void display(){
-    ellipse(i_xPos, i_yPos, i_diameter, i_diameter);
-    textSize(10);
-    text(S_name, i_xPos, i_yPos-10);
-  }
-}
-
-void draw() {
-  background(255);
-  image(img_houses, 0, 0, img_houses.width, img_houses.height);
-  //image(img_streets, 0, 0, img_houses.width, img_houses.height);
-}
diff --git a/archive/citizen_pgraph/archive/citizen_pathfinding/data/houses_with_borders_small.png b/archive/citizen_pgraph/archive/citizen_pathfinding/data/houses_with_borders_small.png
deleted file mode 100644
index 0796857..0000000
Binary files a/archive/citizen_pgraph/archive/citizen_pathfinding/data/houses_with_borders_small.png and /dev/null differ
diff --git a/citizen.pde b/citizen.pde
index 5753e7f..8bcf5ea 100644
--- a/citizen.pde
+++ b/citizen.pde
@@ -9,31 +9,41 @@ boolean b_drawPathDestination = true;
 boolean b_randomRun = false;
 float f_nodeResolution = 0.2; //defines density of path-finding nodes, multiplied with resolution
 int i_pathAlgorithm = 3;
-
-void mousePressed() {
-  citizen[0].goTo(mouseX, mouseY);
-}
+int i_selectedCitizen = 0;
+int i_mapW, i_mapH;
+int i_windowW, i_windowH;
+int i_viewportW, i_viewportH;
+//void mousePressed() {
+//  citizen[0].goTo(constrain(mouseX, 0, img_houses.width), constrain(mouseY, 0, img_houses.height));
+//}
 
 
 void setup() {
-  size(1000, 1000);
-  fill(0);
-  blendMode(MULTIPLY);
-
+  size(700,600);
+  //blendMode(MULTIPLY);
+  i_windowW = width;
+  i_windowH = height;
+  
   if (b_smallerImage) img_houses = loadImage(dataPath("map/houses_with_borders_small.png"));
   else img_houses = loadImage(dataPath("map/houses_with_borders.png"));
-
-  img_streets = loadImage(dataPath("map/streets.png"));  
+  img_streets = loadImage(dataPath("map/streets.png")); 
+  pg_map = createGraphics(img_houses.width, img_houses.height);
   
-  surface.setSize(img_houses.width, img_houses.height);
+  surface.setResizable(true);
+  registerMethod("pre", this);
+  
+  i_mapW = pg_map.width;
+  i_mapH = pg_map.height;
 
   initHouses();
   initPathFinding();
   initWeather();
   initCitizen();
+  initUI();
 
 }
 
+
 void initCitizen(){
  
 
@@ -57,13 +67,27 @@ void initCitizen(){
 }
 
 
+void pre() {
+  if (i_windowW != width || i_windowH != height) {
+    // Sketch window has resized
+    i_windowW = width;
+    i_windowH = height;
+    i_uiW = width;
+    i_uiH = height - i_uiY;
+  }
+}
+
 void draw() {
-  //background(255);
-  background(img_houses);
+  background(127);
+  
+  pg_map.beginDraw();
+  
+  pg_map.fill(0);
+  pg_map.image(img_houses, 0,0, img_houses.width, img_houses.height);
   //image(img_streets, 0, 0, img_houses.width, img_houses.height);
   
-  textSize(7);
-  textAlign(CENTER);
+  pg_map.textSize(7);
+  pg_map.textAlign(CENTER);
   //for (House house : houses) {
   //  house.display();
   //}
@@ -76,6 +100,8 @@ void draw() {
       citizen[i].display();
     }
   }
-
-  UI();
+  
+  pg_map.endDraw();
+  image(pg_map, i_mapOffsetX, i_mapOffsetY, i_mapW, i_mapH);
+  drawUI();
 }