some work on the breadcrumb navigation for files

This commit is contained in:
Robin Appelman 2011-07-22 16:52:35 +02:00
parent d6bf5cd251
commit ceb711dff4
4 changed files with 38 additions and 4 deletions

View File

@ -206,7 +206,7 @@ div.controls { width:100%; margin:0px; background-color:#f7f7f7; border-bottom:1
form.searchbox { display:inline; position:fixed; top:1em; right:10em; margin:0; padding:0; }
/* NAVIGATION ------------------------------------------------------------- */
#plugins { position:fixed; top:3.5em; float:left; width:15.7em; padding:0; }
#plugins { position:fixed; top:3.5em; float:left; width:15.7em; padding:0; z-index:100; }
#plugins ul { list-style-type:none; border-top:1px solid #ccc; }
#plugins a { display:block; padding:0.5em 0.5em 0.5em 3em; background-position:1.5em center; background-repeat:no-repeat; border-bottom:1px solid #ddd; border-top:1px solid #fff; text-decoration:none; font-size:1.2em; color:#666; }
#plugins a.active, #plugins a:hover, #plugins a:focus, #plugins a.selected { background-color:#ccc; border-top:1px solid #ccc; border-bottom:1px solid #ccc; color:#000; outline:0; }
@ -219,7 +219,7 @@ form.searchbox { display:inline; position:fixed; top:1em; right:10em; margin:0;
/* NAVIGATION BAR */
span.nav { padding:1em 0 0 2em; }
span.nav { display:block; float:left; /*margin-right:55em;*/ }
span.nav a { padding:0.5em 1.5em 0.5em 0.5em; background-position:right center; background-repeat:no-repeat; background-image:url('../img/arrow.png'); text-decoration:none; }
span.nav a img { height:16px; vertical-align:text-top; }

Binary file not shown.

After

Width:  |  Height:  |  Size: 495 B

View File

@ -115,10 +115,13 @@ span.extention{
div.crumb{
float:left;
display:block;
background-repeat:no-repeat;
background-position:right 0px;
font-size:20px;
padding:8px;
padding-top:8px;
padding-left:8px;
height:28px; /*36-8*/
}
table tr.mouseOver td { background-color:#eee; }
@ -158,4 +161,13 @@ table td.delete { background-image:url('../img/delete.png'); }
float:right;
display:none;
}
#uploadsize-message{display:none}
#uploadsize-message{display:none}
/* add breadcrumb divider to the File item in navigation panel */
#plugins li:first-child{
background-position: 15.7em 0px;
background-repeat:no-repeat;
background-image: url("/owncloud/core/img/breadcrumb-divider-start.png");
width:15.7em;
padding-right:11px;
}

View File

@ -208,6 +208,28 @@ $(document).ready(function() {
if(navigator.userAgent.search(/konqueror/i)==-1){
$('.file_upload_start').attr('multiple','multiple')
}
//if the breadcrumb is to long, start by replacing foldernames with '...' except for the current folder
var crumb=$('div.crumb').first();
while($('div.controls').height()>40 && crumb.next('div.crumb').length>0){
crumb.children('a').text('...');
crumb=crumb.next('div.crumb');
}
//if that isn't enough, start removing items from the breacrumb except for the current folder and it's parent
var crumb=$('div.crumb').first();
var next=crumb.next('div.crumb');
while($('div.controls').height()>40 && next.next('div.crumb').length>0){
crumb.remove();
crumb=next;
next=crumb.next('div.crumb');
}
//still not enough, start shorting down the current folder name
var crumb=$('div.crumb>a').last();
while($('div.controls').height()>40 && crumb.text().length>6){
var text=crumb.text()
text=text.substr(0,text.length-6)+'...';
crumb.text(text);
}
});
var adjustNewFolderSize = function() {