Day 150: FCC, Basic Front End Web Dev Projects, Pomodoro Clock

All right, today I'm working on the 4th of the 5 projects in the "Basic Front End Web Development" section, which is to make a Pomodoro Clock web app.  O.k., so I downloaded some JQuery code called Time Circles, and after doing some research, I managed to get it to work on my browser (not online, the files are on my computer).  Here's a screenshot:

The code that makes that appear on the page is this:

$(document).ready(function(){
         $(".demo").TimeCircles(); /*insert the code within, "demo" is the div class name*/

    }); /*Place all of this at the top of the javascript(TimeCircles.js) file.*/

It should be inserted at the top of the TimeCircles.js file, which contains the file that makes all of that actually work.  Now I need to figure out how to make the time circles do what I need them to do, which is to count down 25 minute intervals with the click of a start button, and have a timer go off upon the expiration of the 25 minutes.  That's the main user story anyhow, there are also some bonus user stories.

So I'm exploring this TimeCircles code, and I made this for my girl:

Neat, huh?  The only thing is, I can center everything else, but Im having trouble centering the circles and numbers, because that part came with some pre-made CSS, and it's fixed to the left side of the page.  I'll have to go in there and figure it all out though, because I have to position my pomodoro clock for the zipline.

I've been making some headway here today!

SUMMARY OF CODING SKILLS

Total Treehouse Points: 5,385
Treehouse Points by Subject Matter (Miscellaneous not included): 
HTML:                                663 
CSS:                                1,599 
Design:                            1,193 
Development Tools:            747 
JavaScript:                      1,120

Treehouse Ranking (%): "You have more total points than 94% of all students."

Treehouse Badge(s) Earned Today:

Treehouse Courses Completed:
How to Make a Website
HTML
CSS Foundations
CSS Layout Techniques

Aesthetic Foundations
Design Foundations
Adobe Photoshop Foundations
Adobe Illustrator Foundations (66% complete, switched focus from web design to web dev)
Git Basics
Introduction to Programming
JavaScript Basics

Codecademy (& other) Courses Completed:
HTML and CSS (Codecademy) 

Books Read or in Progress:
Completed: "Head First HTML and CSS," by E. Robson & E. Freeman (768 pgs.)
In Progress: "Head First JavaScript," by Eric Freeman and Elisabeth Robson (on pg. 56)
Completed: "A Smarter Way to Learn JavaScript," by Mark Myers (293 pgs., 89 chapters with 20 questions/problems per chapter, for a total of 1,780 coding questions/problems answered)

My Progress on The Odin Project:

1.  Introduction to Web Development                                            100% Complete

2.  Web Development 101                                                               33% Complete 
Note: Switched to FCC for the great online community and better updates/support.

My Progress on Free Code Camp (FCC): 
1. Get Started with Free Code Camp                                                      Complete
2. HTML5 and CSS                                                                                  Complete
3. Responsive Design with Bootstrap                                                       Complete
4. Gear up for Success                                                                            Complete
5. jQuery                                                                                               Complete
6. Basic JavaScript                                                                                 Complete
7. Object Oriented and Functional Programming                                     Complete
8. Basic Algorithm Scripting                                                                    Complete
9. Basic Front End Development Projects                                                 On 4 of 5
10. Intermediate Algorithm Scripting
11. Intermediate Front End Development Projects
12. Claim Your Front End Development Certificate
13. Upper Intermediate Algorithm Scripting
14. Automated Testing and Debugging
15. Advanced Algorithm Scripting
16. AngularJS
17. Git
18. Node.js and Express.js
19. MongoDB
20. Full Stack JavaScript Projects
21. Claim Your Full Stack Development Certificate

After the FCC work above (estimated to take 800 hours), there are 800 more hours of coding projects on behalf of non-profits, which, in addition to contributing to the common good, provide us an opportunity to expand our networks and build a robust portfolio.

Hours Spent Coding Today: 6

Total Hours Coding: 691