Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision		 Previous revision
Next revisionBoth sides next revision
p5js-week-07 [2022/06/11 07:25] – renickp5js-week-07 [2022/06/11 08:04] – renick
Line 49: Line 49:
  
 =====big ideas===== =====big ideas=====
 +
 +{{:french-toast-syrup.jpg?600|}}
 +
 +(photo from https://www.flickr.com/photos/djwtwo/14033143291)
  
 Let's review the really big ideas first! Let's review the really big ideas first!
Line 98: Line 102:
 ===== JavaScript review ===== ===== JavaScript review =====
  
-Let's take a quick look at the various JavaScript that we have learned.+{{:toast-closeup.jpg?600|}} 
 + 
 +(photo from https://upload.wikimedia.org/wikipedia/commons/a/af/DryToast.jpg) 
 + 
 +Now we want do the more close-up review of the various JavaScript that we have learned.
  
 ==== assigning variables ==== ==== assigning variables ====
 +
 +{{:two-pieces-of-toast.png?600|}}
 +
 +(photo from https://www.flickr.com/photos/91261194@N06/51708375114)
  
 Remember, variables are names that we can give to pieces of data, like this: Remember, variables are names that we can give to pieces of data, like this:
Line 159: Line 171:
 howMuchToast3(numberOfPiecesOfToast) howMuchToast3(numberOfPiecesOfToast)
 </code> </code>
 +
 +All of these functions can tell us how much toast we're having for breakfast.
 +
 +{{:beautiful-breakfast_toast.jpg?600|}}
 +
 +(photo from https://pxhere.com/en/photo/872146)
  
 ====various operators==== ====various operators====
Line 306: Line 324:
 </code> </code>
  
-**And that is a quick review of all of the JavaScript that we've learned!**+**And that is a quick review of all of the JavaScript that we've learned!** Now that we have a class for ToastOrders, we're ready to open a restaurant! 
 + 
 +{{:menu-toast.png?600|}} 
 + 
 +(photo from https://nypl.getarchive.net/media/daily-breakfast-held-by-mansion-at-buffalo-ny-coffee-shop-0a9467)
  
 ===== p5js review ===== ===== p5js review =====
 +
 +Now that we've reviewed how to code __the data of toast__, let's review how to program __a drawing of that toast__.
  
 Here's an example in p5js that uses **everything above plus a lot of the things that we've studied before about p5js and some tools we've made**. See if you can find each of these things in the code below. Here's an example in p5js that uses **everything above plus a lot of the things that we've studied before about p5js and some tools we've made**. See if you can find each of these things in the code below.
Line 460: Line 484:
 ===== a full example ===== ===== a full example =====
  
-Then we can use our shapeFromPoints function to draw it.+Then we can use our shapeFromPoints function to draw it. You'll notice that we still sometimes get a self-intersecting polygon, but it's much less common. We could keep working on this algorithm to get one that is perfect, but let's stop here for this lesson.
  
 <HTML> <HTML>
Line 467: Line 491:
  
 ===== making your own class for your drawings ===== ===== making your own class for your drawings =====
 +
 +{{:avacado-toast.png?600|}}
 +
 +(photo from https://www.flickr.com/photos/160866001@N07/44019575945)
 +
 +Now you're ready to get back to your customized personal toast, uh, drawings...
  
 We've been working on these drawings: We've been working on these drawings:
  • p5js-week-07.txt
  • Last modified: 12 months ago
  • by reina.chen