Bug 1173398: reduce the number of visible buttons at the top right of the page

3 files changed, 78 insertions, 49 deletions

diff --git a/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl b/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
index c40926566..1f4ed2471 100644
--- a/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
+++ b/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
@@ -241,12 +241,6 @@
       </div>
     [% END %]
     <div class="button-row">
-      [% IF user.id %]
-        <button type="button" class="comment-btn minor">Add Comment</button>
-      [% END %]
-      <button type="button" id="last-comment-btn" class="minor">Last Comment &darr;</button>
-    </div>
-    <div class="button-row">
       [% IF bug.assigned_to.id == user.id || user.in_group("editbugs") %]
         <button type="button" id="copy-summary" class="minor"
           title="Copy [% terms.bug %] number and summary to your clipboard">Copy Summary</button>
@@ -256,7 +250,18 @@
           [% is_cced ? "Stop Following" : "Follow" %]
         </button>
       [% END %]
-      <button type="button" id="expand-all-btn" class="minor">Expand All</button>
+      <button type="button" id="action-menu-btn" class="minor">&#9662;</button>
+      <menu id="action-menu" type="context" style="display:none">
+        <menuitem id="action-reset" label="Reset Sections"></menuitem>
+        <menuitem id="action-expand-all" label="Expand All Sections"></menuitem>
+        <menuitem id="action-collapse-all" label="Collapse All Sections"></menuitem>
+        <hr>
+        [% IF user.id %]
+          <menuitem id="action-add-comment" label="Add Comment"></menuitem>
+        [% END %]
+        <menuitem id="action-last-comment" label="Last Comment"></menuitem>
+      </menu>
+
     </div>
   </div>
 [% END %]
diff --git a/extensions/BugModal/web/bug_modal.css b/extensions/BugModal/web/bug_modal.css
index 5b3bc4a90..4bcb05a1a 100644
--- a/extensions/BugModal/web/bug_modal.css
+++ b/extensions/BugModal/web/bug_modal.css
@@ -729,6 +729,7 @@ td.flag-requestee {
 
 #mode-container .button-row {
     margin-top: 1px;
+    border-left: 5px solid white;
 }
 
 /* theme */
diff --git a/extensions/BugModal/web/bug_modal.js b/extensions/BugModal/web/bug_modal.js
index 3d565e74f..a0f83803f 100644
--- a/extensions/BugModal/web/bug_modal.js
+++ b/extensions/BugModal/web/bug_modal.js
@@ -65,30 +65,6 @@ $(function() {
         $('#editing').val('');
     }
 
-    // expand all modules
-    $('#expand-all-btn')
-        .click(function(event) {
-            event.preventDefault();
-            var btn = $(event.target);
-            var modules;
-            if (btn.data('expanded-modules')) {
-                modules = btn.data('expanded-modules');
-                btn.data('expanded-modules', false);
-                modules.each(function() {
-                    slide_module($(this).parent('.module'));
-                });
-                btn.text('Expand All');
-            }
-            else {
-                modules = $('.module-content:hidden');
-                btn.data('expanded-modules', modules);
-                modules.each(function() {
-                    slide_module($(this).parent('.module'));
-                });
-                btn.text('Collapse');
-            }
-        });
-
     // expand/colapse module
     $('.module-header')
         .click(function(event) {
@@ -119,15 +95,6 @@ $(function() {
             }
         });
 
-    // last comment btn
-    $('#last-comment-btn')
-        .click(function(event) {
-            event.preventDefault();
-            var id = $('.comment:last')[0].parentNode.id;
-            $.scrollTo($('#' + id));
-            window.location.hash = id;
-        });
-
     // top btn
     $('#top-btn')
         .click(function(event) {
@@ -241,6 +208,71 @@ $(function() {
             }
         });
 
+    // action button menu
+
+    $.contextMenu({
+        selector: '#action-menu-btn',
+        trigger: 'left',
+        items: $.contextMenu.fromMenu($('#action-menu'))
+    });
+
+    // reset
+    $('#action-reset')
+        .click(function(event) {
+            event.preventDefault();
+            var visible = $(this).data('modules');
+            $('.module-content').each(function() {
+                var content = $(this);
+                var moduleID = content.parent('.module').attr('id');
+                var isDefault = $.inArray(moduleID, visible) !== -1;
+                if (content.is(':visible') && !isDefault) {
+                    slide_module($('#' + moduleID), 'hide');
+                }
+                else if (content.is(':hidden') && isDefault) {
+                    slide_module($('#' + moduleID), 'show');
+                }
+            });
+        })
+        .data('modules', $('.module-content:visible').map(function() {
+            return $(this).parent('.module').attr('id');
+        }));
+
+    // expand all modules
+    $('#action-expand-all')
+        .click(function(event) {
+            event.preventDefault();
+            $('.module-content:hidden').each(function() {
+                slide_module($(this).parent('.module'));
+            });
+        });
+
+    // collapse all modules
+    $('#action-collapse-all')
+        .click(function(event) {
+            event.preventDefault();
+            $('.module-content:visible').each(function() {
+                slide_module($(this).parent('.module'));
+            });
+        });
+
+    // add comment menuitem, scroll the textarea into view
+    $('#action-add-comment')
+        .click(function(event) {
+            event.preventDefault();
+            // focus first to grow the textarea, so we scroll to the correct location
+            $('#comment').focus();
+            $.scrollTo($('#bottom-save-btn'));
+        });
+
+    // last comment menuitem
+    $('#action-last-comment')
+        .click(function(event) {
+            event.preventDefault();
+            var id = $('.comment:last')[0].parentNode.id;
+            $.scrollTo($('#' + id));
+            window.location.hash = id;
+        });
+
     //
     // anything after this point is only executed for logged in users
     //
@@ -464,15 +496,6 @@ $(function() {
             window.location.replace($('#this-bug').val());
         });
 
-    // top comment button, scroll the textarea into view
-    $('.comment-btn')
-        .click(function(event) {
-            event.preventDefault();
-            // focus first to grow the textarea, so we scroll to the correct location
-            $('#comment').focus();
-            $.scrollTo($('#bottom-save-btn'));
-        });
-
     // needinfo in people section -> scroll to near-comment ui
     $('#needinfo-scroll')
         .click(function(event) {