Bug 26961: New user onboarding.

Reuse the Firefox onboarding mechanism with minimal changes.
Localizable strings are pulled in from Torbutton (if Torbutton is
  not installed, we lack about:tor and no tour will be shown).
Replace SVG images with PNGs (see bug 27002),
For defense in depth, omit include OnboardingTelemetry.jsm entirely.
Added support for the following UITour page event:
  torBrowserOpenSecuritySettings

Also fix bug 27403: the onboarding bubble is not always displayed.

Arthur suggested to make the onboarding bubble visible on displays with
less than 960px width available, so we choose 200px instead.

Also fix bug 28628: Change onboarding Security panel to open new
Security Level panel.

Also fix bug 27484: Improve navigation within onboarding.

Bug 27082: enable a limited UITour

Disallow access to UITour functionality from all pages other than
  about:home, about:newtab, and about:tor.
Implement a whitelist mechanism for page actions.

Bug 26962 - implement new features onboarding (part 1).

Add an "Explore" button to the "Circuit Display" panel within new user
onboarding which opens the DuckDuckGo .onion and then guides users through
a short circuit display tutorial.

Allow a few additional UITour actions while limiting as much as possible
how it can be used.

Tweak the UITour styles to match the Tor Browser branding.

All user interface strings are retrieved from Torbutton's
browserOnboarding.properties file.

Bug 27486 Avoid about:blank tabs when opening onboarding pages.

Instead of using a simple <a href>, programmatically open onboarding
web pages by using tabBrowser.addTab(). The same technique is now
used for "See My Path", "See FAQs", and "Visit an Onion".

Bug 29768: Introduce new features to users

Add an "update" tour for the Tor Browser 8.5 release that contains two
panels: Toolbar and Security (with appropriate description text and
images).

Display an attention-grabbing dot on the onboarding text bubble when
the update tour is active. The animation lasts for 14 seconds.

Bug 31768: Introduce toolbar and network settings changes in onboarding

Update the "Tor Network" onboarding page to include a note that
settings can now be accessed via the application preferences and
add an "Adjust Your Tor Network Settings" action button which opens
about:preferences#tor.

Replace the Tor Browser 8.5 "update" onboarding tour with a 9.0 one
that includes the revised "Tor Network" page and a revised "Toolbar"
page. The latter explains that Torbutton's toolbar item has been
removed ("Goodbye Onion Button") and explains how to access the
New Identity feature using the hamburger menu and new toolbar item.

Bug 34321 - Add Learn More onboarding item

browser/extensions/onboarding/content/img/icons_addons.svg

-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="8 8 16 16"><title>Icons / Extension</title><g fill="none"><path d="M0 0h16v16H0z"/><path d="M22.5 16c-1 0-1 1-1.7 1-.5 0-.8-.3-.8-.7V13c0-.6-.4-1-1-1h-3.2c-.5 0-.8-.3-.8-.7 0-.8 1-.8 1-1.8 0-.9-.9-1.5-2-1.5s-2 .6-2 1.5c0 1 1 1 1 1.8 0 .4-.3.7-.7.7H9c-.6 0-1 .4-1 1v2.3c0 .4.3.7.8.7.7 0 .7-1 1.7-1 .9 0 1.5.9 1.5 2s-.6 2-1.5 2c-1 0-1-1-1.7-1-.5 0-.8.3-.8.8V23c0 .6.4 1 1 1h3.3c.4 0 .7-.3.7-.7 0-.8-1-.8-1-1.8 0-.9.9-1.5 2-1.5s2 .6 2 1.5c0 1-1 1-1 1.8 0 .4.3.7.8.7H19c.6 0 1-.4 1-1v-3.2c0-.5.3-.8.8-.8.7 0 .7 1 1.7 1 .9 0 1.5-.9 1.5-2s-.6-2-1.5-2z" fill="#3E3D40"/></g></svg>
\ No newline at end of file

browser/extensions/onboarding/content/img/icons_customize.svg

