refurbished new folder button

This commit is contained in:
Arthur Schiwon 2011-04-19 12:21:55 +02:00
parent 59e9c1ee0e
commit 85764257ea
3 changed files with 83 additions and 24 deletions

View File

@ -19,31 +19,36 @@
text-decoration: none;
}
#file_upload_form {
#file_upload_form, #file_newfolder_form {
display: inline;
}
#fileSelector, #file_upload_cancel {
#fileSelector, #file_upload_cancel, #file_newfolder_submit {
display: none;
}
#file_upload_start {
background-image:url(/owncloud-dev/img/mimetypes/file.png);
#file_upload_start, #file_newfolder_name {
background-repeat: no-repeat;
background-position: 0.5em 0;
padding-left: 2em;
}
#file_upload_form input[type="button"]{
#file_upload_start {background-image:url(/owncloud-dev/img/mimetypes/file.png);}
#file_newfolder_name {
background-image:url(/owncloud-dev/img/places/folder.png); font-weight: bold;
width: 14em;
}
#file_newfolder_submit {
width: 3em;
}
form input[type="button"], form input[type="text"]{
/* this is a dirty wurgaround, Jan needs to fix it in global css*/
font-size: 0.9em;
}
#file_newfolder_form {
display: none;
}
#file_upload_target {
display: none;
}

View File

@ -2,6 +2,8 @@ $(document).ready(function() {
$('#file_action_panel').attr('activeAction', false);
$('#file_upload_start').attr('mode', 'menu');
$('#file_upload_form').attr('uploading', false);
$('#file_newfolder_name').css('width', '14em');
$('#file_newfolder_submit').css('width', '3em');
// Sets browser table behaviour :
$('.browser tr').hover(
@ -115,6 +117,40 @@ $(document).ready(function() {
});
});
$('#file_newfolder_name').click(function(){
if($('#file_newfolder_name').val() == 'New Folder'){
$('#file_newfolder_name').val('');
}
});
$('#file_newfolder_name').bind('keyup', adjustNewFolderSize);
$('#file_newfolder_submit').bind('vanish', function() {
$('#file_newfolder_name').bind('keyup', adjustNewFolderSize);
unsplitSize($('#file_newfolder_name'),$('#file_newfolder_submit'));
});
$('#file_newfolder_name').focusout(function(){
if($('#file_newfolder_name').val() == '') {
$('#file_newfolder_form')[0].reset();
$('#file_newfolder_submit').fadeOut(250).trigger('vanish');
}
});
$('#file_newfolder_submit').click(function() {
if($('#file_newfolder_name').val() != '') {
$.ajax({
url: 'ajax/newfolder.php',
data: "dir="+$('#dir').val()+"&foldername="+$('#file_newfolder_name').val(),
complete: function(data){
boolOperationFinished(data, false);
$('#file_newfolder_form')[0].reset();
}
});
}
$('#file_newfolder_submit').fadeOut(250).trigger('vanish');
});
// $('.upload').click(function(){
// if($('#file_action_panel').attr('activeAction') != 'upload') {
// $('#file_action_panel').attr('activeAction', 'upload');
@ -138,18 +174,18 @@ $(document).ready(function() {
$('.new-dir').click(function(){
if($('#file_action_panel').attr('activeAction') != 'new-dir') {
$('#file_action_panel').attr('activeAction', 'new-dir');
$('#file_new_dir_name').val('');
$('#file_action_panel form').slideUp(250);
$('#file_newfolder_form').slideDown(250);
} else {
$('#file_newfolder_form').slideUp(250);
$('#file_action_panel').attr('activeAction', false);
}
return false;
});
// $('.new-dir').click(function(){
// if($('#file_action_panel').attr('activeAction') != 'new-dir') {
// $('#file_action_panel').attr('activeAction', 'new-dir');
// $('#file_new_dir_name').val('');
// $('#file_action_panel form').slideUp(250);
// $('#file_newfolder_form').slideDown(250);
// } else {
// $('#file_newfolder_form').slideUp(250);
// $('#file_action_panel').attr('activeAction', false);
// }
// return false;
// });
$('.download').click(function(event) {
var files='';
@ -184,6 +220,25 @@ $(document).ready(function() {
});
});
var adjustNewFolderSize = function() {
if($('#file_newfolder_name').val() != '') {
splitSize($('#file_newfolder_name'),$('#file_newfolder_submit'));
$('#file_newfolder_name').unbind('keyup', adjustNewFolderSize);
};
}
function splitSize(existingEl, appearingEl) {
nw = parseInt($(existingEl).css('width')) - parseInt($(appearingEl).css('width'));
$(existingEl).css('width', nw + 'px');
$(appearingEl).fadeIn(250);
}
function unsplitSize(stayingEl, vanishingEl) {
nw = parseInt($(stayingEl).css('width')) + parseInt($(vanishingEl).css('width'));
$(stayingEl).css('width', nw + 'px');
$(vanishingEl).fadeOut(250);
}
function uploadFinished() {
result = $('#file_upload_target').contents().text();
result = eval("(" + result + ");");

View File

@ -3,10 +3,9 @@
<form id="file_upload_form" action="ajax/upload.php"
method="post" enctype="multipart/form-data" target="file_upload_target"><input
type="hidden" name="MAX_FILE_SIZE" value="<?php echo $_["uploadMaxFilesize"] ?>" id="max_upload"><input
type="hidden" class="max_human_file_size" value="(max <?php echo $_["uploadMaxHumanFilesize"]; ?>)"><input type="hidden" name="dir" value="<?php echo $_["dir"] ?>" id="dir"><input class="prettybutton" type="submit" id="file_upload_start" value="Upload (max <?php echo $_["uploadMaxHumanFilesize"];?>)" />&nbsp;<input class="prettybutton" type="button" id="file_upload_cancel" value="X" /><input type="file" name="file" id="fileSelector"><iframe id="file_upload_target" name="file_upload_target" src=""></iframe></form><a href="" title="" class="new-dir">New folder</a><a href="" title="" class="download">Download</a><a href="" title="" class="share">Share</a><a href="" title="" class="delete">Delete</a>
type="hidden" class="max_human_file_size" value="(max <?php echo $_["uploadMaxHumanFilesize"]; ?>)"><input type="hidden" name="dir" value="<?php echo $_["dir"] ?>" id="dir"><input class="prettybutton" type="submit" id="file_upload_start" value="Upload (max <?php echo $_["uploadMaxHumanFilesize"];?>)" />&nbsp;<input class="prettybutton" type="button" id="file_upload_cancel" value="X" /><input type="file" name="file" id="fileSelector"><iframe id="file_upload_target" name="file_upload_target" src=""></iframe></form><form id="file_newfolder_form"><input type="text" class="prettybutton" name="file_newfolder_name" id="file_newfolder_name" value="New Folder" />&nbsp;<input class="prettybutton" type="button" id="file_newfolder_submit" name="file_newfolder_submit" value="OK" /></form><a href="" title="" class="download">Download</a><a href="" title="" class="share">Share</a><a href="" title="" class="delete">Delete</a>
</div>
<div id="file_action_panel">
<form id="file_newfolder_form"><input type="text" name="file_new_dir_name" id="file_new_dir_name" />&nbsp;<input class="prettybutton" type="button" id="file_new_dir_submit" name="file_new_dir_submit" value="OK" /></form>
</div>
</div>