Differences

This shows you the differences between two versions of the page.

--- spcs:summer2014:d6 [2014/07/21 17:00]
ffpaladin
+++ spcs:summer2014:d6 [2014/07/22 17:18] (current)
ffpaladin [Part 4 - JS Platformer (Teams, if you have time)]
@@ Line 3: / Line 3: @@
 ====== Topics ======
-http://www.piskelapp.com/
+  * https://docs.google.com/forms/d/1YCb9i2OT46VIZmzbunqjMVXwbdBHRJd-8zrE17NJFOM/viewanalytics
+  * wordpress comments
+  * How do you find the shortest path?
+  * Alan Turing
+  * Demos!!
+    * Coding
+    * getting things on github.
+  * More Animations
+  * Objects!
+  * Graphs
+  * Shortest Distance - Traveling Sales Person
+  * http://www.piskelapp.com/
+  * http://pixelartor.com/
+  * http://hereistoday.com/
-http://pixelartor.com/
+Non Animating Sort
-wordpress comments
+<code java>
-getting things on github.
-http://hereistoday.com/
+// GLOBAL VARIABLES
+int [] array = {90,60,70,50,40,30,20,10,1,80};
+// int i, j, k, l;
+// SETUP FUNCTION - Runs Once
+void setup () {
+  size(500,500);
+  int min = 0;      // index of the array
+  // outer for-loop
+  for (int i=0; i<10; i++) {
+    min = i;
+    // inner for-loop
+    for (int j=i; j<10; j++) {
+      if (array[j] < array[min])
+        min = j;
+    }
+    // swapping
+    int temp = array[i];
+    array[i] = array[min];
+    array[min] = temp;
+  }
+  for (int k=0; k<10; k++)
+    println(array[k]);
+}
+// DRAW LOOP - Infinite Loop
+void draw () {
+  background(255,0,0);
+  ellipse(mouseX, mouseY, 20, 20);
+}
+</code>
+Ball Code
+<code java>
+int x = 30;
+int dx = 0;
+int y = 20;
+int dy = 0;
+void setup() {
+  size (500,500);
+}
+void draw() {
+  //background(255,255,0);
+  fill(random(256),random(256),random(256));
+  ellipse(x,y,20,20);
+  // d-pad = direction-pad
+  if (keyPressed && key == 'd') {
+    dx = 1;
+  }
+  else {
+    dx = 0;
+  }
+  if (keyPressed && key == 's') {
+    dy = 1;
+  }
+  else {
+    dy = 0;
+  }
+  x = dx + x;
+  y = dy + y;
+  /*
+  // Collision Detection
+  if (y > 480 || y < 0) {
+    dy = dy * -1;
+  }
+  y = y + dy;
+  if (x > 480 || x < 0) {
+    dx = dx * -1;
+  }
+  x = x + dx;
+  */
+}
+</code>
 ====== Assignments ======
@@ Line 17: / Line 142: @@
 ===== Part 1: Blog and Github (Review) =====
-===== Part 2: Bouncing Balls =====
+  - Blog: All your completed projects (you don't have to blog if you still want to work on them, but if you are done, blog what you have). Get them up on Github like we talked about in class. http://processingjs.org/articles/p5QuickStart.html
+  - Blog: ALAN TURING. You must address these points:
+    - Mention the new movie coming out
+    - Talk about the imitation game
+    - Briefly look at this paper and link it to your post
+      - http://www.loebner.net/Prizef/TuringArticle.html
+    - Put an image in your post
-===== Part 3: Processing (Teams) - Around the world for Mousey =====
+----
-Mousey the Mouse wants to visit each of you next month. Download a world map, NOT the one on this page. Any kind of world map will do (as long as it's a valid image file format). Find out where everyone lives in the class and help Mousey plan the shortest possible trip. You will approximate the locations based off of the map you choose. Mousey has a jetpack and starts at Stanford.
+===== Part 2: Visual Sorting II. Spend 20-30 min (Yesterday Teams) =====
-{{:spcs:summer2014:screen-shot-2013-08-06-at-9-31-00-pm.png|}}
-==== Step 1: Background image ====
+**Option 1:** For those who've not gotten their sorts working, here's my selection sort from class. It's a little buggy: http://pastebin.com/hVFvXvD2
-  - Find an image of the world
+**Option 2:** If you are done your sort, take the beginning of class to add the following to the sort program:
-  - Google "background processing.js"
+  - A Pause Button
-  - Find out where everyone is from in our class
+  - A Start Button
-  - Place an ellipse at every location
+  - A Reset Button
-    - You may want to create a class object to handle these "vertices" or locations.
-==== Step 2: An object that has x and y ====
+**Option 3:** If you'd rather work on your Seurat (Pixel Splotches), then you can create a way to change the ellipse sizes while within the running program.
+Remember, if your partner is done with the project, to Fork it into your own directory. Forking will allow you to continue the project on your own. You can keep a copy for yourself.
+Everything on gh-pages!
+----
+===== Part 3: Bouncing Balls: Objects and Collision (Today Teams) =====
+Review: Go back to the lecture on Bouncing Balls. Try to create your own Ball class that can bounce around the screen.
+Make 4 balls bounce around the screen.
+  * ball 1 goes left and right
+  * ball 2 goes up and down
+  * ball 3 goes diagonal
+  * ball 4 goes diagonal and moves to where the player clicks the screen (mouseX, mouseY)
+You must create a Ball class. Read: http://www.processing.org/tutorials/objects/
 See this sample code for the Car class.
@@ Line 92: / Line 239: @@
 </code>
+----
+===== Part 4: Processing (Today Teams) - Around the world for Mousey =====
+Mousey the Mouse wants to visit each of you next month. Download a world map, NOT the one on this page. Any kind of world map will do (as long as it's a valid image file format). Find out where everyone lives in the class and help Mousey plan the shortest possible trip. You will approximate the locations based off of the map you choose. Mousey has a jetpack and starts at Stanford.
+{{:spcs:summer2014:screen-shot-2013-08-06-at-9-31-00-pm.png|}}
+==== Step 1: Background image ====
+  - Find an image of the world
+  - Google "background processing.js"
+  - Find out where everyone is from in our class
+  - Place an ellipse at every location
+    - You may want to create a class object to handle these "vertices" or locations.
+==== Step 2: An object that has x and y ====
+Try to see if you can create objects like you did for the ball classes.
 ==== Step 3: Adjacency Matrix ====
@@ Line 101: / Line 268: @@
 Using some algorithm... Maybe Breadth First Search, draw a path that on the screen that highlights what's going on in the code. See example of lines above.
-==== Step 5: Travelling Sales Person ====
+REMINDER: Shortest Path is NOT the Traveling Sales Person problem. TSP is much harder. You do not have to return home like the image above.
+==== Step 5: Traveling Sales Person (Optional) ====
 Find the shortest distance that Mousey can go INCLUDING his return home.
@@ Line 107: / Line 276: @@
 ==== Step 6: Animation ====
-Now make the program animate!
+Now make the program animate! (or interactive)
+One idea is to be able to change Mousey's start location.
 ----
-===== Part 4 - JS Platformer =====
+===== Part 5 - JS Platformer (Teams, if you have time) =====
 Cookbook! You know what to do.
@@ Line 126: / Line 297: @@
 https://docs.google.com/forms/d/1nNvgtxwBtGiDMfe_jjx1PH8MzwJlOR7jIAaEdLZ-sZI/viewform

Teaching

User Tools

Site Tools

Differences

Page Tools