From 7657926a602a524cf651e7e2b95a3369261fbde1 Mon Sep 17 00:00:00 2001 From: Robin Date: Sun, 4 Apr 2010 16:50:04 +0200 Subject: some cleanup in ajax fronted, give error message before starting an upload that is to big --- js/filebrowser.js | 330 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 330 insertions(+) create mode 100644 js/filebrowser.js (limited to 'js/filebrowser.js') diff --git a/js/filebrowser.js b/js/filebrowser.js new file mode 100644 index 00000000000..3460955f2e4 --- /dev/null +++ b/js/filebrowser.js @@ -0,0 +1,330 @@ +/** +* ownCloud - ajax frontend +* +* @author Robin Appelman +* @copyright 2010 Robin Appelman icewind1991@gmail.com +* +* This library is free software; you can redistribute it and/or +* modify it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE +* License as published by the Free Software Foundation; either +* version 3 of the License, or any later version. +* +* This library is distributed in the hope that it will be useful, +* but WITHOUT ANY WARRANTY; without even the implied warranty of +* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +* GNU AFFERO GENERAL PUBLIC LICENSE for more details. +* +* You should have received a copy of the GNU Lesser General Public +* License along with this library. If not, see . +* +*/ + +OC_FILES.browser=new Object(); + +OC_FILES.browser.show=function(dir){ + dir=(dir)?dir:''; + OC_FILES.dir=dir; + OC_FILES.getdirectorycontent(dir,OC_FILES.browser.show_callback); +} + +OC_FILES.browser.show_callback=function(content){ + var dir=OC_FILES.dir + var dirs=dir.split('/'); + var tr=null; + var td=null; + var img=null; + + body=document.getElementsByTagName('body').item(0); + body.addEvent('onclick',OC_FILES.browser.hideallactions); + + //remove current content; + var contentNode=document.getElementById('content'); + if(contentNode.hasChildNodes()){ + while(contentNode.childNodes.length >=1){ + contentNode.removeChild(contentNode.firstChild); + } + } + + var browser=document.createElement('div'); + browser.className='center'; + var table=document.createElement('table'); + browser.appendChild(table); + + // breadcrumb + if(dirs.length>0) { + table.setAttribute('cellpadding',2); + table.setAttribute('cellspacing',0); + var tbody=document.createElement('tbody');//some IE versions need this + table.appendChild(tbody); + tr=document.createElement('tr'); + tbody.appendChild(tr); + td=document.createElement('td'); + tr.appendChild(td); + td.setAttribute('colspan','2'); + td=document.createElement('td'); + tr.appendChild(td); + td.setAttribute('colspan','4'); + td.className='breadcrumb'; + var a=document.createElement('a'); + td.appendChild(a); + a.setAttribute('href','#'); + a.addEvent('onclick',OC_FILES.browser.show); + a.appendChild(document.createTextNode('Home')); + var currentdir=''; + for(index in dirs) { + d=dirs[index]; + currentdir=currentdir+'/'+d; + if(d!=''){ + a=document.createElement('a'); + td.appendChild(a); + a.setAttribute('href','#'+currentdir); + a.setAttribute('onclick','OC_FILES.browser.show("'+currentdir+'")'); + img=document.createElement('img'); + a.appendChild(img); + img.src=WEBROOT+'/img/arrow.png'; + a.appendChild(document.createTextNode(' ' +d)); + } + } + } + + // files and directories + table.setAttribute('cellpadding',6); + table.setAttribute('cellspacing',0); + table.className='browser'; + var tbody=document.createElement('tbody');//some IE versions need this + table.appendChild(tbody); + var filesfound=false; + var sizeTd=null; + if(content){ + tr=document.createElement('tr'); + tbody.appendChild(tr); + tr.className='browserline'; + td=document.createElement('td'); + tr.appendChild(td); + td.setAttribute('colspan','2'); + input=document.createElement('input'); + input.setAttribute('type','checkbox'); + input.setAttribute('name','fileSelector'); + input.setAttribute('value','select_all'); + input.setAttribute('id','select_all'); + input.addEvent('onclick',OC_FILES.selectAll); + td.appendChild(input); + td=document.createElement('td'); + tr.appendChild(td); + td.setAttribute('colspan','4'); + dropdown=document.createElement('select'); + td.appendChild(dropdown); + dropdown.setAttribute('id','selected_action'); + for(index in this.actions_selected){ + if(this.actions_selected[index].call){ + option=document.createElement('option'); + dropdown.appendChild(option); + option.setAttribute('value',index); + option.appendChild(document.createTextNode(index)); + } + } + td.appendChild(document.createTextNode(' selected. ')); + button=document.createElement('button'); + td.appendChild(button); + button.appendChild(document.createTextNode('Go')); + button.addEvent('onclick',OC_FILES.action_selected); + for(index in content){ + var file=content[index]; + if(file.name){ + file.name=file.name.replace('\'',''); + OC_FILES.files[file['name']]=new OC_FILES.file(dir,file['name'],file['type']); + tr=document.createElement('tr'); + tbody.appendChild(tr); + tr.className='browserline'; + td=document.createElement('td'); + tr.appendChild(td); + input=document.createElement('input'); + input.setAttribute('type','checkbox'); + input.setAttribute('name','fileSelector'); + input.setAttribute('value',file['name']); + td.appendChild(input); + tr.appendChild(OC_FILES.browser.showicon(file['type'])); + td=document.createElement('td'); + tr.appendChild(td); + td.className='nametext'; + td.setAttribute('name',file['name']); + td.setAttribute('id',file['name']); + a=document.createElement('a'); + td.appendChild(a); + a.appendChild(document.createTextNode(file['name'])) + if(file['type']=='dir'){ + a.addEvent('onclick',OC_FILES.browser.show,[dir+'/'+file['name']]); + td.setAttribute('colspan',2); + a.setAttribute('href','#'+dir+'/'+file['name']); + }else{ + a.setAttribute('href',WEBROOT+'/?dir=/'+dir+'&file='+file['name']); + sizeTd=document.createElement('td'); + tr.appendChild(sizeTd); + sizeTd.className='sizetext'; + sizeTd.appendChild(document.createTextNode(sizeFormat(file['size']))); + } + a=document.createElement('a'); + img=document.createElement('img'); + td.appendChild(img); + img.className='file_actions'; + img.alt='' + img.title='actions'; + img.src=WEBROOT+'/img/arrow_down.png'; + img.setAttribute('onclick','OC_FILES.browser.showactions(\''+file['name']+'\')') + td=document.createElement('td'); + tr.appendChild(td); + td.className='sizetext'; + td.appendChild(document.createTextNode(file['date'])); + } + } + } + td=document.createElement('td'); + tr.appendChild(td); + tr=document.createElement('tr'); + tbody.appendChild(tr); + tr.className='utilrow'; + td=document.createElement('td'); + tr.appendChild(td); + td.className='upload'; + td.setAttribute('colspan','6'); + OC_FILES.browser.showuploader(dir,td,content['max_upload']); + contentNode.appendChild(browser); +} + +OC_FILES.browser.showicon=function(filetype){ + var td=document.createElement('td'); + var img=document.createElement('img'); + td.appendChild(img); + img.setAttribute('width',16); + img.setAttribute('height',16); + if(filetype=='dir'){ + img.src=WEBROOT+'/img/icons/folder.png'; + }else{ + img.src=WEBROOT+'/img/icons/other.png'; + } + return td; +} + +OC_FILES.browser.showuploader=function(dir,parent,max_upload){ + OC_FILES.uploadForm=document.createElement('form'); + OC_FILES.uploadForm.setAttribute('target','uploadIFrame'); + OC_FILES.uploadForm.setAttribute('action','files/upload.php?dir='+dir); + OC_FILES.uploadForm.method='post'; + OC_FILES.uploadForm.setAttribute('enctype','multipart/form-data'); + OC_FILES.uploadIFrame=document.createElement('iframe'); + OC_FILES.uploadIFrame.className='hidden'; + OC_FILES.uploadIFrame.name='uploadIFrame'; + parent.appendChild(OC_FILES.uploadIFrame); + var input=document.createElement('input'); + input.setAttribute('type','hidden'); + input.setAttribute('name','MAX_FILE_SIZE'); + input.setAttribute('value',max_upload); + input.setAttribute('id','max_upload'); + OC_FILES.uploadForm.appendChild(input); + var file=document.createElement('input'); + file.name='file'; + file.setAttribute('id','fileSelector'); + file.setAttribute('type','file'); + file.addEvent('onchange',OC_FILES.upload,[dir]); + OC_FILES.uploadForm.appendChild(document.createTextNode('Upload file: ')); + OC_FILES.uploadForm.appendChild(file); + parent.appendChild(OC_FILES.uploadForm); +} + +OC_FILES.browser.show_rename=function(dir,file){ + var item=document.getElementById(file); + item.oldContent=Array(); + if(item.hasChildNodes()){ + while(item.childNodes.length >=1){ + item.oldContent[item.oldContent.length]=item.firstChild; + item.removeChild(item.firstChild); + } + } + var form=document.createElement('form'); + form.addEvent('onsubmit',OC_FILES.rename,[dir,file]); + var input=document.createElement('input'); + input.setAttribute('type','text'); + input.setAttribute('name','newname'); + input.setAttribute('value',file); + input.setAttribute('id',file+'_newname') + input.addEvent('onblur',OC_FILES.browser.rename_cancel,[file]); + form.appendChild(input); + item.appendChild(form); + input.focus(); +} + +OC_FILES.browser.rename_cancel=function(file){ + var item=document.getElementsByName(file).item(0); + if(item.hasChildNodes()){ + while(item.childNodes.length >=1){ + item.removeChild(item.firstChild); + } + } + for(index in item.oldContent){ + if(item.oldContent[index].nodeType){ + item.appendChild(item.oldContent[index]); + } + } +} + +OC_FILES.browser.showactions=function(file,hide){ + node=document.getElementById(file); + if(node &&(node.actionsshown || hide)){ + if(node.actionsdiv){ + node.removeChild(node.actionsdiv); + } + node.actionsdiv=null; + node.actionsshown=false + }else if(node){ + node.actionsshown=true + div=document.createElement('div'); + node.actionsdiv=div; + div.className='fileactionlist'; + table=document.createElement('table'); + div.appendChild(table); + tbody=document.createElement('tbody'); + table.appendChild(tbody); + actions=OC_FILES.files[file].actions; + for(name in actions){ + if(actions[name].call){ + tr=document.createElement('tr'); + tbody.appendChild(tr); + td=document.createElement('td'); + tr.appendChild(td); + a=document.createElement('a'); + td.appendChild(a); + a.appendChild(document.createTextNode(name)); + td.addEvent('onclick',new callBack(OC_FILES.files[file].actions[name],OC_FILES.files[file])); + } + } + node.appendChild(div); + OC_FILES.hideallenabled=false; + setTimeout('OC_FILES.hideallenabled=true',50); + } +} + +OC_FILES.browser.hideallactions=function(){ + if(OC_FILES.hideallenabled){ + for(name in OC_FILES.files){ + if(OC_FILES.files[name].hideactions){ + OC_FILES.files[name].hideactions.call(OC_FILES.files[name]); + } + } + } +} + +OC_FILES.hideallenabled=true; //used to prevent browsers from hiding actionslists right after they are displayed; + +sizeFormat=function(size){ + var orig=size; + var steps=Array('B','KiB','MiB','GiB','TiB'); + var step=0; + while(size>(1024*2)){ + step++; + size=size/1024; + } + if(size.toFixed){ + size=size.toFixed(2); + } + return ''+size+' '+steps[step]; +} \ No newline at end of file -- cgit v1.2.3 From e8307187574380c12b8ca5f932185ca576074c68 Mon Sep 17 00:00:00 2001 From: Robin Date: Thu, 8 Apr 2010 23:59:19 +0200 Subject: some more cleanup --- js/ajax.js | 7 +--- js/filebrowser.js | 38 ++++++++++++++------- js/lib_ajax.js | 69 +++++++++++++++++++++++++++++++++------ js/lib_event.js | 98 +++++++++++++------------------------------------------ js/lib_files.js | 17 +++++++++- 5 files changed, 126 insertions(+), 103 deletions(-) (limited to 'js/filebrowser.js') diff --git a/js/ajax.js b/js/ajax.js index d924c9b8bc3..534dd46a290 100644 --- a/js/ajax.js +++ b/js/ajax.js @@ -19,10 +19,5 @@ * */ -var dir='' -var loc=document.location.toString(); -if(loc.indexOf('#')!=-1){ - dir=loc.substring(loc.indexOf('#')+1); -} -OC_onload.add(new function(){OC_FILES.browser.show(dir)}); \ No newline at end of file +OC_onload.add(OC_FILES.browser.showInitial); \ No newline at end of file diff --git a/js/filebrowser.js b/js/filebrowser.js index 3460955f2e4..7bd656987a1 100644 --- a/js/filebrowser.js +++ b/js/filebrowser.js @@ -21,8 +21,20 @@ OC_FILES.browser=new Object(); +OC_FILES.browser.showInitial=function(){ + var dir='' + var loc=document.location.toString(); + if(loc.indexOf('#')!=-1){ + dir=loc.substring(loc.indexOf('#')+1); + } + OC_FILES.dir=dir; + OC_FILES.getdirectorycontent(dir,OC_FILES.browser.show_callback); +} + OC_FILES.browser.show=function(dir){ - dir=(dir)?dir:''; + if(!dir){ + dir=''; + } OC_FILES.dir=dir; OC_FILES.getdirectorycontent(dir,OC_FILES.browser.show_callback); } @@ -71,14 +83,14 @@ OC_FILES.browser.show_callback=function(content){ a.addEvent('onclick',OC_FILES.browser.show); a.appendChild(document.createTextNode('Home')); var currentdir=''; - for(index in dirs) { + for(var index=0;index Date: Sun, 11 Apr 2010 22:49:24 +0200 Subject: visual changes WIP --- css/default.php | 126 +++++++++++++++++++++++++++++++++----- files/get_file.php | 2 +- inc/templates/footer.php | 3 + inc/templates/header.php | 3 + js/filebrowser.js | 155 +++++++++++++++++++++++++++-------------------- js/lib_files.js | 37 ++++++++--- 6 files changed, 238 insertions(+), 88 deletions(-) (limited to 'js/filebrowser.js') diff --git a/css/default.php b/css/default.php index dd69cd703da..93089b9d616 100755 --- a/css/default.php +++ b/css/default.php @@ -2,10 +2,30 @@ header('Content-Type: text/css'); require_once('../inc/lib_base.php'); ?> -body { +html,body { background-color: #F9F9F9; margin:0px; + height:100%; + width:100%; + position:absolute; +} +#mainlayout, #mainlayout>tbody{ + width:100%; + height:100%; +} + +#mainlayout .head{ + height:175px; +} + +#mainlayout .body{ + vertical-align:top; } + +#mainlayout .foot{ + height:75px; +} + body.error {background-color: #F0F0F0;} body,th,td,ul,li,a,div,p,pre {color:#333333; font-family:Verdana,"Bitstream Vera Sans",Arial,Helvetica,Sans,"Bitstream Vera Serif"; font-size:9.0pt;} @@ -54,7 +74,10 @@ a#owncloud-logo span { .errortext {color:#CC3333; font-size:9pt; font-weight:bold; text-decoration:none;} .highlighttext {color:#333333; font-size:9pt; font-weight:bold; text-decoration:none;} .datetext {color:#333333; font-size:7pt;} -.sizetext {color:#333333; font-size:7pt;} +.sizetext{ + color:#333333; + font-size:7pt; +} .footer {color:#999999; text-align:center; font-size:9pt; margin-top:4em;} .footer a {color:#999999; text-decoration:none;} .hint {color:#AAAAAA; text-align:center; font-size:8pt; margin-top:4em; margin-bottom:2em;} @@ -139,7 +162,10 @@ a#owncloud-logo span { margin:0px; padding:0px; border:0px; - //do not use display:none here, it breaks iframes in some browsers + position:absolute; + top:0px; + left:0px; + /*do not use display:none here, it breaks iframes in some browsers*/ } div.OCNotification{ @@ -163,20 +189,10 @@ td img.file_actions{ width:9px; } -td:hover img.file_actions{ +td.nametext:hover img.file_actions{ height:auto; } -td img.rename, td img.delete{ - height:0px; - width:16px; - cursor:pointer; -} - -td:hover img.rename, tr:hover img.delete{ - height:16px; -} - div.breadcrumb{ background-color: #F0F0F0; } @@ -194,4 +210,86 @@ div.fileactionlist td{ div.fileactionlist td:hover{ background-color: #CCCCCC; +} + +tr.breadcrumb{ + background-color: #CCCCCC; +} + +#content, div.browser{ + height:100%; +} + +table.browser{ + border: solid 3px #CCC; + height:100%; + border-spacing:0px; +} + +table.browser thead, table.browser tfoot{ + background-color:#CCC; + width:100%; +} + +td.sizetext{ + width:110px; + text-align:right; +} + +td.fileSelector, td.fileicon{ + width:16px; +} + +span.upload{ + float:right; + text-align:right; + margin:0px; + padding:0px; +} + +table.browser>tbody{ + height:100%; + vertical-align:top; +} + +table.browser>tbody>tr>td, table.browser>tbody>tr{ + padding:0px; + height:100%; +} + +div.fileList{ + width:800px; + overflow:auto; + vertical-align:top; + top:0px; +} + +div.fileList table{ + width:100%; + vertical-align:top; +} + +thead td, tfoot td{ + padding-left:6px; + padding-top:2px; + padding-bottom:2px; +} + +#imageframe{ + position:absolute; + top:0px; + left:0px; + height:100%; + width:100%; + background:rgb(20,20,20); + background:rgba(20,20,20,0.9); + text-align:center; +} + +#imageframe img{ + vertical-align:middle; + max-height:90%; + max-width:90%; + margin:10px; + border: black solid 3px; } \ No newline at end of file diff --git a/files/get_file.php b/files/get_file.php index 72fc8938063..9ec539ee7e0 100644 --- a/files/get_file.php +++ b/files/get_file.php @@ -20,7 +20,7 @@ * */ -//not this file is for getting files themselves, get_files.php is for getting a list of files. +//note this file is for getting files themselves, get_files.php is for getting a list of files. require_once('../inc/lib_base.php'); diff --git a/inc/templates/footer.php b/inc/templates/footer.php index 5ce34a95791..a63014ed518 100755 --- a/inc/templates/footer.php +++ b/inc/templates/footer.php @@ -1,6 +1,9 @@ + +

ownCloud - 1.0 beta 2'); ?>

+ diff --git a/inc/templates/header.php b/inc/templates/header.php index 1f194da797f..755eba26e44 100755 --- a/inc/templates/header.php +++ b/inc/templates/header.php @@ -22,6 +22,8 @@ foreach(OC_UTIL::$scripts as $script){ + +
'); @@ -53,6 +55,7 @@ echo('

'); OC_UTIL::shownavigation(); echo(''); + echo('

'); } ?> diff --git a/js/filebrowser.js b/js/filebrowser.js index 7bd656987a1..2f587fa4188 100644 --- a/js/filebrowser.js +++ b/js/filebrowser.js @@ -51,31 +51,39 @@ OC_FILES.browser.show_callback=function(content){ //remove current content; var contentNode=document.getElementById('content'); + contentNode.className+=' center'; if(contentNode.hasChildNodes()){ while(contentNode.childNodes.length >=1){ contentNode.removeChild(contentNode.firstChild); } } - - var browser=document.createElement('div'); - browser.className='center'; var table=document.createElement('table'); - browser.appendChild(table); + table.className='browser'; + var tbody=document.createElement('tbody'); + var thead=document.createElement('thead'); + var tfoot=document.createElement('tfoot'); + table.appendChild(thead); + table.appendChild(tbody); + table.appendChild(tfoot); +// table.setAttribute('cellpadding',6); // breadcrumb if(dirs.length>0) { - table.setAttribute('cellpadding',2); - table.setAttribute('cellspacing',0); - var tbody=document.createElement('tbody');//some IE versions need this - table.appendChild(tbody); tr=document.createElement('tr'); - tbody.appendChild(tr); + thead.appendChild(tr); + tr.className='breadcrumb'; td=document.createElement('td'); - tr.appendChild(td); - td.setAttribute('colspan','2'); + tr.appendChild(td); + td.className='fileSelector' + input=document.createElement('input'); + input.setAttribute('type','checkbox'); + input.setAttribute('name','fileSelector'); + input.setAttribute('value','select_all'); + input.setAttribute('id','select_all'); + input.addEvent('onclick',OC_FILES.selectAll); + td.appendChild(input); td=document.createElement('td'); tr.appendChild(td); - td.setAttribute('colspan','4'); td.className='breadcrumb'; var a=document.createElement('a'); td.appendChild(a); @@ -100,56 +108,35 @@ OC_FILES.browser.show_callback=function(content){ } // files and directories - table.setAttribute('cellpadding',6); - table.setAttribute('cellspacing',0); - table.className='browser'; - var tbody=document.createElement('tbody');//some IE versions need this - table.appendChild(tbody); + var filesfound=false; var sizeTd=null; if(content){ - tr=document.createElement('tr'); - tbody.appendChild(tr); - tr.className='browserline'; - td=document.createElement('td'); - tr.appendChild(td); - td.setAttribute('colspan','2'); - input=document.createElement('input'); - input.setAttribute('type','checkbox'); - input.setAttribute('name','fileSelector'); - input.setAttribute('value','select_all'); - input.setAttribute('id','select_all'); - input.addEvent('onclick',OC_FILES.selectAll); - td.appendChild(input); - td=document.createElement('td'); - tr.appendChild(td); - td.setAttribute('colspan','4'); - dropdown=document.createElement('select'); - td.appendChild(dropdown); - dropdown.setAttribute('id','selected_action'); - for(index in this.actions_selected){ - if(this.actions_selected[index].call){ - option=document.createElement('option'); - dropdown.appendChild(option); - option.setAttribute('value',index); - option.appendChild(document.createTextNode(index)); - } - } - td.appendChild(document.createTextNode(' selected. ')); - button=document.createElement('button'); - td.appendChild(button); - button.appendChild(document.createTextNode('Go')); - button.addEvent('onclick',OC_FILES.action_selected); + tr=document.createElement('tr'); + tbody.appendChild(tr); + td=document.createElement('td'); + td.setAttribute('colspan','6'); + tr.appendChild(td); + div=document.createElement('div'); + td.appendChild(div); + div.className='fileList'; + table2=document.createElement('table'); + div.appendChild(table2); + tbody2=document.createElement('tbody'); + table2.appendChild(tbody2); + table2.setAttribute('cellpadding',6); + table2.setAttribute('cellspacing',0); for(index in content){ var file=content[index]; if(file.name){ file.name=file.name.replace('\'',''); OC_FILES.files[file['name']]=new OC_FILES.file(dir,file['name'],file['type']); tr=document.createElement('tr'); - tbody.appendChild(tr); + tbody2.appendChild(tr); tr.className='browserline'; td=document.createElement('td'); tr.appendChild(td); + td.className='fileSelector'; input=document.createElement('input'); input.setAttribute('type','checkbox'); input.setAttribute('name','fileSelector'); @@ -170,7 +157,7 @@ OC_FILES.browser.show_callback=function(content){ td.setAttribute('colspan',2); a.setAttribute('href','#'+dir+'/'+file['name']); }else{ - a.setAttribute('href','#'); + a.setAttribute('href','#'+dir); sizeTd=document.createElement('td'); tr.appendChild(sizeTd); sizeTd.className='sizetext'; @@ -192,21 +179,40 @@ OC_FILES.browser.show_callback=function(content){ } } } - td=document.createElement('td'); - tr.appendChild(td); tr=document.createElement('tr'); - tbody.appendChild(tr); - tr.className='utilrow'; - td=document.createElement('td'); - tr.appendChild(td); - td.className='upload'; - td.setAttribute('colspan','6'); - OC_FILES.browser.showuploader(dir,td,content['max_upload']); - contentNode.appendChild(browser); + tfoot.appendChild(tr); + tr.className='utilityline'; + td=document.createElement('td'); + tr.appendChild(td); + td.setAttribute('colspan','4'); + span=document.createElement('span'); + td.appendChild(span); + dropdown=document.createElement('select'); + span.appendChild(dropdown); + dropdown.setAttribute('id','selected_action'); + for(index in this.actions_selected){ + if(this.actions_selected[index].call){ + option=document.createElement('option'); + dropdown.appendChild(option); + option.setAttribute('value',index); + option.appendChild(document.createTextNode(index)); + } + } + span.appendChild(document.createTextNode(' selected. ')); + button=document.createElement('button'); + span.appendChild(button); + button.appendChild(document.createTextNode('Go')); + button.addEvent('onclick',OC_FILES.action_selected); + span=document.createElement('span'); + span.className='upload'; + td.appendChild(span); + OC_FILES.browser.showuploader(dir,span,content['max_upload']); + contentNode.appendChild(table); } OC_FILES.browser.showicon=function(filetype){ var td=document.createElement('td'); + td.className='fileicon'; var img=document.createElement('img'); td.appendChild(img); img.setAttribute('width',16); @@ -228,7 +234,6 @@ OC_FILES.browser.showuploader=function(dir,parent,max_upload){ OC_FILES.uploadIFrame=document.createElement('iframe'); OC_FILES.uploadIFrame.className='hidden'; OC_FILES.uploadIFrame.name='uploadIFrame'; - parent.appendChild(OC_FILES.uploadIFrame); var input=document.createElement('input'); input.setAttribute('type','hidden'); input.setAttribute('name','MAX_FILE_SIZE'); @@ -243,6 +248,7 @@ OC_FILES.browser.showuploader=function(dir,parent,max_upload){ OC_FILES.uploadForm.appendChild(document.createTextNode('Upload file: ')); OC_FILES.uploadForm.appendChild(file); parent.appendChild(OC_FILES.uploadForm); + parent.appendChild(OC_FILES.uploadIFrame); } OC_FILES.browser.show_rename=function(dir,file){ @@ -322,9 +328,11 @@ OC_FILES.browser.showactions=function(file,hide){ OC_FILES.browser.hideallactions=function(){ if(OC_FILES.hideallenabled){ for(name in OC_FILES.files){ - if(OC_FILES.files[name].hideactions){ - OC_FILES.files[name].hideactions.call(OC_FILES.files[name]); - } + if(OC_FILES.files[name]){ + if(OC_FILES.files[name].hideactions){ + OC_FILES.files[name].hideactions.call(OC_FILES.files[name]); + } + } } } } @@ -343,4 +351,21 @@ sizeFormat=function(size){ size=size.toFixed(2); } return ''+size+' '+steps[step]; +} + +OC_FILES.browser.showImage=function(dir,file){ + var path=WEBROOT+'/files/open_file.php?dir='+dir+'&file='+file + var div=document.createElement('div'); + div.setAttribute('id','imageframe'); + div.addEvent('onclick',OC_FILES.browser.hideImage) + var img=document.createElement('img'); + img.setAttribute('src',path); + div.appendChild(img); + body=document.getElementsByTagName('body').item(0); + body.appendChild(div); +} + +OC_FILES.browser.hideImage=function(){ + var div=document.getElementById('imageframe'); + div.parentNode.removeChild(div); } \ No newline at end of file diff --git a/js/lib_files.js b/js/lib_files.js index 4851272593d..443d440380e 100644 --- a/js/lib_files.js +++ b/js/lib_files.js @@ -175,12 +175,6 @@ OC_FILES.file=function(dir,file,type){ this.actions[index]=OC_FILES.fileActions.all[index]; } } - if(OC_FILES.fileActions[this.extention]) - for(index in OC_FILES.fileActions[this.extention]){ - if(OC_FILES.fileActions[this.extention][index].call){ - this.actions[index]=OC_FILES.fileActions[this.extention][index]; - } - } if(OC_FILES.fileActions[this.type]){ for(index in OC_FILES.fileActions[this.type]){ if(OC_FILES.fileActions[this.type][index].call){ @@ -188,6 +182,13 @@ OC_FILES.file=function(dir,file,type){ } } } + if(OC_FILES.fileActions[this.extention]){ + for(index in OC_FILES.fileActions[this.extention]){ + if(OC_FILES.fileActions[this.extention][index].call){ + this.actions[index]=OC_FILES.fileActions[this.extention][index]; + } + } + } } OC_FILES.file.prototype.showactions=function(){ @@ -223,10 +224,30 @@ OC_FILES.fileActions.dir['default']=OC_FILES.fileActions.dir.open; OC_FILES.fileActions.jpg=new Object() OC_FILES.fileActions.jpg.show=function(){ - window.open(WEBROOT+'/files/open_file.php?dir='+this.dir+'&file='+this.file); +// window.open(WEBROOT+'/files/open_file.php?dir='+this.dir+'&file='+this.file); + OC_FILES.browser.showImage(this.dir,this.file); } +OC_FILES.fileActions.jpg['default']=OC_FILES.fileActions.jpg.show; + OC_FILES.fileActions.jpeg=OC_FILES.fileActions.jpg OC_FILES.fileActions.png=OC_FILES.fileActions.jpg OC_FILES.fileActions.gif=OC_FILES.fileActions.jpg -OC_FILES.fileActions.bmp=OC_FILES.fileActions.jpg \ No newline at end of file +OC_FILES.fileActions.bmp=OC_FILES.fileActions.jpg + +function getStyle(el,styleProp) +{ +// var x = document.getElementById(el); + var x=el; + if (x.currentStyle){ + alert(x.currentStyle); + var y = x.currentStyle[styleProp]; + }else if (window.getComputedStyle){ + var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp); + } + return y; +} + +Node.prototype.getStyle=function(styleProp){ + return getStyle(this,styleProp) +} \ No newline at end of file -- cgit v1.2.3 From 48341b082609b8198046afe3d8d799cf2c2abd38 Mon Sep 17 00:00:00 2001 From: Robin Date: Mon, 12 Apr 2010 14:31:22 +0200 Subject: visual changes --- css/default.php | 38 +++++++++++++++++++++++++++++--------- inc/lib_files.php | 2 +- inc/templates/footer.php | 7 ++++--- inc/templates/header.php | 6 +++--- index.php | 2 +- js/filebrowser.js | 13 +++++++++---- 6 files changed, 47 insertions(+), 21 deletions(-) (limited to 'js/filebrowser.js') diff --git a/css/default.php b/css/default.php index 93089b9d616..c3c380cf151 100755 --- a/css/default.php +++ b/css/default.php @@ -9,21 +9,31 @@ html,body { width:100%; position:absolute; } -#mainlayout, #mainlayout>tbody{ +#mainlayout{ width:100%; height:100%; } -#mainlayout .head{ +#mainlayout>div{ + position:absolute; + width:100%; + left:0px; +} + +#mainlayout>.head{ height:175px; + top:0px; } -#mainlayout .body{ +#mainlayout>.body{ vertical-align:top; + top:175px; + bottom:75px; } -#mainlayout .foot{ +#mainlayout>.foot{ height:75px; + bottom:0px; } body.error {background-color: #F0F0F0;} @@ -55,6 +65,8 @@ div#nav { background-color: #EEEEEE; padding:0px; margin:0px; + position:absolute; + bottom:0px; } a#owncloud-logo { @@ -80,7 +92,7 @@ a#owncloud-logo span { } .footer {color:#999999; text-align:center; font-size:9pt; margin-top:4em;} .footer a {color:#999999; text-decoration:none;} -.hint {color:#AAAAAA; text-align:center; font-size:8pt; margin-top:4em; margin-bottom:2em;} +.hint {color:#AAAAAA; text-align:center; font-size:8pt; margin-top:10px;} .hint a{color:#AAAAAA; text-align:center; font-size:8pt;} .formstyle { @@ -165,6 +177,7 @@ a#owncloud-logo span { position:absolute; top:0px; left:0px; + overflow:hidden; /*do not use display:none here, it breaks iframes in some browsers*/ } @@ -217,6 +230,8 @@ tr.breadcrumb{ } #content, div.browser{ + vertical-align:top; + /*min-height:200px;*/ height:100%; } @@ -248,19 +263,20 @@ span.upload{ } table.browser>tbody{ - height:100%; vertical-align:top; } table.browser>tbody>tr>td, table.browser>tbody>tr{ padding:0px; - height:100%; + /*height:100%;*/ } div.fileList{ width:800px; overflow:auto; vertical-align:top; + height:100%; + min-height:200px; top:0px; } @@ -271,8 +287,8 @@ div.fileList table{ thead td, tfoot td{ padding-left:6px; - padding-top:2px; - padding-bottom:2px; + padding-top:0px; + padding-bottom:0px; } #imageframe{ @@ -292,4 +308,8 @@ thead td, tfoot td{ max-width:90%; margin:10px; border: black solid 3px; +} + +tr.hint, tr.hint td{ + background:transparent; } \ No newline at end of file diff --git a/inc/lib_files.php b/inc/lib_files.php index dbafa52a180..5ddf5a4e1f3 100755 --- a/inc/lib_files.php +++ b/inc/lib_files.php @@ -77,7 +77,7 @@ class OC_FILES { echo('
'); if(!$content) echo('

no files here

'); echo('');*/ - echo '
'; + echo '
'; } /** diff --git a/inc/templates/footer.php b/inc/templates/footer.php index a63014ed518..275f4191182 100755 --- a/inc/templates/footer.php +++ b/inc/templates/footer.php @@ -1,9 +1,10 @@ - - +
+

ownCloud - 1.0 beta 2'); ?>

- +
+ diff --git a/inc/templates/header.php b/inc/templates/header.php index 755eba26e44..09529f67268 100755 --- a/inc/templates/header.php +++ b/inc/templates/header.php @@ -22,8 +22,8 @@ foreach(OC_UTIL::$scripts as $script){ - -
+
+
'); @@ -55,7 +55,7 @@ echo('

'); OC_UTIL::shownavigation(); echo('

'); - echo('
'); + echo('
'); } ?> diff --git a/index.php b/index.php index 08d94c6079d..335d39b097a 100755 --- a/index.php +++ b/index.php @@ -36,7 +36,7 @@ if(isset($_GET['file'])) { OC_FILES::showbrowser($CONFIG_DATADIRECTORY,$dir); - echo('

Hint: Mount it via webdav like this: webdav://'.$_SERVER["HTTP_HOST"].$WEBROOT.'/webdav/owncloud.php

'); + echo('

Hint: Mount it via webdav like this: webdav://'.$_SERVER["HTTP_HOST"].$WEBROOT.'/webdav/owncloud.php

'); OC_UTIL::showfooter(); diff --git a/js/filebrowser.js b/js/filebrowser.js index 2f587fa4188..dac81327b69 100644 --- a/js/filebrowser.js +++ b/js/filebrowser.js @@ -51,7 +51,7 @@ OC_FILES.browser.show_callback=function(content){ //remove current content; var contentNode=document.getElementById('content'); - contentNode.className+=' center'; + contentNode.className='center'; if(contentNode.hasChildNodes()){ while(contentNode.childNodes.length >=1){ contentNode.removeChild(contentNode.firstChild); @@ -120,6 +120,7 @@ OC_FILES.browser.show_callback=function(content){ div=document.createElement('div'); td.appendChild(div); div.className='fileList'; + div.setAttribute('style','max-height:'+(parseInt(document.body.clientHeight)-300)+'px;'); table2=document.createElement('table'); div.appendChild(table2); tbody2=document.createElement('tbody'); @@ -195,10 +196,10 @@ OC_FILES.browser.show_callback=function(content){ option=document.createElement('option'); dropdown.appendChild(option); option.setAttribute('value',index); - option.appendChild(document.createTextNode(index)); + option.appendChild(document.createTextNode(capitaliseFirstLetter(index))); } } - span.appendChild(document.createTextNode(' selected. ')); + span.appendChild(document.createTextNode(' Selected ')); button=document.createElement('button'); span.appendChild(button); button.appendChild(document.createTextNode('Go')); @@ -314,7 +315,7 @@ OC_FILES.browser.showactions=function(file,hide){ tr.appendChild(td); a=document.createElement('a'); td.appendChild(a); - a.appendChild(document.createTextNode(name)); + a.appendChild(document.createTextNode(capitaliseFirstLetter(name))); var action=actions[name]; td.addEvent('onclick',new callBack(action,file)); } @@ -368,4 +369,8 @@ OC_FILES.browser.showImage=function(dir,file){ OC_FILES.browser.hideImage=function(){ var div=document.getElementById('imageframe'); div.parentNode.removeChild(div); +} + +function capitaliseFirstLetter(string){ + return string.charAt(0).toUpperCase() + string.slice(1); } \ No newline at end of file -- cgit v1.2.3