Difference between revisions of "IB Computer Science 1"

From WLCS
Line 1: Line 1:
 +
== Wednesday (11/7/18) ==
 +
'''Agenda:'''
 +
* Demo Part 2 activity in [https://docs.google.com/document/d/1wfVoej_7PVHquaAcugEr5YWZIzbKPNl8YYKlp7Gfouo/edit?usp=sharing Mouse Variables & Functions]
 +
* Demo Fancy Buttons Assignment
 +
* Complete [https://docs.google.com/document/d/1xRSA_Ti8l5002jcAftcUtCTdujCojghzoTpUZwJvHQ4/edit?usp=sharing Bouncing Ball]
 +
* ...
 +
 
== Friday (11/2/18) ==
 
== Friday (11/2/18) ==
 
'''Agenda:'''
 
'''Agenda:'''

Revision as of 16:31, 6 November 2018

Wednesday (11/7/18)

Agenda:

Friday (11/2/18)

Agenda:

  • Misc Quiz on Canvas
  • More advanced mouse fun
  • Fancy Buttons Assignment
    1. Create 4 buttons on the screen of some color of your choice (use the same color for all 4 buttons)
    2. Hovering over a button changes its color shade darker and increases the stroke weight around that particular button
    3. Pressing the button makes the color shade even darker (darker than hover)
    4. Releasing the button should return it to its original color. Depending on how you create your program, you may not need to define mouseReleased()
  • Complete Bouncing Ball
  • We will combine our new mouse knowledge with the bouncing ball lab to create a simple pool program that uses the mouse to control hitting a ball to hit another ball
    1. Create a ball on the screen
    2. When the mouse is clicked, you should draw a green line from the middle of the ball to the mouse pointer
    3. Releasing the mouse changes the ball's velocity (dx, dy) using the difference between (x, y) and (mouseX, mouseY)

Wednesday (10/31/18)

Agenda:

  • Quiz on Friday (11/2/18)
    • Variables
    • Conditions
    • if statements
    • functions
  • Demo any missing assignments
  • More advanced mouse fun
  • Fancy Buttons
    1. Create 4 buttons on the screen of some color of your choice (use the same color for all 4 buttons)
    2. Hovering over a button changes its color shade darker and increases the stroke weight around that particular button
    3. Pressing the button makes the color shade even darker (darker than hover)
    4. Releasing the button should return it to its original color. Depending on how you create your program, you may not need to define mouseReleased()


Monday (10/29/18)

Agenda:

Thursday (10/25/18)

Warmup:

  • Complete repl.it warmup: "Warmup 10/25/18"
  • Complete repl.it assignment: "Function definitions & return"

Agenda:

  • Group 4 project permission slips
  • Demo your completed Tic-Tac-Toe: Part 3
  • Functions review
  • Complete Tic-Tac-Toe: Function Assignment today
    1. Go back to your Tic-Tac-Toe code and look for redundant blocks of code. You should notice that the code that switches turns occurs in several places
    2. Define a new function called switchTurn(), and move your code that switches turns into that function definition
    3. Replace all the redundant blocks of code with function calls to switchTurn()
    4. Re-test your Tic-Tac-Toe program to make sure that it still works
    5. Demo your slimmer Tic-Tac-Toe game that uses functions
  • Work on Functions: Emoji Assignment - due next class
  • Work on Functions: Hover Buttons

Tuesday (10/23/18)

Agenda:

  • Group 4 Project Field Trip - Nov 28 / 29
    • Turn in field trip slips (don't worry about teacher signatures)
  • Demo your completed Tic-Tac-Toe: Part 3
  • Introduction to Functions
  • Complete repl.it assignment titled: "Function definitions & return" - due Thursday (10/25/18)

Homework:

  • Group 4 project permission slips
  • Repl.it - Function definitions & return

Friday (10/19/18)

Agenda:

  • Demo Completed Tic-Tac-Toe: Part 2
  • Tic-Tac-Toe - Part 3
    1. Add conditionals to check if any 3 locations in a row/column/diagonal match (make sure that at least one of the locations is not equal to the empty string)
    2. Display a text() message that indicates the winner
    3. Add a conditional to check if the game is a draw (tie), and display a message
    4. To stop the stop/pause the program if there is a winner or tie, you need to create a new variable (e.g. gameOver = False)
      • If the game should be over, you re-assign gameOver to True
      • Within the draw() code block, add a conditional to check if gameOver is True, and if it is, then use the noLoop() command to stop the draw() animation
  • Exhaustively test your program!
    • Try to break your program intentionally by clicking in boxes that already have moves or by making moves after the game is over

Wednesday (10/17/18)

Agenda:

  • text() and textSize() notes
  • X-O clicker assignment
    • Modify the code of the mouseReleased() so that a text-based X or O is drawn every time the mouse button is released
  • Tic-Tac-Toe: Part 2
    1. At the very top of your code, declare/create a global string variable named turn and initialize it to either "X" or "O"
    2. At the very top of your code, declare/create global variables for each square in the game (e.g. b_0_0, b_0_1) -- you will use these variables to track where moves are made
    3. Copy your setup() and draw() from your Tic-Tac-Toe: Select-a-Square
    4. At the end of draw(), add text() commands that draw all the board (b) variables in their respective locations
      • Example: text(b_0_0, 100, 100)
      • Test your code out at this point by giving some of the board (b) variables starting values of "X" or "O" -- be sure to revert them back to empty strings when done with testing
    5. Define mouseReleased() like the X-O clicker assignment. Add/modify the code, so that you detect where the click/release is occurring, and change the appropriate board (b) variable to store the move (turn). Hint: You can use the same if statements or conditionals from the select-a-square lab!
      • You should be sure to save the appropriate move in the board (b) variables
      • Every time you release the mouse and successfully make a move, draw "X" or "O", then turn should switch
      • You must not allow a move to occur in a space that already has a move (check the appropriate board (b) variable to make sure the corresponding slot is still empty string)

Thursday - Monday (10/11/18 - 10/15/18)

Agenda:

  • Read global variables and test out its example code snippet in Processing
    • You will interact with the code snippet by hitting keys
    • Focus on understanding the use of the global keyword
  • Read mouseReleased() and test out its example code snippet in Processing
    • You will interact with the code snippet by pressing and releasing the mouse/trackpad button
    • The mouseReleased() function automatically runs every time the mouse's button is released
  • What components of Tic-Tac-Toe are left?
    • Copy your Tic-Tac-Toe code to a new Processing sketch program and save it as TTT_Part2
    • Declare/create a global string variable named turn and initialize it to either "X" or "O"
    • Declare/create global variables for each square in the game (e.g. b_0_0, b_0_1) -- you will use these variables to track where moves are made
    • Define the mouseReleased() function like the example linked above. Add/modify the mouseReleased() code block, so that you draw a either ax "X" or an "O" in the corresponding slot. Hint: You can use the same if statements or conditional from the previous lab!
    • Every time you release the mouse and draw "X" or "O", the turn should switch
    • You must not allow a move to occur in a space that already has a move

Wednesday (10/10/18)

  • PSATs

Friday (10/6/18)

Agenda:

  • Introduction to Animation
    • setup() function
    • draw() function
    • mouseX and mouseY variables
    • width and height variables
  • Tic-Tac-Toe Select-a-Square
    1. Setup your screen size to be a large square (e.g. 600x600)
    2. Within the draw() function, give the background a color()
    3. Draw tic-tac-toe lines on your screen (make sure that the rows and columns are exactly 1/3 the size of the height and width)
    4. Add conditional statements in the draw() function to detect which square you are in
      • You'll need to access the mouse's current coordinates with mouseX and mouseY variables
      • Draw a square of a different color inside the particular square that you are in
      • The effect that you will generate will look like it is highlighting the current square where the mouse is
    5. Challenge: Modify your code so that changing the screen size, will automatically be adjusted and accounted for by the rest of your code. Hint: use height and width variables
    6. Challenge 2: Modify your code so that it works without any conditionals. Hint: use division and multiplication
  • Coming soon...
    • Functions
    • Global variables
    • Mouse clicks

Wednesday (10/3/18)

Agenda:

  • Complete and demo Introduction: My First Sketch
  • Processing review
    • size()
    • rect()
    • ellipse()
    • line()
    • background()
    • fill()
    • stroke()
  • Draw and demo your favorite emoji / logo / cartoon character using Processing before the end of class

Monday (10/1/18)

Warmup:

  • Take the Conditionals Quiz in Canvas

Agenda:

Archives