Bug 1146761 - clicking on a date/flag/etc should scroll to the corresponding change

2 files changed, 40 insertions, 19 deletions

diff --git a/extensions/BugModal/web/bug_modal.css b/extensions/BugModal/web/bug_modal.css
index ff804e4db..696c5e192 100644
--- a/extensions/BugModal/web/bug_modal.css
+++ b/extensions/BugModal/web/bug_modal.css
@@ -88,6 +88,10 @@ select[multiple], .text_input, .yui-ac-input, input {
     box-shadow: 0 0 2px 2px #f88;
 }
 
+a.activity-ref {
+    color: #000;
+}
+
 /* modules */
 
 .module {
diff --git a/extensions/BugModal/web/bug_modal.js b/extensions/BugModal/web/bug_modal.js
index 89b73c3b5..a72319c72 100644
--- a/extensions/BugModal/web/bug_modal.js
+++ b/extensions/BugModal/web/bug_modal.js
@@ -319,16 +319,22 @@ $(function() {
         .click(function(event) {
             event.preventDefault();
             var id = $('.comment:last')[0].parentNode.id;
-            $.scrollTo($('#' + id));
-            window.location.hash = id;
+            $.scrollTo(id);
         });
 
+    // use scrollTo for in-page activity links
+    $('.activity-ref')
+        .click(function(event) {
+            event.preventDefault();
+            $.scrollTo($(this).attr('href').substr(1));
+        });
+
+    if (BUGZILLA.user.id === 0) return;
+
     //
     // anything after this point is only executed for logged in users
     //
 
-    if (BUGZILLA.user.id === 0) return;
-
     // dirty field tracking
     $('#changeform select').each(function() {
         var that = $(this);
@@ -1256,22 +1262,33 @@ function lb_close(event) {
             return -1;
         },
 
-        // Animated scroll to bring an element into view
-        scrollTo: function(el, complete) {
-            var offset = el.offset();
-            $('html, body')
-                .animate({
-                        scrollTop: offset.top - 20,
-                        scrollLeft: offset.left = 20
-                    },
-                    200,
-                    complete
-                );
+        // Bring an element into view, leaving space for the outline.
+        // If passed a string, it will be treated as an id - the page will scroll
+        // unanimated and the url will be added to the browser's history.
+        // If passed an element, an smooth scroll will take place and no entry
+        // will be added to the history.
+        scrollTo: function(target, complete) {
+            if (typeof target === 'string') {
+                var el = $('#' + target);
+                window.location.hash = target;
+                var $html = $('html');
+                if (Math.abs($html.scrollTop() - el.offset().top) <= 1) {
+                    $html.scrollTop($html.scrollTop() - 10);
+                }
+                $html.scrollLeft(0);
+            }
+            else {
+                var offset = target.offset();
+                $('html')
+                    .animate({
+                            scrollTop: offset.top - 20,
+                            scrollLeft: 0
+                        },
+                        200,
+                        complete
+                    );
+            }
         }
 
     });
 })(jQuery);
-
-// no-ops
-function initHidingOptionsForIE() {}
-function showFieldWhen() {}