Display a dialog for mail import with supported format description and upload size hint

CHANGELOG

@@ -57,6 +57,7 @@ CHANGELOG Roundcube Webmail
 - Reset onerror on images if placeholder does not exist to prevent from requests storm
 - Unified and simplified code for loading content frame for responses and identities
 - Display contact import and advanced search in popup dialogs
+- Display a dialog for mail import with supported format description and upload size hint
 - Make possible to set (some) config options from a skin
 - Added optional checkbox selection for the list widget
 - Make 'compose' command always enabled

program/js/app.js

@@ -1430,7 +1430,13 @@ function rcube_webmail()
       ret = false;
     this.triggerEvent('actionafter', { props:props, action:command, aborted:aborted, ret:ret, originalEvent:event});
 
-    return ret === false ? false : obj ? false : true;
+    if (ret === false)
+      return false;
+
+    if (obj || aborted === true)
+      return false;
+
+    return true;
   };
 
   // set command(s) enabled or disabled

program/localization/en_US/labels.inc

@@ -223,6 +223,8 @@ $labels['folderactions'] = 'Folder actions...';
 $labels['compact'] = 'Compact';
 $labels['empty'] = 'Empty';
 $labels['importmessages'] = 'Import messages';
+$labels['mailimportdesc'] = 'You can upload mail using files in <a href="https://en.wikipedia.org/wiki/Email#Message_format">MIME</a> or <a href="https://en.wikipedia.org/wiki/Mbox">Mbox</a> format.';
+$labels['mailimportzip'] = 'Multiple files can be compressed into zip archives.';
 
 $labels['quota'] = 'Disk usage';
 $labels['unknown'] = 'unknown';
@@ -479,7 +481,7 @@ $labels['importreplace'] = 'Replace the entire address book';
 $labels['importgroups'] = 'Import group assignments';
 $labels['importgroupsall'] = 'All (create groups if necessary)';
 $labels['importgroupsexisting'] = 'Only for existing groups';
-$labels['importdesc'] = 'You can upload contacts from an existing address book.<br/>We currently support importing addresses from the <a href="http://en.wikipedia.org/wiki/VCard">vCard</a> or CSV (comma-separated) data format.';
+$labels['importdesc'] = 'You can upload contacts from an existing address book.<br/>We currently support importing addresses from the <a href="https://en.wikipedia.org/wiki/VCard">vCard</a> or CSV (comma-separated) data format.';
 $labels['done'] = 'Done';
 
 // settings

program/steps/mail/func.inc

