2. /*
3. 
   
4. 
   
5. 
   
6. Project Intent/ Shortened Pseudo-Code
7. 
   
8. The sketch revolves around the idea of creating multiple iterations of a series of aerial shots that were taken 
9. along a chosen path. The aerial views act as visual markers for the entirety of the site, that will align with 
10. the infrastcutural map in the background. The rearrangment of a geographical grid into a series of changing
11. lines allows for multiple relationships of the existing condition. The iterative process of changing the static 
12. condition allows for opportunities to explore the 'ideal' conditions only exposed by computational processes. 
13. 
    
14. Brief Pseudo_Code
15. 
    
16. 1) Load a static image map in the background 
17. 2) Overlay an array of images in gridview
18. 3) Tint overlay to make both simultaneously visible
19. 4) Make the overlayed gridview interactive by creating mousepressed ability 
20. 5) Rearrange array of images by copying old location to new location
21. 6) New location is dependent upon line present in background map
22. 7) Images are displayed along line in ascending order of filename_01
23. 8) New ordering of both maps is output as new_arrangment.png file 
24. 9) Right click resets maps to original state
25. 
    
26. */
27. 
    
28. //declare global variables for arranging images into grid - include the size of the tile, margin, number
29. //of columns, number of rows, and the center point of the tile.
30. int tile_size; 
31. int margin; 
32. int column;
33. int row;
34. int cnt;
35. 
    
36. // Create image class for both array and background image
37. PImage[] pic;
38. PImage original;
39. 
    
40. 
    
41. void setup() {
42.   size(1200,800);
43.   background(255);
44. 
    
45.   pic = new PImage[100];
46.   tile_size = 150; // define all variables for desired grid dimensions
47.   margin = 7;
48.   column = (width-margin)/tile_size; // declare characteristics of the column
49.   row = (height-margin)/tile_size; // declare characteristics of the column
50.   cnt = 0; // each center point starts at 0 and will be later moved by one but reset to 0
51. 
    
52.   
53.   original=loadImage("site_plan.png"); //Load Images in Memory
54.     println("site_plan.png loaded"); // print to console successful load
55.     original.resize(900,800); // resize background image dimensions
56.     image(original,150,0);
57.   
58.   for (int i=0; i<pic.length; i++) {
59.     pic[i] = loadImage("aerial_0"+i+".png"); // load 100 components of image array
60.     println("aerial_0"+i+".png loaded"); // make sure each file is read and loaded in ascending order 
61.     
62.     
63.   }
64.   
65.   noLoop(); // make sure this process is not repeated
66. }
67. 
    
68. /* draw loop enables the images to be displayed independently from the setup loop. The nested for loop
69. enables the creations of the necessary columns and the rows associated with each column.*/
70. 
    
71. void draw() {
72.   for (int j=0; j<=column; j++) {
73.     for (int k=0; k<=row; k++) {
74.       tint(255,100);
75.       image(pic[cnt], (j*tile_size), (k*tile_size), tile_size, tile_size); 
76.       cnt++;
77.       if(cnt%pic.length ==0)cnt=0;
78.     }
79.   }
80.   
81.   if (mousePressed == true) {
82. for (int i=0; i<100; i++) {
83.     image(pic[i],?,?,?,?,
84.       ?,?,?,?);
85.       delay(40);
86. 
    
87. }
88. 
    
89.   
90.   
91.       save("new_arrangement.tif");
92.   }
93. }