Project 1 Notes
Technical Notes
Requirements
- Dynamically creating form elements depending upon the answer of the last question
- See jabbaskript.js function create_dropdown()
- At least 2 choices for each selection
- Create an array of as many choices as you want and pass to create_dropdown()
- At least a depth of 3 different questions
-
View logic flowchart for the Javascript.
Deepest progression currently is four:
- What color is the border? (white)
- Is there an edition symbol? (no)
- Is there a copyright date? (no)
- Is there a slightly 3D border?
- Once the user has made their selections, (at least) create a new node to print out their final choices to the screen
-
When a card determination is reached, a "Get Your Card!" button
appears that leads you to card.html and spits out the information
via cookie storage.
- Give the user the option to start over at any time!
- There is a reset all button at the top of the screen.
- A form on some page getting the user's information (validation!)
-
index.html asks for you to input the card name. If the rest of
the options are entered successfully and the "Get Your Card!" button
appears, when clicked, jabbaskript.js's
function validate_card_name() will trigger. A regex is used to
make sure that the only characters entered are spaces, apostraphes ('),
a-z, A-Z, and 0-9.
- The use of cookies
-
When a card determination is reached, the information is stored
via cookie and a "Get Your Card!" button appears that leads you to
card.html and spits out the information via cookie storage.
-
Re-direct all browsers that this doesn't work on to another page,
asking them to download a browser that would work
-
All pages have <noscript> information leading them
to download a browser that can display JavaScript.
- Looks
-
Theme is based on a
Flash template. Graphics were created using Fireworks; other graphics
are available from
http://www.magicthegathering.com.
- Dynamic creation of at least 3 sets of nodes
- 9 questions total can be dynamically generated.
- Constructor method that creates the next select menu from the last choice
- See jabbaskript.js function form_parse().
- Use of the following commands: createElement, setAttribute, appendChild, getElementById, getElementByTagName, createTextNode, nodeValue, etc
- See jabbaskript.js function create_dropdown().
- Some use of DHTML
- CSS, onChange() is used for every dropdown, breadcrumbs trail at the top of every page, etc.
- No use of innerHTML!
- None.
- Include comments in the code to clearly explain functionality
- See jabbaskript.js and cookies.js - each function has a Javadoc-style comment header.
- Re-direction of NN4 and Mac IE browsers
- All pages have <noscript> information leading them to download a browser that can display JavaScript.
Extras
-
Reusable code: every function in jabbaskript.js
and cookies.js is called more than once.
-
Scalability: add a new case within the switch statement in the
jabbaskript.js function form_parse() and a new
dropdown box will be created.
