# HG changeset patch
# User Daniel Dourvaris <daniel@rhodecode.com>
# Date 2018-10-17 04:57:18
# Node ID 62991ed2f9154988177d1edacef21d0d4fbb2b16
# Parent  814ba1c1370cfcc507f00d34d2aed2e412672c4e

diffs: update all sticky elements on dom changes to handle cases like:

- collapsed diffs
- comments
- collapsed large diffs

diff --git a/rhodecode/public/js/src/rhodecode/comments.js b/rhodecode/public/js/src/rhodecode/comments.js
--- a/rhodecode/public/js/src/rhodecode/comments.js
+++ b/rhodecode/public/js/src/rhodecode/comments.js
@@ -775,10 +775,10 @@ var CommentsController = function() {
               linkifyComments($('.inline-comment-injected'));
               timeagoActivate();
 
-              if (window.Waypoint !== undefined) {
+              if (window.updateSticky !== undefined) {
                   // potentially our comments change the active window size, so we
-                  // notify waypint to re-paint
-                  Waypoint.refreshAll()
+                  // notify sticky elements
+                  updateSticky()
               }
 
               commentForm.setActionButtonsDisabled(false);
diff --git a/rhodecode/templates/codeblocks/diffs.mako b/rhodecode/templates/codeblocks/diffs.mako
--- a/rhodecode/templates/codeblocks/diffs.mako
+++ b/rhodecode/templates/codeblocks/diffs.mako
@@ -157,7 +157,7 @@ collapse_all = len(diffset.files) > coll
         ## anchor with support of sticky header
         <div class="anchor" id="a_${h.FID(filediff.raw_id, filediff.patch['filename'])}"></div>
 
-        <input ${(collapse_all and 'checked' or '')} class="filediff-collapse-state" id="filediff-collapse-${id(filediff)}" type="checkbox" onchange="Waypoint.refreshAll();">
+        <input ${(collapse_all and 'checked' or '')} class="filediff-collapse-state" id="filediff-collapse-${id(filediff)}" type="checkbox" onchange="updateSticky();">
         <div
             class="filediff"
             data-f-path="${filediff.patch['filename']}"
@@ -189,10 +189,10 @@ collapse_all = len(diffset.files) > coll
                         <td class="cb-text" ${(c.user_session_attrs["diffmode"] == 'unified' and 'colspan=4' or 'colspan=6')}>
                             ${_('This diff has been collapsed as it changes many lines, (%i lines changed)' % lines_changed)}
                             <a href="#" class="cb-expand"
-                               onclick="$(this).closest('table').removeClass('cb-collapsed'); return false;">${_('Show them')}
+                               onclick="$(this).closest('table').removeClass('cb-collapsed'); updateSticky(); return false;">${_('Show them')}
                             </a>
                             <a href="#" class="cb-collapse"
-                               onclick="$(this).closest('table').addClass('cb-collapsed'); return false;">${_('Hide them')}
+                               onclick="$(this).closest('table').addClass('cb-collapsed'); updateSticky(); return false;">${_('Hide them')}
                             </a>
                         </td>
                     </tr>
@@ -292,7 +292,7 @@ collapse_all = len(diffset.files) > coll
                 display_state = ''
         %>
         <div class="filediffs filediff-outdated" style="${display_state}">
-            <input ${(collapse_all and 'checked' or '')} class="filediff-collapse-state" id="filediff-collapse-${id(filename)}" type="checkbox" onchange="Waypoint.refreshAll();">
+            <input ${(collapse_all and 'checked' or '')} class="filediff-collapse-state" id="filediff-collapse-${id(filename)}" type="checkbox" onchange="updateSticky();">
             <div class="filediff" data-f-path="${filename}"  id="a_${h.FID(filediff.raw_id, filename)}">
                 <label for="filediff-collapse-${id(filename)}" class="filediff-heading">
                     <div class="filediff-collapse-indicator"></div>
@@ -778,11 +778,11 @@ def get_comments_for(diff_type, comments
               <a
                   class="btn"
                   href="#"
-                  onclick="$('input[class=filediff-collapse-state]').prop('checked', false); Waypoint.refreshAll(); return false">${_('Expand All Files')}</a>
+                  onclick="$('input[class=filediff-collapse-state]').prop('checked', false); updateSticky(); return false">${_('Expand All Files')}</a>
               <a
                   class="btn"
                   href="#"
-                  onclick="$('input[class=filediff-collapse-state]').prop('checked', true); Waypoint.refreshAll(); return false">${_('Collapse All Files')}</a>
+                  onclick="$('input[class=filediff-collapse-state]').prop('checked', true); updateSticky(); return false">${_('Collapse All Files')}</a>
               <a
                   class="btn"
                   href="#"
@@ -900,7 +900,7 @@ def get_comments_for(diff_type, comments
                 window.location.hash = idSelector;
                 // expand the container if we quick-select the field
                 $(idSelector).next().prop('checked', false);
-                Waypoint.refreshAll()
+                updateSticky()
             });
 
             var contextPrefix = _gettext('Context file: ');
@@ -917,7 +917,8 @@ def get_comments_for(diff_type, comments
             });
 
             updateSticky = function () {
-                sidebar.updateSticky()
+                sidebar.updateSticky();
+                Waypoint.refreshAll();
             };
 
             var animateText =  $.debounce(100, function(fPath, anchorId) {