-<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><title>Glyph / Customize</title><g id="Symbols" fill="none" fill-rule="evenodd"><g id="Glyph-/-Customize" fill-rule="nonzero" fill="#3E3D40"><path d="M4 10c-.886.002-1.665.59-1.91 1.44 0 .01-.015.015-.018.025-.362 1.135-.705 2.11-1.76 2.573l-.022.012-.024.012c-.162.086-.265.254-.266.438 0 .276.224.5.5.5 1.74.12 3.46-.414 4.825-1.5.006-.006.007-.013.013-.02.62-.55.832-1.428.534-2.202C5.575 10.504 4.83 9.995 4 10zM15.693.307c-.365-.363-.95-.383-1.338-.046l-8.03 7c-.206.18-.327.435-.336.707-.01.27.093.535.285.727l1.032 1.03c.184.185.433.288.693.288h.033c.272-.01.527-.13.706-.335l7-8.03c.338-.39.318-.975-.047-1.34z" id="Shape"/></g></g></svg>
\ No newline at end of file

browser/extensions/onboarding/content/img/icons_default.svg

-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><title>default-browser-16</title><path fill="context-fill" d="M8,6s0-4,3.5-4S15,5,15,6c0,4.5-7,9-7,9Z"/><path fill="context-fill" d="M8,6S8,2,4.5,2,1,5,1,6c0,4.5,7,9,7,9L9,9Z"/></svg>

browser/extensions/onboarding/content/img/icons_library.svg

-<?xml version="1.0" encoding="UTF-8"?><svg width="92px" height="92px" viewBox="0 0 92 92" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>Tip / Icon / Library</title><desc>Created with Sketch.</desc><defs></defs><g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="Tip-/-Icon-/-Library" fill-rule="nonzero" fill="#0C0C0D"><g id="Icon-/-Library-/-Web"><path d="M28.7405828,17.2350375 C25.5662458,17.2350375 22.9929371,19.8060508 22.9929371,22.9775563 L22.9929371,80.402744 C22.9929371,83.5742496 25.5662458,86.1452628 28.7405828,86.1452628 C31.9149199,86.1452628 34.4882285,83.5742496 34.4882285,80.402744 L34.4882285,22.9775563 C34.4882285,19.8060508 31.9149199,17.2350375 28.7405828,17.2350375 Z M45.98352,11.4925188 C42.8091829,11.4925188 40.2358743,14.063532 40.2358743,17.2350375 L40.2358743,80.402744 C40.2358743,83.5742496 42.8091829,86.1452628 45.98352,86.1452628 C49.157857,86.1452628 51.7311657,83.5742496 51.7311657,80.402744 L51.7311657,17.2350375 C51.7311657,14.063532 49.157857,11.4925188 45.98352,11.4925188 Z M91.6140792,78.4388026 L68.6234964,15.2710961 C67.9500245,13.3049026 66.2658683,11.8556604 64.2198302,11.4816739 C62.1737921,11.1076875 60.0851643,11.8673187 58.7585671,13.4679283 C57.4319699,15.0685378 57.0744241,17.2603443 57.8236701,19.198979 L80.814253,82.3666855 C81.4877249,84.332879 83.1718811,85.7821212 85.2179192,86.1561076 C87.2639573,86.5300941 89.3525851,85.7704629 90.6791823,84.1698533 C92.0057794,82.5692438 92.3633253,80.3774372 91.6140792,78.4388026 L91.6140792,78.4388026 Z M11.4976457,5.75 C8.32330864,5.75 5.75,8.32101323 5.75,11.4925188 L5.75,80.402744 C5.75,83.5742496 8.32330864,86.1452628 11.4976457,86.1452628 C14.6719828,86.1452628 17.2452914,83.5742496 17.2452914,80.402744 L17.2452914,11.4925188 C17.2452914,8.32101323 14.6719828,5.75 11.4976457,5.75 Z" id="Shape"></path></g></g></g></svg>
\ No newline at end of file

browser/extensions/onboarding/content/img/icons_performance.svg

