adjust controls bar width to not overlay scrollbar
This commit is contained in:
parent
fb8994603b
commit
d728b85fdd
|
@ -635,6 +635,8 @@
|
||||||
* @param filesArray array of file data (map)
|
* @param filesArray array of file data (map)
|
||||||
*/
|
*/
|
||||||
setFiles: function(filesArray) {
|
setFiles: function(filesArray) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
// detach to make adding multiple rows faster
|
// detach to make adding multiple rows faster
|
||||||
this.files = filesArray;
|
this.files = filesArray;
|
||||||
|
|
||||||
|
@ -655,7 +657,10 @@
|
||||||
this.updateSelectionSummary();
|
this.updateSelectionSummary();
|
||||||
$(window).scrollTop(0);
|
$(window).scrollTop(0);
|
||||||
|
|
||||||
this.$fileList.trigger(jQuery.Event("updated"));
|
this.$fileList.trigger(jQuery.Event('updated'));
|
||||||
|
_.defer(function() {
|
||||||
|
self.$el.closest('#app-content').trigger(jQuery.Event('apprendered'));
|
||||||
|
});
|
||||||
},
|
},
|
||||||
/**
|
/**
|
||||||
* Creates a new table row element using the given file data.
|
* Creates a new table row element using the given file data.
|
||||||
|
|
|
@ -1261,6 +1261,32 @@ function initCore() {
|
||||||
// initial call
|
// initial call
|
||||||
toggleSnapperOnSize();
|
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);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -1685,3 +1711,29 @@ jQuery.fn.selectRange = function(start, end) {
|
||||||
jQuery.fn.exists = function(){
|
jQuery.fn.exists = function(){
|
||||||
return this.length > 0;
|
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);
|
||||||
|
};
|
||||||
|
|
Loading…
Reference in New Issue