mxmoss / fllcalculator Goto Github PK

In the "About" page explain the following:

• Purpose of FLL Calculator
• Link to FLL 2017 challenge
• Paypal donate link
• Contact
• Link to Github Repo

Add Google Analytics to the app to allow for tracking whether anyone is using it

Display a banner ad in the footer. The benefits of this are two-fold:

1. Learn how to have a footer anchored to the bottom of the page
2. Possibly get some clicks & earn some revenue

Let the user load previous FLL challenges

The radio buttons don't always update the score. Reselecting a previously selected radio button doesn't update the state.

Steps to recreate:

1. Run the app
2. Click on Yellow for cargo plane
3. Current score: 20 points
4. Click on Blue for cargo plane
5. Current score: 30 points
6. Click on Yellow for cargo plane
7. Current score still shows 30 points. A correct score should show 20 points

The radio buttons are OK, but hard to use on a small-profile device such as a smart phone.

A better solution is to format them as a toggle button groups

Ref: https://react-bootstrap.github.io/components.html

Format the challenges so they can display two or three across when there's room.
Suggest using bootstrap formatting in the style of this example
https://getbootstrap.com/docs/3.3/examples/offcanvas/#

Currently the app's title, "2013 FLL Challenge Nature's Fury" is hard-coded.
In view of trying to make this calculator re-usable over multiple FLL years, it would be good to read the title from the JSON data.

For example, read the title "2013 FLL Challenge Nature's Fury" from the file FLL2013Challenge.json
But for 2017 the title is "2017 FLL Challenge Hydro Dynamis" from the file FLL2017Challenge.json

The menu items (Home / About / Reset) don't appear in the mobile version of the app.

Steps to recreate:

• Open a browser to https://mxmoss.github.io/fll2013challenge/
• Shrink the size of the browser until the meatstack appears in the upper right corner
• Click on the meatstack (3 lines) and nothing happens.

It is supposed to show the menu... Home / About / Reset

The full text of the challenge description isn't always necessary. People new to the challenge might want to know more, but after one or two times using the app it's OK to hide the text.

Suggested solution:
Only show a Challenge's detailed description when the user wants to see it

Add click to "show more" "show less"
more -> display the full text of the description
less -> hide the text

The first iteration of this calculator was created to re-implement the 2013 FLL Calculator for the Nature's Fury challenge. After moving most of the year-specific information into JSON files, it's apparent that there are other parts of the project that should be made more generic.
Suggested solution: Replace any reference to "FLL2013Challenge" with "FLLChallengeCalc"

• Rename this Repo to FLLChallengeCalc
• Rename the github pages URL to FLLChallengeCalc
• Other items?

The navigation menu at the top is not as simple or nicely formatted as it seems that it should be.
Can we improve on how it works?

Issues:

• Layout & design of menu is bumpy
• I originally used this method because I wanted it to be responsive. The responsive result, however, wasn't as simple or nice to use as expected.
• Sometimes the text scrolls under the nav menu

Caktus has a tutorial on a different way to add a navigation menu. Maybe this would be better?

The "Current Score" panel floats on the upper right side.
When you scroll, it stays put, but it's hard to read since there is other text showing underneath it.

It would be nice to format the panel like this:

1. floating is OK
2. No other text obscures the score
3. Give the score panel some color so it stands out

Currently the challenge graphic files are larger than they need to be.
They range from 50 to 70 KB in size, and are about 250 px across. The calculator only shows them as 80 x 80 pixel icons.

An 80x80 pixel PNG file is only 13KB and would load about 5 times faster.

Currently the only way to reset the score is to refresh the page.
When kids are calculating the scores, they may have many robot runs and will want to reset the score after each one.
Adding a [Reset] button or some way to reset the score to zero would be handy.