Rewrite smart upload button to work in IE (#5410)

program/steps/mail/compose.inc

@@ -1631,57 +1631,56 @@ function rcmail_compose_attachment_form($attrib)
 {
     global $RCMAIL;
 
-    // set defaults
-    $attrib += array('id' => 'rcmUploadbox', 'buttons' => 'yes');
-
     // Get filesize, enable upload progress bar
     $max_filesize = $RCMAIL->upload_init();
 
-    $hint      = html::div('hint', $RCMAIL->gettext(array('name' => 'maxuploadsize', 'vars' => array('size' => $max_filesize))));
-    $event     = rcmail_output::JS_OBJECT_NAME . ".command('send-attachment', this.form)";
-    $form_id   = $attrib['id'] . 'Frm';
-    $form_attr = array(
+    $hint = html::div('hint', $RCMAIL->gettext(array('name' => 'maxuploadsize', 'vars' => array('size' => $max_filesize))));
+
+    if ($attrib['mode'] == 'hint') {
+        return $hint;
+    }
+
+    // set defaults
+    $attrib += array('id' => 'rcmUploadbox', 'buttons' => 'yes');
+
+    $event      = rcmail_output::JS_OBJECT_NAME . ".command('send-attachment', this.form)";
+    $form_id    = $attrib['id'] . 'Frm';
+    $input_attr = array('id' => $attrib['id'] . 'Input');
+    $form_attr  = array(
         'id'      => $form_id,
         'name'    => 'uploadform',
         'method'  => 'post',
         'enctype' => 'multipart/form-data'
     );
 
-    $RCMAIL->output->add_gui_object('uploadform', $form_id);
-
-    if (rcube_utils::get_boolean($attrib['smart-button'])) {
-        $form = $RCMAIL->output->form_tag($form_attr, "\n");
-        $RCMAIL->output->add_footer($form);
-
-        $input_attrs = $attrib + array(
+    if ($attrib['mode'] == 'smart') {
+        unset($attrib['buttons']);
+        $form_attr['class'] = 'smart-upload';
+        $input_attr += array(
             // Note: Chrome sometimes executes onchange event on Cancel, make sure a file was selected
             'onchange' => "if ((this.files && this.files.length) || (!this.files && this.value)) $event",
-            'form'     => $form_id,
             'class'    => 'smart-upload',
             'tabindex' => '-1',
         );
+    }
 
-        $label_attrs = array(
-            'for'        => $attrib['id'],
-            'id'         => $attrib['id'] . 'btn',
-            'tabindex'   => $attrib['tabindex'],
-            'onkeypress' => 'if (event.keyCode == 13) this.click()',
-        );
+    $content = rcmail_compose_attachment_field($input_attr);
 
-        return $hint . rcmail_compose_attachment_field($input_attrs)
-            . html::label($label_attrs, $RCMAIL->gettext('addattachment'));
+    if ($attrib['mode'] != 'smart') {
+        $content  = html::div(null, $content);
+        $content .= $hint;
     }
 
-    $button  = new html_inputfield(array('type' => 'button'));
-    $content = html::div(null, rcmail_compose_attachment_field()) . $hint;
-
     if (rcube_utils::get_boolean($attrib['buttons'])) {
+        $button   = new html_inputfield(array('type' => 'button'));
         $content .= html::div('buttons',
             $button->show($RCMAIL->gettext('close'), array('class' => 'button', 'onclick' => "$('#$attrib[id]').hide()")) . ' ' .
             $button->show($RCMAIL->gettext('upload'), array('class' => 'button mainaction', 'onclick' => $event))
         );
     }
 
+    $RCMAIL->output->add_gui_object('uploadform', $form_id);
+
     return html::div($attrib, $RCMAIL->output->form_tag($form_attr, $content));
 }
 

skins/larry/styles.css

@@ -181,6 +181,7 @@ input.mainaction {
 	font-weight: bold;
 }
 
+form.smart-upload,
 input.smart-upload {
 	visibility: hidden;
 	width: 1px;
@@ -190,11 +191,6 @@ input.smart-upload {
 
 /** link buttons **/
 
-input.smart-upload + label {
-	cursor: pointer;
-}
-
-input.smart-upload + label,
 a.button,
 .buttongroup {
 	display: inline-block;
@@ -218,8 +214,6 @@ a.button,
 	white-space: nowrap;
 }
 
-input.smart-upload:focus + label,
-input.smart-upload + label:focus,
 a.button:focus,
 input.button:focus {
 	border-color: #4fadd5;

skins/larry/templates/compose.html

@@ -30,7 +30,7 @@
 		<a href="#languages" class="dropbuttontip" id="spellmenulink" onclick="UI.toggle_popup('spellmenu',event);return false" aria-haspopup="true" aria-expanded="false" tabindex="2">Select Spell Language</a>
 	</span>
 	<roundcube:endif />
-	<roundcube:button name="addattachment" type="link" class="button attach" label="attach" title="addattachment" onclick="$('#uploadformbtn').click(); return false" aria-haspopup="true" aria-expanded="false" tabindex="2" />
+	<roundcube:button name="addattachment" type="link" class="button attach" label="attach" title="addattachment" onclick="$('#uploadformInput').click()" aria-haspopup="true" aria-expanded="false" tabindex="2" />
 	<roundcube:button command="insert-sig" type="link" class="button insertsig disabled" classAct="button insertsig" label="signature" title="insertsignature" tabindex="2" />
 	<a href="#responses" class="button responses" label="responses" title="<roundcube:label name='insertresponse' />" id="responsesmenulink" unselectable="on" onmousedown="return false" onclick="UI.toggle_popup('responsesmenu',event);return false" tabindex="2" aria-haspopup="true" aria-expanded="false" aria-owns="textresponsesmenu"><roundcube:label name="responses" /></a>
 	<roundcube:button command="compose-encrypted" type="link" class="button encrypt disabled" classAct="button encrypt" classSel="button encrypt selected" label="encrypt" title="encryptmessagemailvelope" tabindex="2" style="display:none" />
@@ -176,7 +176,8 @@
 	<div id="compose-attachments" class="rightcol" role="region" aria-labelledby="aria-label-composeattachments">
 		<h2 id="aria-label-composeattachments" class="voice"><roundcube:label name="attachments" /></h2>
 		<div style="text-align:center; margin-bottom:10px">
-			<roundcube:object name="composeAttachmentForm" id="uploadform" smart-button="yes" tabindex="1" />
+            <roundcube:object name="composeAttachmentForm" mode="hint" />
+			<a class="button" tabindex="1" href="#" onclick="$('#uploadformInput').click()"><roundcube:label name="addattachment" /></a>
 		</div>
 		<roundcube:object name="composeAttachmentList" id="attachment-list" class="attachmentslist" tabindex="1" />
 		<roundcube:object name="fileDropArea" id="compose-attachments" />
@@ -198,6 +199,8 @@
 
 </div><!-- end mainscreen -->
 
+<roundcube:object name="composeAttachmentForm" id="uploadform" mode="smart" />
+
 <div id="spellmenu" class="popupmenu" aria-hidden="true"></div>
 
 <div id="responsesmenu" class="popupmenu" aria-hidden="true">