reveal.js

# Image Processing

---

CS 65 // 2021-03-25

## Administrivia
- Academic integrity policy

## Extra Credit Activities
- [Test Anxiety: Breath](https://calendar.drake.edu/event/test_anxiety_breath?utm_source=newsletter&utm_medium=email&utm_content=DETAILS&utm_campaign=Faculty-March-23#.YFoEI0hKhLw)
    + Thursday, 3/25 from 2pm to 3pm

## Extra Credit Activities
- [BLM Event](https://www.eventbrite.com/e/blmdrake-tickets-147650180665)
    + Two Drake alums are speaking on racial justice and equity with a Q&A to follow
    + Friday, 3/26 from noon to 1pm

# Exam 2: Debrief

## Assignment 6
- Can be completed individually or in a group of your choosing
- 
 Am still going to continue to randomly generate groups to work on the labs together in-class

## Tic-Tac-Toe
- Suppose we'd like to create a game of **Tic-Tac-Toe**

---

```py
def main():
    # Game code goes here...
```

- How can we decompose this huge task into helper functions?

## Tic-Tac-Toe
- When we are creating helper functions, they are usually **verbs** because functions **DO** things
- 
 What are the things we need to DO in Tic-Tac-Toe?
    + 
 **Draw** the board
    + 
 **Get** a mouse click from the user
    + 
 **Update** the board with the mouse click
    + 
 **Check** if a player wins the game
    + 
 **Show** a message at the end of the game

## Tic-Tac-Toe
- Our main program might look something like this:

```py
def main():
    createBoard()
    while gameOver() == False:
        drawBoard()
        mouse = getMouse()
        updateBoard(mouse)
    drawGameOverMessage()
```

# Questions
## ...about anything?

# Colors

# Colors
- The **graphics.py** is written using another well-known library called **tkinter**
- A variety of **built-in colors** exist in tkinter

## Colors
- We can also create colors using the **color_rgb** function
- Needs three numbers between 0-255 that specify how much of each color to "mix in" to your paint

---

- color_rgb(255, 0, 0) is **red**
- color_rgb(0, 255, 0) is **green**
- color_rgb(255, 0, 255) is **magenta**
- color_rgb(0, 0, 0) is **black**
- color_rgb(255, 255, 255) is **white**
- color_rgb(100, 100, 100) is **gray**

</div>
<div>

![RGB Diagram](https://processing.org/tutorials/color/imgs/rgb.jpg)

</div>
</div>

# Images

## Images in graphics.py
- The Zelle graphics library also supports creating, loading, and writing, images to the disk
- 
 To create an **empty image**, use the constructor
    + `img = Image(center, width, height)`
- 
 To load an image **from a file**, use the constructor
    + `img = Image(center, filename)`

## Images in graphics.py
- You can get individual pixels of images with:
    + 
 `img.getPixel(x, y)`<br>
      Returns color of pixel at `(x,y)` as a list `[r,g,b]`
    + 
 `img.setPixel(x, y, color)`<br>
      Changes pixel at `(x,y)` to the color given
- 
 Can get the **width** and the **height** in pixels
    + `img.getWidth()`
    + `img.getHeight()`
- 
 To save an image to the disk, can use method: `img.save(filename)`

## Looping Over Each Pixel
- When manipulating an image, it is useful to be able to iterate over each pixel of the image
- This is usually done with a **nested for loop**:
```py
img = Image(Point(0,0), 640, 480)
for y in range(img.getHeight()):
    for x in range(img.getWidth()):
        img.setPixel(x, y, "blue")
```

# Lab Time