“Control Panel”  Lightmode and Change Speed

I will need to create the button objects. Four separate rectangular buttons to adjust speed from 0-4. These are the constants states: off, slow, medium, and fast.  Each with their onclick event and a function with a conditional updating the current speed variable. A second function will be needed to access each

tag or child of the container and change the style object based on the value of the current speed variable. 

The circle will call the change of the light mode. Majority of that is CSS.

• Proposal - Animation speeds

Variable – state - 0 1 2 3

Const – speeds - Slow Medium Fast Off

Function - updateSpeed

Pseudocode UpdateSpeed

Start with the speed set to medium

• on click

            if the speed is off change style sheet

            else if the speed is slow

                        then make the transitions x seconds apart

            elseif the speed is set to medium

                        then make the transitions y seconds apart

            else the speed is fast, and transitions are  z seconds apart

• Proposal: String replacement

Variable-  minuteSelected, currentActivity, maxTime, temp

const - activities

2functions: conditionals 

1 loop while minute < maxTime

If breathing clicked, then do nothing

Else if activity x clicked then search all the text and replace every occurrence with

Else if activity y clicked then find and replace

Else activity z clicked then find and replace

• Proposal: Form validation

On submit

If input less than minLength then alert

Else if input than maxLength then alert

onsubmit

If pattern does not match then alert