diff options
author | Jan-Christoph Borchardt <hey@jancborchardt.net> | 2015-03-27 03:34:55 +0300 |
---|---|---|
committer | Morris Jobke <hey@morrisjobke.de> | 2015-06-04 15:31:31 +0300 |
commit | eeace88beb588a902c17462dc5ac857c2ec3b629 (patch) | |
tree | af718d9c1971f7d77f66df46a3c6950e21a2a869 /core | |
parent | 5fcab24e592c5f0f35d3293449dbd2f15a40f5f8 (diff) |
adjust controls bar width to not overlay scrollbar
Diffstat (limited to 'core')
-rw-r--r-- | core/js/js.js | 52 |
1 files changed, 52 insertions, 0 deletions
diff --git a/core/js/js.js b/core/js/js.js index 78342ce97bd..410d5156842 100644 --- a/core/js/js.js +++ b/core/js/js.js @@ -1191,6 +1191,32 @@ function initCore() { // initial call toggleSnapperOnSize(); + // adjust controls bar width + var adjustControlsWidth = function() { + if($('#controls').length) { + // if there is a scrollbar … + if($('#app-content').get(0).scrollHeight > $('#app-content').height()) { + if($(window).width() > 768) { + var controlsWidth = $('#content').width() - $('#app-navigation').width() - getScrollBarWidth(); + } else { + var controlsWidth = $('#content').width() - getScrollBarWidth(); + } + } else { // if there is none + if($(window).width() > 768) { + var controlsWidth = $('#content').width() - $('#app-navigation').width(); + } else { + var controlsWidth = $('#content').width(); + } + } + $('#controls').css('width', controlsWidth); + $('#controls').css('min-width', controlsWidth); + } + }; + + $(window).resize(_.debounce(adjustControlsWidth, 250)); + + $('body').delegate('#app-content', 'apprendered', adjustControlsWidth); + } } @@ -1615,3 +1641,29 @@ jQuery.fn.selectRange = function(start, end) { jQuery.fn.exists = function(){ return this.length > 0; }; + +function getScrollBarWidth() { + var inner = document.createElement('p'); + inner.style.width = "100%"; + inner.style.height = "200px"; + + var outer = document.createElement('div'); + outer.style.position = "absolute"; + outer.style.top = "0px"; + outer.style.left = "0px"; + outer.style.visibility = "hidden"; + outer.style.width = "200px"; + outer.style.height = "150px"; + outer.style.overflow = "hidden"; + outer.appendChild (inner); + + document.body.appendChild (outer); + var w1 = inner.offsetWidth; + outer.style.overflow = 'scroll'; + var w2 = inner.offsetWidth; + if (w1 == w2) w2 = outer.clientWidth; + + document.body.removeChild (outer); + + return (w1 - w2); +}; |