SLIDE 1
Homework 3 Review Goal: Recreate Twitter UI to Post a tweet HTML: - - PowerPoint PPT Presentation
Homework 3 Review Goal: Recreate Twitter UI to Post a tweet HTML: - - PowerPoint PPT Presentation
Homework 3 Review Goal: Recreate Twitter UI to Post a tweet HTML: Why do I have the tweet_length_feedback div? JS: What does this do? Line 97 attaches a keypress event listener to the textarea What does this do? Why is this a good next
SLIDE 2
SLIDE 3
HTML: Why do I have the tweet_length_feedback div?
SLIDE 4
JS: What does this do?
Line 97 attaches a “keypress” event listener to the textarea
SLIDE 5
What does this do? Why is this a good next step?
It allows us to check if line 98 does what we expect. Does it?
SLIDE 6
Not quite. What might be the problem?
What should we try to fix?
SLIDE 7
Keyup event seems better. Does it work?
Now what?
SLIDE 8
Display the characters left
Now what?
SLIDE 9
Turn negative characters red. Like this?
Now what?
SLIDE 10
Add a class
Now what?
SLIDE 11
Next - remove the class. When?
SLIDE 12
What next? DO THIS
SLIDE 13
How do we start?
Add a click event listener (handler) to the post_tweet button
SLIDE 14
What does create_post do?
SLIDE 15
What else does it need to do?
- a. When the user presses the “post tweet” button the
following things must happen:
- i. The post must appear with the poster’s username
(not an image). The username can be hard coded in JavaScript (but not in HTML). The post text cannot be hard coded (obviously).
- ii. New posts must appear at the top of the list of
posts, so that users see the latest tweets at the top
- f the list.
iii.The text in the box where users write tweets must disappear. iv.The number that counts the number of characters remaining must return to the maximum number.
- v. The cursor must return to the box where the user
writes tweets (so that they can immediately start writing another tweet!)
SLIDE 16
After the text clears, then what?
- a. When the user presses the “post tweet” button the
following things must happen:
- i. The post must appear with the poster’s username
(not an image). The username can be hard coded in JavaScript (but not in HTML). The post text cannot be hard coded (obviously).
- ii. New posts must appear at the top of the list of
posts, so that users see the latest tweets at the top
- f the list.
iii.The text in the box where users write tweets must disappear. iv.The number that counts the number of characters remaining must return to the maximum number.
- v. The cursor must return to the box where the user
writes tweets (so that they can immediately start writing another tweet!)
SLIDE 17
After the tweet length = 30m then what?
- a. When the user presses the “post tweet” button the
following things must happen:
- i. The post must appear with the poster’s username
(not an image). The username can be hard coded in JavaScript (but not in HTML). The post text cannot be hard coded (obviously).
- ii. New posts must appear at the top of the list of
posts, so that users see the latest tweets at the top
- f the list.
iii.The text in the box where users write tweets must disappear. iv.The number that counts the number of characters remaining must return to the maximum number.
- v. The cursor must return to the box where the user
writes tweets (so that they can immediately start writing another tweet!)
SLIDE 18