Dropzone is somewhat working, need to actually try it out

css/dropzone-basic.min.css

@@ -0,0 +1 @@
+.dropzone,.dropzone *{box-sizing:border-box}.dropzone{position:relative}.dropzone .dz-preview{position:relative;display:inline-block;width:120px;margin:0.5em}.dropzone .dz-preview .dz-progress{display:block;height:15px;border:1px solid #aaa}.dropzone .dz-preview .dz-progress .dz-upload{display:block;height:100%;width:0;background:green}.dropzone .dz-preview .dz-error-message{color:red;display:none}.dropzone .dz-preview.dz-error .dz-error-message,.dropzone .dz-preview.dz-error .dz-error-mark{display:block}.dropzone .dz-preview.dz-success .dz-success-mark{display:block}.dropzone .dz-preview .dz-error-mark,.dropzone .dz-preview .dz-success-mark{position:absolute;display:none;left:30px;top:30px;width:54px;height:58px;left:50%;margin-left:-27px}

inc/header.inc.php

@@ -99,6 +99,8 @@ if (is_dir(HESK_PATH . 'install')) {
     <link href="//netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
     <link rel="stylesheet" href="<?php echo HESK_PATH; ?>css/octicons.css" type="text/css">
     <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.css">
+    <link rel="stylesheet" href="<?php echo HESK_PATH; ?>css/dropzone.min.css">
+    <link rel="stylesheet" href="<?php echo HESK_PATH; ?>css/dropzone-basic.min.css">
     <script src="<?php echo HESK_PATH; ?>js/jquery-1.10.2.min.js"></script>
     <script language="Javascript" type="text/javascript" src="<?php echo HESK_PATH; ?>hesk_javascript.js"></script>
     <script language="Javascript" type="text/javascript" src="<?php echo HESK_PATH; ?>js/bootstrap.min.js"></script>

inc/view_attachment_functions.inc.php

@@ -173,7 +173,7 @@ function mfh_getFontAwesomeIconForFileExtension($fileExtension)
 
 function output_dropzone_window() {
     echo '
-    <div class="table table-striped" class="files" id="preview" style="display:none">
+    <div class="table table-striped" class="files" id="previews" style="display:none">
         <div id="template" class="file-row">
             <!-- This is used as the file preview template -->
             <div>
@@ -205,19 +205,21 @@ function display_dropzone_field($url) {
 
     output_dropzone_window();
 
+    $acceptedFiles = implode(',', $hesk_settings['attachments']['allowed_types']);
+
     echo "
     <script type=\"text/javascript\">
     Dropzone.options.filedrop = {
         paramName: 'file',
-        url: '/some/url',
+        url: '".$url."',
         parallelUploads: 1,
         uploadMultiple: false,
         maxFiles: 1,
-        acceptedFiles: '.zip, .rar, .7z',
+        acceptedFiles: '".json_encode($acceptedFiles)."',
         maxFilesize: 2, // MB
-        dictDefaultMessage: 'Drag or click here to select your file for submission. Files must end in .zip, .rar, or .7z.',
-        dictInvalidFileType: 'Sorry, but the file you tried to upload does not end in .zip, .rar, or .7z.',
-        dictResponseError: 'Yikes, something went wrong! Please go to the Mods for HESK forums to report this issue.',
+        dictDefaultMessage: ".json_encode($hesklang['attachment_viewer_message']).",
+        dictInvalidFileType: ".json_encode($hesklang['attachment_invalid_type_message']).",
+        dictResponseError: ".json_encode($hesklang['attachment_upload_error']).",
         previewTemplate: $('#previews').html()
     };
     </script>

index.php

@@ -195,7 +195,7 @@ function print_add_ticket()
                 $onsubmit = 'onsubmit="return validateRichText(\'message-help-block\', \'message-group\', \'message\', \''.htmlspecialchars($hesklang['this_field_is_required']).'\')"';
             }
             ?>
-            <div class="form-horizontal" role="form" method="post" action="submit_ticket.php?submit=1" name="form1"
+            <form class="form-horizontal" role="form" method="post" action="submit_ticket.php?submit=1" name="form1"
                   enctype="multipart/form-data" <?php echo $onsubmit; ?>>
                 <!-- Contact info -->
                 <div class="form-group">
@@ -979,23 +979,24 @@ function print_add_ticket()
                             :</label>
 
                         <div align="left" class="col-sm-9">
-                            <?php
-                            for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
-                                $cls = ($i == 1 && in_array('attachments', $_SESSION['iserror'])) ? ' class="isError" ' : '';
-                                echo '<input type="file" name="attachment[' . $i . ']" size="50" ' . $cls . ' /><br />';
-                            }
-                            ?>
+                            <div class="dropzone" id="filedrop">
+                                <div class="fallback">
+                                    <input type="hidden" name="use-legacy-attachments" value="1">
+                                    <?php
+                                    for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+                                        $cls = ($i == 1 && in_array('attachments', $_SESSION['iserror'])) ? ' class="isError" ' : '';
+                                        echo '<input type="file" name="attachment[' . $i . ']" size="50" ' . $cls . ' /><br />';
+                                    }
+                                    ?>
+                                </div>
+                            </div>
+
                             <a href="file_limits.php" target="_blank"
                                onclick="Javascript:hesk_window('file_limits.php',250,500);return false;"><?php echo $hesklang['ful']; ?></a>
                         </div>
-                        <div class="dropzone" id="filedrop">
-                            <div class="fallback">
-                                <input name="file" type="file" multiple />
-                            </div>
-                        </div>
                     </div>
                     <?php
-                    display_dropzone_field('ticket-attachment', 'someurl');
+                    display_dropzone_field('someurl');
                 }
 
                 if ($hesk_settings['question_use'] || $hesk_settings['secimg_use'])
@@ -1185,7 +1186,7 @@ function print_add_ticket()
                     "<?php echo addslashes($hesklang['select_at_least_one_value']); ?>");
             </script>
         </div>
-    </div>
+    </form>
     <?php if ($columnWidth == 'col-md-10 col-md-offset-1'): ?>
     <div class="col-md-1">&nbsp;</div></div>
 <?php endif; ?>

language/en/text.php

@@ -32,6 +32,9 @@ $hesklang['warning_title_case'] = 'Warning';
 $hesklang['logs'] = 'Logs';
 $hesklang['view_message_log'] = 'View Message Log';
 $hesklang['can_view_logs'] = 'Can view message logs';
+$hesklang['attachment_viewer_message'] = 'Drag or click here to select your file for submission.';
+$hesklang['attachment_invalid_type_message'] = 'Sorry, but the file type you tried to upload is not allowed.';
+$hesklang['attachment_upload_error'] = 'An error occurred when trying to upload. Please try again later.';
 
 // ADDED OR MODIFIED IN Mods for HESK 2.5.2
 $hesklang['manage_statuses'] = 'Manage Statuses';