Bug 851818: Modernize the entry page for filing a bug by including, keeping, and removing products shown on the enter bug page

9 files changed, 91 insertions, 56 deletions

diff --git a/extensions/BMO/template/en/default/global/choose-product.html.tmpl b/extensions/BMO/template/en/default/global/choose-product.html.tmpl
index 9f3aca3c0..d6d493827 100644
--- a/extensions/BMO/template/en/default/global/choose-product.html.tmpl
+++ b/extensions/BMO/template/en/default/global/choose-product.html.tmpl
@@ -29,7 +29,7 @@
 
 [% PROCESS global/variables.none.tmpl %]
 
-[% style_urls = [ "extensions/BMO/web/styles/choose_product.css" ] %] 
+[% style_urls = [ "extensions/BMO/web/styles/choose_product.css" ] %]
 
 [% IF target == "enter_bug.cgi" %]
   [% title = "Enter $terms.Bug" %]
@@ -68,7 +68,7 @@
   ProdCompSearch.script_name = '[% target FILTER js %]';
 </script>
 <div id="prod_comp_search_main">
-  [% PROCESS prodcompsearch/form.html.tmpl 
+  [% PROCESS prodcompsearch/form.html.tmpl
      input_label = "Find product:"
   %]
 </div>
@@ -90,32 +90,37 @@
    icon="firefox.png"
 %]
 [% INCLUDE easyproduct
-   name="Thunderbird"
-   icon="thunderbird.png"
+   name="Boot2Gecko"
+   icon="firefox.png"
+   caption="Firefox OS"
 %]
 [% INCLUDE easyproduct
-   name="Calendar"
-   icon="sunbird.png"
+   name="Firefox for Android"
+   icon="firefox.png"
 %]
 [% INCLUDE easyproduct
-   name="Camino"
-   icon="camino.png"
+   name="Firefox for Metro"
+   icon="firefox.png"
 %]
 [% INCLUDE easyproduct
-   name="SeaMonkey"
-   icon="seamonkey.png"
+   name="Toolkit"
+   icon="dino.png"
 %]
 [% INCLUDE easyproduct
-   name="Firefox for Android"
-   icon="firefox.png"
+   name="Marketplace"
+   icon="marketplace.png"
 %]
 [% INCLUDE easyproduct
-   name="Mozilla Localizations"
-   icon="dino.png"
+   name="Thunderbird"
+   icon="thunderbird.png"
 %]
 [% INCLUDE easyproduct
-   name="Mozilla Labs"
-   icon="labs.png"
+   name="SeaMonkey"
+   icon="seamonkey.png"
+%]
+[% INCLUDE easyproduct
+   name="Mozilla Localizations"
+   icon="dino.png"
 %]
 [% INCLUDE easyproduct
    name="Mozilla Services"
@@ -182,7 +187,7 @@
 
 <br>
 [% IF target == "enter_bug.cgi" AND user.settings.product_chooser.value != 'full_product_chooser' %]
-<p>You can choose to get this screen by default when you click "New [% terms.Bug %]" 
+<p>You can choose to get this screen by default when you click "New [% terms.Bug %]"
 by changing your <a href="userprefs.cgi?tab=settings">preferences</a>.</p>
 [% END %]
 [% END %]
@@ -190,6 +195,13 @@ by changing your <a href="userprefs.cgi?tab=settings">preferences</a>.</p>
 
 </div>
 
+<div id="guided">
+  <a id="guided_img" href="enter_bug.cgi?format=guided"><img
+   src="extensions/BMO/web/images/guided.png" width="16" height="16" border="0" align="absmiddle"></a>
+  <a id="guided_link" href="enter_bug.cgi?format=guided"
+   >Switch to the [% terms.Bugzilla %] Helper</a>
+</div>
+
 [% PROCESS global/footer.html.tmpl %]
 
 [%###########################################################################%]
@@ -208,7 +220,7 @@ by changing your <a href="userprefs.cgi?tab=settings">preferences</a>.</p>
           <td><h2 align="left" style="margin-bottom: 0px"><a href="[% target FILTER uri %]?product=[% p.name FILTER uri %]
                   [%- IF cloned_bug_id %]&amp;cloned_bug_id=[% cloned_bug_id FILTER uri %][% END -%]
                   [%- IF format %]&amp;format=[% format FILTER uri %][% END %]">
-              [% p.name FILTER html FILTER no_break %]</a>:</h2>
+              [% caption || name FILTER html FILTER no_break %]</a>:</h2>
               [% IF p.description %]
                 <p style="margin-top: 0px;">[% p.description FILTER html_light %]</p>
               [% END %]
diff --git a/extensions/BMO/web/core.png b/extensions/BMO/web/core.png
new file mode 100644
index 000000000..b9c5053f6
--- /dev/null
+++ b/extensions/BMO/web/core.png
diff --git a/extensions/BMO/web/marketplace.png b/extensions/BMO/web/marketplace.png
new file mode 100644
index 000000000..62025a2a8
--- /dev/null
+++ b/extensions/BMO/web/marketplace.png
diff --git a/extensions/GuidedBugEntry/template/en/default/guided/guided.html.tmpl b/extensions/GuidedBugEntry/template/en/default/guided/guided.html.tmpl
index 50a7616be..c9bed9f41 100644
--- a/extensions/GuidedBugEntry/template/en/default/guided/guided.html.tmpl
+++ b/extensions/GuidedBugEntry/template/en/default/guided/guided.html.tmpl
@@ -231,10 +231,8 @@ dupes.setLabels(
         ></a>
       </div>
     </td>
-    <td width="100%">
-      <h2>
-        <a href="http://www.mozilla.org/support/">I need technical support</a>
-      </h2>
+    <td class="exit_text">
+      <a href="http://www.mozilla.org/support/">I need technical support</a><br>
       For technical support or help getting your site to work with Mozilla.
     </td>
   </tr>
@@ -246,14 +244,24 @@ dupes.setLabels(
         ></a>
       </div>
     </td>
-    <td width="100%">
-      &bull; <a href="http://input.mozilla.org/feedback/#sad">Offer us ideas on how to make Firefox better</a><br>
-      &bull; <a href="http://input.mozilla.org/feedback/#sad">Report an issue with a web site that I use</a><br>
-      &bull; <a href="enter_bug.cgi?format=guided&amp;product=Core">Report an issue with Firefox on a site that I've developed</a><br>
-      &bull; <a href="http://input.mozilla.org/feedback/">Provide feedback about Firefox</a><br>
+    <td class="exit_text">
+      <a href="http://input.mozilla.org/feedback/#sad">Offer us ideas on how to make Firefox better</a><br>
+      <a href="http://input.mozilla.org/feedback/">Provide feedback about Firefox</a><br>
+    </td>
+  </tr>
+  <tr>
+    <td>
+      <div class="exit_img">
+        <img src="extensions/GuidedBugEntry/web/images/webbug.png" width="32" height="32">
+      </div>
+    </td>
+    <td class="exit_text_last">
+      <a href="enter_bug.cgi?format=guided&amp;product=Core">Report an issue with Firefox on a site that I've developed</a><br>
+      <a href="http://input.mozilla.org/feedback/#sad">Report an issue with a web site that I use</a><br>
     </td>
   </tr>
 </table>
+
 <h3>
   None of the above; my [% terms.bug %] is in:
 </h3>
@@ -423,7 +431,7 @@ explain how to write effective [% terms.bug %] reports.</li>
   <span class="help-bad">Bad example</span>: Mozilla crashed. You suck!<br>
   <span class="help-good">Good example</span>: After a crash which happened
   when I was sorting in the Bookmark Manager, all of my top-level bookmark
-  folders beginning with the letters Q to Z are no longer present. 
+  folders beginning with the letters Q to Z are no longer present.
   </div>
   </td>
 </tr>
diff --git a/extensions/GuidedBugEntry/template/en/default/guided/products.html.tmpl b/extensions/GuidedBugEntry/template/en/default/guided/products.html.tmpl
index 22c93a354..f775f837c 100644
--- a/extensions/GuidedBugEntry/template/en/default/guided/products.html.tmpl
+++ b/extensions/GuidedBugEntry/template/en/default/guided/products.html.tmpl
@@ -11,34 +11,41 @@
    icon="firefox.png"
 %]
 [% INCLUDE product_block
+   name="Boot2Gecko"
+   icon="firefox.png"
+   caption="Firefox OS"
+%]
+[% INCLUDE product_block
    name="Firefox for Android"
    icon="firefox.png"
 %]
 [% INCLUDE product_block
-   name="Thunderbird"
-   icon="thunderbird.png"
+   name="Firefox for Metro"
+   icon="firefox.png"
 %]
 [% INCLUDE product_block
-   name="Mozilla Services"
-   icon="dino.png"
+   name="Marketplace"
+   icon="marketplace.png"
 %]
 [% INCLUDE product_block
-   name="SeaMonkey"
-   icon="seamonkey.png"
+   name="Thunderbird"
+   icon="thunderbird.png"
 %]
 [% INCLUDE product_block
-   name="Mozilla Localizations"
-   icon="dino.png"
+   name="SeaMonkey"
+   icon="seamonkey.png"
 %]
 [% INCLUDE product_block
-   name="Mozilla Labs"
-   icon="labs.png"
+   name="Core"
+   icon="core.png"
 %]
 [% INCLUDE product_block
-   name="Calendar"
-   icon="sunbird.png"
+   name="Mozilla Localizations"
+   icon="dino.png"
+   caption="Localizations"
 %]
 [% INCLUDE product_block
-   name="Core"
-   icon="core.png"
+   name="Mozilla Services"
+   icon="dino.png"
+   caption="Services"
 %]
diff --git a/extensions/GuidedBugEntry/web/images/products/marketplace.png b/extensions/GuidedBugEntry/web/images/products/marketplace.png
new file mode 100644
index 000000000..62025a2a8
--- /dev/null
+++ b/extensions/GuidedBugEntry/web/images/products/marketplace.png
diff --git a/extensions/GuidedBugEntry/web/images/webbug.png b/extensions/GuidedBugEntry/web/images/webbug.png
new file mode 100644
index 000000000..949cfbc59
--- /dev/null
+++ b/extensions/GuidedBugEntry/web/images/webbug.png
diff --git a/extensions/GuidedBugEntry/web/js/guided.js b/extensions/GuidedBugEntry/web/js/guided.js
index 8eaf6b3b5..98d637d60 100644
--- a/extensions/GuidedBugEntry/web/js/guided.js
+++ b/extensions/GuidedBugEntry/web/js/guided.js
@@ -306,7 +306,7 @@ var dupes = {
     };
     // DataSource can't understand a JSON-RPC error response, so
     // we have to modify the result data if we get one.
-    dataSource.doBeforeParseData = 
+    dataSource.doBeforeParseData =
       function(oRequest, oFullResponse, oCallback) {
         if (oFullResponse.error) {
           oFullResponse.result = {};
@@ -316,17 +316,17 @@ var dupes = {
         }
         return oFullResponse;
       };
-    dataSource.subscribe('dataErrorEvent', 
+    dataSource.subscribe('dataErrorEvent',
       function() {
         dupes._currentSearchQuery = '';
       }
     );
 
     this._dataTable = new YAHOO.widget.DataTable(
-      'dupes_list', 
-      this._dataTableColumns, 
-      dataSource, 
-      { 
+      'dupes_list',
+      this._dataTableColumns,
+      dataSource,
+      {
         initialLoad: false,
         MSG_EMPTY: 'No similar issues found.',
         MSG_ERROR: 'An error occurred while searching for similar issues,' +
@@ -517,7 +517,7 @@ var dupes = {
 
       dupes._dataTable.showTableMessage(
         'Searching for similar issues...&nbsp;&nbsp;&nbsp;' +
-        '<img src="extensions/GuidedBugEntry/web/images/throbber.gif"' + 
+        '<img src="extensions/GuidedBugEntry/web/images/throbber.gif"' +
         ' width="16" height="11">',
         YAHOO.widget.DataTable.CLASS_LOADING
       );
@@ -535,12 +535,12 @@ var dupes = {
       };
 
       dupes._dataTable.getDataSource().sendRequest(
-        YAHOO.lang.JSON.stringify(json_object), 
+        YAHOO.lang.JSON.stringify(json_object),
         {
           success: dupes._onDupeResults,
           failure: dupes._onDupeResults,
           scope: dupes._dataTable,
-          argument: dupes._dataTable.getState() 
+          argument: dupes._dataTable.getState()
         }
       );
 
@@ -856,12 +856,12 @@ var bugForm = {
   },
 
   validate: function() {
-    
+
     // check mandatory fields
 
     var missing = bugForm._mandatoryMissing();
     if (missing.length) {
-      var message = 'The following field' + 
+      var message = 'The following field' +
         (missing.length == 1 ? ' is' : 's are') + ' required:\n\n';
       for (var i = 0, n = missing.length; i < n; i++ ) {
         var id = missing[i];
@@ -888,9 +888,9 @@ var bugForm = {
       if (!el.id)
         el.id = help_id + '_parent';
       el.panel = new YAHOO.widget.Panel(
-        help_id, 
-        { 
-          width: "320px", 
+        help_id,
+        {
+          width: "320px",
           visible: false,
           close: false,
           context: [el.id, 'tl', 'tr', null, [5, 0]]
diff --git a/extensions/GuidedBugEntry/web/style/guided.css b/extensions/GuidedBugEntry/web/style/guided.css
index 55550933f..f06715eab 100644
--- a/extensions/GuidedBugEntry/web/style/guided.css
+++ b/extensions/GuidedBugEntry/web/style/guided.css
@@ -81,6 +81,14 @@
     text-align: right;
 }
 
+.exit_text, .exit_text_last {
+    width: 100%;
+}
+
+.exit_text {
+    border-bottom: 1px dotted silver;
+}
+
 #prod_comp_search_main {
     width: 400px;
 }