-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill="context-fill" d="M8 1a8.009 8.009 0 0 0-8 8 7.917 7.917 0 0 0 .78 3.43 1 1 0 1 0 1.8-.86A5.943 5.943 0 0 1 2 9a6 6 0 1 1 11.414 2.571 1 1 0 1 0 1.807.858A7.988 7.988 0 0 0 8 1z"/><path fill="context-fill" d="M11.769 7.078a.5.5 0 0 0-.69.153L8.616 11.1a2 2 0 1 0 .5 3.558 2.011 2.011 0 0 0 .54-.54 1.954 1.954 0 0 0-.2-2.479l2.463-3.871a.5.5 0 0 0-.15-.69z"/></svg>

browser/extensions/onboarding/content/img/icons_private.svg

-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="8 8 16 16"><title>Icons / Private Browsing</title><g fill="none"><path d="M0 0h32v32H0z"/><path d="M20.4 20c-1.7 0-2.8-2-4.4-2-1.6 0-2.8 2-4.4 2-2 0-3.5-2-3.5-5.3-.1-2 .6-2.7 3.2-2.7s3.4 1.1 4.7 1.1c1.3 0 2.1-1.1 4.7-1.1s3.3.7 3.2 2.7c0 3.3-1.5 5.3-3.5 5.3zm-7.8-5.4c-1.6 0-2.3 1-2.3 1.2 0 .3 1.1.9 2.1.9 1.1 0 2.3-.4 2.3-.7-.2-1-1.1-1.6-2.1-1.4zm6.8 0c-1-.2-1.9.4-2.1 1.4 0 .3 1.2.7 2.3.7 1 0 2.1-.6 2.1-.9 0-.2-.7-1.2-2.3-1.2z" fill="#3E3D40"/></g></svg>
\ No newline at end of file

browser/extensions/onboarding/content/img/icons_screenshots.svg

-<?xml version="1.0" encoding="UTF-8"?><svg width="92px" height="92px" viewBox="0 0 92 92" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>Tip / Icon / Screenshots</title><desc>Created with Sketch.</desc><defs></defs><g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="Tip-/-Icon-/-Screenshots" fill-rule="nonzero" fill="#0C0C0D"><g id="Icon-/-Screenshot-/-Web"><path d="M23.0526905,5.75 C16.7062659,5.75 11.5614723,10.8982866 11.5614723,17.2490201 L23.0526905,17.2490201 L23.0526905,5.75 Z M57.5263453,5.75 L46.035127,5.75 L46.035127,17.2490201 L57.5263453,17.2490201 L57.5263453,5.75 Z M80.5087818,5.75 L80.5087818,17.2490201 L92,17.2490201 C92,10.8982866 86.8552063,5.75 80.5087818,5.75 Z M40.2895179,5.75 L28.7982997,5.75 L28.7982997,17.2490201 L40.2895179,17.2490201 L40.2895179,5.75 Z M74.7631726,5.75 L63.2719544,5.75 L63.2719544,17.2490201 L74.7631726,17.2490201 L74.7631726,5.75 Z M80.5087818,34.4975502 L92,34.4975502 L92,22.9985301 L80.5087818,22.9985301 L80.5087818,34.4975502 Z M80.5087818,68.9946104 C86.8552063,68.9946104 92,63.8463237 92,57.4955903 L80.5087818,57.4955903 L80.5087818,68.9946104 Z M80.5087818,51.7460803 L92,51.7460803 L92,40.2470602 L80.5087818,40.2470602 L80.5087818,51.7460803 Z M77.9749681,39.286892 C74.3364854,34.0846734 67.1729138,32.8182928 61.9734467,36.4581331 L39.9390357,52.734996 L28.631677,44.8006721 C28.7205927,44.2448747 28.7762328,43.6842562 28.7982997,43.1218152 C28.7892628,38.6172543 26.6604054,34.3800822 23.0526905,31.6860398 L23.0526905,22.9985301 L11.5614723,22.9985301 L11.5614723,29.0355156 C5.79583786,30.1835386 1.31120668,34.7313256 0.240775953,40.5156383 C-0.829654779,46.2999509 1.73019662,52.1531434 6.70268981,55.2910372 C11.675183,58.4289309 18.0565494,58.2180974 22.811375,54.7588235 L29.9474215,59.7551477 L21.9035687,65.4011666 C16.3310302,62.0167647 9.17796578,62.8225007 4.49677041,67.3619045 C-0.184424965,71.9013083 -1.21401,79.0303725 1.99130168,84.710299 C5.19661336,90.3902255 11.8290284,93.1895755 18.1311131,91.5224455 C24.4331979,89.8553154 28.8167193,84.1418505 28.7982997,77.6188754 C28.7959008,76.6687877 28.699673,75.721263 28.5110192,74.7901165 L77.9749681,39.286892 Z M14.4342769,50.3087028 C10.4677615,50.3087028 7.25226545,47.0910236 7.25226545,43.1218152 C7.25226545,39.1526068 10.4677615,35.9349277 14.4342769,35.9349277 C18.4007922,35.9349277 21.6162883,39.1526068 21.6162883,43.1218152 C21.6162883,47.0910236 18.4007922,50.3087028 14.4342769,50.3087028 Z M14.4342769,84.805763 C10.4677615,84.805763 7.25226545,81.5880838 7.25226545,77.6188754 C7.25226545,73.649667 10.4677615,70.4319879 14.4342769,70.4319879 C18.4007922,70.4319879 21.6162883,73.649667 21.6162883,77.6188754 C21.6162883,81.5880838 18.4007922,84.805763 14.4342769,84.805763 Z M45.4605661,70.8402031 L62.7950688,84.0640762 C67.9945359,87.7039165 75.1581075,86.4375358 78.7965902,81.2353172 L55.457926,63.8200513 L45.4605661,70.8402031 Z" id="Shape"></path></g></g></g></svg>
\ No newline at end of file

