310 likes | 319 Views
Computer Science I. Looking at code: "Where did Prof. Shablinsky go?” Reprise on Add to 15 implementation Classwork/homework: Catch up: classy project. Propose midterm project. Feedback on error messages. While programming in Processing
E N D
Computer Science I Looking at code: "Where did Prof. Shablinsky go?” Reprise on Add to 15 implementation Classwork/homework: Catch up: classy project. Propose midterm project.
Feedback on error messages While programming in Processing • Some you can ignore because you haven’t gotten to code something yet. • BUT look at them because maybe the message indicates a mistake. • For example, methods (aka functions) are defined to take specific arguments.void calculate(float v, float w) {…} is not the same asvoid calculate(int v) { }
Feedback • You need to zip the FOLDER, containing the .pde file and, possibly, a data file, and, possibly, other things… • USE THE NAMING CONVENTION:jMeyerBouncingThingsWClasses • You may have problems in re-using names. Download may producejMeyerBouncingThings(1).zipwhich could produce folder NOT matching .pde file name. Solution: erase old stuff or change name.
Why classes • Like functions and variables, classes are a way to extend the language to [better] suit your application. • Bouncing things used classes so • The same code used when possible • Different code used when necessary. The different code was defined in a structured way. • Classes are not especially abstract. Think about what are the entities (things) in your application? • Look at the Slingshot sketch later in the class.
Class • A class definition is the template for any number of distinct objects. • An object is set up using the new operator and invoking the constructor. So if Thingee is the name of a class ThingeemyThingee = new Thingee( ); Builds of object of datatype Thingee, setting values. • The methods of the class can be invoked for each object using dot notation. The variables can be set or accessed using dot notation.
Arrays and Classes • You can use one or both for your particular project. • Except sometimes I required one or the other for an assignment! • The Add to 15 has a more or less intricate use of arrays • Values in certain arrays are indices into other arrays.
Feedback • Consider use of array in place of Box1, Box2, … • Then you can use loopsfor (inti<0;i<boxes.length;i++) { …} • Do use distinct names for things that have specific rolesThing badguy = new Thing(…);Thing goodguy = new Thing(...);Things[] stuffToDisplay = {badguy,goodguy,…}
Idea for game • Display world map • Player attempts to guess where Prof. Shablinsky went during a summer a couple of years ago? Answers are: • Iceland • St. Petersberg • While player is thinking, a shrinking image travels towards mouse position. Elapsed time shown. • If player clicks the screen, flyer appears where the mouse was clicked. Two possibilities for message: • Positive message • Distance in pixels from closest of two answers • If alloted time runs out, • Time ran out
Processing features • The background function can take an image as an argument. This is how I make the map be the background: background(bg); • The nf function formats floats. So if secs has the value 5.100101, thennf(secs,1,2); will produce the string "5.10"
Planning • Manage two phases: inmotion Boolean variable (aka flag) • Define • setup • Draw • If inmotion: move flyer image towards mouse • Else: give response • mouseClicked • checkanswer • giveresponse
Planning, cont. • Move (animate) the flyer (the Irina image) towards the mouse position. • Animation stops at the end of a fixed time duration set to 5 seconds OR if player clicks on the map. • If player clicks on the map, a computation is done using the dist function to see if the player's location is near enough to one of the answer. Appropriate response given. • If time runs out, a response is given.
Examine program • Notice comments, including commented out code: used for debugging. • The world map displayed using Pimagebg;In setup: bg = loadImage(filename); In draw: background(bg); • The distance in pixels is calculated by builtin function dist. A for-loop calculates what of the two places is closer and then compares that number to 10, the tolerance allowed. This may be too strict. • The function nf is used to format the elapsed time to display 2 decimal places. • The flyer image dimensions are continuously changed, but kept in proportion using wdel, fw, and fh variables. fw-= wdel; fh= fw*(origh/origw);
PImagebg; PImage flyer; booleaninmotion = true; boolean clicked = false; float duration = 5; // 5 seconds float framer = 50; float interval = 1/framer; //frame interval in time float x,y,fw,fh,wdel; float origw,origh,smallw; PFont font; String question = "Where did Professor Shablinsky travel this summer?"; int[][] answers = {{452,90},{367,77}}; String[] answertexts = {"St. Petersberg, Russia", "Iceland"}; String responsetext;
Functions • setup • draw • mouseClicked • checkAnswer (float cx, float cy) • giveresponse
Reprise on Add to 15 • Rules of the game • Implementation • Prepare data ahead of time • No addition to 15 • Example of use of arrays • Arrays with pointers (indices) into other arrays
Similar to • … tic tac toe • In fact, equivalent • What does that mean? • Examine game
Characteristics • 9 moves • What are winning combinations? • 9 5 1 • ?
Number of combinations • 8 • Same as number of rows + columns + diagonals!!! • Suggestion for the proof • Assign the numbers to the 9 locations on the tic tac toe grid to make valid combination in each row, column and diagonal • Try to do it
Here is a way • For each number, count up presence in winning combinations. • 5 is present in 4, so….it goes in the middle. • There are 4 numbers that are present in 3, so they go in the corners, • First placement is arbitrary….keep going.
My approach to smartmove • Check for immediate win • Check for immediate need to block • Check for group with 1 computer move and no player move • Take the 5, if available • Take a corner, if available • Late addition. May not be needed • Make random move
Implementation • HTML, CSS, JavaScript • Processing • Continually re-drawing window AND checking for mouse clicks • Both implementations use arrays to hold the information on winning combinations • No adding up values • Some use of place holder for first slot
[Some] variables int[] player = {}; int[] computer = {}; int[] board = {1,2,3,4,5,6,7,8,9};
String[] groups = { " ", //place holder, not used "3 4 8", "1 5 9", "2 6 7", "1 6 8", "3 5 7", "2 4 9", "2 5 8", "4 5 6" }; int[][] occupied = { //indexed subtracting 1 {2, 4}, {3, 6, 7}, {1, 5}, {1, 6, 8}, {2, 5, 7, 8}, {3, 4, 8}, {3, 5}, {1, 4, 7}, {2, 6} }; int[] pgroupcount = {0,0,0,0,0,0,0,0,0}; //unused first slot int[] cgroupcount = {0,0,0,0,0,0,0,0,0}; //unused first slot
Tracking progress • The pgroupcount array indicates what the player has with respect to each of the 8 possible winning combinations. • So given winning combinations String[] groups = { " ", //place holder, not used "3 4 8", "1 5 9", "2 6 7", "1 6 8", "3 5 7", "2 4 9", "2 5 8", "4 5 6" }; If computer is {1,2,5} then cgroupcount will be {0, 0, 2, 1, 1, 1, 1, 2, 1} Computer wins if the 9 or the 8 is available to be taken, that is, still on the board.
intsmartChoice() { //first check for immediate win intboardl = board.length; for (inti=0;i<boardl;i++) { int possible = board[i]; for (int j=0;j<occupied[possible-1].length;j++) { if (cgroupcount[occupied[possible-1][j]]==2) { return (i); } } } ….
General comments • Repeat: My code never adds up numbers. • Sometimes, let your program do the work, and sometimes… no. • Only 8 valid combinations. • Keeping track of progress towards satisfying each combination works. • The human, even expert, approach may not be the best approach for a program. • Reference: chess programs.
Challenges • Play game and design and implement a perfect strategy for "the computer" • Always wins or, at worse case, ties • Make it possible for computer to start. • Make computer skill adjustable (levels) • Perhaps random, takes any win, my strategy, yours? • Improve "look and feel" of game. • Adding pause before computer move • Add feature to keep record of moves. • Add keeping score feature. • ?
Classwork / Homework • Catch up on classy project. • Propose midterm project • Wait for my approval and/or feedback. • Study for midterm • Check out midterm guide • Prepare questions for second half of class