Athabasca University | AU Student/Staff Login | Invited Guest Login
Group members: this is the place for your learning diary. Use this to post your zipped-up site at least once each unit, and your reflections as often as you wish (at least once per unit). Please write your reflections directly in the post, not as attached files. Where you do need to attach documents, such as for unit 1 designs, use PDF, PNG or JPG formats. You can attach files using the 'Embed content' link in the editor.
QUICK COURSE LINKS: Add blog post - Read latest group posts - FAQs: Course process : Site design : HTML : CSS : JavaScript : JQuery : AJAX : Misc : Podcasts for each unit
Updated resource pages: Unit 1 - Unit 2 - Unit 3 - Units 4 & 5 - Unit 6 - Unit 7
mportant notice: the student web server is unavailable. Until this is fixed, we do not require you to upload your site to the student server. See Running a web server on your local machine for details of how to meet the requirements for the final unit
unit5 JS Design
“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
COMP 266
