Computer+Science+-+Spring+2011+-+Processing

= **Computer Science (CS) - Spring 2011 - Processing - Multimedia** = **Mr. Bujak**


 * Few of the links below are broken: my Pogoplug™ personal cloud solution is no longer connected to a 24-hour/day ISP.
 * I unfortunately did not update this page the last 1.5 months of this course since my time was spent with the student teams on their individual and group projects.

In an effort to be totally transparent and to support students 24/7/365.25, this volunteer-maintained and optional area is meant to be a collection of reflections and an activity log for computational and algorithmic thinking discussed and practiced during the Spring 2011 semester "Introduction to Computer Science" 0.5 credit elective course at Hope Charter High School.

Computer Science Syllabus Spring 2011 Semester

NEWS: 3/10/2011: Mr. Bujak has been informed that RAPTOR will be installed on our school computers. Although RAPTOR is not a "straight up" programming language, it is a great tool to learn how to correctly program via flow charting to craft software. RAPTOR is very good at Illustrating the lifetime (life cycle) of variables as code executes. You can single step or control the execution speed and watch the variables being modified and change focus/scope. RAPTOR is amazing at illustrating recursion with its illustration of the program (LIFO) stack. RAPTOR was never installed for students to use, but Mr. Bujak demonstrated some computer concepts using RAPTOR on his personal computer.

INFO:

Processing - A Programming Handbook for Visual Designers and Artists, by Casey Reas and Ben Fry, The MIT Press, 2007 ISBN-10: 0-262-18262-9, ISBN-13: 978-0-262-18262-1 Link to all chapters Search below for the Processing "Table of Contents" All assignments will also have a reference link here in the applicable PowerSchool Gradebook daily assignment description.

NOTES:**
 * 1) These files are on my "personal cloud" using my personal Pogoplug™ hardware and my personal 2TB Seagate Free Agent GoFlex drive.
 * 2) I will have redundant links to the CS Unplugged activities/videos; including my Pogoplug™ hardware - here <>
 * 3) 4 C's of Technology Integration - Communication, Computing, Critical Thinking, and Creativity
 * 4) The LEGO Education 4C learning approach consists of four phases: Content, Construct, Contemplate, Continue.


 * TEAM PROJECTS (summary):**

Project Name - Team Name - Team Member(s) - details are on the individual project pages. Since the Processing language is Java, I should create Applets in a Webpage -and-standalone EXEcutables of these animations. (when I have time).

Flowers - Team Juicy - Tyler, Aaliyah Typography - Team Little - James Similating smoke - Team AJ - Antwan and Jazmere

IFS Fractals- Team IFS - Kevin and Shafi - recursive drawing (IFS fractal drawing): http://recursivedrawing.com

Fireworks - Team Fire - Johnvonna Stars - Team - Rayonna and Kahara now Chad Fireball - Team Fireball - Patrick Pacman - Team Pacman - Orbin and Cory (formerly of Fireworks) Pong - Team P - Joel Hearts - Team H - Tyneesha

>
 * ADDITIONAL CODE THAT MAY HELP IN PROJECTS (developed by Mr. Bujak as demands arise in team projects): (SPLIT THIS COMMON CODE OUT INTO A SEPARATE PAGE)**
 * 1) MouseX and MouseY are great, but what do you do if you need more than 2 course inputs --> go to the keyboard. This code example uses lowercase (r,g,b,o) to lower the (red, green, blue, opacity) and used the uppercase (R,G,B,O) to increase the (Red, Green, Blue, Opacity)
 * 2) calcRegularPolygonVertices - A function that returns an array of equally space (x.y) coordinate pairs around a circle of radius r. This is needed by the following projects: Typography, Flowers, Stars, maybe Hearts
 * 3) Please incorporate GUI components to easily change your program's parameters - see 435.chap52.Input 7 - Interface.pdf - scribd.com, Pogoplug public link , Pogoplug Embedded direct link - it has: button class, check box class, radio buttons class, scrollbar class.
 * 4) audio, sound - I will write a simple sound output, then "attach" it to the bouncing ball program we did in class when the ball hits a wall
 * 5) sliders - horizontal, vertical (maybe also bind the slider to keys; see [1])

[1] Code for keyboard processing (not with events or event handling) patterned after 223.chap28.Input 2 - Keyboard.pdf - Pogoplug public link - Pogoplug embedded direct link - code /* handling keyboard keys - not using events and event handling * Notice the serious problem in receiving multiple keystrokes. * Need to debounce the keys, but easier to use events and event handling. * Mr. Bujak */

PFont font;

void setup { size(400,130); // you will have to create a font and change this file name: font = loadFont("Dialog.bold-72.vlw"); textFont(font); smooth; } // Setup

void draw { background(204);

if (keyPressed == true) { if ((key >= 32) && (key <= 126)) { println("ASCII char " + key); text(key,28,75); }   else if (key == CODED) { print("ASCII control char "); if (keyCode == UP) { println("UP"); text("UP",28,75); }     else if (keyCode == DOWN) { println("DOWN"); text("DOWN",28,75); }     else if (keyCode == LEFT) { println("LEFT"); text("LEFT",28,75); }     else if (keyCode == RIGHT) { println("RIGHT"); text("RIGHT",28,75); }     else if (keyCode == ENTER) { println("ENTER"); text("ENTER",28,75); }     else if (keyCode == CONTROL) { println("CONTROL"); text("CONTROL",28,75); }     else if (keyCode == ALT) { println("ALT"); text("ALT",28,75); }     else if (keyCode == SHIFT) { println("SHIFT"); text("SHIFT",28,75); }     else { println("not trappped"); text("____",28,75); }   }  // key == CODED } // keyPressed } // draw code the embedded movie: media type="file" key="keystrokesNoEvents.mp4" width="300" height="300" the movie link:

Now we can debounce the keyboard with events. Simply take the code and put it into a keyPressed event handler. patterned after 229.chap29.Input 3 - Events.pdf - Pogoplug public link - Pogoplug embedded direct link - code /* handling keyboard keys - using events and event handling * Keys are debounced because events are guaranteed once. * Mr. Bujak */

PFont font;

void setup { size(400,130); // you will have to create a font and change this file name: font = loadFont("Dialog.bold-72.vlw"); textFont(font); smooth; } // Setup

void draw { background(204); } // draw

// ======================

void keyPressed { if (keyPressed == true) { if ((key >= 32) && (key <= 126)) { println("ASCII char " + key); text(key,28,75); }   else if (key == CODED) { print("ASCII control char "); if (keyCode == UP) { println("UP"); text("UP",28,75); }     else if (keyCode == DOWN) { println("DOWN"); text("DOWN",28,75); }     else if (keyCode == LEFT) { println("LEFT"); text("LEFT",28,75); }     else if (keyCode == RIGHT) { println("RIGHT"); text("RIGHT",28,75); }     else if (keyCode == ENTER) { println("ENTER"); text("ENTER",28,75); }     else if (keyCode == CONTROL) { println("CONTROL"); text("CONTROL",28,75); }     else if (keyCode == ALT) { println("ALT"); text("ALT",28,75); }     else if (keyCode == SHIFT) { println("SHIFT"); text("SHIFT",28,75); }     else { println("not trappped"); text("____",28,75); }   }  // key == CODED } // keyPressed } // keyPressed event handler code the embedded movie: media type="file" key="keystrokesWithEvents.mp4" width="300" height="300" the movie link:

[2] This is the core skeleton with code to drive the real vertices generating function: code void setup { size(200,200); smooth;

float[] data = calcVertices(4,200);

for (int i = 0; i < data.length; i+=2) { println("(" + data[i] + "," + data[i+1] + ")"); }

//draw lines just for fun, cleaner and more intuitive to use // beginShape and endShape: /* for (int i = 0; i < data.length-2; i+=2) { line(data[i], data[i+1], data[i+2], data[i+3]); }  */

fill(color(random(0,255),random(0,255),random(0,255)));

beginShape; for (int i = 0; i < data.length; i+=2) { vertex(data[i], data[i+1]); } endShape(CLOSE); //noLoop; } // setup

void draw {

float[] data = calcVertices((int)random(3,8),200);

fill(color(random(0,255),random(0,255),random(0,255),255));

//noStroke;

beginShape; for (int i = 0; i < data.length; i+=2) { vertex(data[i], data[i+1]); } endShape(CLOSE); } // draw

// ======================

float[] calcVertices(int nV, float r) { float d[] = new float[2 * nV]; // {x0,y0,x1,y1,x2,y2,x3,y3, ...} for (int i = 0; i < 2*nV; i+=2) { d[i] = r * random(0,1); d[i+1] = r * random(0,1); } return d; }

void keyPressed { noLoop; } code

[3] COMING SOON. IDEA: add scroll bars to the above for red, green, blue, and opacity. Additionally scroll bar for number of vertices, radius, ...

[4] COMING SOON.

Weigh in with what you would like to see sooner than later. nomenclature: "direct topics - subordinate topics" (note separation by hyphen)
 * TOPICS NOT DISCUSSED EXPLICITLY IN CLASS:**
 * 1) recursion as it relates to program flow (tail, head, self, indirect) - demo with RAPTOR - recursion can also apply to data types - Droste effect -
 * 2) libraries -, packages typically stored in compressed jar files, javadocs (and more) - leverage software that others already wrote
 * 3) sound/audio - using "minim" library: FFT, etc.
 * 4) parsing -
 * 5) images - vector vs raster
 * 6) image processing - pixel manipulation with math, convolution (really cool, conceptually easy, mathematically intensive)
 * 7) advanced drawing - drawing stars, 5-pointed, multi-pointed, various thickness, nautical stars - show //Mathematica// code
 * 8) Finch robot - personal - On-board features include:
 * 9) Light, temperature, and obstacle sensors
 * 10) 3-axis accelerometer
 * 11) 2 wheels on 2 independent motors
 * 12) Buzzer
 * 13) Full-color beak LED (3 color based on tilt)
 * 14) Pen mount for drawing capabilities
 * 15) AppInventor - programming Android devices (Dr. Paula Matuzek, Villanova University)

**TEAM PROJECTS (detail):**

I __strongly__ recommend you work in a team of two. No teams greater than 2 students ... no exceptions. Tell me your ideas and team - due Friday, April 29, 2011 in email to me. Here is a protype of your email due Fridya, April 29, 2011.

TO: ebujak@hopecschool.org FROM: <> CC: <> SUBJECT: 2011 CS Project - John Smith and Samantha Jones (team JSSJ) - 2-D Racquet Ball BODY: [1] 2-D Racquet Ball [2] Team: John Smith and Samantha Jones (Team JSSA) [3] Explanation: Sort of like pong, but only one paddle. User controls a paddle to keep the bouncing ball in a 2-D rectangular box with 3 solid sides. The user controlled paddle moves along the open box's edge. Goal is to keep the bouncing ball in the rectangular box. [4] Input(s): [4a] keyboard - to program settings like paddle length, ball size, ball speed, number of balls, etc [4b] finch robot - use Finch's built in accelerometer to control the paddle up/down or side-to-side movement. [4c] gamepad - moving paddle [4d] mouse/touchpad - moving paddle [5] Outputs(s): [5a] console - text diagnostics [6a] sketch area - main game action, 3 walls, user controlled moving paddle [6b] advanced: maybe write some game values to the sketch area using PFont class - need to dedicate an area of the sketch ares for printable text [6] Random thoughts: [6a] ball should probably always start moving away from pattle at a random angle (give the player a chance!), maybe the ball should launch "out" of the paddle as a result of hitting the space bar? [6b] nice to maybe accumulate some game statistics: # of paddle hits, # of wall hits, etc. [6c] all calculations should NOT be absolute, they should be derived from the window's "height" and "width" [6d] paddle should initially start in the middle and after a miss remain in the last user position [6e] user selectable background color [6f] user selectable speeds: paddle sensitivity (velocity), [6g] user selectable paddle length - probably a % of the opening, initial allowance [10%..90%] of opening [6h] 2 paddles - what are we thinking here? Then the paddles should be different colors. [6i] more than 1 ball - different colors [6j] the contained area will be a rectangle set by size(width, height) - other shapes will need advanced math [6k] allow multiple rounds. A round starts with a launch of a ball and ends when the ball passes the paddle. [6l] play very small sound clips: when a ball hits a wall, when the ball hits the paddle, when the ball passes the paddle


 * 1) There are mandatory weekly updates that you need to email me and CC your team mate by 5:00 PM each Friday.
 * 2) If I do not receive an update, your team will receive a 0 (zero) - no exceptions.
 * 3) For each week FORWARD the previous email ... so we can all appreciate your progress. We will also have all previous attachments attached.
 * 4) For each week attach the current code (an ASCII text, .TXT, file is probably best)..
 * 5) Code must contain documentation such as your team name, project name, at the top, but also you must describe your program statements/flow if it is not obvious, especially if you are doing something unique or intricate.
 * 6) Name your variables and objects appropriately to represent reality, not a1, bb, cej, etc.
 * 7) Your team and your project are graded on progress, process, and product. I will be grading you daily, not just on these weekly emailed published updates. Doodle, draw, do math, save everything even your mistakes - I will ask for them continuously and these artifacts will be a great portfolio for your masterpiece when it is finished.
 * 8) Remember that I will be collecting and aggregating the emails, but also publishing each of your teams materials including any pictures and/or videos of your program inputs/outputs. This will hopefully inspire other teams and cross-pollinate ideas.
 * 9) You will be graded contemporaneously on your team's Gracious ProfessionalismTM  and CoopertitionTM although we are not competing against anyone or against each other.
 * 10) I want to help you if you want the help. I can only help you if you help yourself.
 * 11) I am available before school, after school, during 5th period, during 8th period. Best to email me your code with your thoughts ... so we can actually point to something to talk about.
 * 12) Use your digital camera, cell phone, to take pictures of your artifacts, activities, send them along in your email. I will post them. Have fun, but do not slack off.
 * 13) Keep in mind that you will be able to produce [a] a stand-alone EXEcutable file and also [b] an Applet so you can embed your program in an HTML Webpage.

