Commit cb867337 authored by Kathleen Brade's avatar Kathleen Brade Committed by Georg Koppen
Browse files

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

Add a "New Circuit Display" promotional banner to the about:tbupdate page.
parent 671ba50b

browser/base/content/abouttbupdate/aboutTBUpdate.css

+25 −0
Original line number Diff line number Diff line
@@ -53,6 +53,31 @@ a { 
  margin-bottom: 20px;

}



#new-features {

  margin-bottom: 15px;

  padding: 10px;

  text-align: center;

  /* swap text and background colors in this section */

  color: var(--abouttor-bg-toron-color);

  background-color: var(--abouttor-text-color);

}



#new-features-description {

  margin: 15px auto;

  max-width: 500px;

  font-size: 85%;

}



#new-features button {

  padding: 8px 20px;

  border: none;

  border-radius: 3px;

  font-size: 90%;

  color: var(--abouttor-text-color);

  background-color: var(--abouttor-bg-toron-color);

  cursor: pointer;

}



#changelog-container {

  margin: 0px 20px 20px 20px;

}

browser/base/content/abouttbupdate/aboutTBUpdate.js

+8 −1
Original line number Diff line number Diff line 
// Copyright (c) 2015, The Tor Project, Inc.

// Copyright (c) 2018, The Tor Project, Inc.

// See LICENSE for licensing information.

//

// vim: set sw=2 sts=2 ts=8 et syntax=javascript:
@@ -8,3 +8,10 @@ function init() 
  let event = new CustomEvent("AboutTBUpdateLoad", { bubbles: true });

  document.dispatchEvent(event);

}



function showNewFeaturesOnboarding()

{

  let event = new CustomEvent("AboutTBUpdateNewFeaturesOnboarding",

                              { bubbles: true });

  document.dispatchEvent(event);

}

browser/base/content/abouttbupdate/aboutTBUpdate.xhtml

+5 −0
Original line number Diff line number Diff line
@@ -28,6 +28,11 @@ 
</div>

</div>

<br clear="all"/>

<div id="new-features">

  <div>&aboutTBUpdate.circuitDisplayHeading;</div>

  <div id="new-features-description">&aboutTBUpdate.circuitDisplayDescription;</div>

  <button onclick="showNewFeaturesOnboarding()">&aboutTBUpdate.learnMore;</button>

</div>

<div id="changelog-container">

<div id="changelog-heading">&aboutTBUpdate.changeLogHeading;</div>

<div id="changelog"></div>

browser/base/content/tab-content.js

+10 −0
Original line number Diff line number Diff line
@@ -359,6 +359,8 @@ AboutReaderListener.init(); 
let AboutTBUpdateListener = {

  init: function(chromeGlobal) {

    chromeGlobal.addEventListener('AboutTBUpdateLoad', this, false, true);

    chromeGlobal.addEventListener("AboutTBUpdateNewFeaturesOnboarding",

                                  this, false, true);

  },



  get isAboutTBUpdate() {
@@ -373,6 +375,9 @@ let AboutTBUpdateListener = { 
      case "AboutTBUpdateLoad":

        this.onPageLoad();

        break;

      case "AboutTBUpdateNewFeaturesOnboarding":

        this.onNewFeaturesOnboarding();

        break;

      case "pagehide":

        this.onPageHide(aEvent);

        break;
@@ -406,6 +411,11 @@ let AboutTBUpdateListener = { 
    removeEventListener("pagehide", this, true);

  },



  onNewFeaturesOnboarding: function() {

    // Tell the onboarding extension to open the circuit display onboarding.

    sendAsyncMessage("Onboarding:OnContentMessage",

                     {action: "tor-open-circuit-display-page"});

  },

};

AboutTBUpdateListener.init(this);

#endif

browser/locales/en-US/chrome/browser/aboutTBUpdate.dtd

+4 −0
Original line number Diff line number Diff line
@@ -4,3 +4,7 @@ 
<!ENTITY aboutTBUpdate.linkLabel  "visit our website">

<!ENTITY aboutTBUpdate.linkSuffix ".">

<!ENTITY aboutTBUpdate.changeLogHeading "Changelog:">



<!ENTITY aboutTBUpdate.circuitDisplayHeading "New, Redesigned Circuit Display">

<!ENTITY aboutTBUpdate.circuitDisplayDescription "The Tor circuit display has been relocated and improved! Click the Site&#160;Identity button (located on the left side of the URL bar) to see the new circuit display.">

<!ENTITY aboutTBUpdate.learnMore "Learn More">