@@ -1687,16 +1687,23 @@ function rcmail_message_import_form($attrib = array())
 {
     global $RCMAIL;
 
-    $RCMAIL->output->add_label('selectimportfile','importwait');
+    $RCMAIL->output->add_label('selectimportfile', 'importwait', 'importmessages');
 
-    $input_attr = array(
+    $description = $RCMAIL->gettext('mailimportdesc');
+    $input_attr  = array(
         'multiple' => true,
         'name'     => '_file[]',
-        'accept'   => ".eml, .mbox, message/rfc822, text/*",
+        'accept'   => '.eml, .mbox, .msg, message/rfc822, text/*',
     );
 
+    if (class_exists('ZipArchive', false)) {
+        $input_attr['accept'] .= '.zip, application/zip, application/x-zip';
+        $description          .= ' ' . $RCMAIL->gettext('mailimportzip');
+    }
+
     $attrib['prefix'] = html::tag('input', array('type' => 'hidden', 'name' => '_unlock', 'value' => ''))
-        . html::tag('input', array('type' => 'hidden', 'name' => '_framed', 'value' => '1'));
+        . html::tag('input', array('type' => 'hidden', 'name' => '_framed', 'value' => '1'))
+        . html::p(null, $description);
 
     return $RCMAIL->upload_form($attrib, 'importform', 'import-messages', $input_attr);
 }

skins/elastic/templates/includes/mail-menu.html

@@ -61,7 +61,8 @@
 	<ul class="toolbarmenu listing" role="menu" aria-labelledby="aria-label-message-menu">
 		<roundcube:button type="link-menuitem" command="print" label="printmessage" class="print" classAct="print active" data-hidden="small"/>
 		<roundcube:if condition="template:name != 'message'" />
-			<roundcube:button type="link-menuitem" command="import-messages" label="import" class="import" classAct="import active" name="messageimport" onclick="if (rcmail.command_enabled('import-messages')) rcmail.upload_input('uploadform')" />
+			<roundcube:button type="link-menuitem" command="import-messages" label="import" class="import" classAct="import active"
+				name="messageimport" onclick="UI.import_dialog()" />
 		<roundcube:endif />
 		<roundcube:button type="link-menuitem" command="download" label="export" class="download" classAct="download active" />
 		<roundcube:button type="link-menuitem" command="edit" prop="new" label="editasnew" class="edit asnew" classAct="edit asnew active" />
@@ -83,3 +84,7 @@
 		<roundcube:container name="markmenu" id="markmessage-menu" />
 	</ul>
 </div>
+
+<roundcube:if condition="template:name != 'message'" />
+	<roundcube:object name="messageimportform" id="uploadform" class="popupmenu formcontent" buttons="no" />
+<roundcube:endif />

skins/elastic/templates/mail.html

@@ -184,6 +184,4 @@
 	<roundcube:add_label name="listoptionstitle" />
 </div>
 
-<roundcube:object name="messageimportform" id="uploadform" mode="smart" />
-
 <roundcube:include file="includes/footer.html" />

skins/elastic/ui.js

@@ -59,6 +59,7 @@ function rcube_elastic_ui()
     this.popup_init = popup_init;
     this.about_dialog = about_dialog;
     this.headers_dialog = headers_dialog;
+    this.import_dialog = import_dialog;
     this.headers_show = headers_show;
     this.spellmenu = spellmenu;
     this.searchmenu = searchmenu;
@@ -2238,8 +2239,7 @@ function rcube_elastic_ui()
 
         dialog = rcmail.simple_dialog(dialog, rcmail.gettext('listoptionstitle'), save_func, {
             closeOnEscape: true,
-            minWidth: 400,
-            width: width
+            minWidth: 400
         });
     };
 
@@ -2261,7 +2261,6 @@ function rcube_elastic_ui()
             button: support_button,
             button_class: 'help',
             cancel_button: 'close',
-            width: 600,
             height: 400
         });
     };
@@ -2285,11 +2284,28 @@ function rcube_elastic_ui()
 
         rcmail.simple_dialog(dialog, rcmail.gettext('arialabelmessageheaders'), null, {
             cancel_button: 'close',
-            width: 600,
             height: 400
         });
     };
 
+    /**
+     * Mail import dialog
+     */
+    function import_dialog()
+    {
+        var content = $('#uploadform'),
+            dialog = content.clone();
+
+        var save_func = function(e) {
+            return rcmail.command('import-messages', $(dialog.find('form')[0]));
+        };
+
+        rcmail.simple_dialog(dialog, rcmail.gettext('importmessages'), save_func, {
+            closeOnEscape: true,
+            minWidth: 400
+        });
+    };
+
     /**
      * Search options menu popup
      */

skins/larry/templates/mail.html

@@ -171,7 +171,7 @@
 		<roundcube:button command="expunge" type="link-menuitem" label="compact" classAct="active" />
 		<roundcube:button command="purge" type="link-menuitem" label="empty" classAct="active" />
 		<roundcube:button command="mark-all-read" type="link-menuitem" label="markallread" classAct="active" />
-		<roundcube:button command="import-messages" type="link-menuitem" name="messageimport" classAct="active" label="importmessages" onclick="if (rcmail.command_enabled('import-messages')) rcmail.upload_input('uploadform')" />
+		<roundcube:button command="import-messages" type="link-menuitem" name="messageimport" classAct="active" label="importmessages" onclick="UI.import_dialog()" />
 		<roundcube:button command="folders" task="settings" type="link-menuitem" label="managefolders" classAct="active" />
 		<roundcube:container name="mailboxoptions" id="mailboxoptionsmenu" />
 	</ul>
@@ -262,7 +262,7 @@
 	</div>
 </div>
 
-<roundcube:object name="messageimportform" id="uploadform" mode="smart" />
+<roundcube:object name="messageimportform" id="uploadform" buttons="no" class="popupdialog" />
 
 <roundcube:include file="/includes/footer.html" />
 

skins/larry/ui.js