TEAM PROJECT IDEAS:
 * 1) [] - spirograph
 * 2) AppInventor - programming Android devices. There is an Android device emulator to simulate a device on the screen.
 * 3) interfacing - high speed photography (as in stopping a bursting balloon), Arduino, Finch robot, ...
 * 4) Finch robot - become famous and develop 2 classes and submit them to finchrobot.com. You cannot repeat any lesson already submitted. I personally own one Finch robot.
 * 5) Curve stiching - string art - []
 * 6) fractals - IFR
 * 7) create a class that is useful - you must also demonstrate it's usefulness. For example: a Matrix class, a Complex (number) class, etc., that has representative data attributes and commonly useful methods/functions.
 * 8) network - network monitoring - will need library/package
 * 9) audio - sound tools and manipulation - will need library/package
 * 10) create various graphs from univariate/multivariate data - file input for data (CSV is standard), output visual- maybe a GUI to enhance graphic, save the graph as an image file
 * 11) cellular automata - pixel, rules - []
 * 12) pure computer science investigations:
 * 13) <span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; background-repeat: no-repeat no-repeat; cursor: pointer; padding-right: 10px;">searching algorithms - linear, binary, ...
 * 14) <span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; background-repeat: no-repeat no-repeat; cursor: pointer; padding-right: 10px;">sorting algorithms - bubble, quick, insertion, merge, ...
 * 15) indexing, keys, hash functions (hashing, hash tables), ...
 * 16) interfacing - high speed photography (as in stopping a bursting balloon), no shooting of any kind, no sticky exploding soda cans) - I can help with the electronics, but we must first have a camera with a hot shoe pickup so we can send a signal to it to flash.


 * CLASS LOG and ASSIGNMENTS:**

These enumerated assignments are also in PowerSchool Gradebook with details and links.

Link to all chapters <-- use this link!!


 * MAY 2-6, 2011 -** **<span style="display: inline ! important; margin: 0px; padding: 0px;">FILE I/O WEEK: **

Mon 347 Image 4 Tue 355 Image 5 Wed 367 Output 1 Images - <span style="display: inline ! important; margin: 0px; padding: 0px;"> 367.chap45.Output 1 - Images.pdf - Thu 421 File Export Fri 427 File Import


 * FUTURE**

<span style="display: inline ! important; font-weight: normal; margin: 0px; padding: 0px;">page 197 Recursion page 237 Mouse II


 * FRIDAY, APRIL 29, 2011**

page 229.chap29.Input 3 - Events.pdf - Pogoplug public link - Pogoplug embedded direct link -

OLD:

205.chap26.Input 1 - Mouse I.pdf: mouseX, mouseY , pmouseX , pmouseY , mousePressed , mouseButton

223.chap28.Input 2 - Keyboard.pdf - Pogoplug public link - Pogoplug embedded direct link : keyPressed, key , keyCode 245.chap31.Input 5 - Time, Date.pdf: second, minute, hour, say, month, year

scribd.com, Pogoplug public link, Pogoplug embedded direct link -

NEW:

229.chap29.Input 3 - Events.pdf - Pogoplug public link - Pogoplug embedded direct link -
 * mouse events: mousePressed, mouseReleased , mouseMoved , mouseDragged - functions you write to handle these events
 * key events: keyPresssed, keyReleased - functions you write to handle the keyPressed and key Released events
 * controlling the flow: loop, redraw
 * constrain: constrain
 * distance: dist
 * easing: abs
 * speed:
 * orientation: atan2 -

Link to all chapters

** ==> ** **THURSDAY, APRIL 28, 2011**

We will utilize: ** 435.chap52.Input 7 - Interface.pdf - scribd.com, Pogoplug public link, Pogoplug Embedded direct link - **
 * <span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; background-repeat: no-repeat no-repeat; cursor: pointer; font-weight: normal; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 10px; padding-top: 0px;">Link to all chapters **

<span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; cursor: pointer; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 10px; padding-top: 0px;">GUI - Graphical User Interface <span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; cursor: pointer; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 10px; padding-top: 0px;">WIMP - Windows, Icons, Mouse, Pointer <span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; cursor: pointer; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 10px; padding-top: 0px;">HMI - Human Machine Interface

<span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; cursor: pointer; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 10px; padding-top: 0px;">page 436 - rollover, button, dragging, <span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; cursor: pointer; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 10px; padding-top: 0px;">page 442 - check boxes, radio buttons, <span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; cursor: pointer; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 10px; padding-top: 0px;">page 448 - scrollbar

<span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; cursor: pointer; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 10px; padding-top: 0px;">NOTE: <span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; cursor: pointer; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 10px; padding-top: 0px;">Since the network not been usable by students for 3 days, I have personally copied the necessary directories with all files to the laptops we will be using:
 * 1) executable code - "C:/Processing"
 * 2) book documentation - "C:/Processing - A Programming Handbook for Visual Designers and Artists" - including all chapters
 * 3) Website image (extracted on 428/2011 at __:__ AM) - "C:/Processing - WIKI"


 * WEDNESDAY, APRIL 27, 2011**
 * Serious computer network isues, students could do nothing: could not get to any sites other than search engines.**


 * Objects( advanced) **
 * ** multiple constructors (already did a few times) **
 * composite objects (Egg class + Ring class --> EggRing class) **, and **
 * ** inheritance (extends, super) ** - super class, sub class


 * We will study **** <span style="background-attachment: initial; background-clip: initial; background-color: initial; background-origin: initial; background-position: 100% 50%; background-repeat: no-repeat no-repeat; cursor: pointer; padding-right: 10px;">inheritance by **** defining a Spin base class. **
 * We will create a SpinArm class that extends Spin and also define a SpinSpots class that extends Spin. We will utilize: **
 * 453.chap53.Structure 5 - Objects II.pdf: scribd.com, Pogoplug public link , Pogoplug embedded direct link - **
 * <span style="background-position: 100% 50%; cursor: pointer; font-weight: normal; margin: 0px; padding: 0px 10px 0px 0px;"> Link to all chapters **

code SpinSpots spots; SpinArm arm;
 * <span style="background-position: 100% 50%; cursor: pointer; font-weight: normal; margin: 0px; padding: 0px 10px 0px 0px;">During class, we also added 2 different random colors to the 2 spinning spots, but favored red for Tyler. **

void setup { size(100, 100); smooth; arm = new SpinArm(width/2, height/2, 0.01); spots = new SpinSpots(width/2, height/2, -0.02, 33.0); }

void draw { background(204); arm.update; arm.display; spots.update; spots.display; }

// ===========================

class Spin { float x, y, speed; float angle = 0.0;

Spin(float xpos, float ypos, float s) { x = xpos; y = ypos; speed = s; }

void update { angle += speed; } } // Spin class

// ---

class SpinArm extends Spin { float speed;

SpinArm(float x, float y, float s) { super(x, y, s); }

void display { strokeWeight(1); stroke(0); pushMatrix; translate(x, y); angle += speed; rotate(angle); line(0, 0, 100, 0); popMatrix; } } // SpinArm class

// ---

class SpinSpots extends Spin { float dim; color colour1 = color(random(200,255),random(60,70),random(60,100)); color colour2 = color(random(220,255),random(80,130),random(60,70));

SpinSpots(float x, float y, float s, float d) { super(x, y, s); dim = d; }

void display { noStroke; pushMatrix; translate(x, y); angle += speed; rotate(angle); fill(colour1); ellipse(-dim/2, 0, dim, dim); fill(colour2); ellipse(dim/2, 0, dim, dim); popMatrix; } } // SpinSpots class code
 * <span style="background-position: 100% 50%; cursor: pointer; font-weight: normal; margin: 0px; padding: 0px 10px 0px 0px;"><<INSERT VIDEO HERE>> **

**TUESDAY, APRIL 26, 2011** **(0.5 hour shortened class due to short Tuesday schedule)**
 * Serious computer network isues, students could do nothing: could not get to any sites other than search engines.**


 * Objects( advanced) **
 * ** multiple constructors (already did a few times) **
 * composite objects (Egg class + Ring class --> EggRing class)**, and**
 * ** inheritance ( **** extends, super) **


 * We will extend our Egg class and extend our Ring class to create a new composite EnnRing class. We will utilize: **
 * 453.chap53.Structure 5 - Objects II.pdf: scribd.com, Pogoplug public link , Pogoplug embedded direct link - **
 * <span style="background-position: 100% 50%; cursor: pointer; font-weight: normal; margin: 0px; padding: 0px 10px 0px 0px;"> Link to all chapters **

The following demonstrates a composite object:. The Egg class and the Ring class are combined to create a new class called EggRing. The EggRiing class has one Egg object called ovoid and, created in the constructor, and one RIng object called circle, created at the base of the class. code EggRing er1, er2;

void setup { size(150, 150); smooth; er1 = new EggRing(33, 66, 0.1, 33); er2 = new EggRing(66, 90, 0.05, 66); }

void draw { background(0); er1.transmit; er2.transmit; }

// ===========================

