Add walkthrough=true url parameter to auto-start the walkthrough

(closes #4111)

API.md

@@ -28,6 +28,8 @@ in the hash portion of the URL:
 * `comment` - Prefills the changeset comment box, for use when integrating iD with
   external task management or quality assurance tools.  Example:
   `comment=CAR%20crisis%2C%20refugee%20areas%20in%20Cameroon%20%23hotosm-task-592`.
+* `rtl=true` - Force iD into right-to-left mode (useful for testing).
+* `walkthrough=true` - Start the walkthrough automatically
 
 ##### iD on openstreetmap.org (Rails Port)
 
@@ -42,6 +44,7 @@ are available as regular URL query parameters:
 * `gpx` - same as standalone
 * `offset` - same as standalone
 * `comment` - same as standalone
+* `walkthrough` - same as standalone
 
 
 ## CSS selectors

modules/behavior/hash.js

@@ -37,7 +37,7 @@ export function behaviorHash(context) {
         var center = map.center(),
             zoom = map.zoom(),
             precision = Math.max(0, Math.ceil(Math.log(zoom) / Math.LN2)),
-            q = _.omit(utilStringQs(window.location.hash.substring(1)), 'comment'),
+            q = _.omit(utilStringQs(window.location.hash.substring(1)), ['comment', 'walkthrough']),
             newParams = {};
 
         delete q.id;
@@ -87,16 +87,27 @@ export function behaviorHash(context) {
             .on('hashchange.hash', hashchange);
 
         if (window.location.hash) {
+
             var q = utilStringQs(window.location.hash.substring(1));
+
             if (q.id) {
                 context.zoomToEntity(q.id.split(',')[0], !q.map);
             }
+
             if (q.comment) {
                 context.storage('comment', q.comment);
                 context.storage('commentDate', Date.now());
             }
+
+            if (q.walkthrough) {
+                hash.startWalkthrough = true;
+            }
+
             hashchange();
-            if (q.map) hash.hadHash = true;
+
+            if (q.map) {
+                hash.hadHash = true;
+            }
         }
     }
 

modules/ui/init.js

@@ -17,6 +17,7 @@ import { uiFullScreen } from './full_screen';
 import { uiGeolocate } from './geolocate';
 import { uiHelp } from './help';
 import { uiInfo } from './info';
+import { uiIntro } from './intro';
 import { uiLoading } from './loading';
 import { uiMapData } from './map_data';
 import { uiMapInMap } from './map_in_map';
@@ -282,9 +283,13 @@ export function uiInit(context) {
         context.enter(modeBrowse(context));
 
         if (!uiInitCounter++) {
+            if (!hash.startWalkthrough) {
+                context.container()
+                    .call(uiSplash(context))
+                    .call(uiRestore(context));
+            }
+
             context.container()
-                .call(uiSplash(context))
-                .call(uiRestore(context))
                 .call(uiShortcuts(context));
         }
 
@@ -302,6 +307,11 @@ export function uiInit(context) {
             });
 
         uiInitCounter++;
+
+        if (hash.startWalkthrough) {
+            hash.startWalkthrough = false;
+            context.container().call(uiIntro(context));
+        }
     }