Add folder creation in Save as dialog

plugins/kolab_files/kolab_files.js

@@ -74,10 +74,10 @@ function kolab_directory_selector_dialog()
     title: rcmail.gettext('kolab_files.saveall'),
 //    close: function() { rcmail.dialog_close(); },
     buttons: buttons,
-    minWidth: 300,
+    minWidth: 400,
     minHeight: 300,
-    height: 250,
-    width: 250
+    height: 300,
+    width: 350
     }).show();
 
   file_api.folder_selector();
@@ -220,9 +220,9 @@ function kolab_files_ui()
         first = i;
     });
 
-   // select first folder
-   if (first)
-     this.selector_select(first);
+   // select first folder?
+//   if (first)
+//     this.selector_select(first);
 
     // add tree icons
     this.folder_list_tree(this.env.folders);
@@ -294,4 +294,25 @@ function kolab_files_ui()
 //    $('tr.selected', table).removeClass('selected');
     $(row).addClass('selected');
   };
+
+  // folder create request
+  this.folder_create = function(folder)
+  {
+    this.req = this.set_busy(true, 'creating');
+    this.get('folder_create', {folder: folder}, 'folder_create_response');
+  };
+
+  // folder create response handler
+  this.folder_create_response = function(response)
+  {
+    if (!this.response(response))
+      return;
+
+    // refresh folders list
+    if (rcmail.task == 'kolab_files')
+      this.folder_list();
+    else
+      this.folder_selector();
+  };
+
 };

plugins/kolab_files/lib/kolab_files_engine.php

@@ -63,6 +63,11 @@ class kolab_files_engine
         }
 
         if (!empty($template)) {
+            // register template objects
+            $this->rc->output->add_handlers(array(
+                'folder-create-form' => array($this, 'folder_create_form'),
+            ));
+            // add dialog content at the end of page body
             $this->rc->output->add_footer(
                 $this->rc->output->parse('kolab_files.' . $template, false, false));
         }
@@ -82,6 +87,32 @@ class kolab_files_engine
         }
     }
 
+    /**
+     * Template object for folder creation form in "Save as" dialog
+     */
+    public function folder_create_form($attr)
+    {
+        $attrib['name'] = 'folder-create-form';
+        if (empty($attrib['id'])) {
+            $attrib['id'] = 'folder-create-form';
+        }
+
+        $input_name = new html_inputfield(array('name' => 'folder_name'));
+        $out = $input_name->show();
+
+//        $input_parent = new html_checkbox(array('name' => 'folder_parent', 'checked' => true, 'value' => 1));
+//        $out .= html::label(null, $input_parent->show() . $this->plugin->gettext('assubfolder'));
+
+        // add form tag around text field
+        if (empty($attrib['form'])) {
+            $out = $this->rc->output->form_tag($attrib, $out);
+        }
+
+        $this->rc->output->add_gui_object('folder-create-form', $attrib['id']);
+
+        return $out;
+    }
+
     /**
      * Get API token for current user session, authenticate if needed
      */
@@ -263,6 +294,8 @@ class kolab_files_engine
             $this->rc->output->show_message($this->plugin->gettext('saveallerror', array('n' => $count)), 'error');
         }
 
+        // @TODO: update quota indicator, make this optional in case files aren't stored in IMAP
+
         $this->rc->output->send();
     }
 

plugins/kolab_files/skins/larry/style.css

@@ -1,5 +1,6 @@
 #files-dialog,
-#files-compose-dialog {
+#files-compose-dialog,
+#files-folder-create {
   display: none;
 }
 
@@ -18,6 +19,10 @@
   width: 190px;
 }
 
+#files-dialog #files-folder-selector {
+  bottom: 40px;
+}
+
 #files-file-selector {
   position: absolute;
   top: 5px;
@@ -29,6 +34,16 @@
   overflow: auto;
 }
 
+#files-dialog #files-folder-footer {
+  position: absolute;
+  height: 30px;
+  bottom: 0;
+}
+
+#files-dialog #files-folder-footer form {
+  display: inline;
+}
+
 #files-folder-selector table {
   width: 100%;
   border-spacing: 0;

plugins/kolab_files/skins/larry/templates/message_plugin.html

@@ -1,3 +1,12 @@
 <div id="files-dialog" class="uidialog">
     <div id="files-folder-selector"></div>
+    <div id="files-folder-footer">
+        <input id="folder-create-start-button" onclick="kolab_files_folder_form()" type="button" value="<roundcube:label name="kolab_files.foldercreate" />">
+        <div id="files-folder-create">
+            <roundcube:object name="folder-create-form" />
+            <input id="folder-create-save-button" onclick="kolab_directory_create()" type="button" class="button mainaction" value="<roundcube:label name="create" />">
+            <input id="folder-create-cancel-button" onclick="kolab_directory_cancel()" type="button" class="button" value="<roundcube:label name="cancel" />">
+        </div>
+    </div>
 </div>
+<script src="plugins/kolab_files/skins/larry/ui.js" type="text/javascript"></script>

plugins/kolab_files/skins/larry/ui.js

@@ -0,0 +1,41 @@
+function kolab_files_folder_form(link)
+{
+  var form = $('#files-folder-create'),
+    link = $('#folder-create-start-button');
+
+  link.hide();
+  form.show();
+
+  $('input[name="folder_name"]', form).val('').focus();
+}
+
+function kolab_directory_create()
+{
+  var folder = '',
+    form = $('#files-folder-create'),
+    name = $('input[name="folder_name"]', form).val(),
+    parent = file_api.env.folder;
+//    parent = $('input[name="folder_parent"]', form).is(':checked');
+
+  if (!name)
+    return;
+
+  if (parent && file_api.env.folder)
+    folder = file_api.env.folder + file_api.env.directory_separator;
+
+  folder += name;
+
+  kolab_directory_cancel();
+  file_api.folder_create(folder);
+
+  // todo: select created folder
+}
+
+function kolab_directory_cancel()
+{
+  var form = $('#files-folder-create'),
+    link = $('#folder-create-start-button');
+
+  link.show();
+  form.hide();
+}