fixing breadcrumbs on ajax loading of files
This commit is contained in:
Thomas Müller
Vincent Petry
parent
ef955bae56
commit
4e751cbb47
|
|
@ -218,8 +218,10 @@ var FileList={
|
|||
if(typeof(result.data.breadcrumb) != 'undefined'){
|
||||
$controls.find('.crumb').remove();
|
||||
$controls.prepend(result.data.breadcrumb);
|
||||
// TODO: might need refactor breadcrumb code into a new file
|
||||
//resizeBreadcrumbs(true);
|
||||
|
||||
var width = $(window).width();
|
||||
Files.initBreadCrumbs();
|
||||
Files.resizeBreadcrumbs(width, true);
|
||||
|
||||
// in case svg is not supported by the browser we need to execute the fallback mechanism
|
||||
if(!SVGSupport()) {
|
||||
|
|
|
|||
|
|
@ -111,6 +111,72 @@ Files={
|
|||
$(e).droppable(folderDropOptions);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
lastWidth: 0,
|
||||
|
||||
initBreadCrumbs: function () {
|
||||
Files.lastWidth = 0;
|
||||
Files.breadcrumbs = [];
|
||||
|
||||
// initialize with some extra space
|
||||
Files.breadcrumbsWidth = 64;
|
||||
if ( document.getElementById("navigation") ) {
|
||||
Files.breadcrumbsWidth += $('#navigation').get(0).offsetWidth;
|
||||
}
|
||||
Files.hiddenBreadcrumbs = 0;
|
||||
|
||||
$.each($('.crumb'), function(index, breadcrumb) {
|
||||
Files.breadcrumbs[index] = breadcrumb;
|
||||
Files.breadcrumbsWidth += $(breadcrumb).get(0).offsetWidth;
|
||||
});
|
||||
|
||||
|
||||
$.each($('#controls .actions>div'), function(index, action) {
|
||||
Files.breadcrumbsWidth += $(action).get(0).offsetWidth;
|
||||
});
|
||||
},
|
||||
|
||||
resizeBreadcrumbs: function (width, firstRun) {
|
||||
if (width != Files.lastWidth) {
|
||||
if ((width < Files.lastWidth || firstRun) && width < Files.breadcrumbsWidth) {
|
||||
if (Files.hiddenBreadcrumbs == 0) {
|
||||
Files.breadcrumbsWidth -= $(Files.breadcrumbs[1]).get(0).offsetWidth;
|
||||
$(Files.breadcrumbs[1]).find('a').hide();
|
||||
$(Files.breadcrumbs[1]).append('<span>...</span>');
|
||||
Files.breadcrumbsWidth += $(Files.breadcrumbs[1]).get(0).offsetWidth;
|
||||
Files.hiddenBreadcrumbs = 2;
|
||||
}
|
||||
var i = Files.hiddenBreadcrumbs;
|
||||
while (width < Files.breadcrumbsWidth && i > 1 && i < Files.breadcrumbs.length - 1) {
|
||||
Files.breadcrumbsWidth -= $(Files.breadcrumbs[i]).get(0).offsetWidth;
|
||||
$(Files.breadcrumbs[i]).hide();
|
||||
Files.hiddenBreadcrumbs = i;
|
||||
i++
|
||||
}
|
||||
} else if (width > Files.lastWidth && Files.hiddenBreadcrumbs > 0) {
|
||||
var i = Files.hiddenBreadcrumbs;
|
||||
while (width > Files.breadcrumbsWidth && i > 0) {
|
||||
if (Files.hiddenBreadcrumbs == 1) {
|
||||
Files.breadcrumbsWidth -= $(Files.breadcrumbs[1]).get(0).offsetWidth;
|
||||
$(Files.breadcrumbs[1]).find('span').remove();
|
||||
$(Files.breadcrumbs[1]).find('a').show();
|
||||
Files.breadcrumbsWidth += $(Files.breadcrumbs[1]).get(0).offsetWidth;
|
||||
} else {
|
||||
$(Files.breadcrumbs[i]).show();
|
||||
Files.breadcrumbsWidth += $(Files.breadcrumbs[i]).get(0).offsetWidth;
|
||||
if (Files.breadcrumbsWidth > width) {
|
||||
Files.breadcrumbsWidth -= $(Files.breadcrumbs[i]).get(0).offsetWidth;
|
||||
$(Files.breadcrumbs[i]).hide();
|
||||
break;
|
||||
}
|
||||
}
|
||||
i--;
|
||||
Files.hiddenBreadcrumbs = i;
|
||||
}
|
||||
}
|
||||
Files.lastWidth = width;
|
||||
}
|
||||
}
|
||||
};
|
||||
$(document).ready(function() {
|
||||
|
|
@ -273,72 +339,15 @@ $(document).ready(function() {
|
|||
//do a background scan if needed
|
||||
scanFiles();
|
||||
|
||||
var lastWidth = 0;
|
||||
var breadcrumbs = [];
|
||||
var breadcrumbsWidth = 0;
|
||||
if ( document.getElementById("navigation") ) {
|
||||
breadcrumbsWidth = $('#navigation').get(0).offsetWidth;
|
||||
}
|
||||
var hiddenBreadcrumbs = 0;
|
||||
|
||||
$.each($('.crumb'), function(index, breadcrumb) {
|
||||
breadcrumbs[index] = breadcrumb;
|
||||
breadcrumbsWidth += $(breadcrumb).get(0).offsetWidth;
|
||||
});
|
||||
|
||||
|
||||
$.each($('#controls .actions>div'), function(index, action) {
|
||||
breadcrumbsWidth += $(action).get(0).offsetWidth;
|
||||
});
|
||||
|
||||
function resizeBreadcrumbs(firstRun) {
|
||||
var width = $(this).width();
|
||||
if (width != lastWidth) {
|
||||
if ((width < lastWidth || firstRun) && width < breadcrumbsWidth) {
|
||||
if (hiddenBreadcrumbs == 0) {
|
||||
breadcrumbsWidth -= $(breadcrumbs[1]).get(0).offsetWidth;
|
||||
$(breadcrumbs[1]).find('a').hide();
|
||||
$(breadcrumbs[1]).append('<span>...</span>');
|
||||
breadcrumbsWidth += $(breadcrumbs[1]).get(0).offsetWidth;
|
||||
hiddenBreadcrumbs = 2;
|
||||
}
|
||||
var i = hiddenBreadcrumbs;
|
||||
while (width < breadcrumbsWidth && i > 1 && i < breadcrumbs.length - 1) {
|
||||
breadcrumbsWidth -= $(breadcrumbs[i]).get(0).offsetWidth;
|
||||
$(breadcrumbs[i]).hide();
|
||||
hiddenBreadcrumbs = i;
|
||||
i++
|
||||
}
|
||||
} else if (width > lastWidth && hiddenBreadcrumbs > 0) {
|
||||
var i = hiddenBreadcrumbs;
|
||||
while (width > breadcrumbsWidth && i > 0) {
|
||||
if (hiddenBreadcrumbs == 1) {
|
||||
breadcrumbsWidth -= $(breadcrumbs[1]).get(0).offsetWidth;
|
||||
$(breadcrumbs[1]).find('span').remove();
|
||||
$(breadcrumbs[1]).find('a').show();
|
||||
breadcrumbsWidth += $(breadcrumbs[1]).get(0).offsetWidth;
|
||||
} else {
|
||||
$(breadcrumbs[i]).show();
|
||||
breadcrumbsWidth += $(breadcrumbs[i]).get(0).offsetWidth;
|
||||
if (breadcrumbsWidth > width) {
|
||||
breadcrumbsWidth -= $(breadcrumbs[i]).get(0).offsetWidth;
|
||||
$(breadcrumbs[i]).hide();
|
||||
break;
|
||||
}
|
||||
}
|
||||
i--;
|
||||
hiddenBreadcrumbs = i;
|
||||
}
|
||||
}
|
||||
lastWidth = width;
|
||||
}
|
||||
}
|
||||
Files.initBreadCrumbs();
|
||||
|
||||
$(window).resize(function() {
|
||||
resizeBreadcrumbs(false);
|
||||
var width = $(this).width();
|
||||
Files.resizeBreadcrumbs(width, false);
|
||||
});
|
||||
|
||||
resizeBreadcrumbs(true);
|
||||
var width = $(this).width();
|
||||
Files.resizeBreadcrumbs(width, true);
|
||||
|
||||
// event handlers for breadcrumb items
|
||||
$('#controls').delegate('.crumb a', 'click', onClickBreadcrumb);
|
||||
|
|
|
|||
|
|
@ -38,7 +38,9 @@
|
|||
</form>
|
||||
</div>
|
||||
<?php if ($_['trash'] ): ?>
|
||||
<input id="trash" type="button" value="<?php p($l->t('Deleted files'));?>" class="button" <?php $_['trashEmpty'] ? p('disabled') : '' ?>></input>
|
||||
<div id="trash" class="button" <?php $_['trashEmpty'] ? p('disabled') : '' ?>>
|
||||
<a><?php p($l->t('Deleted files'));?></a>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<div id="uploadprogresswrapper">
|
||||
<div id="uploadprogressbar"></div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue