# 2009-GHP-RM-WEB-FT Cookie Jar: Events

## Will we be going over how to make click and ‘enter’ work as event listeners today on the same form input object or is that later?

## Answer

Form stuff is week 4!

Update: Also, check the pixelate solution with extra credit. The feature where indicate how many cells we want: It's not a form but it's an input field.

## Question from Zoom: Talk more to the optional boolean field in `addEventListener`

## Answer

Here's the documentation!
- [addEventListener](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener)
- There are a few options (I'll talk about 2):
- `capture`: A Boolean indicating that events of this type will be dispatched to the registered listener before being dispatched to any EventTarget beneath it in the DOM tree.
- `once`: A Boolean indicating that the listener should be invoked at most once after being added. If true, the listener would be automatically removed when invoked.

For `capture`, I believe this is indicating to fire the events during the capture phase

For `once`, it's essentially doing a `removeEventListener` right after it has been fired

## Question from Exit Ticket: Go over `.bind`

## Answer

- I added a [repl.it](https://repl.it/join/rlzwvdkh-b17z) on it!
- I also added comments to it from our [code demo](https://repl.it/join/jnicxiwm-b17z) during the Event lecture

## Question from Exit Ticket: How to know when to declare variables and functions globally

## Answer

A rule of thumb is to bias on not declaring variables globally. This can cause something called scope pollution where somewhere else in our code, we can affect a global variable unintentionally and that can cause weird behavior.

In terms of functions, the point of functions is modularize our code - split up functionality to smaller pieces. If you find that you're doing many different things in one function, maybe it's time to split it up. Take a look at the Pixelate code. We separated the different pieces such as fillGrid, colorize, addRow into different functions because they do fundamentally different things

## Question from Exit Ticket: How can we select multiple cells to color(like if you selecting text to copy), so that all selected cells will change color(so rectangle of selected cells will change)

## Answer

This sounds like a mousedown with mouseup functionality where during the mousedown, we are keeping track of the cells being selected. But we should differentiate from the mousedown that we are doing in Pixelate so maybe similar to the functionality on our computers where we can use shift + mouse down. So, on shift + mousedown, keep track of the cells being selected and then on release, color based on the selected color. Or we can try to reuse the button we have to colorize the grey cells (see extra credit).