File tree Expand file tree Collapse file tree
Expand file tree Collapse file tree Original file line number Diff line number Diff line change 33 < head >
44 < meta charset ="UTF-8 " />
55 < meta name ="viewport " content ="width=device-width, initial-scale=1.0 " />
6- < title > Title here </ title >
6+ < title > Quote Generator App </ title >
77 < script defer src ="quotes.js "> </ script >
88 </ head >
99 < body >
10- < h1 > hello there </ h1 >
10+ < h1 > Random Quote: </ h1 >
1111 < p id ="quote "> </ p >
1212 < p id ="author "> </ p >
1313 < button type ="button " id ="new-quote "> New quote</ button >
Original file line number Diff line number Diff line change @@ -491,3 +491,34 @@ const quotes = [
491491] ;
492492
493493// call pickFromArray with the quotes array to check you get a random quote
494+
495+ function setup ( ) {
496+ updateQuote ( ) ;
497+ appendQuote ( ) ;
498+ }
499+
500+ const state = {
501+ quote : "" ,
502+ author : "" ,
503+ } ;
504+
505+ function updateQuote ( ) {
506+ const chosenQuote = pickFromArray ( quotes ) ;
507+ state . quote = chosenQuote . quote ;
508+ state . author = chosenQuote . author ;
509+ }
510+
511+ function appendQuote ( ) {
512+ const quoteElem = document . getElementById ( "quote" ) ;
513+ const authorElem = document . getElementById ( "author" ) ;
514+ quoteElem . textContent = "" ;
515+ authorElem . textContent = "" ;
516+ quoteElem . append ( state . quote ) ;
517+ authorElem . append ( state . author ) ;
518+ }
519+
520+ document . getElementById ( "new-quote" ) . addEventListener ( "click" , function ( ) {
521+ setup ( ) ;
522+ } ) ;
523+
524+ window . onload = setup ;
You can’t perform that action at this time.
0 commit comments