fixes scrollbar jump by making discussion the same size as the sidebar when sidebar is bigger, and not allowing affix to do fixed position on the sidebarissue-page-keeps-jumping-up

4 files changed, 40 insertions, 12 deletions

diff --git a/app/assets/javascripts/issuable_context.js.coffee b/app/assets/javascripts/issuable_context.js.coffee
index bcc3e52bf9b..02232698bc2 100644
--- a/app/assets/javascripts/issuable_context.js.coffee
+++ b/app/assets/javascripts/issuable_context.js.coffee
@@ -15,16 +15,7 @@ class @IssuableContext
         $(@).width($(@).outerWidth())
       .on 'affixed-top.bs.affix affixed-bottom.bs.affix', ->
         $(@).width('')
-      $discussion = $('.issuable-discussion')
-      $sidebar = $('.issuable-sidebar')
-      discussionHeight = $discussion.height()
-      sidebarHeight = $sidebar.height()
-      console.log(sidebarHeight,discussionHeight)
-      if sidebarHeight > discussionHeight
-        $discussion.height(sidebarHeight + 50)
-        console.log('fixing issues')
-        return
-      # No affix if discussion is smaller than sidebar
+
       $('.issuable-affix').affix offset:
         top: ->
           @top = ($('.issuable-affix').offset().top - 70)
diff --git a/app/assets/javascripts/issue.js.coffee b/app/assets/javascripts/issue.js.coffee
index 2297061a605..cbc70cd846c 100644
--- a/app/assets/javascripts/issue.js.coffee
+++ b/app/assets/javascripts/issue.js.coffee
@@ -6,10 +6,25 @@ class @Issue
   constructor: ->
     # Prevent duplicate event bindings
     @disableTaskList()
+    @fixAffixScroll()
     if $('a.btn-close').length
       @initTaskList()
       @initIssueBtnEventListeners()
 
+  fixAffixScroll: ->
+    fixAffix = ->
+      $discussion = $('.issuable-discussion')
+      $sidebar = $('.issuable-sidebar')
+      if $sidebar.hasClass('no-affix')
+        $sidebar.removeClass(['affix-top','affix'])
+      discussionHeight = $discussion.height()
+      sidebarHeight = $sidebar.height()
+      if sidebarHeight > discussionHeight
+        $discussion.height(sidebarHeight + 50)
+        $sidebar.addClass('no-affix')
+    $(window).on('resize', fixAffix)
+    fixAffix()
+
   initTaskList: ->
     $('.detail-page-description .js-task-list-container').taskList('enable')
     $(document).on 'tasklist:changed', '.detail-page-description .js-task-list-container', @updateTaskList
diff --git a/app/assets/javascripts/merge_request.js.coffee b/app/assets/javascripts/merge_request.js.coffee
index d4fd4ed6003..239f3d6afae 100644
--- a/app/assets/javascripts/merge_request.js.coffee
+++ b/app/assets/javascripts/merge_request.js.coffee
@@ -15,6 +15,8 @@ class @MergeRequest
     this.$('.show-all-commits').on 'click', =>
       this.showAllCommits()
 
+    @fixAffixScroll();
+
     @initTabs()
 
     # Prevent duplicate event bindings
@@ -28,6 +30,20 @@ class @MergeRequest
   $: (selector) ->
     this.$el.find(selector)
 
+  fixAffixScroll: ->
+    fixAffix = ->
+      $discussion = $('.issuable-discussion')
+      $sidebar = $('.issuable-sidebar')
+      if $sidebar.hasClass('no-affix')
+        $sidebar.removeClass(['affix-top','affix'])
+      discussionHeight = $discussion.height()
+      sidebarHeight = $sidebar.height()
+      if sidebarHeight > discussionHeight
+        $discussion.height(sidebarHeight + 50)
+        $sidebar.addClass('no-affix')
+    $(window).on('resize', fixAffix)
+    fixAffix()
+
   initTabs: ->
     if @opts.action != 'new'
       # `MergeRequests#new` has no tab-persisting or lazy-loading behavior
@@ -50,10 +66,11 @@ class @MergeRequest
       $this = $(this)
       if $this.data('submitted')
         return
+      e.preventDefault()
+      e.stopImmediatePropagation()
       shouldSubmit = $this.hasClass('btn-comment')
+      console.log("shouldSubmit")
       if shouldSubmit
-        e.preventDefault()
-        e.stopImmediatePropagation()
         _this.submitNoteForm($this.closest('form'),$this)
 
   submitNoteForm: (form, $button) =>
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index d4b44004f4f..c3c33f0b76a 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -20,6 +20,11 @@
       position: fixed;
       top: 70px;
       margin-right: 35px;
+
+      &.no-affix {
+        position: relative;
+        top: 0;
+      }
     }
   }
 }