Bug 954826 - Suggest popular protocols during account creation, r=florian.

im/content/accountWizard.css

@@ -0,0 +1,7 @@
+/* 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/. */
+
+.top-protocol {
+  -moz-binding: url("chrome://instantbird/content/accountWizard.xml#topProtocol");
+}

im/content/accountWizard.js

@@ -43,24 +43,28 @@ const PREF_EXTENSIONS_GETMOREPROTOCOLSURL = "extensions.getMoreProtocolsURL";
 
 var accountWizard = {
   onload: function aw_onload() {
-    accountWizard.setGetMoreProtocols();
+    let topProtoList = document.getElementById("topprotolist");
+    let bundle = document.getElementById("topProtocolsBundle");
+    let topProtocols = bundle.getString("topProtocol.list").split(",");
 
-    var protoList = document.getElementById("protolist");
-    var protos = [];
-    for (let proto in this.getProtocols())
-      protos.push(proto);
-    protos.sort(function(a, b) a.name < b.name ? -1 : a.name > b.name ? 1 : 0);
-    protos.forEach(function(proto) {
-      var id = proto.id;
-      var item = protoList.appendItem(proto.name, id, id);
-      item.setAttribute("image", proto.iconBaseURI + "icon.png");
-      item.setAttribute("class", "listitem-iconic");
-    });
+    for each (let topProto in topProtocols) {
+      let proto = Services.core.getProtocolById(topProto);
+      if (proto == null)
+        continue;
 
-    // there is a strange selection bug without this timeout
-    setTimeout(function() {
-      protoList.selectedIndex = 0;
-    }, 0);
+      let item = document.createElement("richlistitem");
+      item.className = "top-protocol";
+      topProtoList.insertBefore(item, document.getElementById("otherListItem"));
+      let desc = bundle.getString("topProtocol." + proto.id + ".description");
+      item.build(proto, desc);
+    }
+
+    if (topProtoList.itemCount < 2) {
+      document.getElementById("accountWizard")
+              .getPageById("accountwelcome").next = "accountprotocol";
+    }
+
+    topProtoList.selectedIndex = -1;
 
     Services.obs.addObserver(this, "prpl-quit", false);
     window.addEventListener("unload", this.unload);
@@ -101,14 +105,17 @@ var accountWizard = {
   },
 
   selectProtocol: function aw_selectProtocol() {
-    var protoList = document.getElementById("protolist");
-    var id = protoList.selectedItem.value;
-    this.proto = Services.core.getProtocolById(id);
+    // A fix for users wanting to return to the list they previously viewed.
+    var pageId = document.getElementById("accountWizard").currentPage.pageid;
+    document.getElementById("accountusername").previous = pageId;
+
+    var listId = pageId == "accounttoplist" ? "topprotolist" : "protolist";
+    var protoList = document.getElementById(listId);
+    this.proto = Services.core.getProtocolById(protoList.selectedItem.value);
 
     return true;
   },
 
-
   insertUsernameField: function aw_insertUsernameField(aName, aLabel, aParent,
                                                        aDefaultValue) {
     var hbox = document.createElement("hbox");
@@ -571,5 +578,43 @@ var accountWizard = {
     Components.classes["@mozilla.org/uriloader/external-protocol-service;1"]
               .getService(Components.interfaces.nsIExternalProtocolService)
               .loadUrl(Services.io.newURI(aURL, null, null));
+  },
+
+  advanceTopProtocolPage: function() {
+    let selectedProtocol = document.getElementById("topprotolist").selectedItem;
+    if (!selectedProtocol || selectedProtocol.id == "otherListItem")
+      return true;
+    accountWizard.selectProtocol();
+    document.getElementById("accountWizard").goTo("accountusername");
+    return false;
+  },
+
+  rewindFromUsernamePage: function() {
+    let wizard = document.getElementById("accountWizard");
+    let previousPage = wizard.getPageById("accountusername").previous;
+    if (previousPage == "accountprotocol")
+      return true;
+    wizard.goTo(previousPage);
+    return false;
+  },
+
+  showProtocolPage: function() {
+    let protoList = document.getElementById("protolist");
+    if (protoList.itemCount > 0)
+      return;
+
+    accountWizard.setGetMoreProtocols();
+    let protos = [];
+    for (let proto in accountWizard.getProtocols())
+      protos.push(proto);
+    protos.sort(function(a, b) a.name < b.name ? -1 : a.name > b.name ? 1 : 0);
+
+    protos.forEach(function(proto) {
+      let item = protoList.appendItem(proto.name, proto.id);
+      item.setAttribute("image", proto.iconBaseURI + "icon.png");
+      item.setAttribute("class", "listitem-iconic");
+    });
+
+    protoList.selectedIndex = 0;
   }
 };

im/content/accountWizard.xml

@@ -0,0 +1,39 @@
+<?xml version="1.0"?>
+<!-- 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/.  -->
+
+<!DOCTYPE bindings [
+  <!ENTITY % accountsDTD SYSTEM "chrome://instantbird/locale/accountWizard.dtd">
+  %accountsDTD;
+]>
+
+<bindings id="accountWizardBindings"
+          xmlns="http://www.mozilla.org/xbl"
+          xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+          xmlns:xbl="http://www.mozilla.org/xbl">
+
+  <binding id="topProtocol" extends="chrome://global/content/bindings/richlistbox.xml#richlistitem">
+    <content align="center">
+     <xul:image xbl:inherits="src=prplicon" class="top-proto-icon"/>
+     <xul:vbox>
+       <xul:description xbl:inherits="value=name" class="top-proto-name"/>
+       <xul:description xbl:inherits="value=description" class="top-proto-description"/>
+     </xul:vbox>
+    </content>
+    <implementation>
+     <method name="build">
+      <parameter name="aProtocol"/>
+      <parameter name="aDescription"/>
+      <body>
+      <![CDATA[
+        this.setAttribute("name", aProtocol.name);
+        this.setAttribute("description", aDescription);
+        this.setAttribute("prplicon", aProtocol.iconBaseURI + "icon32.png");
+        this.value = aProtocol.id;
+      ]]>
+      </body>
+     </method>
+    </implementation>
+  </binding>
+</bindings>

im/content/accountWizard.xul

@@ -39,6 +39,7 @@
 
 
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
+<?xml-stylesheet href="chrome://instantbird/content/accountWizard.css" type="text/css"?>
 <?xml-stylesheet href="chrome://instantbird/skin/accountWizard.css" type="text/css"?>
 
 <!DOCTYPE wizard [
@@ -57,20 +58,34 @@
   <script type="application/javascript" src="chrome://instantbird/content/accountWizard.js"/>
   <stringbundle id="proxiesBundle" src="chrome://instantbird/locale/proxies.properties"/>
   <stringbundle id="accountsBundle" src="chrome://instantbird/locale/accounts.properties"/>
+  <stringbundle id="topProtocolsBundle" src="chrome://instantbird/locale/accountWizard.properties"/>
 
-  <wizardpage id="accountwelcome" pageid="accountwelcome" next="accountprotocol"
+  <wizardpage id="accountwelcome" pageid="accountwelcome" next="accounttoplist"
               label="&accountWelcomeTitle.label;">
     <description>&accountWelcomeInfo.label;</description>
     <separator/>
   </wizardpage>
 
+  <wizardpage id="accounttoplist" pageid="accounttoplist" next="accountprotocol"
+              label="&accountProtocolTitle.label;"
+              onpageadvanced="return accountWizard.advanceTopProtocolPage();">
+    <description>&accountProtocolInfo.label2;</description>
+    <separator class="thin"/>
+    <richlistbox flex="1" id="topprotolist"
+                 ondblclick="document.getElementById('accountWizard').advance();">
+      <richlistitem id="otherListItem">
+        <description class="top-proto-name" value="&accountProtocolShowMore.label;"/>
+        <description class="top-proto-description" value="&accountProtocolShowMore.description;"/>
+      </richlistitem>
+    </richlistbox>
+  </wizardpage>
+
   <wizardpage id="accountprotocol" pageid="accountprotocol" next="accountusername"
               label="&accountProtocolTitle.label;"
+              onpageshow="accountWizard.showProtocolPage();"
               onpageadvanced="return accountWizard.selectProtocol();">
-    <description>&accountProtocolInfo.label;</description>
-    <separator/>
-    <label value="&accountProtocolField.label;" control="protolist"
-           id="protoLabel" hidden="true"/>
+    <description>&accountProtocolInfo.label2;</description>
+    <separator class="thin"/>
     <listbox flex="1" id="protolist"
              ondblclick="document.getElementById('accountWizard').advance();"/>
     <hbox pack="end">
@@ -82,7 +97,8 @@
   <wizardpage id="accountusername" pageid="accountusername" next="accountpassword"
               label="&accountUsernameTitle.label;"
               onpageshow="accountWizard.showUsernamePage();"
-              onpagehide="accountWizard.hideUsernamePage();">
+              onpagehide="accountWizard.hideUsernamePage();"
+              onpagerewound="return accountWizard.rewindFromUsernamePage();">
     <description id="usernameInfo"/>
     <separator/>
     <vbox id="userNameBox"/>

im/content/jar.mn

@@ -6,8 +6,10 @@ instantbird.jar:
 	content/instantbird/accounts.css
 	content/instantbird/accounts.js
 *	content/instantbird/accounts.xul
+	content/instantbird/accountWizard.css
 	content/instantbird/accountWizard.js
 	content/instantbird/accountWizard.xul
+	content/instantbird/accountWizard.xml
 	content/instantbird/account.xml
 	content/instantbird/account.xul
 	content/instantbird/addbuddy.js

im/locales/en-US/chrome/instantbird/accountWizard.dtd

@@ -4,9 +4,10 @@
 <!ENTITY accountWelcomeInfo.label    "This wizard will help you in the process of setting up your IM account in order to use it with &brandShortName;.">
 
 <!ENTITY accountProtocolTitle.label   "Protocol">
-<!ENTITY accountProtocolInfo.label    "Please choose the protocol of your IM account in the following list.">
-<!ENTITY accountProtocolField.label   "Protocol:">
+<!ENTITY accountProtocolInfo.label2   "Please choose the protocol of your IM account.">
 <!ENTITY accountProtocolGetMore.label "Get more…">
+<!ENTITY accountProtocolShowMore.label  "Show all protocols">
+<!ENTITY accountProtocolShowMore.description  "Choose from the full list of protocols">
 
 <!ENTITY accountUsernameTitle.label   "Username">
 <!ENTITY accountUsernameDuplicate.label "This account is already configured!">

im/locales/en-US/chrome/instantbird/accountWizard.properties

@@ -0,0 +1,17 @@
+# LOCALIZATION NOTE
+# The selected protocols below should be the most relevant
+# to the target language / location and comma delimited.
+# Exceeding 4 protocols may cause scrolling. A list of the
+# available protocols can be found at
+#     https://wiki.instantbird.org/Protocol_Identifiers
+topProtocol.list=prpl-gtalk,prpl-facebook,prpl-twitter,prpl-aim,prpl-msn,prpl-yahoo
+
+# LOCALIZATION NOTE
+# These are the descriptions of the top protocols specified above.
+# A description should be provided for each protocol ID listed above.
+topProtocol.prpl-gtalk.description=Talk to your Gmail contacts
+topProtocol.prpl-facebook.description=Communicate with Facebook friends
+topProtocol.prpl-twitter.description=Stay up to date with your Twitter timeline
+topProtocol.prpl-aim.description=Chat with your buddies on AOL Instant Messenger
+topProtocol.prpl-msn.description=Microsoft Windows Live Messenger (formerly MSN)
+topProtocol.prpl-yahoo.description=Chat with friends using Yahoo! Messenger

im/locales/jar.mn

@@ -7,6 +7,7 @@
 	locale/@AB_CD@/instantbird/accounts.dtd		(%chrome/instantbird/accounts.dtd)
 	locale/@AB_CD@/instantbird/accounts.properties	(%chrome/instantbird/accounts.properties)
 	locale/@AB_CD@/instantbird/accountWizard.dtd	(%chrome/instantbird/accountWizard.dtd)
+	locale/@AB_CD@/instantbird/accountWizard.properties	(%chrome/instantbird/accountWizard.properties)
 	locale/@AB_CD@/instantbird/addbuddy.dtd		(%chrome/instantbird/addbuddy.dtd)
 	locale/@AB_CD@/instantbird/buddytooltip.properties (%chrome/instantbird/buddytooltip.properties)
 	locale/@AB_CD@/instantbird/core.properties	(%chrome/instantbird/core.properties)

im/themes/accountWizard.css

@@ -44,6 +44,26 @@
   overflow: auto;
 }
 
+#otherListItem {
+  padding-left: 40px;
+  min-height: 40px;
+  -moz-box-orient: vertical;
+  -moz-box-pack: center;
+}
+
+.top-proto-name {
+  font-size: larger;
+}
+
+.top-proto-description {
+  font-size: smaller;
+  opacity: 0.85;
+}
+
+.top-proto-icon {
+  padding: 4px;
+}
+
 groupbox.collapsable {
   -moz-user-focus: normal;
 }