combination lock

CS 322 –HOMEWORK 2

due: Thu, 2/4/16

PROJECT:

Create a web page that displays a combination lock with 40 tick marks and number labels for every fifth number 0, 5, 10, ..., 35. Provide “Nudge left” and “Nudge right” buttons that cause the combination lock’s dial to turn one position left (counter-clockwise) or one position right (clockwise), respectively. For details, study the sample session.

As always, you are required to use named constants and helper functions when appropriate.

Sample session:

After loading the web page:

After clicking Nudge left once:

After clicking Nudge right 3 times:

EXTRA CREDIT (3 pts)

Implement a target number box that allows the user to enter a number between 0 and 39. Implement two buttons that, when clicked, cause the dial to turn left or right to the user-entered target value. When the dial turns, the turning motion must be smooth; it must not jump more than one tick at a time.

For the animation, you’ll need to use the setTimeout method. See our book or the Internet for setTimeout details.

Sample session:

After refreshing the web page, click Nudge right 10 times, so the 30 is at the top:

After entering 35 in the target box, and clicking Left to target, the dial turns 5 positions counter-clockwise:

After entering 5 in the target box, and clicking Right to target, the dial turns 30 positions clockwise:

Extra credit