browser/extensions/onboarding/content/img/icons_singlesearch.svg

-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="8 8 16 16 "><title>Icons / Search</title><g fill="none"><path d="M0 0h32v32H0z"/><path d="M23.7 22.3l-4.8-4.8c1.8-2.5 1.4-6.1-1-8.1s-5.9-1.9-8.1.4c-2.3 2.2-2.4 5.7-.4 8.1 2 2.4 5.6 2.8 8.1 1l4.8 4.8c.4.4 1 .4 1.4 0 .4-.4.4-1 0-1.4zM14 18c-2.2 0-4-1.8-4-4s1.8-4 4-4 4 1.8 4 4c0 1.1-.4 2.1-1.1 2.9-.8.7-1.8 1.1-2.9 1.1z" fill="#3E3D40"/></g></svg>
\ No newline at end of file

browser/extensions/onboarding/content/img/icons_sync.svg

-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="8 8 16 16"><title>  Icons &#x2F; Sync</title><desc>  Created with Sketch.</desc><g fill="none"><rect width="32" height="32"/><path d="M22 9C21.4 9 21 9.4 21 10L21 11.1C19.2 9.3 16.6 8.6 14.2 9.2 11.7 9.9 9.8 11.8 9.2 14.3 9.1 14.7 9.2 15 9.5 15.3 9.8 15.5 10.1 15.6 10.5 15.5 10.8 15.4 11.1 15.1 11.2 14.8 11.7 12.6 13.7 11 16 11 17.6 11 19 11.7 20 13L18 13C17.4 13 17 13.4 17 14 17 14.6 17.4 15 18 15L22 15C22.6 15 23 14.6 23 14L23 10C23 9.4 22.6 9 22 9ZM22 16.5C21.8 16.4 21.5 16.5 21.3 16.6 21.1 16.7 20.9 17 20.8 17.2 20.3 19.4 18.3 21 16 21 14.4 21 13 20.3 12 19L14 19C14.6 19 15 18.6 15 18 15 17.4 14.6 17 14 17L10 17C9.4 17 9 17.4 9 18L9 22C9 22.6 9.4 23 10 23 10.6 23 11 22.6 11 22L11 20.9C12.8 22.7 15.4 23.4 17.8 22.8 20.3 22.1 22.2 20.2 22.8 17.7 22.9 17.2 22.6 16.6 22 16.5Z" fill="#3E3D40"/></g></svg>

