refurbished new folder button

diff --git a/files/css/files.css b/files/css/files.css
index 368adba29116a3f3fa899e3677902c33dc9df040..e3a7528fbf4b64b50602f61cd324240208833d16 100644 (file)
--- a/files/css/files.css
+++ b/files/css/files.css
@@ -19,29 +19,34 @@
     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"]{
-       /* this is a dirty wurgaround, Jan needs to fix it in global css*/
-       font-size: 0.9em;
+#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_form {
-       display: none;
+#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_upload_target {

diff --git a/files/js/files.js b/files/js/files.js
index bfb68317b02bcebdf19027541c54ac62c2ede69e..901078680de6017a8a56e115526692b201146788 100644 (file)
--- a/files/js/files.js
+++ b/files/js/files.js
@@ -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 + ");");

diff --git a/files/templates/index.php b/files/templates/index.php
index e794bad300c1763fa8fdc17ab30b84a626f4e815..4d34222b9667a34ae1b123cbf0b2386d04e6fc0d 100644 (file)
--- a/files/templates/index.php
+++ b/files/templates/index.php
@@ -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>