diff --git a/app/assets/javascripts/app/controllers/ticket_zoom.js.coffee b/app/assets/javascripts/app/controllers/ticket_zoom.js.coffee index d9717a42c..7c5475530 100644 --- a/app/assets/javascripts/app/controllers/ticket_zoom.js.coffee +++ b/app/assets/javascripts/app/controllers/ticket_zoom.js.coffee @@ -40,6 +40,9 @@ class App.TicketZoom extends App.Controller @delay( update, 1800, 'ticket-zoom-' + @ticket_id ) ) + @bind "task:hide", @onHide + @bind "task:show", @onShow + meta: => meta = url: @url() @@ -69,6 +72,7 @@ class App.TicketZoom extends App.Controller release: => # nothing @autosaveStop() + @scrollHeader.destroy() if @scrollHeader fetch: (ticket_id, force) -> @@ -385,23 +389,31 @@ class App.TicketZoom extends App.Controller @userPopups() @autosaveStart() + + @scrollToBottom() @bindScrollPageHeader() - @scrollToBottom() - - scrollToBottom: -> + scrollToBottom: => @main.scrollTop( @main.prop('scrollHeight') ) bindScrollPageHeader: -> pageHeader = @$('.page-header') - scrollHolder = pageHeader.scrollParent() - scrollBody = scrollHolder.get(0).scrollHeight - scrollHolder.height() + scrollBody = @main.prop('scrollHeight') - @main.height() if scrollBody > pageHeader.height() - skrollr.init + # TODO: recalculate the distance when adding a comment + @scrollHeader = skrollr.init forceHeight: false - holder: scrollHolder.get(0) + holder: @main.get(0) + + onShow: => + if @scrollHeader + @scrollHeader.continue() + + onHide: => + if @scrollHeader + @scrollHeader.pause() autosaveStop: => @autosaveLast = {} diff --git a/app/assets/javascripts/app/lib/animations/skrollr.js b/app/assets/javascripts/app/lib/animations/skrollr.js index 0dfe0280c..47d5cbc2a 100644 --- a/app/assets/javascripts/app/lib/animations/skrollr.js +++ b/app/assets/javascripts/app/lib/animations/skrollr.js @@ -7,6 +7,7 @@ * * Free to use under terms of MIT license */ +window.id = 0; (function(window, document, undefined) { 'use strict'; @@ -19,7 +20,7 @@ }, //Main entry point. init: function(options) { - return _instance || new Skrollr(options); + new Skrollr(options); }, VERSION: '0.6.26' }; @@ -232,6 +233,8 @@ _instance = this; + this.id = window.id++; + options = options || {}; _constants = options.constants || {}; @@ -308,17 +311,30 @@ } }); - var requestAnimFrame = polyfillRAF(); - //Let's go. - (function animloop(){ - _render(); - _animFrame = requestAnimFrame(animloop); - }()); + this.animloop(); return _instance; } + Skrollr.prototype.animloop = function() { + var requestAnimFrame = polyfillRAF(); + _render(); + // console.log("rendering", this.id); + if(!this.paused) + _animFrame = requestAnimFrame(_instance.animloop.bind(this)); + } + + Skrollr.prototype.pause = function() { + cancelAnimFrame(_animFrame); + this.paused = true; + } + + Skrollr.prototype.continue = function() { + this.paused = false; + this.animloop(); + } + /** * (Re)parses some or all elements. */ @@ -616,7 +632,7 @@ if(_isMobile) { _mobileOffset = Math.min(Math.max(top, 0), _maxKeyFrame); } else { - window.scrollTo(0, top); + documentElement.scrollTop = top; } return _instance;