browser/extensions/onboarding/content/img/icons_tour-complete.svg

@@ -8,10 +8,10 @@
         <g id="Tips-/-Navigation" transform="translate(-30.000000, -117.000000)" stroke-width="2">
             <g id="Group">
                 <g id="Tip-/-Check" transform="translate(30.000000, 117.000000)">
-                    <circle id="Oval-2" stroke="#FFFFFF" fill="#33F70C" fill-rule="evenodd" cx="10" cy="10" r="9"></circle>
+                    <circle id="Oval-2" stroke="#FFFFFF" fill="#00DDB3" fill-rule="evenodd" cx="10" cy="10" r="9"></circle>
                     <polyline id="Path-31" stroke="#165866" stroke-linecap="round" stroke-linejoin="round" points="5.5 10.5 8.5 13.5 14.5 6.5"></polyline>
                 </g>
             </g>
         </g>
     </g>
-</svg>
+</svg>
\ No newline at end of file

browser/extensions/onboarding/content/img/watermark.svg

-<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><title>newtab-firefox-gry</title><path d="M31.359,14.615h0c-.044-.289-.088-.459-.088-.459s-.113.131-.3.378A10.77,10.77,0,0,0,30.6,12.5a13.846,13.846,0,0,0-.937-2.411,10.048,10.048,0,0,0-.856-1.468q-.176-.263-.359-.51c-.57-.931-1.224-1.5-1.981-2.576a7.806,7.806,0,0,1-.991-2.685A10.844,10.844,0,0,0,25,4.607c-.777-.784-1.453-1.341-1.861-1.721C21.126,1.006,21.36.031,21.36.031h0S17.6,4.228,19.229,8.6a8.4,8.4,0,0,0,2.8,3.733c1.576,1.3,3.273,2.323,4.168,4.937a8.377,8.377,0,0,0-3.144-3.317,7.573,7.573,0,0,1,.6,3,7.124,7.124,0,0,1-8.711,6.94,6.561,6.561,0,0,1-1.765-.6,7.183,7.183,0,0,1-2.115-1.955l-.01-.017.126.046a6.5,6.5,0,0,0,.9.241,5.628,5.628,0,0,0,3.583-.423c1.126-.625,1.808-1.088,2.361-.905l.01,0c.54.172.966-.352.58-.9a2.94,2.94,0,0,0-2.848-1.112c-1.127.164-2.16.965-3.637.189a3.129,3.129,0,0,1-.277-.163c-.1-.057.317.087.22.022a7.33,7.33,0,0,1-.928-.554c-.022-.018.223.07.2.052a3.581,3.581,0,0,1-.968-.979,1.741,1.741,0,0,1-.066-1.554,1.371,1.371,0,0,1,.6-.564c.191.094.309.165.309.165s-.087-.16-.134-.244c.017-.006.032,0,.049-.011.167.072.537.26.732.375a1.016,1.016,0,0,1,.335.3s.067-.033.017-.173a.9.9,0,0,0-.346-.424l.016,0a2.94,2.94,0,0,1,.426.265,2.079,2.079,0,0,0,.17-.9,1.178,1.178,0,0,0-.069-.5c-.053-.1.03-.14.123-.035a.976.976,0,0,0-.079-.238v-.008h0s.053-.069.077-.094a1.43,1.43,0,0,1,.216-.176,9.973,9.973,0,0,1,1.465-.747c.414-.181.757-.319.827-.359a2.3,2.3,0,0,0,.293-.225,1.968,1.968,0,0,0,.66-1.14,1.6,1.6,0,0,0,.017-.178v-.05l0-.03v0l0-.012v0l0-.013h0c-.06-.225-.448-.394-2.476-.584a1.773,1.773,0,0,1-1.45-1.36l0,.009c-.029.074-.055.149-.081.225.026-.075.052-.15.081-.225l0-.016a5.138,5.138,0,0,1,1.986-2.466c.052-.042-.208.011-.156-.032a5.156,5.156,0,0,1,.53-.224c.091-.038-.39-.222-.815-.177a2.2,2.2,0,0,0-.756.178c.1-.086.4-.2.329-.2a4.865,4.865,0,0,0-1.542.583.314.314,0,0,1,.03-.14,2.4,2.4,0,0,0-.964.744,1.275,1.275,0,0,0,.01-.174,2.876,2.876,0,0,0-.473.444l-.009.007a6.285,6.285,0,0,0-3.517-.3l-.01-.009.012,0a2.943,2.943,0,0,1-.625-.7L6.1,5.852,6.081,5.83c-.077-.114-.156-.243-.237-.387-.058-.1-.117-.217-.176-.338,0-.008-.009-.011-.013-.012-.024,0-.041.111-.061.082l0-.006a4.308,4.308,0,0,1-.283-1.687l-.016.008a1.884,1.884,0,0,0-.714.934c-.061.137-.1.212-.14.287,0,.006,0-.01,0-.035.009-.069.039-.211.032-.2s-.012.019-.019.029a1.733,1.733,0,0,0-.251.372,2.355,2.355,0,0,0-.15.382c-.006.021,0-.018,0-.064s.009-.128,0-.111l-.022.043a9.5,9.5,0,0,0-.8,3.035A3.022,3.022,0,0,0,3.2,8.7v.016a6.628,6.628,0,0,0-.817,1.1,15.606,15.606,0,0,0-1.727,4.23,10.351,10.351,0,0,1,.925-1.621,15,15,0,0,0-1.045,5.5,14.233,14.233,0,0,1,.45-1.629A13.807,13.807,0,0,0,2.234,22.76a15.037,15.037,0,0,0,5.951,6.748h0a13.016,13.016,0,0,0,3.468,1.662c.162.059.326.117.494.173-.053-.021-.1-.044-.153-.067a15.7,15.7,0,0,0,4.5.662c5.394,0,7.175-2.054,7.339-2.259h0a2.73,2.73,0,0,0,.637-.856h0q.156-.064.315-.137l.067-.03.121-.057a11.312,11.312,0,0,0,2.277-1.426,5.5,5.5,0,0,0,2.123-3.1h0a1.938,1.938,0,0,0,.029-1.428q.083-.131.171-.28a12.706,12.706,0,0,0,1.907-6.181v-.006c0-.059,0-.118,0-.177A7.731,7.731,0,0,0,31.359,14.615Z" fill="context-fill"/></svg>

