From dff21822c37436ac7e7caeb785b7ca1788b75011 Mon Sep 17 00:00:00 2001 From: Ian Date: Wed, 31 Aug 2016 11:09:30 -0700 Subject: [PATCH 1/2] adding minor semicolons --- app/app.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/app/app.js b/app/app.js index fd7fb9a..1f18246 100644 --- a/app/app.js +++ b/app/app.js @@ -28,8 +28,9 @@ App.fn.load = function(){ }; App.fn.save = function(){ - if (this.dob) + if (this.dob) { localStorage.dob = this.dob.getTime(); + } }; App.fn.submit = function(e){ @@ -52,7 +53,7 @@ App.fn.renderAgeLoop = function(){ }; App.fn.renderAge = function(){ - var now = new Date + var now = new Date; var duration = now - this.dob; var years = duration / 31556900000; @@ -79,6 +80,6 @@ App.fn.view = function(name){ return Handlebars.compile($el.innerHTML); }; -window.app = new App($('app')) +window.app = new App($('app')); })(); From 01367c4f87131c2be354394f03f9f4f294d559e2 Mon Sep 17 00:00:00 2001 From: Ian Date: Wed, 31 Aug 2016 15:48:29 -0700 Subject: [PATCH 2/2] cleaned up syntax based on console audiot --- app/app.js | 51 +++++++---------------------- css/style.css | 87 -------------------------------------------------- dashboard.html | 22 ++----------- 3 files changed, 15 insertions(+), 145 deletions(-) diff --git a/app/app.js b/app/app.js index 1f18246..88b3426 100644 --- a/app/app.js +++ b/app/app.js @@ -6,18 +6,10 @@ var $$ = document.querySelectorAll.bind(document); var App = function($el){ this.$el = $el; this.load(); - - this.$el.addEventListener( - 'submit', this.submit.bind(this) - ); - - if (this.dob) { - this.renderAgeLoop(); - } else { - this.renderChoose(); - } + this.renderAgeLoop(); }; + App.fn = App.prototype; App.fn.load = function(){ @@ -27,27 +19,6 @@ App.fn.load = function(){ this.dob = new Date(parseInt(value)); }; -App.fn.save = function(){ - if (this.dob) { - localStorage.dob = this.dob.getTime(); - } -}; - -App.fn.submit = function(e){ - e.preventDefault(); - - var input = this.$$('input')[0]; - if ( !input.valueAsDate ) return; - - this.dob = input.valueAsDate; - this.save(); - this.renderAgeLoop(); -}; - -App.fn.renderChoose = function(){ - this.html(this.view('dob')()); -}; - App.fn.renderAgeLoop = function(){ this.interval = setInterval(this.renderAge.bind(this), 100); }; @@ -55,11 +26,12 @@ App.fn.renderAgeLoop = function(){ App.fn.renderAge = function(){ var now = new Date; var duration = now - this.dob; - var years = duration / 31556900000; + var seconds = duration / 1000; - var majorMinor = years.toFixed(9).toString().split('.'); + var majorMinor = seconds.toFixed(4).toString().split('.'); requestAnimationFrame(function(){ + // console.log(this.view('age'), "<= thisviewage"); this.html(this.view('age')({ year: majorMinor[0], milliseconds: majorMinor[1] @@ -67,19 +39,20 @@ App.fn.renderAge = function(){ }.bind(this)); }; -App.fn.$$ = function(sel){ - return this.$el.querySelectorAll(sel); -}; - App.fn.html = function(html){ + // console.log(html); this.$el.innerHTML = html; }; App.fn.view = function(name){ + var $el = $(name + '-template'); + // console.log($el.innerHTML, "<= $el.innerHTML"); return Handlebars.compile($el.innerHTML); }; -window.app = new App($('app')); - +app = new App($('secCount')); +console.log(app, "<=app at bottom"); +// console.log(app); +app.dob = new Date; })(); diff --git a/css/style.css b/css/style.css index 550c999..e69de29 100644 --- a/css/style.css +++ b/css/style.css @@ -1,87 +0,0 @@ -*, -*:before, -*:after { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -ms-box-sizing: border-box; - -o-box-sizing: border-box; - box-sizing: border-box; -} - -body, -html { - margin: 0; - padding: 0; - height: 100%; -} - -body { - -moz-osx-font-smoothing: grayscale; - -webkit-align-items: center; - -webkit-flex-direction: column; - -webkit-font-smoothing: antialiased; - -webkit-justify-content: center; -} - -body, input { - display: -webkit-flex; - font-family: 'Avenir', 'helvetica neue', helvetica, arial, sans-serif; -} - -.age-label { - color: #B0B5B9; - font-size: 1.2rem; - line-height: 1; - margin: 0 0 0 2px; -} - -.count { - color: #494949; - margin: 0; - font-size: 6rem; - line-height: 1; - font-weight: 600; -} - -.count sup { - font-size: 2.4rem; - margin-left: 7px; -} - -label { - display: block; -} - -input, button { - padding: 0.375rem 0.75rem; - font-size: 1.5rem; - appearance: none; - -webkit-appearance: none; -} - -input { - margin-right: 0.5rem; - box-sizing: border-box; - border-width: 1px; - border-style: solid; - border-radius: 0.25rem; - border-color: #CCC; - background-color: #FFF; -} - -button { - outline: none; - display: block; - cursor: pointer; - color: #FFF; - border: none; - border-radius: 0.25rem; - background-color: #0BE; -} - -footer { - padding-top: 0.5rem; - display: -webkit-flex; - -webkit-flex-direction: row; - -webkit-justify-content: center; -} diff --git a/dashboard.html b/dashboard.html index c35b6f7..ae12574 100644 --- a/dashboard.html +++ b/dashboard.html @@ -1,30 +1,14 @@ + - - - New Tab - - - - - -
- +