@@ -40,9 +40,9 @@ function rcube_mail_ui()
   this.show_popup = show_popup;
   this.toggle_popup = toggle_popup;
   this.add_popup = add_popup;
+  this.import_dialog = import_dialog;
   this.set_searchmod = set_searchmod;
   this.set_searchscope = set_searchscope;
-  this.show_uploadform = show_uploadform;
   this.show_header_row = show_header_row;
   this.hide_header_row = hide_header_row;
   this.update_quota = update_quota;
@@ -181,8 +181,7 @@ function rcube_mail_ui()
         }
       }
       else if (rcmail.env.action == 'compose') {
-        rcmail.addEventListener('aftersend-attachment', show_uploadform)
-          .addEventListener('fileappended', function(e) { if (e.attachment.complete) attachmentmenu_append(e.item); })
+        rcmail.addEventListener('fileappended', function(e) { if (e.attachment.complete) attachmentmenu_append(e.item); })
           .addEventListener('aftertoggle-editor', function(e) {
             window.setTimeout(function() { layout_composeview() }, 200);
             if (e && e.mode)
@@ -235,8 +234,7 @@ function rcube_mail_ui()
         rcmail.init_pagejumper('#pagejumper');
 
         rcmail.addEventListener('setquota', update_quota)
-          .addEventListener('layout-change', mail_layout)
-          .addEventListener('afterimport-messages', show_uploadform);
+          .addEventListener('layout-change', mail_layout);
       }
       else if (rcmail.env.action == 'get') {
         new rcube_splitter({ id:'mailpartsplitterv', p1:'#messagepartheader', p2:'#messagepartcontainer',
@@ -300,8 +298,7 @@ function rcube_mail_ui()
     }
     /***  addressbook task  ***/
     else if (rcmail.env.task == 'addressbook') {
-      rcmail.addEventListener('afterupload-photo', show_uploadform)
-        .addEventListener('beforepushgroup', push_contactgroup)
+      rcmail.addEventListener('beforepushgroup', push_contactgroup)
         .addEventListener('beforepopgroup', pop_contactgroup)
         .addEventListener('menu-open', menu_toggle)
         .addEventListener('menu-close', menu_toggle);
@@ -1078,63 +1075,24 @@ function rcube_mail_ui()
       });
   }
 
-  function show_uploadform(e)
+  /**
+   * Mail import dialog
+   */
+  function import_dialog()
   {
-    var $dialog = $('#upload-dialog');
+    var content = $('#uploadform'),
+      dialog = content.clone().removeClass('popupdialog');
 
-    // close the dialog
-    if ($dialog.is(':visible')) {
-      $dialog.dialog('close');
-      return;
-    }
+    var save_func = function(e) {
+      return rcmail.command('import-messages', $(dialog.find('form')[0]));
+    };
 
-    // do nothing if mailvelope editor is active
-    if (rcmail.mailvelope_editor)
-      return;
-
-    // add icons to clone file input field
-    if (rcmail.env.action == 'compose' && !$dialog.data('extended')) {
-      $('<a>')
-        .addClass('iconlink add')
-        .attr('href', '#add')
-        .html('Add')
-        .appendTo($('input[type="file"]', $dialog).parent())
-        .click(add_uploadfile);
-      $dialog.data('extended', true);
-    }
-
-    $dialog.dialog({
-      modal: true,
-      resizable: false,
+    rcmail.simple_dialog(dialog, rcmail.gettext('importmessages'), save_func, {
       closeOnEscape: true,
-      title: $dialog.attr('title'),
-      open: function(e) {
-        if (!document.all)
-          $('input[type=file]', $dialog).first().click();
-      },
-      close: function() {
-        try { $('#upload-dialog form').get(0).reset(); }
-        catch(e){ }  // ignore errors
-
-        $dialog.dialog('destroy').hide();
-        $('div.addline', $dialog).remove();
-      },
-      width: 480
-    }).show();
-  }
-
-  function add_uploadfile(e)
-  {
-    var div = $(this).parent();
-    var clone = div.clone().addClass('addline').insertAfter(div);
-    clone.children('.iconlink').click(add_uploadfile);
-    clone.children('input').val('');
-
-    if (!document.all)
-      $('input[type=file]', clone).click();
+      minWidth: 400
+    });
   }
 
-
   /**
    *
    */