browser/extensions/onboarding/content/onboarding-tor-circuit-display.js

+// Copyright (c) 2018, The Tor Project, Inc.
+// vim: set sw=2 sts=2 ts=8 et syntax=javascript:
+
+let gStringBundle;
+
+let domLoadedListener = (aEvent) => {
+  let doc = aEvent.originalTarget;
+  if (doc.nodeName == "#document") {
+    removeEventListener("DOMContentLoaded", domLoadedListener);
+    beginCircuitDisplayOnboarding();
+  }
+};
+
+addEventListener("DOMContentLoaded", domLoadedListener, false);
+
+function beginCircuitDisplayOnboarding() {
+  // 1 of 3: Show the introductory "How do circuits work?" info panel.
+  let target = "torBrowser-circuitDisplay";
+  let title = getStringFromName("intro.title");
+  let msg = getStringFromName("intro.msg");
+  let button1Label = getStringFromName("one-of-three");
+  let button2Label = getStringFromName("next");
+  let buttons = [];
+  buttons.push({label: button1Label, style: "text"});
+  buttons.push({label: button2Label, style: "primary", callback: function() {
+    showCircuitDiagram(); }});
+  let options = {closeButtonCallback: function() { cleanUp(); }};
+  Mozilla.UITour.showInfo(target, title, msg, undefined, buttons, options);
+}
+
+function showCircuitDiagram() {
+  // 2 of 3: Open the control center and show the circuit diagram info panel.
+  Mozilla.UITour.showMenu("controlCenter", function() {
+    let target = "torBrowser-circuitDisplay-diagram";
+    let title = getStringFromName("diagram.title");
+    let msg = getStringFromName("diagram.msg");
+    let button1Label = getStringFromName("two-of-three");
+    let button2Label = getStringFromName("next");
+    let buttons = [];
+    buttons.push({label: button1Label, style: "text"});
+    buttons.push({label: button2Label, style: "primary", callback: function() {
+      showNewCircuitButton(); }});
+    let options = {closeButtonCallback: function() { cleanUp(); }};
+    Mozilla.UITour.showInfo(target, title, msg, undefined, buttons, options);
+  });
+}
+
+function showNewCircuitButton() {
+  // 3 of 3: Show the New Circuit button info panel.
+  let target = "torBrowser-circuitDisplay-newCircuitButton";
+  let title = getStringFromName("new-circuit.title");
+  let msg = getStringFromName("new-circuit.msg");
+  let button1Label = getStringFromName("three-of-three");
+  let button2Label = getStringFromName("done");
+  let buttons = [];
+  buttons.push({label: button1Label, style: "text"});
+  buttons.push({label: button2Label, style: "primary", callback: function() {
+    cleanUp(); }});
+  let options = {closeButtonCallback: function() { cleanUp(); }};
+  Mozilla.UITour.showInfo(target, title, msg, undefined, buttons, options);
+}
+
+function cleanUp() {
+  Mozilla.UITour.hideMenu("controlCenter");
+  Mozilla.UITour.closeTab();
+}
+
+function getStringFromName(aName) {
+  const TORBUTTON_BUNDLE_URI = "chrome://torbutton/locale/browserOnboarding.properties";
+  const PREFIX = "onboarding.tor-circuit-display.";
+
+  if (!gStringBundle) {
+    gStringBundle = Services.strings.createBundle(TORBUTTON_BUNDLE_URI)
+  }
+
+  let result;
+  try {
+    result = gStringBundle.GetStringFromName(PREFIX + aName);
+  } catch (e) {
+    result = aName;
+  }
+  return result;
+}
+
+
+// The remainder of the code in this file was adapted from
+// browser/components/uitour/UITour-lib.js (unfortunately, we cannot use that
+// code here because it directly accesses 'document' and it assumes that the
+// content window is the global JavaScript object),
+
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+// create namespace
+if (typeof Mozilla == "undefined") {
+  var Mozilla = {};
+}
+
+(function($) {
+  "use strict";
+
+  // create namespace
+  if (typeof Mozilla.UITour == "undefined") {
+    /**
+     * Library that exposes an event-based Web API for communicating with the
+     * desktop browser chrome. It can be used for tasks such as opening menu
+     * panels and highlighting the position of buttons in the toolbar.
+     *
+     * <p>For security/privacy reasons `Mozilla.UITour` will only work on a list of allowed
+     * secure origins. The list of allowed origins can be found in
+     * {@link https://dxr.mozilla.org/mozilla-central/source/browser/app/permissions|
+     * browser/app/permissions}.</p>
+     *
+     * @since 29
+     * @namespace
+     */
+    Mozilla.UITour = {};
+  }
+
+  function _sendEvent(action, data) {
+    var event = new content.CustomEvent("mozUITour", {
+      bubbles: true,
+      detail: {
+        action,
+        data: data || {}
+      }
+    });
+
+    content.document.dispatchEvent(event);
+  }
+
+  function _generateCallbackID() {
+    return Math.random().toString(36).replace(/[^a-z]+/g, "");
+  }
+
+  function _waitForCallback(callback) {
+    var id = _generateCallbackID();
+
+    function listener(event) {
+      if (typeof event.detail != "object")
+        return;
+      if (event.detail.callbackID != id)
+        return;
+
+      content.document.removeEventListener("mozUITourResponse", listener);
+      callback(event.detail.data);
+    }
+    content.document.addEventListener("mozUITourResponse", listener);
+
+    return id;
+  }
+
+  /**
+   * Show an arrow panel with optional images and buttons anchored at a specific UI target.
+   *
+   * @see Mozilla.UITour.hideInfo
+   *
+   * @param {Mozilla.UITour.Target} target - Identifier of the UI widget to anchor the panel at.
+   * @param {String} title - Title text to be shown as the heading of the panel.
+   * @param {String} text - Body text of the panel.
+   * @param {String} [icon=null] - URL of a 48x48px (96px @ 2dppx) image (which will be resolved
+   *                               relative to the tab's URI) to display in the panel.
+   * @param {Object[]} [buttons=[]] - Array of objects describing buttons.
+   * @param {String} buttons[].label - Button label
+   * @param {String} buttons[].icon - Button icon URL
+   * @param {String} buttons[].style - Button style ("primary" or "link")
+   * @param {Function} buttons[].callback - Called when the button is clicked
+   * @param {Object} [options={}] - Advanced options
+   * @param {Function} options.closeButtonCallback - Called when the panel's close button is clicked.
+   *
+   * @example
+   * var buttons = [
+   *   {
+   *     label: 'Cancel',
+   *     style: 'link',
+   *     callback: cancelBtnCallback
+   *   },
+   *   {
+   *     label: 'Confirm',
+   *     style: 'primary',
+   *     callback: confirmBtnCallback
+   *   }
+   * ];
+   *
+   * var icon = '//mozorg.cdn.mozilla.net/media/img/firefox/australis/logo.png';
+   *
+   * var options = {
+   *   closeButtonCallback: closeBtnCallback
+   * };
+   *
+   * Mozilla.UITour.showInfo('appMenu', 'my title', 'my text', icon, buttons, options);
+   */
+  Mozilla.UITour.showInfo = function(target, title, text, icon, buttons, options) {
+    var buttonData = [];
+    if (Array.isArray(buttons)) {
+      for (var i = 0; i < buttons.length; i++) {
+        buttonData.push({
+          label: buttons[i].label,
+          icon: buttons[i].icon,
+          style: buttons[i].style,
+          callbackID: _waitForCallback(buttons[i].callback)
+        });
+      }
+    }
+
+    var closeButtonCallbackID, targetCallbackID;
+    if (options && options.closeButtonCallback)
+      closeButtonCallbackID = _waitForCallback(options.closeButtonCallback);
+    if (options && options.targetCallback)
+      targetCallbackID = _waitForCallback(options.targetCallback);
+
+    _sendEvent("showInfo", {
+      target,
+      title,
+      text,
+      icon,
+      buttons: buttonData,
+      closeButtonCallbackID,
+      targetCallbackID
+    });
+  };
+
+  /**
+   * Hide any visible info panels.
+   * @see Mozilla.UITour.showInfo
+   */
+  Mozilla.UITour.hideInfo = function() {
+    _sendEvent("hideInfo");
+  };
+
+  /**
+   * Open the named application menu.
+   *
+   * @see Mozilla.UITour.hideMenu
+   *
+   * @param {Mozilla.UITour.MenuName} name - Menu name
+   * @param {Function} [callback] - Callback to be called with no arguments when
+   *                                the menu opens.
+   *
+   * @example
+   * Mozilla.UITour.showMenu('appMenu', function() {
+   *   console.log('menu was opened');
+   * });
+   */
+  Mozilla.UITour.showMenu = function(name, callback) {
+    var showCallbackID;
+    if (callback)
+      showCallbackID = _waitForCallback(callback);
+
+    _sendEvent("showMenu", {
+      name,
+      showCallbackID,
+    });
+  };
+
+  /**
+   * Close the named application menu.
+   *
+   * @see Mozilla.UITour.showMenu
+   *
+   * @param {Mozilla.UITour.MenuName} name - Menu name
+   */
+  Mozilla.UITour.hideMenu = function(name) {
+    _sendEvent("hideMenu", {
+      name
+    });
+  };
+
+  /**
+   * @summary Closes the tab where this code is running. As usual, if the tab is in the
+   * foreground, the tab that was displayed before is selected.
+   *
+   * @description The last tab in the current window will never be closed, in which case
+   * this call will have no effect. The calling code is expected to take an
+   * action after a small timeout in order to handle this case, for example by
+   * displaying a goodbye message or a button to restart the tour.
+   * @since 46
+   */
+  Mozilla.UITour.closeTab = function() {
+    _sendEvent("closeTab");
+  };
+})();