first run preset. PA -> SF. (#35)

paulirish · May 5, 2017 · bed685a · bed685a
1 parent 9822663
commit bed685a
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 4 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,7 +1,8 @@
 module.exports = {
   "extends": "google",
   "env": {
-    "browser": true
+    "browser": true,
+    "es6": true
   },
   "rules": {
     "camelcase": 0,
@@ -27,6 +28,7 @@ module.exports = {
       "varsIgnorePattern": "(^_$)"
     }],
     "quotes": [1, "single"],
+    "no-var": 0,
     "require-jsdoc": 0,
     "valid-jsdoc": 0
   }

diff --git a/index.html b/index.html
@@ -47,6 +47,9 @@ <h1 class="title header-group">
             <label class="input-label" for="toselect">To:</label>
             <div id="to" class="location"></div>
             <button id="reverse" type="submit"></button>
+            <p class="onetap">One-tap:
+              <a href="#" id="firstruntrigger">Palo Alto &rarr; San Francisco</a>.
+            </p>
         </div>
         <div class="when header-group">
             <button class="when-button selected" value="now">
@@ -73,9 +76,9 @@ <h1 class="title header-group">
             <p>Bombardier trains are denoted with a sparkle✨.</p>
         </div>
         <div class="copyright">
-            Schedule represents the <b>April 10, 2017</b> effective Caltrain schedule.
+            <b>April 10, 2017</b> effective Caltrain schedule.
         </div>
-        
+
         <div class="copyright">
             Built by @samccone & @paul_irish
             <br>

diff --git a/javascripts/default.js b/javascripts/default.js
@@ -328,7 +328,7 @@ NodeList.prototype.on = NodeList.prototype.addEventListener = (function(name, fn
       return prev + ('<div class="trip">' +
                     '<span class="departure"' +
                       (trip.bombardier ? 'data-bombardier="✨"' : '') +
-                      '>' + second2str(trip.departure_time) + 
+                      '>' + second2str(trip.departure_time) +
                     '</span>' +
                     '<span class="duration">' +
                       time_relative(trip.departure_time, trip.arrival_time) + ' min' +
@@ -381,6 +381,8 @@ NodeList.prototype.on = NodeList.prototype.addEventListener = (function(name, fn
       schedule();
     });
 
+    $('#firstruntrigger').on('click', firstRun)
+
     $('#reverse').on('click', function() {
       var from = $('#from select').value;
       var to = $('#to select').value;
@@ -392,6 +394,14 @@ NodeList.prototype.on = NodeList.prototype.addEventListener = (function(name, fn
     });
   }
 
+  function firstRun(locationSelects) {
+    const fromselect = $('#fromselect');
+    const toselect = $('#toselect');
+    fromselect.querySelector('[value="Palo Alto"]').selected = true;
+    toselect.querySelector('[value="San Francisco"]').selected = true;
+    toselect.dispatchEvent(new Event('change'));
+  }
+
   function constructSelect(name, opts) {
     return '<select id="' + name + 'select">' + opts.reduce(function(prev, curr) {
       return prev + '<option value="' + curr + '">' + curr + '</option>';

diff --git a/stylesheets/default.css b/stylesheets/default.css
@@ -253,6 +253,17 @@ p {
     margin: 7px 0 4px;
 }
 
+p.onetap {
+    margin: 18px 15px 0;
+    font-size: 17px;
+    text-align: center;
+    display: none;
+}
+
+.firstrun .onetap {
+    display: block;
+}
+
 .firstrun .when,
 .firstrun #instructions,
 .firstrun #reverse {