class Egg { float x, y;  // X-coordinate, y-coordinate float tilt;  // Left and right angle offset float angle; // Used to define the tilt float scalar; // Height of the egg // color of the egg color colour = color(random(0,255), random(0,255), random(0,255));

// Constructor Egg(int xpos, int ypos, float t, float s) { x = xpos; y = ypos; tilt = t;   scalar = s / 100.0; }

Egg(int xpos, int ypos, float t, float s, color c) { x = xpos; y = ypos; tilt = t;   scalar = s / 100.0; colour = c; }

void wobble { tilt = cos(angle) / 8; angle += 0.1; }

void display { noStroke; fill(colour); pushMatrix;       // <=== Matrix translate(x, y); rotate(tilt); scale(scalar); beginShape;  // <--- Shape vertex(0, -100); bezierVertex(25, -100, 40, -65, 40, -40); bezierVertex(40, -15, 25, 0, 0, 0); bezierVertex(-25, 0, -40, -15, -40, -40); bezierVertex(-40, -65, -25, -100, 0, -100); endShape;    // <--- Shape popMatrix;        // <=== Matrix } } // Egg class

// ---

class Ring { float x, y;        // x-coordinate, y-coordinate float diameter;    // Diameter of the ring boolean on = false; // Turns the display on and off // new data attribute: each ring will have a random color, not transparent color colour = color(random(0,255), random(0,255), random(0,255));

void start(float xpos, float ypos) { x = xpos; y = ypos; on = true; diameter = 1; }

void grow { if (on == true) { diameter += 0.5; if (diameter > 400) { on = false; }   }  }

void display { if (on == true) { noFill; strokeWeight(4);    // change for thickness of circle stroke(colour,153); // ellipse(x, y, diameter, diameter); } } }  // Ring class

// ---

class EggRing { Egg ovoid; Ring circle = new Ring;

// Constructor for EggRing class: EggRing(int x, int y, float t, float sp) { ovoid = new Egg(x, y, t, sp); circle.start(x, y - sp/2); }

void transmit { ovoid.wobble; ovoid.display; circle.grow; circle.display; if (circle.on == false) { circle.on = true; } } }  // EggRing class code output: <<INSERT VIDEO HERE - SERIOUS PROBLEMS AT SCHOOL>>

ANNOUNCEMENT (repeat): Start thinking about your team project. I __strongly__ recommend you work in a team of two. No teams greater than 2 students - no exceptions.

SEE ABOVE FOR A PROTYPE OF THE WEEKLY EMAILS YOUR TEAM WILL EMAIL TO ME.


 * MONDAY, APRIL 25, 2011**

395.chap48.Structure 4 - Objects.pdf: scribd.com, Pogoplug public link , Pogoplug embedded direct link - Link to all chapters

[A] Egg class - middle page 404 to middle page 406 pay attention to the display method of class Egg: [A1] pushMatrix and popMatrix - to preserve the state of the frame of reference of the caller since display method uses translate, rotate, and scale [A2] beginShape and endShape - to close the set of vertices and bezierVertices [A3] make another constructor with a 5th parameter for the Egg's color, place supporting code to have the Egg use this color to fill it's wobbling shape. [A4] instantiate another Egg object with a different size, position, and color. code Egg humpty, dumpty, mrEgghead; // Declare the objects

void setup { size(100, 130); smooth; // Inputs: x-coordinate, y-coordinate, tilt, height, color humpty = new Egg(50, 100, PI/32, 80, color(255,255,0)); dumpty = new Egg(65, 110, PI/32, 40, color(0,255,255,80)); mrEgghead = new Egg(30, 120, PI/32, 70, color(50,22,240,80)); }

void draw { background(240); humpty.wobble; // notice that humpty and dumpty are wobbling in sync humpty.display; dumpty.wobble; dumpty.display; if (random(0,1) > 0.5) { // mrEgghead wobbles randomly mrEgghead.wobble; } mrEgghead.display; }

// ===========================

class Egg { float x, y;  // X-coordinate, y-coordinate float tilt;  // Left and right angle offset float angle; // Used to define the tilt float scalar; // Height of the egg color colour; // color of the egg

// Constructor Egg(int xpos, int ypos, float t, float s) { x = xpos; y = ypos; tilt = t;   scalar = s / 100.0; }

Egg(int xpos, int ypos, float t, float s, color c) { x = xpos; y = ypos; tilt = t;   scalar = s / 100.0; colour = c; }

void wobble { tilt = cos(angle) / 8; angle += 0.1; }

void display { noStroke; fill(colour); pushMatrix;       // <=== Matrix translate(x, y); rotate(tilt); scale(scalar); beginShape;  // <--- Shape vertex(0, -100); bezierVertex(25, -100, 40, -65, 40, -40); bezierVertex(40, -15, 25, 0, 0, 0); bezierVertex(-25, 0, -40, -15, -40, -40); bezierVertex(-40, -65, -25, -100, 0, -100); endShape;    // <--- Shape popMatrix;        // <=== Matrix } } // Egg class code output (notice egg wobbling out of window frame, notice transparency of the non-yellow eggs, notice mrEgghead wobbling randomly - not in sync with humpy or dumpy) media type="file" key="__EggWobble.mp4" width="150" height="150"

[B] Ring class - an array of objects - middle page 407 to page 409 Try this (easy): add color to the Ring class. Make sure the color persists throughout it's growth. HINTS: probably want to avoid blinding harsh whites which create an annoying flashing strobe effect. code Ring[] rings; // Declare the array

int numRings = 50; int currentRing = 0;

void setup { size(100, 100); smooth; rings = new Ring[numRings]; // Create the array for (int i = 0; i < numRings; i++) { rings[i] = new Ring; // Create each object } } void draw { background(0); for (int i = 0; i < numRings; i++) { rings[i].grow; rings[i].display; } }

// Click to create a new Ring void mousePressed { rings[currentRing].start(mouseX, mouseY); currentRing++; if (currentRing >= numRings) { currentRing = 0; } }

// ===================

class Ring { float x, y;        // x-coordinate, y-coordinate float diameter;    // Diameter of the ring boolean on = false; // Turns the display on and off // new data attribute: each ring will have a random color, not transparent color colour = color(random(0,255), random(0,255), random(0,255));

void start(float xpos, float ypos) { x = xpos; y = ypos; on = true; diameter = 1; }

void grow { if (on == true) { diameter += 0.5; if (diameter > 400) { on = false; }   }  }

void display { if (on == true) { noFill; strokeWeight(4);    // change for thickness of circle stroke(colour,153); // ellipse(x, y, diameter, diameter); } } }  // Ring class code SWF (I will replace this): media type="file" key="__Rings.Jing.swf" width="135" height="135" NOTICE: If you make the window larger, you will see each ring "disappear" when its diameter grows above 400.

ANNOUNCEMENT: Start thinking about a project. I __strongly__ recommend you work in a team of two. No teams greater than 2 students ... no exceptions. Tell me your ideas. Maybe we will have an open 10 minutes to just throw ideas out there and brainstorm.

You will have required weekly updates that you need to email me. They are graded on progress, process, and product. I do this for you and me. I want to help you if you want the help. I can only help you if you hep yourself and do something.

**SPRING BREAK (week)**

<<WE NEED SOME SPRING FLOWERS HERE>>

**FRIDAY, APRIL 15, 2011**

Objects (Day 4) - so this did turn out to be an "objects" week (well ... 4 days)

395.chap48.Structure 4 - Objects.pdf: scribd.com, Pogoplug public link , Pogoplug embedded direct link - Link to all chapters

[AA] Move color data attribute into the Spot class. Need color (name conflict!) as a data attribute in the Spot class Make another Spot constructor to support color (keep old constructor - hey, that's overloading!) Need fill(colour); in display method <<NEED VIDEO OF ME MODIFYING CODE - NEAT IDEA!>> <<NEED VIDEO OF FINAL OUTPUT>>

[BB] Make an array of rocks (name courtesy of Jazmere) of class Spot. Array of Spots - middle page 406 to midddle page 406 - program 41-10 which needs Spot class At top: code Spot[] rocks;       // declare a rocks array int numRocks = 100; code In setup: code rocks = new Spot[numRocks]; // ask for numRocks many rocks that are of Spot class for (int i=0; i<rocks.length; i++) { rocks[i] = new Spot(78+5*i, 11+2*i, 12*i/4, color (255/12*i,100/15*i,100), i%8, i%5); } code In draw: code for (int i=0; i<rocks.length; i++) { // note use of length rather than numRocks rocks[i].move;                    // in case the array dynamically grows rocks[i].display;                 // or shrinks --> robust code } code <<NEED VIDEO OF FINAL CODE --AND-- FINAL OUTPUT>>

[CC] bb above is too predictive ... so try using constrained random values to fill the each spots': x y, diameter, colour, speedX, speedY x - constrained int of (0+diameter/2 .. width-diameter/2) --> random(0+diameter/2, width-diameter/2) y - constrained int of (0+diameter/2 .. height-diameter/2) --> random(0+diameter/2, height-diameter/2) diameter - constrained int of(5,60) color(0..255, 0..255, 0.255) - maybe throw transparency in there: color(0..255, 0..255, 0.255, 0..200) speedX - constrained (0.0 .. 5.0) speedY - constrained (0.0 .. 5.0)

Change the instantiation of the objects line: code rocks[i] = new Spot(78+5*i, 11+2*i, 12*i/4, color (255/12*i,100/15*i,100), i%8, i%5); code to: code rocks[i] = new Spot(random(0+diameter/2, width-diameter/2), // xpos random(0+diameter/2, height-diameter/2), // ypos                   random(5, 60),                            // diameter                                                              // colour:                    color(random(0,255),                        // red random(0,255),                           // green random(0,255),                           // blue 85);                                     // opacity is 85/255 = 1/3, thus transparency = 2/3 random(0, 5), // speedX                    random(0, 5));                            // speedY code

Johnvonna, the new kid, hung out after class (free 5th period) and we created this wonderful extension of the above. HINTS: soft white background, ~2/3 transparent colors - so rocks travel over/under each other, but because of the white background have a pastel like color scheme. Note that there are 500 of these moving spots, with varying diameters, varying colors. Nice work. <<INSERT VIDEO HERE>>

EXTRA THOUGHTS - new classes to explore on your own:

**WEDNESDAY, APRIL 13, 2011** Objects (Day 3) -
 * THURSDAY, APRIL 14, 2011**

= I am not in Wednesday. Enjoy your Bujak-free day. =

Avoid the spiders ... they are hungry and bit 4 or 5 students yesterday. Did Tyler transform into Spiderwoman yet?

Start to really think about "Object-Orientation" (OO) .. .the sooner it clicks the better. This is a BIG idea in computer science. The use of OO is ubiquitous and pervasive. OO is a phenomenal way to organize and write/use/re-use code. OO is about encapsulating data and functionality as a cohesive self-contained abstract class that anyone can re-use, like a cookie cutter, to stamp out new objects of that class. Remember **PImage** and **PFont**... well they are built-in classes. Now I have not mentioned inheritance, where a class can inherit these data attributes and method functionality, but that is for a future date.

You can read my thoughts [A] and [B] immediately below and also my thoughts [1]-->[7] from the previous day, April 12. Today, well Thursday, We will be doing [1], [2], [4], [A] [B] is something you will want to do and have available in your "toolbox" ... hey wait maybe the class should have a method to copy itself - just like arrayCopy - now that's OO thinking.

We will extend our Spot class and utilize: 395.chap48.Structure 4 - Objects.pdf: scribd.com, Pogoplug public link , Pogoplug embedded direct link - Link to all chapters

Examine THOUGHTS from yesterday, April 12. Here are some more: [A] Another fefature of object-orientation is encapsulation, sometimes referred to as information hiding (data/attributes and functionality/methods). To accomplish this the class should have complete control of the data and it's functionality via it's own methods. most objects have accessor functions (helper functions) that get and set the class data values (generally called getter and setter methods). These are usually prefaced with "get" and "set." For example objectName.getX, objectName.getColor, and objectName.setSpeedX(1.75), objectName.setDiameter(24), etc [B] How would I copy an class? Maybe something like: objectName2.setSpot = objectName1.getSpot; ot maybe; objectName2.setSpot(objectName1.getSpot);

Sample code that has x and y movement via speedX, directionX, speeedY, directionY: code Spot cory; Spot peter,sidney, gabrielle, rachel;

void setup { size(400, 500); smooth; //noStroke; cory = new Spot(43, 50, 60, 5.5, 4.5); peter = new Spot(30, 23, 20, 1.5, 15.0); sidney = new Spot(45, 11, 20, 4.5, 2.7); gabrielle = new Spot(45, 21, 20, 3.5, 1.5); rachel = new Spot(78, 11, 20, 3.5, 2.3); }

void draw { background(color(43,69,170)); cory.move; cory.display(color(0,100,255)); peter.move; peter.display(color(0,155,0)); sidney.move; sidney.display(color(0,0,155)); gabrielle.move; gabrielle.display(color(155,0,0)); rachel.move; rachel.display(color(0,255,200)); }

class Spot { float x, y; float diameter; float speedX; int directionX = 1; // 1 is right, -1 is left float speedY; int directionY = 1; // 1 is down, -1 is up

// Constructor(s): Spot(float xpos, float ypos, float dia, float spX, float spY) { x = xpos; y = ypos; diameter = dia; speedX = spX; speedY = spY; }

void move { y += speedY * directionY; if ((y > (height - diameter/2)) || (y < diameter/2)) { directionY *= -1; } x += speedX * directionX; if ((x > (width - diameter/2)) || (x < diameter/2)) { directionX *= -1; } }

void display { ellipse(x, y, diameter, diameter); }

void display(int c) { fill(c); ellipse(x, y, diameter, diameter); } } // class Spot code sample output: media type="file" key="_bouncing 5 XY Spots.mp4" width="243" height="243"

Objects (Day 2) -
 * TUESDAY, APRIL 12, 2011**

395.chap48.Structure 4 - Objects.pdf: scribd.com, Pogoplug public link , Pogoplug embedded direct link - Link to all chapters code Spot cory;

void setup { size(100, 100); smooth; noStroke; cory = new Spot(33, 50, 30, 1.6); }

void draw { background(color(255,255,0)); cory.move; cory.display(color(0,0,255)); }

class Spot { float x, y; float diameter; float speed; int direction = 1; // 1 is down, -1 is up

// Constructor(s): Spot(float xpos, float ypos, float dia, float sp) { x = xpos; y = ypos; diameter = dia; speed = sp; }

void move { y += speed * direction; if ((y > (height - diameter/2)) || (y < diameter/2)) { direction *= -1; } }

void display { ellipse(x, y, diameter, diameter); }

void display(int c) { fill(c); ellipse(x, y, diameter, diameter); }

} // Spot class code output video: media type="file" key="_bounce vertical ball.mp4" width="138" height="138"media type="file" key="_bouncing_2D-ball-faster.mp4" width="135" height="135"

Congratulations: objects of class Spot can:
 * move vertically, up and down,
 * have a vertical speed, and
 * bounce vertically off the horizontal edges

THOUGHTS:
 * 1) For pure entertainment (maybe debugging hint), add a print of the Spot's y position as it moves - consider that this may have side effects: [a] do not want classes to print unless for temporary debugging, [b] what if there are more than 1 Spot ... do you want them all to print?
 * 2) Extend Spot to move similarly in the horizontal direction. What would we need to do? It might look something like:media type="file" key="_bouncing_2D-ball.mp4" width="135" height="135"
 * 3) Move color into the class Spot. What would we need to do? Remember color supports opacity!
 * 4) Create a few instances (objects) of class Spot with different starting positions, different speeds, different colors, ... What are some "degenerate" cases? How robust is the code? For example what if the constructor is activated with an x or a y off the screen? Try making the initial y --> height-diameter/2 OR height-10/2+1
 * 5) Can I have some "boing" sound when it bounces off a wall"? Need a library for this. From Processing menu: Sketch --> Import Library ... --> Minim Audio. This will place import line(s) at the top of your source code. Best hint is to look at the impressive sample code at C:\Processing\examples\Library\Minim (Sound)
 * 6) Constrain the bouncing Spot(s) in an arbitrary shape - very hard for non-rectangular regions!
 * 7) Collision of Spot's - advanced, here are some hints: all the same shape - how exactly do you bounce (does speed change as a function of Spot size ratio between the 2 colliding Spots?, direction reversed as a ratio that look like slope - trapping for division by zero), circular (that helps), different radii (not an issue) --> need to use distance formula dist = SQRT[(x2-x1)^2 + (y2-y1)^2] but you need to do this between all Spots - this is a Combinationproblem where order does not matter
 * 1 Spot - 0 distance calculations
 * 2 Spots - C(2,2) = 1 distance calculation
 * 3 Spots - C(3,2) = 3 distance calculations
 * 4 Spots - C(4,2) = 6 distance calculations
 * 5 Spots - C(5,2) = 10 distance calculations
 * 6 Spots - C(6,2) = 15 distance calculations
 * N Spots - C(N,2) = __ distance calculations
 * N Spots - C(N,2) = __ distance calculations


 * MONDAY, APRIL 11, 2011**
 * Objects (Day 1) - aggregation of data (fields) and functionality (methods) into an abstract data structure (object) --> object orientation --> yielding: encapsulation (information hiding), abstraction. **


 * You have used primitive data types: **int**,** long**,** float**,** boolean which only hold a variable
 * You have used system classes: **String**,** PImage**,** PFont **which hold variables and methods**

395.chap48.Structure 4 - Objects.pdf: scribd.com, Pogoplug public link, Pogoplug embedded direct link - Link to all chapters

class - is like a cookie cutter or a template to stamp out new object instances object - an instance of a Class, a particular one. Objects have fields (data) and methods (functions)

The fields (data) and methods (functions) of an object are accessed with the dot operator
 * **fuji.color** is used to access the value of color inside the **fuji** object
 * **golden.grow** is used to activate (or "call") the grow methods inside the **golden** object

constructor - a block of code activated as the object is created.

<< NEED TO POPULATE EACH OF TE INCREMENTAL CODE DEVELOPMENT STAGES WITH CODE SNIPPETS>>

We gradually built up a graphical Spot class. <<MORE INCREMENTAL CODE DEVELOPMENT HERE>> [1] from no object-orientation:

[2] to incorporating only data into a Spot class:

[3] to incorporating a simple display method

[4] to incorporating another overloaded display(color) method:

[5] and we were in the middle of creating a special method called a constructor that is activated when a new Spot object is instantiated, but class time ran out: code Spot cory;

void setup { size(100, 100); smooth; noStroke; cory = new Spot; cory.x = 33; cory.y = 50; cory.diameter = 30; }

void draw { background(0); cory.display(color(255,0,0)); }

class Spot { float x, y; float diameter;

Spot(float xpos, float ypos, float dia) { = xpos; // end-of class period bell rang in the middle of typing this assignment. ... Argh! }

void display { ellipse(x, y, diameter, diameter); }

void display(int c) { fill(c); ellipse(x, y, diameter, diameter); } } // class Spot code <<NEED SOME EXAMPLE JING PHOTOS>>

We will pick this up tomorrow, Tuesday.

301.chap37.Data 4 - Arrays.pdf: scribd.com, Pogoplug public link , Pogoplug embedded direct link Link to all chapters
 * FRIDAY, APRIL 8, 2011**

Arrays (Day 2): [1] more array functions: [1a] expand - patterned after program 33-19 [1b] arrayCopy - patterned after program 33-20 - arrays values cannot be copied with the assignment operator because array are objects (What is an object? well more on Monday, but we used the '.' operator yesterday with weight.length) - arrayCopy can be used to copy parts of the array [1c] explore the other array functions: Language Reference: www.processing.org/reference

[2] overloading a function (revisit) [2a] write a function printArray(int [] array) that prints all elements of the array up to array.length, to the console, separate each int element with a trailing comma and space [2b] write a function printArray(String [] array) that prints all elements of the array up to array.length, to the console, place each String element in double quotes and a trailing command and space

[3] write a function that operates on an array - patterned after program 33-22 arrays as function parameters are "pass by reference" - it's a pointer. no new data is created/copied on the stack ... so changes made in the function to the parameter are reflected in the calling routine. Hold this thought. Will this affect recursive calls? What is recursion? Coming soon.

* By end of today, April 9, 2011 school day you must email Mr. Bujak (ebujak@hopecschool.org) your programs for the Exercises #1 and #2 at the bottom of 301.chap37.Data 4 - Arrays.pdf. Extra credit #3 !!!

301.chap37.Data 4 - Arrays.pdf: scribd.com, Pogoplug public link, Pogoplug embedded direct link Link to all chapters
 * THURSDAY, APRIL 7, 2011**

Arrays (Day 1)
 * provide for a compact method of grouping similar items into a collection that is quickly index'able.
 * collection of homogeneous data types
 * can hold any data type: **int**, **long**, **float**, **char**, **String**, **boolean**, etc.

[1] organization, storage, retrieval [2] program 33-01 - review beginShape, endShape, vertices, closure of the shape [3] programs 33-02, 33-03, 33-04 - declare, create, assign - can do independently (in this order), or together [4] Array functions: length, append - use in loops

We talked about and coded a linear (1-dimensional) array for the weights of objects which were **int** data type. We assigned one weight element at a time and printed one weight element at a time. We then moved on to assiging the elements in a loop, and then printing them out in a loop. We then moved to an array of trees of data type **String**.

<<NEED TO PUT CODE SNIPPETS HERE>>


 * WEDNESDAY, APRIL 6, 2011** **(0.5 hour shortened class due to modified "PSSA schedule")**

245.chap31.Input 5 - Time, Date.pdf - in scribd.com 245.chap31.Input 5 - Time, Date.pdf - public link 245.chap31.Input 5 - Time, Date.pdf - embedded direct link

second, minute, hour, millis, day, month, year

NEW IDEAS/CONCEPTS for hour, minute, second:

[1] numeric dgital clock - program 28-03 nf(intValue, digits) - integer formating, padding to the left with 0s as needed nf(floatValue, left, right) - floating point number formating, left is number of digits to the left of the decimal point, right is number of digits to the right of the decimal point, padding with 0s as needed. media type="file" key="clock-digital.swf" width="150" height="150"

[2] abstract clock - program 28-04 map(value, low1, high1, low2, high2) - used to convert from one range of numbers to another The low1 and high1 parameters are the minimum an maximum values of the number's current range. The low2 and high2 parameters are the minimum an maximum values of the number's new range.

[3] analog clock - program 28-05 cos - in radians, cos is the horizontal component of a vector (in this case the clock hand) sin - in radians sin is the vertical component of a vector (in this case the clock hand)

Also explore day, month, year.

<<NEED TO PUT CODE SNIPPETS HERE>> <<NEED TO PUT VIDEOS of the CLOCKS HERE>> <<PUT DOWNLOADABLE LINKS HERE FOR 3 STANDALONE EXECUTABLE CLOCKS AND 3 JAVA APPLETS CODE>>

**TUESDAY, APRIL 5, 2011** **(0.5 hour shortened class due to modified "PSSA schedule")** <--embedded, hard to copy code from this <-- not really (file is in wikispaces - get Pogoplug to work)

127.chap17.Math 4 - Random.pdf - in scribd.com - appears to be "copy-able"!!!!!

Pogoplug public link URL: <span style="font-family: Arial,sans-serif; line-height: normal; white-space: nowrap;">@http://my.pogoplug.com/share/MzzECjCbqh_X1V1Fbqr3Nw

random, randomSeed, noise, noiseSeed

random(high) --> returns [0,high) random(low, high) --> returns [low,high)

Run this numerous times: code print(random(27.0)); code Put this "numerous time" behavior into a loop: code for (int i = 0; i< 30; i++) { println(i + ":" + random(5.0) + " "); } code What if I only want integers [0,high): code for (int i = 0; i< 30; i++) { int randomInteger = int(random(5.0)); println(i + ":" + randomInteger + " "); } code We will learn how to better format numbers soon with the nf function tomorrow.

What if we want to accumulate the counts of the random integers, the number of 0's, the number of 1's, the number of 2's, the number of 3's, etc. code int numRandom0 = 0; int numRandom1 = 0; int numRandom2 = 0; int numRandom3 = 0; int numRandom4 = 0; int numRandom5 = 0;

for (int i = 0; i< 30; i++) { int randomInteger = int(random(5.0)); if (randomInteger == 0) { numRandom0++; } else if (randomInteger == 1) { numRandom1++; } else if (randomInteger == 2) { numRandom2++; } else if (randomInteger == 3) { numRandom3++; } else if (randomInteger == 4) { numRandom4++; } else if (randomInteger == 5) { numRandom5++; }

println(i + ":" + randomInteger); } // for

println("-Summary:-"); println("number of 0's = " + numRandom0); println("number of 1's = " + numRandom1); println("number of 2's = " + numRandom2); println("number of 3's = " + numRandom3); println("number of 4's = " + numRandom4); println("number of 5's = " + numRandom5); code A better way to do the above is with an Array data type, which we will hopefully get to on Thursday.

Explore randomness with graphics. Ask for a random number [0,100). If the number is less than 50 then display a line, else display a circle. code // this is program 15-05 float r = random(100); if (r < 50.0) { line(0, 0, 100, 100); } else {  ellipse(50, 50, 75, 75); }

code

Now for some noise with program 15-09. noise is multi-dimensional randomness.

**MONDAY, APRIL 4, 2011** **(0.5 hour shortened class due to modified "PSSA schedule")**

Functions (Day 2 extended) - 181.chap24.Structure 3 - Functions.pdf new link @http://my.pogoplug.com/share/hz5pd_eoMwSQP7siu2JqCQ

embedded link @http://my.pogoplug.com/share/hz5pd_eoMwSQP7siu2JqCQW0mmgruBUM81xNhKeOz4B2pGsOY/181.chap24.Structure%203%20-%20Functions.pdf

Function overloading - pages 193-194 Calculating and returning values: pages 194-196

2-day project (extended): By end of today, April 4, 2011 school day you must email Mr. Bujak (ebujak@hopecschool.org) your programs for the 3 Exercises at the bottom of 181.chap24.Structure 3 - Functions.pdf

Mr. Bujak will walk around room helping students.


 * FRIDAY, APRIL 1, 2011**

Functions (Day 2) - 181.chap24.Structure 3 - Functions.pdf

2-day project: By end of April 1, 2011 school day you must email Mr. Bujak (ebujak@hopecschool.org) your programs for the 3 Exercises at the bottom of 181.chap24.Structure 3 - Functions.pdf

Mr. Bujak will walk around room helping students; especially the new students ramp up to speed with a immersive mini-crash course.


 * THURSDAY, MARCH 31, 2011** **(0.5 hour shortened class due to modified "PSSA schedule")**

ANNOUNCEMENT YOU MUST EMAIL ME YOUR CODE. I want to collect them and post them here (output and/or code) since they are starting to be creative and original. Great work. There will still shots if the program does not draw; is not dynamic. There will be movies if the program has dynamic output; uses draw.

Functions (Day 1) - 181.chap24.Structure 3 - Functions.pdf We have been using system functions every day and we even wrote a few functions. Functions make redundant code more concise by extracting the common elements and making them into code blocks that can be run many times within the program. The beauty of using functions is that it’s not necessary to understand how they work. It’s usually enough to know how to use them - to know what the inputs are and how they affect the output. This technique of ignoring the details of a process is called abstraction__.

Now it is time to ramp up your knowledge functions to write/us your own functions. Enhanced Eyes program patterned after 21-03, but incrementally added: [a] color, background, [b] mouse tracking for 3rd eye therefore removed noLoop, [c] transparency to 3rd moving eye code void setup { size(100, 100);     // window size(width, height) noStroke;         // no borders on images smooth;           // smooth the edges of images //noLoop;         // refresh every draw cursor(HAND);       // change cursor to finger pointing hand }
 * >  ||= Start ||= End ||
 * > Eyes || 21-01 || 21-04 ||
 * > Xs || 21-05 || 21-12 ||
 * > Leaves || 21-13 || 21-14 ||

void draw { background(180);                        // darker-gray background eye(65, 44, color(255,0,0));            // red eye, opaque eye(20, 50, color(0,255,0));            // green eye, opaque eye(mouseX, mouseY, color(0,0,255,170)); // blue eye, opacity is 170/255 (2/3), so it is a 1/3 transparent }

// USER DEFINED FUNCTIONS BELOW:

void eye(int x, int y, color c) { fill(c); ellipse(x, y, 60, 60); // large c colored circle centerd at (x,y) fill(0); ellipse(x+10, y, 30, 30); // smaller black cirlce shifted to the right, centered at (x+10,y) fill(c); ellipse(x+16, y-5, 6, 6);  // small c colored circle shifted to upper-right, centered at (x+16,y-5) } code output video (click the play button): media type="file" key="__eyes2.mp4" width="150" height="150"

2-day project: Within the next 2 class periods (by end of April 1, 2011 school day) you must email Mr. Bujak (ebujak@hopecschool.org) your programs for the 3 Exercises at the bottom of 181.chap24.Structure 3 - Functions.pdf


 * WEDNESDAY, MARCH 30, 2011** **(0.5 hour shortened class due to modified "PSSA schedule")**

Continuous (motion, frame rate, frame count) - 173.chap23.Structure 2 - Continuous.pdf Human persistence of vision, movie frame rates, "jerkiness", motion. Controlling the speed of program execution, refresh rates, frameRate, frameCount, noLoop

By default, frames are drawn to the screen 60 frames per second (fps). NOTE: say you want to update every 2 seconds, that's 1 frame per 2 seconds = 0.5 fps.

Example code to stop counting after 5 seconds: code void draw { frameRate(1); // 1 frame per second (fps) println("1000 - " + frameCount); if (frameCount == 5) { noLoop;           // stop the draw refresh/update } } code output: <<DO A MOVIE OF THIS TO OBSERVE THE TIMING/COUNTING>>

Email sample code to all 3 Exercises at the bottom of 173.chap23.Structure 2 - Continuous.pdf


 * TUESDAY, MARCH 29, 2011** **(0.5 hour shortened class due to modified "PSSA schedule")**

Rotate, Scale (image manipulation) - 137.chap19.Transform 2 - Rotate, Scale.pdf

You probably want to use smooth due to rotating and scaling side effects such as jagged lines (antialiasing is use)

Can view from 2 frames of reference:
 * the coordinate system frame of reference
 * the object frame of reference

Develop function drawGrid(color) to display grid every 10 units (horizontally and vertically) to help visualize transformation of coordinate system with translate, rotate, scale.

[1], [2], and [3] will use the following code: code int black = color(0,   0,   0);   // this is a good practice to define variables/constants that ... int red   = color(255, 0,   0);   // help you create self-documenting code int green = color(0,   255, 0); int blue  = color(0,   0,   255); int yellow = color(255, 255, 0); int purple = color(255, 0,  255); int aqua  = color(0,   255, 255); int white = color(255, 255, 255);

int greenTrans = color(0, 255, 0, 85); // 85/255 alpha --> ~1/3 opaque or 2/3 transparent int yellowTrans = color(255, 255, 0, 85); int purpleTrans = color(255, 0, 255, 65); // some colors are "harder", so backoff the opacity int aquaTrans = color(0, 255, 255, 85);

void setup { smooth; background(white);

drawGrid(greenTrans); // draw the original grid

translate(25, 55);                 // we will be changing these 3 lines // rotate(PI/8); // scale(2.8);

drawGrid(purpleTrans); // draw the transformed grid } // setup

// USER DEFINED FUNCTIONS BELOW: --

void drawGrid(color c) {             // a bad side effect is that the pen color is set to c  stroke(c);                          // change the color of the "pen" for (int x=0; x<=width; x+=10) {   // vertical grid lines line(x, 0, x, height-1); } // for for (int y=0; y<=height; y+=10) {  // horizontal grid lines line(0, y, width-1, y); } // for } //drawGrid code

[1] Revisit translate(x,y) code translate(25, 55); // rotate(PI/8); // scale(2.8); code

[2] Introduction to rotate(angle) rotate(angle) rotates the coordinate system clockwise, where angle is specified in units of radians (use the constant PI) Negative angles are permitted. Pivot point is (0,0) by default. code // translate(25, 55); rotate(PI/8); // scale(2.8); code

[3] Introduction to scale(size) -and- scale(xsize,ysize) scale(size) - uniform magnification, where scale is a decimal, such that scaling of 180% is 1.8, scaling of 75% is 0.75 scale(xsize, ysize) - non-uniform magnification, note that this distorts the coordinate system horizontally or vertically Note that scale affect everything including the grid lines [from the call to line] code // translate(25, 55); // rotate(PI/8); scale(2.8); code

[2a] rotate with a shape code drawGrid(greenTrans); // draw the original grid

fill(aquaTrans); rect(10, 60, 40, 20); rotate(-PI/8);          // rotate negative

drawGrid(purpleTrans); // draw the transformed grid

rect(10, 60, 40, 20); code

[3a] scale with a shape code drawGrid(greenTrans); // draw the original grid

fill(aquaTrans); rect(10, 60, 40, 20); scale(2.0);             // scale with 2 for easy interpretation

drawGrid(purpleTrans); // draw the transformed grid

rect(10, 60, 40, 20); code also add code size(150, 200); code immediately under code void setup { code

[_] Can use transformation together.

Mr. Bujak will code, students individually repeat, Mr Bujak will periodically run around the room and check. You can vary the code a little to your "personal tastes" with color, borders, diagnostics, etc. Try to ask your neighbors for help if it does not work before you ask Mr. Bujak; 90% of the time it is pure syntax errors attributable to new programmers and/or bad typing.

**MONDAY, MARCH 28, 2011** **(0.5 hour shortened class due to modified "PSSA schedule")**

Translate, Matrices (image manipulation) - 133.chap18.Transform 1 - Translate, Matrices.pdf

translate(x,y) moves the origin from the upper-left to another location [an (x,y,) offset].

Mr. Bujak will code, students individually repeat, Mr Bujak will periodically run around the room and check. You can vary the code to your "personal tastes" with color, borders, diagnostics, etc. Try to ask your neighbors for help if it does not work before you ask Mr. Bujak; 90% of the time it is pure syntax errors attributable to incorrect typing. [1] Introduction to translate(x,y) code int black = color(0,   0,   0);   // this is a good practice to define variables/constants that ... int red   = color(255, 0,   0);   // help you create self-documenting code int green = color(0,   255, 0); int blue  = color(0,   0,   255); int yellow = color(255, 255, 0); int purple = color(255, 0,  255); int aqua  = color(0,   255, 255); int white = color(255, 255, 255);

int purpleTrans = color(255, 0, 255, 85); // 85/255 alpha --> ~1/3 opaque or 2/3 transparent int aquaTrans = color(0, 255, 255, 85);

fill(yellow); rect(0,5,70,30);

strokeWeight(5); translate(10,30); fill(aqua); rect(0,5,70,30);

// strokeWeight(0); // this is not the same as noStroke noStroke; translate(10,20); fill(purpleTrans); rect(0,5,70,30); code will output:

[2] Preserve state with pushMatrix and popMatrix, as in a stack (LIFO queue). code int red   = color(255, 0,   0); int yellow = color(255, 255, 0);

pushMatrix; translate(25,20); fill(red); rect(0,20,66,30); popMatrix;

fill(yellow); rect(0,20,66,30); code will ouptut: [3] pushMatrix and popMatrix can be nested: code int red   = color(255, 0,   0);   // this is a good practice to define variables/constants that ... int green = color(0,   255, 0);   // help you create self-documenting code int blue  = color(0,   0,   255); int yellow = color(255, 255, 0);

// patterned after program 16-06 in "Processing" book, page 135 pushMatrix;        // outer translate(20, 0); fill(red); rect(0, 10, 70, 20); // Draws at (20, 10) - NOTE book incorrectly says (20,30) pushMatrix;        // inner translate(30, 0); fill(green); rect(0, 30, 70, 20); // Draws at (50, 30) - ... // that'(20 outer push + 30 inner push + 0 call, 0 outer push + 0 inner push + 30 call) popMatrix;         // inner fill(blue); rect(0, 50, 70, 20); // Draws at (20, 50) - ... // that'(20 outer push + 0 call, 0 outer push + 50 call) popMatrix;         // outer fill(yellow); rect(0, 70, 70, 20); // Draws at (0, 70) - ... // that'(0 call, 70 call) code with output:

Email sample code to the 2 Exercises at the bottom of 133.chap18.Transform 1 - Translate, Matrices.pdf

**FRIDAY, MARCH 25, 2011**

Revisit the PImage class object. Image manipulation, display, Tint, alpha (opacity) - 095.chap12.Image 1 - Display, Tint.pdf

Mr. Bujak already placed these images on C:/Processing subdirectory:
 * "fibonacci-sunflower-300x225.jpg"
 * "pj sam.gif"
 * "pj sam.transparent.gif"
 * "boy_math_lg_clr.transparent.motion.gif"
 * "spiral.png"

Let's work with spiral.png. These and other sample images at: @http://my.pogoplug.com/share/CucWCNLdw2wV3U9hqNm3MA/ A good source of royalty free images is http://pics4learning.com code size(500,500); PImage imgSpiral; // declare variable imgSpiral as an instance of the PImage object

int dullGreen = color(100,128,100); // color is a nice function background(dullGreen);

imgSpiral = loadImage("spiral.png"); int w = imgSpiral.width; // width of imgSpiral println("width = " + w); int h = imgSpiral.height; // height of imgSpiral println("height = " + h);

// put a point at the bottom-right of the above image: fill(128,128,0); // yellow-like color ellipse(w,h,9,9); // circle point(w,h);      // single pixel at spiral.jpg's lower-right

float aspectRatio; aspectRatio = w / h; println("aspectRatio = " + aspectRatio); // why is it 1.0 ? ==> integer arithmetic aspectRatio = float(w) / h; println("aspectRatio = " + aspectRatio); // it is 1.04

image(imgSpiral, 0, 0); // display imgSpiral

// place a smaller scaled image in the bottom-right, tinted blue: tint(0, 153, 204); // tint blue image(imgSpiral, w-80, h-80, 60, 60);

// place a smaller scaled image in the top-left, not tinted: noTint; // note that noTint is equivalent to tint(255, 255, 255, 255) image(imgSpiral, 20, 20, 60, 60);

// place a smaller scaled image in the top-right, not tinted, a little transparent: tint(255, 255, 255, 80); // no tint is 255,255,255, alpha to 80 image(imgSpiral, w-80, 20, 60, 60);

// place a smaller scaled image in the bottom-left, not tinted tint(255, 255, 0); // note that the blue colors are suppressed image(imgSpiral, 20, h-80, 60, 60);

// draw the smaller image 7 times, at bottom, varying tint, // from 0 tint all colors (on left) to full tint all colors (on right) for (int i=0; i<7; i++) { tint (i*255/7, i*255/7, i*255/7); image(imgSpiral,70*i, h+10, 60, 60); } code will output: and console output: NOTE: spiral.png is NOT a square image, so we distorted the "scaled" smaller images by saying 60, 60. If we wanted a width of 60, then we should have scaled by 442.0/60.0 = 7.366666 So 60,60 should have been 442/7.3666666, 425/7.3666666 --> 60.0, 57.7 --> 60, 58

Email sample code to the 3 Exercises at the bottom of 095.chap12.Image 1 - Display, Tint.pdf

**THURSDAY, MARCH 24, 2011**

[1] Processing (actually Java) can create Applets (platform independent) --or-- stand-alone EXEcutable code (platform dependent). We will revisit this ability of Java to create Applets and standalone executables later.
 * "File" / "Export" - for the Java Applet and supporting HTML (browser) files - also copy image files to the subdirectory where index.html is located.
 * "File" / "Export Application" - for stand-alone EXEcutable files - also copy image files to "application.windows" subdirectory where the .EXE file is located

[2] Typography - 111.chap15.Typography 1 - Display.pdf Follow along and do the same as Mr. Bujak demonstrates and explains some typography manipulation with Processing. Use the Create Font Tool to create a font: from menu click "Tools" then select "Create Font..." from the drop-down menu 72 points to an inch, Processing font files end in .VLW, Smooth vs non-smooth [like Smooth and noSmooth in graphics], be sure to copy the file name (use copy/paste). Processing fonts are bit (raster) images not vectors, so scaling larger/smaller will "degrade" the image. code size(400,400);

PFont font1 = loadFont("AgencyFB-Reg-48.vlw"); PFont font2 = loadFont("Boopee-Bold-48.vlw");

background(0,128,128);

textFont(font1); fill(255,0,0); text("Hello there!",50,50);

textFont(font2); fill(200,50,3); text("Please go home.",50,100,120,100);

textSize(90); text("Here we go again.",50,300); code will output something like: Notes: need these fonts on your machine. There are 2 fonts. Fonts have color with fill. Fonts have size with textSize. Fonts display at an x,y postion.

Email sample code to the 3 Exercises at the bottom of 111.chap15.Typography 1 - Display.pdf

**WEDNESDAY, MARCH 23, 2011**

There are many image file formats. Why? Some image file formats only support limited color palette. Some image file formats can support transparency. Some file formats support multiple images. Some file formats support "motion".
 * GIF - <256 colors, support transparency, supports multiple images, supports "motion"
 * PNG - true color, supports transparency
 * JPG - true color, no transparency
 * TIF ro TIFF - ?, no transparency

Make sure the following images are in C:/Processing subdirectory. Mr. Bujak already placed these images on C:/Processing. These and other sample images at: @http://my.pogoplug.com/share/CucWCNLdw2wV3U9hqNm3MA/ A good source of royalty free images is http://pics4learning.com
 * "fibonacci-sunflower-300x225.jpg"
 * "pj sam.gif"
 * "pj sam.transparent.gif"
 * "boy_math_lg_clr.transparent.motion.gif"

Let me share this final code with you. In class we will incrementally develop this code with pertinent discourse and a lot of walking around the room to make sure we are on "the same page." code // global variables - want everyone to see these: PImage imgBackground, imgFollowMouse;

void setup { size(500,350);

// only load the images once - that's why these are in the setup system function imgBackground = loadImage("fibonacci-sunflower-300x225.jpg");

// imgFollowMouse = loadImage("pj sam.gif"); // image is not ransparent imgFollowMouse = loadImage("pj sam.transparent.gif"); // image is transparent, no motion // imgFollowMouse = loadImage("boy_math_lg_clr.transparent.motion.gif"); // image is transparent and motion

cursor(HAND);   // change cursor to the finger pointing hand } // setup

void draw { background(255,77,125);    // pink-red background, use Color Selector tool image(imgBackground,0,0); // repaint the image over the above pink-red background image(imgFollowMouse, mouseX, mouseY); // repaint the last image

// only print the mouse position if it changes: if ((mouseX != pmouseX) || (mouseY != pmouseY)) { println(mouseX + "," + mouseY); // display the values of the mouse in the console } // if } // draw

code Show Mr. Bujak your code and email it to him.

The output should look like this. This image does not have the finger pointing hand cursor shown in the top-left of the Pajama Sam transparent GIF image that follows the mouse. Notice the mouse position is indicated in the console. the output video (click the play button): media type="file" key="pajama sam.mp4" width="461" height="461"

**TUE****SDAY, MARCH 22, 2011 (0.5 hour shortened class due to modified "PSSA schedule")**

OLD: We know about primitive data types: **void**, **int**, **long**, **float**, **boolean**, **cha** **r**. We know about one object data type: **String**.

NEW: Today we will learn about data type conversion and learn what an object is and how to use functions on instances of objects (like a variable). We will utilize Type Conversion and Objects - 105.chap14.Data 3 - Conversion, Objects.pdf

Primitive data types conversion: "data types" as functions to coerce/convert other data types: boolean, byte, char, float, int, str.

There are primitive data types and Objects. Primitive data types do not have properties.

Object "data types" have properties: **String** has length which returns the string's length, **String** also has functionality toUpperCase, etc.

Watch and code along with Mr. Bujak as he explains and codes. Mr. Bujak will around the room often to see your work and progress (or non-progress).

Object class: **String** (this is just a sampling) code String msg = "Here we go again!"; // declare and initialize a String variable called msg println(msg);

String msg2 = msg.toUpperCase; // Objects such as String have functionality ... a String knows how to upper case println(msg2);

int len = msg.length; // String objects know about its dynamic length println("The string's length = " + len); code will output: code Here we go again! HERE WE GO AGAIN! The string's length = 17 code

Object class: **PImage** (this is just a sampling)

Sample images at: @http://my.pogoplug.com/share/CucWCNLdw2wV3U9hqNm3MA/ or copy from the USB thumb drives passed around. "fibonacci-sunflower-300x225.jpg" "pj sam.gif" "spiral.png" Put these images into the C:/Processing subdirectory. code size(500,500);

PImage img; int w, h; // can declare multiple variables of the same data type together

println("fibonacci-sunflower-300x225.jpg"); // "fibo...jpg" has no background img = loadImage ("fibonacci-sunflower-300x225.jpg"); w = img.width; println("width = " + w); h = img.height; println("height = " + h); image(img,0,0);

println("spiral.png"); // spiral.png has a transparent background img = loadImage ("spiral.png"); w = img.width; println("width = " + w); h = img.height; println("height = " + h); image(img,0,0);

/* println("pj sam.gif"); // "pj sam.jpg" has a white background, not transparent img = loadImage ("pj sam.gif"); w = img.width; println("width = " + w); h = img.height; println("height = " + h); image(img,0,0); */ code will output: code fibonacci-sunflower-300x225.jpg width = 300 height = 225 spiral.png width = 442 height = 425

code and Note that the sunflower JPG image was displayed first and the transparent spiral PNG image was displayed second due to program execution.

EXTRA: Now for the brave at heart, make one of the images moveable as a function of the mouse movement (probably best if this were the transparent image. IDEAS: need t omake this update often ... so need to put most of this in the draw system function.

Object class: **PFont** (maybe in the next 2 days)

**MONDAY, MARCH 21, 2011 (0.5 hour shortened class due to modified "PSSA schedule")**

OLD: Last week was all about functions; creating small packets of code that can be called repeatedly with different values to effect a result. NEW: We know about data types: **void**, **int**, **long**, **float**, **boolean**. Today we will learn about text data types: **char** and **String**. We will utilize 101.chap13.Data 2 - Text.pdf. Email sample code to the 3 Exercises at the bottom of 101.chap13.Data 2 - Text.pdf. [1] Exercise 1: code char a0, a1, a2, a3, a4, a5; // declaration a0 = 'w'; // assignment a1 = 'o'; a2 = 'n'; a3 = 'd'; a4 = 'e'; a5 = 'r';
 * char** & **String** data types -

print(a0); print(a1); print(a2); print(a3); print(a4); print(a5); code with output: code wonder code [2] Exercise 2: code String firstName = "Edward"; // declare and initialize String variable firstName String lastName = "Bujak"; // declare and initialize String variable lastName String fullName; // declare String variable fullName

fullName = firstName + " " + lastName; // contatenate 3 Strings

println("Your first name is " + firstName); println("Your last name is " + lastName); println("Your full name is " + fullName); code with output: code Your first name is Edward Your last name is Bujak Your full name is Edward Bujak code [3] Exercise 3: code String sentence; String sentence2;

// note that String is multi-char and it may contain a single quote char sentence = "It's a wonderful day in the neighborhood!";

// Use the backslash as an escape character to specify an embedded delimiter, in this case the double quote sentence2 = "Joe said \"Welcome!\" ";

println(sentence); println(sentence2); code with output: code It's a wonderful day in the neighborhood! Joe said "Welcome!" code

**FRIDAY, MARCH 18, 2011**

OLD: Code from yesterday should have been something like: code void setup { for (int i=1; i<=20; i++) {    // loop from 1 to 20 inclusive println(i + " " + fact(i));  // on each line, print: "i i!" } } // setup

int fact(int n) { int factorial = 1;             // initialize for(int i= 1; i<=n; i++) {     // loop from 1 to n (the entered value) factorial = factorial * i;   // do product from 1*2*3*4*...*n } return (factorial);             // return the value of the factorial } // fact

code NEW: I posted the code (sample answers) after the Friday, March 18, 2011 class. [1] Do Program 1 from yesterday. Show Mr. Bujak your implementation of this and email your code to Mr. Bujak. The code is above! This was a gift. The problem is that it blows up after fact(16). This is due to the size of the **int** data type and factorial growing very fast.

[2] Do Program 2 from yesterday. Show Mr. Bujak your implementation of this and email your code to Mr. Bujak. I gave you the fact2 code below! All you had to do was copy/paste it into your program and change the name code that used to call fact to now call fact2; yet another gift. code void setup { for (int i=1; i<=21; i++) {    // loop from 1 to 21 inclusive println(i + " " + fact2(i)); // be sure to call the new fact2 function } } // setup

long fact2(int n) {              // note: int return data type changed to long return data type long factorial = 1;            // note: we must also change the factorial to a long data type for(int i=1; i<=n; i++) {      // loop from 1 to n (the entered value) factorial *= i;              // note: the change from factorial = factorial * i;   note: it's cleaner and faster } return factorial;               // note: the parentheses are optional on return } // fact2 code The smaller **int** data type was changed to the bigger **long** data type (both are integers), but it still blows up after fact(20). This is due to the tremendous growth of factorial for larger numbers, not because of our code.

[3] Do Program 3 from yesterday. Show Mr. Bujak your implementation of this and email your code to Mr. Bujak. Yet another relatively easy task which was to modify the code to only print out the prime numbers from 2 to 100 inclusive in one line. The isPrime function was provided; use it! code void setup {

//OLD CODE: /* for (int i=2; i<=20; i++) {  // loop from 2 to 20 inclusive println ("isPrime(" + i + ") = " + isPrime(i)); } // for */

// NEW CODE: for (int i=2; i<=20; i++) {     // loop from 2 to 20 inclusive if (isPrime(i)) {             // if i is prime ... print (i + " ");            // then print the prime number with trailing space, no return } // if  }  // for } // setup

boolean isPrime(int n) {          // isPrime(7) returns true, isPrime(9) returns false float m = sqrt(n); int i = 1; while (++i <= m) { if((n % i) == 0) { return false; } // if  }  // while return true; }  // isPrime code The output looks like: code 2 3 5 7 11 13 17 19 23 29 31 37 41 43 47 53 59 61 67 71 73 79 83 89 97 code

[4] Program 4: Write an isEven function. [4a] 1 input ---> int n return data type ---> boolean (true if n is even, false if n is not odd) Hint: explore ---> n%2 == 0 means the number n is an even number [4b] Call isEven function in loop from -10 to 10 inclusive, indiicating with a println statement if the value is even or not.

I explained a simple test for even-ness: divide by 2, if the remainder is 0 then it is an even number. In mathematics this is the modulus operator or simply mod. In many computer languages this is designated with the '%' operator or the mod function. code void setup { for (int i=-10; i<=10; i++) {   // loop from -10 to 10 inclusive if (isEven(i)) {              // if i is even ... print (i + " ");            // then print the even number with trailing space, no return } // if  }  // for } // setup

boolean isEven(int n) {           // isEven(8) returns true, isEven(9) returns false if((n % 2) == 0) {              // if a number n is evenly divisible by 2 ... return true;                  // then the number n is even } // if  return false; }  // isEven code The output looks like: code -10 -8 -6 -4 -2 0 2 4 6 8 10 code

**THURSDAY, MARCH 17, 2011 (0.5 hour shortened class due to modified "PSSA schedule")**

OLD: Extended: do-loop (iterate) to generate factorial for any Natural (Counting) number as a function. Code from yesterday is: [1] Program 1 (from yesterday): code void setup { println ("5!=" + fact(5)); // rewrite this println ("6!=" + fact(6)); // rewrite this println ("7!=" + fact(7)); // rewrite this } // setup

int fact(int n) { int factorial = 1; for(int i= 1; i<=n; i++) {  // loop from 1 to n inclusive (entered value) factorial = factorial * i; } return (factorial); } // fact

code NEW:

[1] Program 1: rewrite the above 3 indicated lines to calculate the factorials from 1 to 20 inclusive __in a loop__. Do you see a problem? Does it blow up? Show Mr. Bujak your personal code or your development team's (2 students only) code and email your code to ebujak@hopecschool.org (please put in an appropriate Subject line and identify yourself or your team by your real name(s))

[2] Program 2: a "better" factorial, fact2, shown below returns and works on a **long** data type rather than an **int**. The **long** is a bigger **int**. code long fact2(int n) { long factorial = 1; for(int i=1; i<=n; i++) { factorial *= i;          // note: the change from factorial = factorial * i;  } return factorial;          // note: the parentheses are optional on return value } // fact2

code Note: variable scope: this is not the same factorial or the same n or the same i as in fact. At what factorial n does fact2 blow up? Show Mr. Bujak your implementation of this and your calling this fact2 function in a loop. Email your code to Mr. Bujak.

[3] Program 3: Mr. Bujak wrote a function that determines if a number is prime by using the simple "trial division" technique from 2 to sqrt(n). There are many faster, more efficient methods, but this algorithm is conceptually simple. Note the introduction of the **boolean** data type (true or false). The "%" operator is the modulus, or mod operator; think of it (for now) as the remainder when you divide. The logical equals operator is ""=="". code void setup { for (int i=2; i<=20; i++) {     // loop from 2 to 20 inclusive println ("isPrime(" + i + ") = " + isPrime(i)); } } // setup

boolean isPrime(int n) {         // calculate if a number n is prime using the "trial division" method float m = sqrt(n); int i = 1; while (++i <= m) { if((n % i) == 0) { return false; } // if  }  // while return true; }  // isPrime code Your task is to enhance this code to only print out the prime numbers from 1 to 100 inclusive with no message, such as: [|2], [|3] , [|5] , [|7] , [|11] , [|13] , [|17] , [|19] , [|23] , [|29] , [|31] , [|37] , [|41] , [|43] , [|47] , [|53] , [|59] , [|61] , [|67] , [|71] , [|73] , [|79] , [|83] , [|89] , [|97] Hint: modify setup to only print the value of the number if it is prime. The critical word is "if" meaning you might want to use a conditional (and if statement).

Show Mr. Bujak your implementation of this and email your code to Mr. Bujak


 * WEDNESDAY, MARCH 16, 2011 (0.5 hour shortened class due to modified "PSSA schedule")**

OLD: Extended: do-loop (iterate) to generate factorial for any Natural (Counting) number. Code from yesterday is: code void setup {

int factorial;                      //  declare variable factorial int n;                              //  declare variable n

// compute 5! factorial = 1;                      // initialize variable factorial n = 5;                              // initialize variable n  for(int i=1; i<=n; i++) {            // loop from 1 to n inclusive factorial = factorial * i;        // take the product of 1*2*3*4*...*n // println(i + "=" + factorial);  // diagnostic message } // for println("factorial = " + factorial);

// now let's compute 6! factorial = 1;                      // initialize variable factorial n = 6;                              // initialize variable n  for(int i=1; i<=n; i++) {            // loop from 1 to n inclusive factorial = factorial * i;        // take the product of 1*2*3*4*...*n // println(i + "=" + factorial);  // diagnostic message } // for println("factorial = " + factorial);

} // setup

int fact (int n) {                    // this does not compile ... why? } // fact code BIG QUESTION: Why does the environment yell with "This method must return a result of type int"

ISSUES:
 * 1) We have to duplicate these lines every time we want to do a factorial --> not good design
 * 2) Artifacts are not good --> such as printing
 * 3) Make this generic --> so we can invoke its behavior or effect in an abstract call

NEW: Constants (such as PI). Data types: int, float, void. Data type conversion. M ake factorial program a function, return values (void, int, etc), formal parameters/arguments to functions, data types (currently we only know about int and float), operators: ++,--,*=,,/=

EXTRA CREDIT : Call the new fact function for fact(1) to fact (15) in a loop.

[1] Program 1: code println (PI); // constants are uppercase by convention println("the value of pi = " + PI); code [2] Program 2: code int i; println("the value of i = " + i); code What is the error message from the Processing environment? What does this mean? Fix it.

[3] Program 3: code int i;  // declare variable i as int data type i=5.4;  // assign value 5.4 to the variable i println("the value of i = " + i); code What is the error message from the Processing environment? What does this mean? Fix it. Note there are functions to "round" a real number (float data type) to an integer (int data type); such as: floor(5.4); ceil(5.4); round(5.4);

[4] Program 4: data type conversion code float i;  // declare variable i as float data type i=5;      // assign value 5 to the variable i println("the value of i = " + i); code [5] Program 5: now that we know a little more about data types let's go back to that factorial function. code // change factorial = factorial * i; // to factorial *= i; code

Type in the code that Mr. Bujak incrementally enters and explains. Please pay attention to the "behavior" of the color-directed sytanx editor. Yes, I want you to pay attention to the subtle programming hints with colors, emboldening, indenting, structure, etc. I will develop this incrementally and deliberately make mistakes and ask for suggestions to enhance the code, make it more generic, and more robust.

FUTURE: W e will revisit the above in a recursive function.


 * TUESDAY, MARCH 15, 2011 (0.5 hour shortened class due to modified "PSSA schedule")**

OLD: Do-loop (iterate) to generate factorial for any Natural (Counting) number. Code from yesterday is: code int factorial;                      // declare variable factorial as int data type int n;                              // declare variable i as int data type

factorial = 1;                      // initialize variable factorial n = 6;                              // initialize variable n for(int i=1; i<=n; i++) {            // loop from 1 to n inclusive factorial = factorial * i;        // take the product of 1*2*3*4*...*n // println(i + "=" + factorial);  // diagnostic message } // for println("factorial = " + factorial);

code

ISSUES:
 * 1) We have to duplicate these lines every time we want to do a factorial --> not good design
 * 2) Artifacts are not good --> such as printing
 * 3) Make this generic --> so we can invoke its behavior or effect in an abstract call
 * 4) It blows up for bigger n ... when? How can you tell?

NEW: declaration is not initialization although both can be done in one line, you declare a variable's data type only once, you can initialize a variable many time, make factorial program a function, return values (void, int, etc), formal parameters/arguments to functions, data types (currently we only know about int and float), operators: ++,--,*=,,/=

Type in the code that Mr. Bujak incrementally enters and explains. Please pay attention to the "behavior" of the color-directed sytax editor. Yes, I want you to pay attention to the subtle programming hints with colors, emboldening, indenting, structure, etc. I will develop this incrementally and deliberately make mistakes and ask for suggestions to enhance the code, make it more generic, and more robust.

FUTURE: We will revisit the above in a recursive function.


 * MONDAY, MARCH 14, 2011 (0.5 hour shortened class due to modified "PSSA schedule")**

OLD: Comments and review on previous day highlights: color by numbers, color selector tool, transparency/opacity/alpha, HSB, hue, saturation, brightness, RGB, red, green, blue, HEX number, opacity/transparency, additive colors, subtractive colors, NEW: Do-loop (iterate) to generate factorial for any Natural number

Type in the code that Mr. Bujak incrementally enters and explains. Please pay attention to the "behavior" of the color-directed sytax editor. Yes, I want you to pay attention to the subtle programming hints with colors, emboldening, indenting, structure, etc. I will develop this incrementally and deliberately make mistakes and ask for suggestions to enhance the code, make it more generic, and more robust.


 * FRIDAY, MARCH 11, 2011**

OLD: Comments and review on previous day highlights: functions, overloading eg fill, background NEW: color by numbers, color selector tool, transparency/opacity/alpha, HSB, hue, saturation, brightness, RGB, red, green, blue, HEX number, opacity/transparency, additive colors, subtractive colors - 085.chap11.Color 1 - Color by Numbers.pdf Work solo: email Mr Bujak your programs to questions 1 and 2 at the bottom of 085.chap11.Color 1 - Color by Numbers.pdf. 3 is optional extra credit.


 * THURSDAY, MARCH 10, 2011**

OLD: Comments and review on previous day highlights: NEW: repetion review; data types: int, float; debugging; diagnostics; functions; grouping statements to form blocks: parentheses, braces, brackets, beginShape, endShape; overloading eg beginShape Hardware failure, so we did paper on March 10. Hardware fixed, so here is the electronic work 069.chap9.Shape 2 - Vertices.pdf Work in teams of 2 only: Have fun with the code, experiment, explore, copy/paste, modify, ask Mr. Bujak questions, show Mr. Bujak your experiments. Email M.r Bujak your team's 3 small programs which are the answers to the 3 questions at the bottom of 069.chap9.Shape 2 - Vertices.pdf.


 * WEDNESDAY, MARCH 9, 2011**

OLD: repetition NEW: variables, simple data types: int, float; debugging; diagnostics Must work as a team of 2. Reply what each of these programs does with an email to Mr. Bujak with a subject line similar to "Subject: Period 4 - CS - 3/9 - Antwan Tate & Cory Robinson"

Type these in. Pay attention to the syntax: spelling, uppercase, lowercase, grammar, punctuation.

[1] Program 1: code int i = 7; println (i); code [2] Program 2: code int i = 7; println ("The value of i = " + i); code [3] Program 3: code int i = 7; i++; println ("The value of i = " + i); code [4] Program 4: code int i = 7; i = i + 8; println ("The value of i = " + i); code [5] Program 5: change i = i + 8; to i + =8; code int i = 7; i += 8; println ("The value of i = " + i); code [6] Program 6: Change the variable's data type from an integer (int) to a real number (float) code float i = 7; i += 8; println ("The value of i = " + i); code [7] Program 7: repetition (loop) review code for (int i=0; i<10; i++) { println ("The value of i = " + i); } code [8] Program 8: nested loops code for (int i=0; i<10; i++) { for (int j=0; j<3; j++) { println ("The value of i = " + i + " j = " + j); } } code

[9] Play with triangle, fill, background Show Mr. Bujak.


 * TUESDAY, MARCH 9, 2011**

OLD: NEW: Repetition - 061.chap8.Control 2 - Repetition.pdf


 * MONDAY, MARCH 7, 2011** - **Follow instructions**:

[1] You may work in pairs and discuss answers. You will need a laptop with Processing on it. [2] Be sure to use the 5 handouts that links are provided as a resource: [3] Email your __individual__ answers to questions [A] --> [E] to Mr. Bujak - <span class="wiki_link_ext">ebujak@hopecschool.org before you leave class. Note that each question is separated by a horizontal line. After you copy/paste the code snippets, you may want to reformat: "Tools" / "Auto Format" Please use "Period 4-CS Processing-3/4-YOUR NAME" as the Subject line, such as: Period 4-CS Processing-3/4-Jose Gonzales
 * [1] Getting Started: @http://processing.org/learning/gettingstarted/
 * [2] Download: @http://processing.org/download/
 * [3] Tutorials: @http://processing.org/learning/
 * [4] Basic Examples: @http://processing.org/learning/basics/
 * [5] Language Reference: @http://www.processing.org/reference/

We finished our Thursday, March 3, 2011 class with Program 4 (might want to copy/paste this code into Processing): code void setup { size(400,200);                 // 400 wide, 200 high }

void draw { background(0);                 // paint background black ellipse(mouseX,mouseY,20,40); // center the 20 wide, 40 high ellipse with the mouse, interactive event updates } code

size(400,200); background(0); ellipse(mouseX,mouseY,20,40);
 * QUESTION [A]** Briefly describe what each of these executable lines do (in the above program):

Comments are not executed. Comments are used for human descriptions. Comment out the background(0); line by putting a "slash slash" in front of that line. The line should turn gray. Describe the result/changes in the output.
 * QUESTION [B]**

mouseX and mouseY are reserved variables (blue). There are other similar system hardware "readings" like mousePressed. Modify the code to add a conditional (that's an "if") based on if the user is pressing the mouse button. code void setup { size(400,200);        // 400 wide, 200 high }
 * QUESTION [C]**

void draw { background(0);

if (mousePressed) { fill(0);            // black } else { fill(255);          // white }

ellipse(mouseX,mouseY,20,40); // center the 20 wide, 40 high ellipse with the mouse, interactive event updates } // draw code

Describe the result/changes in the output. How is the mouse button pressed related to fill?

Keyboard input. Examine (maybe copy/paste) the following code. Add a user defined variable "bgColor" and initialize it to 0 (black). We will use "bgColor" to hold the background color of the window. We examine the keyboard being pressed via the "keyPressed" system (blue) variable. If "keyPressed" is true, then we must further ask if it may have been one of the keys we want to act upon. We do this by further querying the "key" system (blue) variable. Let's pick p, but make sure we look for lowercase 'p' and uppercase 'P'.
 * QUESTION [D]**

Describe the result/changes in the output. Please comment on the print statement, "println(bgColor)" ... is the execution of the program too fast? When we hit the 'p' are we too slow and maybe the program is too fast? Thought on maybe how to address this (it's generally called

code int bgColor= 0;                 // global variable

void setup { size(400,200);                // 400 wide, 200 high }

void draw { if(keyPressed) { if (key == 'p' || key == 'P') { bgColor = bgColor + 5; if (bgColor > 250) { bgColor = 0; } // if (bgColor ...      println(bgColor);    }  // if (key ... } // if (keyPressed ...

background(bgColor);

if (mousePressed) { fill(0);                    // black } else { fill(255);                  // white }

ellipse(mouseX,mouseY,20,40); // center the 20 wide, 40 high ellipse with the mouse, interactive event updates

} // draw code


 * QUESTION [E]** Enhance the above program with something totally new and tell me what it is. You __must__ include your code. Copy your code from Procesing and paste into your email to me. If you like, you can out the comments in your code.

End of March 4, 20111 classwork. Have a great weekend.


 * CURRATED RESOURCES (below) - use your browser search**

• Curriculum

 * CSTA - Computer Science Teachers Association Model Curriculum for K-12 Computer Science evel I, Level II, Level III, ...
 * @http://csta.acm.org/Curriculum/sub/ACMK12CSModel.html
 * @http://csta.acm.org/Curriculum/sub/ExploringCS.html

• Standards

 * CSTA (Computer Science Teachers Association) Model Curriculum for K-12 Computer CS in the Core
 * Science - Level II and Level III
 * Standards for Technological Literacy (STL)
 * National Science Standards (NSTA)
 * National Math Standards (NCTM)
 * ISTE NET-S Standards- [|www.iste.org/standards/nets-for-students.aspx].

• Professional Organizations

 * CS Principles - A First Course in Computing - from the College Board
 * CSTA - Computer Science Teachers Association
 * PACSE - Google Group - Philadelphia Area Computer Science Educators is a chapter of the CSTA - students invited!


 * **PicoBoards interfaces to Scratch, BYOB - from MIT -** ** (formerly Scratch Boards) - PicoCricket - printed circuit interface board **
 * Scratch projects tagged with PicoBoards -
 * information -
 * buy here -
 * PicoCricket Workshop Kit -
 * Sensor Board simulator -
 * **Arduino - from Italy - interfaces to Processing**
 * ** Arduino home page - **
 * ** BYOB used to control devices with Arduino micro-controller - **
 * ** <span class="wiki_link_ext"> Arduino flickr (photos) group pool - **
 * ** where to buy - SparkFun Electronics - **
 * **Finch robot - interfaces to Processing,** GreenFoot, **Java, JavaScript (coming soon), Python, Scratch (coming soon), Alice (coming soon), Visual Basic (coming soon), Labview (coming soon)**
 * <span style="color: #2a2a2a; font-family: Tahoma,Verdana,Arial,sans-serif; line-height: 17px;">[] -
 * <span style="color: #2a2a2a; font-family: Tahoma,Verdana,Arial,sans-serif; line-height: 17px;">__ @http://www.finchrobot.com/news/processing __
 * <span style="color: #2a2a2a; font-family: Tahoma,Verdana,Arial,sans-serif; line-height: 17px;"> __ @http://csbots.wetpaint.com/ __
 * Finch on FaceBook -
 * [] - great youtube videos
 * [|http://www.andrew.cmu.edu/user/tlauwers/Finch] - Java package Finch documentation
 * [|http://www.andrew.cmu.edu/user/tlauwers/Finch] - Java package Finch documentation

>> http://mathfuture.wikispaces.com/Scratch+platform+as+a+pathway+to+math+and+programming-
 * **Java Links**
 * main Sun site: java.sun.com
 * Sun Links:
 * Full API
 * Javadoc Info
 * The Java Tutorial
 * The Java Language Specification
 * Competitions, Tournaments:
 * Computer Stars Competition
 * Textbooks:
 * Free online Java textbooks and lessons
 * Thinking In Java - a free online textbook
 * Tutorials and Lessons:
 * Beginner, intermediate, and advanced tutorial links from George Washington University
 * Online tutorials from Java Coffee Break
 * Code Conventions for the Java Programming Language
 * **Java IDE**
 * DrJava IDE (Java-based, runs everywhere, with debugger and //interpreter// (interactions pane)) <span style="font-family: Verdana,Arial,Helvetica,Sans-Serif;">is a lightweight development environment for writing Java programs. It is designed primarily for students, providing an intuitive interface and the ability to interactively evaluate Java code. It also includes powerful features for more advanced users. DrJava <span style="font-family: Verdana,Arial,Helvetica,Sans-Serif;">is available for free under the <span class="wiki_link_ext">BSD License, and it is under active development by the JavaPLT group at Rice University. DrJava was used at the 2009 CMU ACTIVATE Workshop on Java Programming for Math and Science - my photos/videos.
 * <span style="color: #333333; font-family: Arial,sans-serif; line-height: 14px;">Java programming environments for beginners:
 * <span style="color: #005fa9; font-family: Arial,sans-serif; line-height: 14px; text-decoration: none;">[|Greenfoot]
 * <span style="color: #005fa9; font-family: Arial,sans-serif; line-height: 14px; text-decoration: none;"> [|Dr. Java]
 * JCreator IDE (Windows-only, no debugger in free version, but lightweight and fast) is the development tool for every programmer that likes to do what he does best: programming. It is faster, more efficient and more reliable than other IDE’s. Therefore it is the perfect tool for programmers of every level, from learning programmer to Java-specialist. JCreator was used at the 2009 CMU ACTIVATE Workshop on Java Programming for Math and Science - my photos/videos.
 * <span class="wiki_link_ext">Eclipse (or here) - more complex, but still free, IDE for professionals
 * <span class="wiki_link_ext">NetBeans IDE - more complex, but still free, IDE for professionals
 * BlueJay (BlueJ) - Java IDE, shows objects, from Kent University, UK
 * Jelliot algorithm animator, plug-in for BlueJay,uses BlueJ - Jeliot is a program animation system for Java programs. All dynamic aspects of the program execution are visualized -- expression evaluation, assignment and control statements, method calls and constructor invocations -- either step by step or continuously. The full program state is visualized -- variables, activation records, objects and references -- so that the student can understand the effect of each operation on the data. A history is maintained so that previous states can be displayed. The animation is done directly from the Java source code with no annotations or modifications, so that Jeliot can be easily used by teachers and students. Jeliot is free software distributed under the GNU General Public License (GPL).
 * GridWorld - approximately 25% of the AP Computer Science test.
 * GreenFoot - GridWorld for anything, uses BlueJ, supports scenarios, games in 2D grids
 * Javabat.com - class management, class login, user login, saved practice
 * jGRASP is a medium weight IDE with many pedogogical features for teaching and learning Java, including automatic generation of control structure diagrams and UML class diagrams, a highly visual and easy to use debugger, and an intuitive object workbench. jGRASP and the jGRASP Handbook are freely available at http://www.jgrasp.org
 * **1st person programming environment**
 * Alice is an innovative 3D programming environment that makes it easy to create an animation for telling a story, playing an interactive game, or a video to share on the web. Alice is a teaching tool for introductory computing from middle school through early college. Alice uses 3D graphics and a drag-and-drop interface to facilitate a more engaging, less frustrating first programming experience. What is Alice? - Tutorials from Duke -
 * Scratch - 2D worlds - used in some universities (University of Pennsylvania, Harvard University, ...) for a gentle 2-week intro to programming concepts before jumping into Java - my Scratch diigo bookmarks. - Scratch programming as a pathway to learning math and programming -
 * Scratch - 2D worlds - used in some universities (University of Pennsylvania, Harvard University, ...) for a gentle 2-week intro to programming concepts before jumping into Java - my Scratch diigo bookmarks. - Scratch programming as a pathway to learning math and programming -
 * Scratch Wiki - http://wiki.scratch.mit.edu/wiki/Scratch_Wiki
 * Scratch featured projects - http://scratch.mit.edu/channel/featured
 * ScratchEd - http://scratched.media.mit.edu
 * Scratch events - <span class="wiki_link_ext"> http://events.scratch.mit.edu
 * Blog entry: Storytelling with Scratch -
 * Scratch Tutorials (screencasts) -
 * LearnScratch.org - tutorials/videos
 * Shall we learn.com - http://shallwelearn.com
 * Shall We Learn Scratch Programming eBook - by Jessica Chiang, 177 pages - [|www.scribd.com/doc/23343953/Shall-We-Learn-Scratch-Programming-eBook]
 * Scrape - analyzing Scratch programs - very interesting - also []
 * youtube
 * [] - intro
 * [] - lesson 1 of 10
 * __BYOB - "Scratch for CS" - Berkeley - BYOB (Build Your Own Blocks), an advanced offshoot of Scratch, a visual programming language primarily for kids from the Lifelong Kindergarten Group at the MIT Media Lab. This version, developed by Jens Mönig with design input and documentation from Brian Harvey, is an attempt to extend the brilliant accessibility of Scratch to somewhat older users—in particular, non-CS-major computer science students—without becoming inaccessible to its original audience. BYOB 3 adds first class lists and procedures to BYOB's original contribution of custom blocks and recursion. BYOB adds lists, lambda, map, and many other features. UC Berkeley The CS 10 Moodle (lab-based) BYOB programming curriculum (log in as guest), CS 10 lecture videos from fall 2010, CS 10 website, BYOB - the movie (very good), Build Your Own Blocks — SIGCSE 2011 Workshop #22, Friday, March 11, 2011, 7–10pm. BYOB used to control devices with Arduino micro-controller - my BYOB diigo bookmarks -__
 * Panther__ - is a programming language aimed at young users with only a small knowledge of programming. Panther offers you a more advanced version of Scratch, a simple programming language developed at MIT. With a host of new features such as file and webpage manipulation and advanced colour sensing, cloning and much more besides, Panther provides advanced usage for avid Scratchers around the globe as well as new programmers looking for a fluid, easy to understand starting language. Visit Panther's [|Wiki page] for a full list of our features.
 * **Python**
 * Python is a programming language that lets you work more quickly and integrate your systems more effectively. You can learn to use Python and see almost immediate gains in productivity and lower maintenance costs.
 * PyGeo - a dynamic geometry toolkit - @http://pygeo.sourceforge.net -AND- www.4dsolutions.net/ocn/pygeo.html
 * NumPy (add-on) - Numerical Python - http://sourceforge.net/projects/numpy
 * I used Python for my 2010 Bioinformatics Summer Research Fellowship, June 14-July 23, 2010, Franklin & Marshall College, Lancaster, PA - photos/videos - my research slide show Machine Learning to Differentiate coding RNA from non-coding RNA
 * ShowMeDo videos on Python - great
 * Free tutorials and books:
 * <span style="color: #005fa9; font-family: Arial,sans-serif; line-height: 14px; text-decoration: none;">[|Python tutorial]
 * <span style="color: #005fa9; font-family: Arial,sans-serif; line-height: 14px; text-decoration: none;">[|Python beginners guide]
 * <span style="color: #005fa9; font-family: Arial,sans-serif; line-height: 14px; text-decoration: none;">[|Dive into Python]
 * <span style="color: #005fa9; font-family: Arial,sans-serif; line-height: 14px; text-decoration: none;">[|Think Python: How to Think Like a Computer Scientist]
 * <span style="color: #005fa9; font-family: Arial,sans-serif; line-height: 14px; text-decoration: none;">[|Introduction to Media Computation: A Multimedia Cookbook in Python]
 * <span style="color: #333333; font-family: Arial,sans-serif; line-height: 14px;">Python Summaries and quick references
 * <span style="color: #005fa9; font-family: Arial,sans-serif; line-height: 14px; text-decoration: none;">[|Python summary]
 * <span style="color: #005fa9; font-family: Arial,sans-serif; line-height: 14px; text-decoration: none;">[|Pocket reference]
 * <span style="color: #005fa9; font-family: Arial,sans-serif; line-height: 14px; text-decoration: none;">[|Python Quick Reference (PQR)] : complete and long
 * resources - University of Maryland
 * **VPython**
 * VPython is the Python programming language plus a 3D graphics module called "Visual" originated by David Scherer in 2000. VPython makes it easy to create navigable 3D displays and animations, even for those with limited programming experience. Because it is based on Python, it also has much to offer for experienced programmers and researchers.
 * **RAPTOR**
 * RAPTOR is a flowchart-based programming environment, designed specifically to help students visualize their algorithms and avoid syntactic baggage. RAPTOR programs are created visually and executed visually by tracing the execution through the flowchart. Required syntax is kept to a minimum. Students prefer using flowcharts to express their algorithms, and are more successful creating algorithms using RAPTOR than using a traditional language or writing flowcharts without RAPTOR. RAPTOR was used at the 2009 CMU ACTIVATE Workshop on Computational Thinking - my photos/videos.
 * great RAPTOR instructional videos.
 * **Processing**
 * <span class="wiki_link_ext">Processing is graphical, artistic, and computing environment based on Java. <span style="color: #323232; font-family: Arial,Helvetica,'Bitstream Vera Sans',sans-serif; line-height: 16px;">Processing is a language and environment that is built on top of Java, but which provides powerful built-in methods that make visualization and audio processing accessible to novice programmers. See: CSE120 CS Principles, www.cs.washington.edu/education/courses/cse120/11wi
 * [1] Getting Started: @http://processing.org/learning/gettingstarted/
 * [2] Download: @http://processing.org/download/
 * [3] Tutorials: @http://processing.org/learning/
 * [4] Basic Examples: @http://processing.org/learning/basics/
 * [5] Language Reference: www.processing.org/reference
 * Chapters from //Processing - A Programming Handbook for Visual Designers and Artists//, by Casey Reas and Ben Fry, The MIT Press, 2007
 * ISBN-10: 0-262-18262-9, ISBN-13: 978-0-262-18262-1
 * Link to all chapters
 * Search below for the //Processing//"Table of Contents" with links to online chapter documents.
 * _xix.forw1.Foreword.pdf -
 * _xxi.pref1.Preface.pdf - contains Contents, How to read this book, Casey's introduction, Ben's introduction, Acknowledgments, Software, Literacy, Open, Education, Network, Context
 * 001.chap1.Processing....pdf
 * 009.chap2.Using Processing.pdf
 * 017.chap3.Structure 1 - Code Elements.pdf
 * 023.chap4.Shape 1 - Coordinates, Primitives.pdf
 * 037.chap5.Data 1 - Variables.pdf
 * 043.chap6.Math 1 - Arithmetic, Functions.pdf
 * 051.chap7.Control 1 - Decisions.pdf
 * 061.chap8.Control 2 - Repetition.pdf
 * 069.chap9.Shape 2 - Vertices.pdf
 * 079.chap10.Math 2 - Curves.pdf
 * 085.chap11.Color 1 - Color by Numbers.pdf
 * 095.chap12.Image 1 - Display, Tint.pdf
 * <span class="wiki_link_ext">101.chap13.Data 2 - Text.pdf
 * 105.chap14.Data 3 - Conversion, Objects.pdf
 * 111.chap15.Typography 1 - Display.pdf
 * 117.chap16.Math 3 - Trigonometry.pdf
 * 127.chap17.Math 4 - Random.pdf
 * 133.chap18.Transform 1 - Translate, Matrices.pdf
 * 137.chap19.Transform 2 - Rotate, Scale.pdf
 * 145.chap20.Development 1 - Sketching, Techniques.pdf
 * 149.chap21.Synthesis 1 - Form and Code.pdf
 * 155.chap22.Interviews 1 - Print.pdf
 * <span class="wiki_link_ext">173.chap23.Structure 2 - Continuous.pdf
 * 181.chap24.Structure 3 - Functions.pdf
 * 197.chap25.Shape 3 - Parameters, Recursion.pdf
 * 205.chap26.Input 1 - Mouse I.pdf
 * 217.chap27.Drawing 1 - Static Forms.pdf
 * 223.chap28.Input 2 - Keyboard.pdf - Pogoplug public link - Pogoplug embedded direct link -
 * 229.chap29.Input 3 - Events.pdf - Pogoplug public link - Pogoplug embedded direct link -
 * media type="custom" key="8985430" (4/6/2011)
 * 237.chap30.Input 4 - Mouse II.pdf
 * 245.chap31.Input 5 - Time, Date.pdf
 * 251.chap32.Development 2 - Iteration, Debugging.pdf
 * 255.chap33.Synthesis 2 - Input and Response.pdf
 * 261.chap34.Interviews 2 - Software, Web.pdf
 * 279.chap35.Motion 1 - Lines, Curves.pdf
 * 291.chap36.Motion 2 - Machine, Organism.pdf
 * 301.chap37.Data 4 - Arrays.pdf
 * 315.chap38.Image 2 - Animation.pdf
 * 321.chap39.Image 3 - Pixels.pdf
 * 327.chap40.Typography 2 - Motion.pdf
 * 333.chap41.Typography 3 - Response.pdf
 * 337.chap42.Color 2 - Components.pdf
 * 347.chap43.Image 4 - Filter, Blend, Copy, Mask.pdf
 * 355.chap44.Image 5 - Image Processing.pdf
 * 367.chap45.Output 1 - Images.pdf
 * 371.chap46.Synthesis 3 - Motion and Arrays.pdf
 * 377.chap47.Interviews 3 - Animation, Video.pdf
 * 395.chap48.Structure 4 - Objects.pdf
 * 413.chap49.Drawing 2 - Kinetic Forms.pdf
 * 421.chap50.Output 2 - File Export.pdf
 * 427.chap51.Input 6 - File Import.pdf
 * 435.chap52.Input 7 - Interface.pdf
 * 453.chap53.Structure 5 - Objects II.pdf
 * 461.chap54.Simulate 1 - Biology.pdf
 * 477.chap55.Simulate 2 - Physics.pdf
 * 495.chap56.Synthesis 4 - Structure, Interface.pdf
 * 501.chap57.Interviews 4 - Performance, Installation.pdf
 * 519.chap58.Extension 1 - Continuing....pdf
 * 525.chap59.Extension 2 - 3D.pdf
 * 547.chap60.Extension 3 - Vision.pdf
 * 563.chap61.Extension 4 - Network.pdf
 * 579.chap62.Extension 5 - Sound.pdf
 * 603.chap63.Extension 6 - Print.pdf
 * 617.chap64.Extension 7 - Mobile.pdf
 * 633.chap65.Extension 8 - Electronics.pdf
 * ---MORE ABOVE THIS---
 * 661.app.app1.Appendices.pdf
 * 692.refs1.Related Media.pdf
 * 699.refs2.Glossary.pdf
 * 703.index1.Code Index.pdf
 * 705.index2.Traditional Index.pdf
 * Processing flickr (photos) group pool -
 * **App Inventor for Android**
 * About App Inventor for Android from Google Labs - create apps for your phone. App Inventor is a software tool from Google for developing apps for Android smartphones. Apps are built from preprogrammed "blocks" using a drag-and-drop method. An emulator fo rthe Android devices will be used.
 * App Inventor google group -
 * Android -
 * Android Developers -
 * **Smalltalk**
 * Squek is a modern, open source, full-featured implementation of the powerful Smalltalk ( [|Smalltalk] ) object-oriented programming language and environment. Squeak is highly-portable - even its virtual machine is written entirely in Smalltalk making it easy to debug, analyze, and change. Squeak is the vehicle for a wide range of projects from multimedia applications, educational platforms to commercial web application development. Smalltalk was designed in the 1970s in part as an educational tool for teaching programming. Squeak may be best known as part of the [|Children's Machine], part of the [|One Laptop Per Children] initiative. Squeak is closely related with Objective-C, and Smalltalk and Squeak have both been influential on the development of other languages (including Scratch).
 * **Scheme**
 * Scheme
 * **BASIC**
 * Scheme
 * **LISP**
 * LISP is a funcitonal language typoically used in artificial intelligence and expert systems.
 * **Haskell**
 * Haskell is a functional language
 * **PROLOG**
 * PROLOG
 * **Scheme**
 * Scheme
 * **Statistics**
 * The R Project for statistical Computing - "R is a language and environment for statistical computing and graphics. It is a GNU project which is similar to the S language and environment which was developed at Bell Laboratories (formerly AT&T, now Lucent Technologies) by John Chambers and colleagues. R can be considered as a different implementation of S. There are some important differences, but much code written for S runs unaltered under R. R provides a wide variety of statistical (linear and nonlinear modeling, classical statistical tests, time-series analysis, classification, clustering, ...) and graphical techniques, and is highly extensible. The S language is often the vehicle of choice for research in statistical methodology, and R provides an Open Source route to participation in that activity."
 * Planetmath.org - great deal of R language related math topics - including the following starting points: [|PlanetMath Overview] - [|High School Mathematics] - [|Calculus] - [|Statistics] - [|Real Numbers] - [|(more)]
 * **C++**
 * C++ is C with object-oriented extensions such as single inheritance,
 * DevC++ compiler - is a full-featured integrated development environment (IDE) that uses the MinGW version of C++. An IDE is a program that allows you to edit, compile, and debug your C++ programs without using the command-line. For those of you who prefer to use your own editor, [| download the command-line version] of MinGW instead. DevC++ comes with everything you need to compile and link both console-mode and GUI programs that will run on Windows 95/98/NT/2K/XP
 * **C**
 * C is a high-level software language that needs to be compiled. It has no type checking so is fast. C is used for low-level software up to operating system software.
 * **Pascal**
 * Pascal is a strongly typed programming language used for a time in data structures and algorthms courses
 * **Ada**
 * Pascal derivative. adds multi-tasking, concurrency. Mandated by the military to standardize on one language.
 * **FORTH**
 * FORTH is a threaded interpretive language (TIL). FORTH is great for writing low-level software without having to delve into assembly. FORTH is interpreted, via a dictionary, so development is rapid. FORTH can also be target compipled for more speed. FORTH utilizes the stack to deal with "parameter passing" so it is fast. FORTH is great for embedded systems.
 * **Assembly Language**
 * Assembly Language is native-code programmed directly in the (micro)processor's instruction set.
 * **Assembly Language**
 * Assembly Language is native-code programmed directly in the (micro)processor's instruction set.
 * Assembly Language is native-code programmed directly in the (micro)processor's instruction set.
 * **Assembly Language**
 * Assembly Language is native-code programmed directly in the (micro)processor's instruction set.

• Gaming

 * <span class="wiki_link_ext">Texas Games Network - This site is provided for all educators, students, and independent game developers to share common interests, resources, and ideas for integrating game-based design and development into the classroom.
 * yoyogames.com - "where the world comes to play, make, and share games"
 * Beginning Gamers Educator's Toolkit -

• Resources
> @http://blogs.edweek.org/edweek/DigitalEducation/2011/03/national_stem_game_challenge_w.html > > Decent $$ prizes. > > Are you a user or creator? Are you simply a consumer or a producer? Almost everyone can use this stuff at different levels, but who can create anything with it? That's why we need critical thinkers and computer science/engineering and programming! It teaches professional collegiality and original thought! It teachers conceptual thinking and computational thinking.
 * Science Digest - computers - various computer science topics
 * Programming Dojo is a place where you can learn more about programming and programming languages.
 * cs-unplugged - a great resource with a number of exercises to demonstrate computer science principles without the use of of a computer
 * strfriend - visualize regular expressions (regex or regexp) simply
 * diff - online diff (from unix) to compare two ASCII text files
 * Nice "article" and video about STEM and CS/programming.

• College Board AP Resources
Information specific to AP Computer Science, including the Grid World Case Study, can be found on AP Central:
 * AP Computer Science A
 * AP Computer Science AB
 * CS Principles - a first course in computing

• Events

 * CS Education Week - December 5-11, 2010

• Research
> The report finds that roughly two-thirds of the country have few computer science education standards for secondary school education, and most states treat high school computer science courses as simply an elective and not part of a student's core education. To address these issues, ACM is partnering with major stakeholders in the community to launch a new coalition called Computing in the Core. Read more about the ACM and CSTA study and download the report.
 * "Transforming Computer Science Education in High Schools" by Jan Cuny, NSF - IEEE Computer Society, June 2011
 * Bertrand Meyer's technology blog - Wirth, Liskov and Knuth - "In November of 2005, as part of the festivities of its 150-th anniversary, the ETH Zurich bestowed honorary doctorates on Don Knuth and Barbara Liskov."
 * Bertrand Meyer's gallery of computer scientists - wonderful
 * New Report! Why is the K-12 CS Education Fading as Digital Economy Grows? - from CSTAAlerts - System Failure: ACM and CSTA release report on CS education standards; Computing in the Core coalition launched

• Computational Singing

 * Mr. Kosbie at CMU - www.kosbie.net/cmu/cmupie.mp3 - (America Pie) - CMU, Pittsburgh, PA
 * Dr. John Dougherty (aka JD) – Haverford College -http://cs.haverford.edu/songs I have videos of some of these at my photos/videos from CSESI 2009 (Computer Science Education Summer Institute) at Haverford College
 * Mr. Haggag - @http://mrhaggag.com/nw/cd/ - Germantown/Rockville, MD8n