Merge pull request #455 from mkoch227/attachments-phase-two

Attachments phase two

admin/admin_reply_ticket.php

@@ -145,10 +145,24 @@ if (strlen($message)) {
 if ($hesk_settings['attachments']['use']) {
     require(HESK_PATH . 'inc/attachments.inc.php');
     $attachments = array();
-    for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+
-        $att = hesk_uploadFile($i);
+    $use_legacy_attachments = hesk_POST('use-legacy-attachments', 0);
-        if ($att !== false && !empty($att)) {
+
-            $attachments[$i] = $att;
+    if ($use_legacy_attachments) {
+        for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+            $att = hesk_uploadFile($i);
+            if ($att !== false && !empty($att)) {
+                $attachments[$i] = $att;
+            }
+        }
+    } else {
+        // The user used the new drag-and-drop system.
+        $temp_attachment_ids = hesk_POST_array('attachment-ids');
+        foreach ($temp_attachment_ids as $temp_attachment_id) {
+            // Simply get the temp info and move it to the attachments table
+            $temp_attachment = mfh_getTemporaryAttachment($temp_attachment_id);
+            $attachments[] = $temp_attachment;
+            mfh_deleteTemporaryAttachment($temp_attachment_id);
         }
     }
 }

admin/admin_submit_ticket.php

@@ -171,10 +171,23 @@ if ($hesk_settings['attachments']['use']) {
     $attachments = array();
     $trackingID = $tmpvar['trackid'];
 
-    for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+    $use_legacy_attachments = hesk_POST('use-legacy-attachments', 0);
-        $att = hesk_uploadFile($i);
+
-        if ($att !== false && !empty($att)) {
+    if ($use_legacy_attachments) {
-            $attachments[$i] = $att;
+        for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+            $att = hesk_uploadFile($i);
+            if ($att !== false && !empty($att)) {
+                $attachments[$i] = $att;
+            }
+        }
+    } else {
+        // The user used the new drag-and-drop system.
+        $temp_attachment_ids = hesk_POST_array('attachment-ids');
+        foreach ($temp_attachment_ids as $temp_attachment_id) {
+            // Simply get the temp info and move it to the attachments table
+            $temp_attachment = mfh_getTemporaryAttachment($temp_attachment_id);
+            $attachments[] = $temp_attachment;
+            mfh_deleteTemporaryAttachment($temp_attachment_id);
         }
     }
 }

admin/admin_ticket.php

@@ -314,12 +314,27 @@ if (isset($_POST['notemsg']) && hesk_token_check('POST')) {
         require(HESK_PATH . 'inc/htmLawed.php');
         require(HESK_PATH . 'inc/attachments.inc.php');
         $attachments = array();
-        for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+
-            $att = hesk_uploadFile($i);
+        $use_legacy_attachments = hesk_POST('use-legacy-attachments', 0);
-            if ($att !== false && !empty($att)) {
+
-                $attachments[$i] = $att;
+        if ($use_legacy_attachments) {
+            for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+                $att = hesk_uploadFile($i);
+                if ($att !== false && !empty($att)) {
+                    $attachments[$i] = $att;
+                }
+            }
+        } else {
+            // The user used the new drag-and-drop system.
+            $temp_attachment_ids = hesk_POST_array('attachment-ids');
+            foreach ($temp_attachment_ids as $temp_attachment_id) {
+                // Simply get the temp info and move it to the attachments table
+                $temp_attachment = mfh_getTemporaryAttachment($temp_attachment_id);
+                $attachments[] = $temp_attachment;
+                mfh_deleteTemporaryAttachment($temp_attachment_id);
             }
         }
+
     }
     $myattachments = '';
 
@@ -1238,23 +1253,32 @@ require_once(HESK_PATH . 'inc/show_admin_nav.inc.php');
                 ?>
 
                 <div id="notesform" style="display:<?php echo isset($_SESSION['note_message']) ? 'block' : 'none'; ?>">
-                    <form data-toggle="validator" method="post" action="admin_ticket.php" style="margin:0px; padding:0px;"
+                    <form class="form-horizontal" data-toggle="validator" method="post" action="admin_ticket.php" style="margin:0px; padding:0px;"
                           enctype="multipart/form-data">
-                        <div class="form-group">
+                        <div class="row">
-                        <textarea data-error="<?php echo htmlspecialchars($hesklang['this_field_is_required']) ?>" class="form-control" name="notemsg" rows="6"
+                            <div class="col-md-6">
-                                  cols="60" required><?php echo isset($_SESSION['note_message']) ? stripslashes(hesk_input($_SESSION['note_message'])) : ''; ?></textarea>
+                                <div class="form-group">
-                            <div class="help-block with-errors"></div>
+                                    <textarea style="min-height: 150px" data-error="<?php echo htmlspecialchars($hesklang['this_field_is_required']) ?>" class="form-control" name="notemsg" rows="6"
+                                              cols="60" required><?php echo isset($_SESSION['note_message']) ? stripslashes(hesk_input($_SESSION['note_message'])) : ''; ?></textarea>
+                                    <div class="help-block with-errors"></div>
+                                </div>
+                            </div>
+                            <div class="col-md-6">
+                                <div class="dropzone" id="notesFiledrop">
+                                    <div class="fallback">
+                                        <input type="hidden" name="use-legacy-attachments" value="1">
+                                        <?php
+                                        for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+                                            echo '<input type="file" name="attachment[' . $i . ']" size="50" /><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>
-                        <?php
+                        <?php display_dropzone_field($hesk_settings['hesk_url'] . '/internal-api/ticket/upload-attachment.php', 'notesFiledrop'); ?>
-                        // attachments
-                        if ($hesk_settings['attachments']['use']) {
-                            echo '<br />';
-                            for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
-                                echo '<input type="file" name="attachment[' . $i . ']" size="50" /><br />';
-                            }
-                            echo '<br />';
-                        }
-                        ?>
                         <input class="btn btn-default" type="submit" value="<?php echo $hesklang['s']; ?>"/><input
                             type="hidden" name="track" value="<?php echo $trackingID; ?>"/>
                         <i><?php echo $hesklang['nhid']; ?></i>
@@ -1806,15 +1830,23 @@ function hesk_printReplyForm()
                 <label for="attachments" class="col-sm-3 control-label"><?php echo $hesklang['attachments']; ?>:</label>
 
                 <div class="col-sm-9">
-                    <?php for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+                    <div class="dropzone" id="filedrop">
-                        echo '<input type="file" name="attachment[' . $i . ']" size="50" /><br />';
+                        <div class="fallback">
-                    }
+                            <input type="hidden" name="use-legacy-attachments" value="1">
-
+                            <?php
-                    echo '<a href="Javascript:void(0)" onclick="Javascript:hesk_window(\'../file_limits.php\',250,500);return false;">' . $hesklang['ful'] . '</a>';
+                            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>
             <?php
+            display_dropzone_field($hesk_settings['hesk_url'] . '/internal-api/ticket/upload-attachment.php');
         }
         ?>
         <div class="form-group">

admin/manage_knowledgebase.php

@@ -37,6 +37,7 @@ define('PAGE_TITLE', 'ADMIN_KB');
 require(HESK_PATH . 'hesk_settings.inc.php');
 require(HESK_PATH . 'inc/common.inc.php');
 require(HESK_PATH . 'inc/admin_functions.inc.php');
+require(HESK_PATH . 'inc/view_attachment_functions.inc.php');
 hesk_load_database_functions();
 
 // Check for POST requests larger than what the server can handle
@@ -434,10 +435,18 @@ if (!isset($_SESSION['hide']['new_article']))
                         </div>
                         <div class="form-group">
                             <label for="attachments" class="control-label"><?php echo $hesklang['attachments']; ?> (<a href="Javascript:void(0)" onclick="Javascript:hesk_window('../file_limits.php',250,500);return false;"><?php echo $hesklang['ful']; ?></a>)</label>
-                            <input type="file" name="attachment[1]" size="50" /><br />
+                            <div class="dropzone" id="filedrop">
-                            <input type="file" name="attachment[2]" size="50" /><br />
+                                <div class="fallback">
-                            <input type="file" name="attachment[3]" size="50" />
+                                    <input type="hidden" name="use-legacy-attachments" value="1">
+                                    <?php
+                                    for ($i = 1; $i < 4; $i++) {
+                                        echo '<input type="file" name="attachment[' . $i . ']" size="50" ' . $cls . ' /><br />';
+                                    }
+                                    ?>
+                                </div>
+                            </div>
                         </div>
+                        <?php display_dropzone_field($hesk_settings['hesk_url'] . '/internal-api/admin/knowledgebase/upload-attachment.php'); ?>
                         <br>
                         <div class="form-group">
                             <input type="hidden" name="a" value="new_article" />
@@ -1129,14 +1138,26 @@ function save_article()
     require_once(HESK_PATH . 'inc/posting_functions.inc.php');
     require_once(HESK_PATH . 'inc/attachments.inc.php');
     $attachments = array();
-    for ($i=1;$i<=3;$i++)
+    $use_legacy_attachments = hesk_POST('use-legacy-attachments', 0);
-    {
+
-        $att = hesk_uploadFile($i, false);
+    if ($use_legacy_attachments) {
-        if ( ! empty($att))
+        for ($i=1;$i<=3;$i++) {
-        {
+            $att = hesk_uploadFile($i, false);
-            $attachments[$i] = $att;
+            if ( ! empty($att)) {
+                $attachments[$i] = $att;
+            }
+        }
+    } else {
+        // The user used the new drag-and-drop system.
+        $temp_attachment_ids = hesk_POST_array('attachment-ids');
+        foreach ($temp_attachment_ids as $temp_attachment_id) {
+            // Simply get the temp info and move it to the attachments table
+            $temp_attachment = mfh_getTemporaryAttachment($temp_attachment_id);
+            $attachments[] = $temp_attachment;
+            mfh_deleteTemporaryAttachment($temp_attachment_id);
         }
     }
+
 	$myattachments='';
 
     /* Any errors? */
@@ -1468,17 +1489,27 @@ function edit_article()
                             }
                             ?>
 
-                            <input type="file" name="attachment[1]" size="50" /><br />
+                            <div class="dropzone" id="filedrop">
-                            <input type="file" name="attachment[2]" size="50" /><br />
+                                <div class="fallback">
-                            <input type="file" name="attachment[3]" size="50" />
+                                    <input type="hidden" name="use-legacy-attachments" value="1">
+                                    <?php
+                                    for ($i = 1; $i < 4; $i++) {
+                                        echo '<input type="file" name="attachment[' . $i . ']" size="50" ' . $cls . ' /><br />';
+                                    }
+                                    ?>
+                                </div>
+                            </div>
+                            <?php display_dropzone_field($hesk_settings['hesk_url'] . '/internal-api/admin/knowledgebase/upload-attachment.php'); ?>
 
                             <input type="hidden" name="a" value="save_article" />
                             <input type="hidden" name="id" value="<?php echo $id; ?>" />
                             <input type="hidden" name="old_type" value="<?php echo $article['type']; ?>" />
                             <input type="hidden" name="old_catid" value="<?php echo $catid; ?>" />
                             <input type="hidden" name="token" value="<?php hesk_token_echo(); ?>" /><br>
-                            <input type="submit" value="<?php echo $hesklang['kb_save']; ?>" class="btn btn-default" />
+                            <div class="btn-group">
-                            <a class="btn btn-default" href="manage_knowledgebase.php?a=manage_cat&amp;catid=<?php echo $catid; ?>"><?php echo $hesklang['cancel']; ?></a>
+                                <input type="submit" value="<?php echo $hesklang['kb_save']; ?>" class="btn btn-primary" />
+                                <a class="btn btn-default" href="manage_knowledgebase.php?a=manage_cat&amp;catid=<?php echo $catid; ?>"><?php echo $hesklang['cancel']; ?></a>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -1954,14 +1985,29 @@ function new_article()
 	require_once(HESK_PATH . 'inc/posting_functions.inc.php');
     require_once(HESK_PATH . 'inc/attachments.inc.php');
     $attachments = array();
-    for ($i=1;$i<=3;$i++)
+
-    {
+    $use_legacy_attachments = hesk_POST('use-legacy-attachments', 0);
-        $att = hesk_uploadFile($i, false);
+
-        if ( ! empty($att))
+    if ($use_legacy_attachments) {
+        for ($i=1; $i<=3; $i++)
         {
-            $attachments[$i] = $att;
+            $att = hesk_uploadFile($i, false);
+            if ( ! empty($att))
+            {
+                $attachments[$i] = $att;
+            }
+        }
+    } else {
+        // The user used the new drag-and-drop system.
+        $temp_attachment_ids = hesk_POST_array('attachment-ids');
+        foreach ($temp_attachment_ids as $temp_attachment_id) {
+            // Simply get the temp info and move it to the attachments table
+            $temp_attachment = mfh_getTemporaryAttachment($temp_attachment_id);
+            $attachments[] = $temp_attachment;
+            mfh_deleteTemporaryAttachment($temp_attachment_id);
         }
     }
+
 	$myattachments='';
 
     /* Any errors? */

admin/new_ticket.php

@@ -40,6 +40,7 @@ define('AUTOFOCUS', true);
 require(HESK_PATH . 'hesk_settings.inc.php');
 require(HESK_PATH . 'inc/common.inc.php');
 require(HESK_PATH . 'inc/admin_functions.inc.php');
+require(HESK_PATH . 'inc/view_attachment_functions.inc.php');
 hesk_load_database_functions();
 
 hesk_session_start();
@@ -1032,18 +1033,24 @@ if ($hesk_settings['attachments']['use']) {
         <label for="attachments" class="control-label col-sm-3"><?php echo $hesklang['attachments']; ?>:</label>
 
         <div class="col-sm-9">
-            <?php
+            <div class="dropzone" id="filedrop">
-            for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+                <div class="fallback">
-                $cls = ($i == 1 && in_array('attachments', $_SESSION['iserror'])) ? ' class="isError" ' : '';
+                    <input type="hidden" name="use-legacy-attachments" value="1">
-                echo '<input type="file" name="attachment[' . $i . ']" size="50" ' . $cls . ' /><br />';
+                    <?php
-            }
+                    for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
-            ?>
+                        $cls = ($i == 1 && in_array('attachments', $_SESSION['iserror'])) ? ' class="isError" ' : '';
-            <a href="Javascript:void(0)"
+                        echo '<input type="file" name="attachment[' . $i . ']" size="50" ' . $cls . ' /><br />';
-               onclick="Javascript:hesk_window('../file_limits.php',250,500);return false;"><?php echo $hesklang['ful']; ?></a>
+                    }
+                    ?>
+                </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>
     <hr/>
     <?php
+    display_dropzone_field($hesk_settings['hesk_url'] . '/internal-api/ticket/upload-attachment.php');
 }
 ?>
 <!-- Admin options -->

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/attachments.inc.php

@@ -40,13 +40,23 @@ function hesk_uploadFile($i, $isTicket = true)
 {
     global $hesk_settings, $hesklang, $trackingID, $hesk_error_buffer, $modsForHesk_settings;
 
+    $single_file = $i == -1;
     /* Return if name is empty */
-    if (empty($_FILES['attachment']['name'][$i])) {
+    $name = $single_file
+        ? $_FILES['attachment']['name']
+        : $_FILES['attachment']['name'][$i];
+
+    if (empty($name)) {
         return '';
     }
 
+
     /* Parse the name */
-    $file_realname = hesk_cleanFileName($_FILES['attachment']['name'][$i]);
+    if ($single_file) {
+        $file_realname = hesk_cleanFileName($_FILES['attachment']['name']);
+    } else {
+        $file_realname = hesk_cleanFileName($_FILES['attachment']['name'][$i]);
+    }
 
     /* Check file extension */
     $ext = strtolower(strrchr($file_realname, "."));
@@ -55,10 +65,13 @@ function hesk_uploadFile($i, $isTicket = true)
     }
 
     /* Check file size */
-    if ($_FILES['attachment']['size'][$i] > $hesk_settings['attachments']['max_size']) {
+    $size = $single_file
+        ? $_FILES['attachment']['size']
+        : $_FILES['attachment']['size'][$i];
+    if ($size > $hesk_settings['attachments']['max_size']) {
         return hesk_fileError(sprintf($hesklang['file_too_large'], $file_realname));
     } else {
-        $file_size = $_FILES['attachment']['size'][$i];
+        $file_size = $size;
     }
 
     /* Generate a random file name */
@@ -68,11 +81,8 @@ function hesk_uploadFile($i, $isTicket = true)
         $tmp .= $useChars{mt_rand(0, 29)};
     }
 
-    if (defined('KB')) {
+
-        $file_name = substr(md5($tmp . $file_realname), 0, 200) . $ext;
+    $file_name = substr(md5($tmp . $file_realname), 0, 200) . $ext;
-    } else {
-        $file_name = substr($trackingID . '_' . md5($tmp . $file_realname), 0, 200) . $ext;
-    }
 
     // Does the temporary file exist? If not, probably server-side configuration limits have been reached
     // Uncomment this for debugging purposes
@@ -88,7 +98,10 @@ function hesk_uploadFile($i, $isTicket = true)
     if (!$isTicket) {
         $directory = $modsForHesk_settings['kb_attach_dir'];
     }
-    if (!move_uploaded_file($_FILES['attachment']['tmp_name'][$i], dirname(dirname(__FILE__)) . '/' . $directory . '/' . $file_name)) {
+    $file_to_move = $single_file
+        ? $_FILES['attachment']['tmp_name']
+        : $_FILES['attachment']['tmp_name'][$i];
+    if (!move_uploaded_file($file_to_move, dirname(dirname(__FILE__)) . '/' . $directory . '/' . $file_name)) {
         return hesk_fileError($hesklang['cannot_move_tmp']);
     }
 
@@ -130,3 +143,29 @@ function hesk_removeAttachments($attachments, $isTicket)
 
     return true;
 } // End hesk_removeAttachments()
+
+
+function mfh_getTemporaryAttachment($id) {
+    global $hesk_settings;
+
+    $rs = hesk_dbQuery("SELECT * FROM `" . hesk_dbEscape($hesk_settings['db_pfix']) . "temp_attachment` WHERE `id` = " . intval($id));
+    if (hesk_dbNumRows($rs) == 0) {
+        return NULL;
+    }
+    $row = hesk_dbFetchAssoc($rs);
+
+    $info = array(
+        'saved_name' => $row['saved_name'],
+        'real_name' => $row['file_name'],
+        'size' => $row['size']
+    );
+
+    return $info;
+}
+
+
+function mfh_deleteTemporaryAttachment($id) {
+    global $hesk_settings;
+
+    hesk_dbQuery("DELETE FROM `" . hesk_dbEscape($hesk_settings['db_pfix']) . "temp_attachment` WHERE `id` = ".intval($id));
+}

inc/common.inc.php

@@ -1837,3 +1837,10 @@ function mfh_log_warning($location, $message, $user) {
 function mfh_log_error($location, $message, $user) {
     mfh_log($location, $message, 3, $user);
 }
+
+function mfh_bytesToUnits($size) {
+    $bytes_in_megabyte = 1048576;
+    $quotient = $size / $bytes_in_megabyte;
+
+    return intval($quotient);
+}

inc/header.inc.php

@@ -99,9 +99,12 @@ 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>
+    <script type="text/javascript" src="<?php echo HESK_PATH; ?>js/dropzone.min.js"></script>
     <script language="Javascript" type="text/javascript"
             src="<?php echo HESK_PATH; ?>js/modsForHesk-javascript.js"></script>
     <script language="JavaScript" type="text/javascript"
@@ -112,6 +115,7 @@ if (is_dir(HESK_PATH . 'install')) {
     <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.js"></script>
     <script type="text/javascript" src="<?php echo HESK_PATH; ?>js/platform.js"></script>
     <script type="text/javascript" src="<?php echo HESK_PATH; ?>js/bootstrap-validator.min.js"></script>
+    <script type="text/javascript" src="<?php echo HESK_PATH; ?>internal-api/js/core.php"></script>
     <style>
         .navbar-default {
             background-color: <?php echo $modsForHesk_settings['navbarBackgroundColor']; ?>;

inc/headerAdmin.inc.php

@@ -75,11 +75,14 @@ $modsForHesk_settings = mfh_getSettings();
     <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>
+    <script type="text/javascript" src="<?php echo HESK_PATH; ?>js/dropzone.min.js"></script>
     <script language="Javascript" type="text/javascript"
             src="<?php echo HESK_PATH; ?>js/modsForHesk-javascript.js"></script>
-    <script language="Javascript" type="text/javascript" src="<?php echo HESK_PATH; ?>js/bootstrap.min.js"></script>
     <script language="JavaScript" type="text/javascript"
             src="<?php echo HESK_PATH; ?>js/bootstrap-datepicker.js"></script>
     <script type="text/javascript" src="<?php echo HESK_PATH; ?>js/iconset-fontawesome-4.3.0.js"></script>

inc/view_attachment_functions.inc.php

@@ -170,3 +170,88 @@ function mfh_getFontAwesomeIconForFileExtension($fileExtension)
     }
     return $icon;
 }
+
+function output_dropzone_window() {
+    echo '
+    <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>
+                <span class="preview"><img data-dz-thumbnail /></span>
+            </div>
+            <div class="row">
+                <div class="col-md-4 col-sm-12">
+                    <p class="name" data-dz-name></p>
+                    <i class="fa fa-trash fa-2x" style="color: gray; cursor: pointer" title="Remove file" data-dz-remove></i>
+                </div>
+                <div class="col-md-8 col-sm-12">
+                    <p class="size" data-dz-size></p>
+                    <div class="progress progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0" id="total-progress">
+                        <div class="progress-bar progress-bar-success" style="width:0%;" data-dz-uploadprogress></div>
+                    </div>
+                </div>
+            </div>
+            <div class="row">
+                <div class="col-xs-12">
+                    <strong class="error text-danger" data-dz-errormessage></strong>
+                </div>
+            </div>
+        </div>
+    </div>';
+}
+
+function output_attachment_id_holder_container($id) {
+    echo '<div id="attachment-holder-' . $id . '" class="hide"></div>';
+}
+
+function display_dropzone_field($url, $id = 'filedrop') {
+    global $hesk_settings, $hesklang;
+
+    output_dropzone_window();
+    output_attachment_id_holder_container($id);
+
+    $acceptedFiles = implode(',', $hesk_settings['attachments']['allowed_types']);
+    $size = mfh_bytesToUnits($hesk_settings['attachments']['max_size']);
+    $max_files = $hesk_settings['attachments']['max_number'];
+
+    echo "
+    <script type=\"text/javascript\">
+    Dropzone.options.".$id." = {
+        init: function() {
+            this.on('success', function(file, response) {
+                // The response will only be the ID of the attachment in the database
+                outputAttachmentIdHolder(response, '".$id."');
+
+                // Add the database id to the file
+                file['databaseId'] = response;
+            });
+            this.on('removedfile', function(file) {
+                // Remove the attachment from the database and the filesystem.
+                removeAttachment(file['databaseId']);
+            });
+            this.on('queuecomplete', function(progress) {
+                // Stop animating if complete.
+                $('#total-progress').removeClass('active');
+            });
+        },
+        paramName: 'attachment',
+        url: '" . $url . "',
+        parallelUploads: ".$max_files.",
+        uploadMultiple: true,
+        maxFiles: ".$max_files.",
+        acceptedFiles: '".json_encode($acceptedFiles)."',
+        maxFilesize: ".$size.", // MB
+        dictDefaultMessage: ".json_encode($hesklang['attachment_viewer_message']).",
+        dictFallbackMessage: '',
+        dictInvalidFileType: ".json_encode($hesklang['attachment_invalid_type_message']).",
+        dictResponseError: ".json_encode($hesklang['attachment_upload_error']).",
+        dictFileTooBig: ".json_encode($hesklang['attachment_too_large']).",
+        dictCancelUpload: ".json_encode($hesklang['attachment_cancel']).",
+        dictCancelUploadConfirmation: ".json_encode($hesklang['attachment_confirm_cancel']).",
+        dictRemoveFile: ".json_encode($hesklang['attachment_remove']).",
+        previewTemplate: $('#previews').html()
+    };
+    </script>
+    ";
+
+}

index.php

@@ -36,6 +36,7 @@ define('VALIDATOR', 1);
 // Get all the required files and functions
 require(HESK_PATH . 'hesk_settings.inc.php');
 require(HESK_PATH . 'inc/common.inc.php');
+require(HESK_PATH . 'inc/view_attachment_functions.inc.php');
 
 hesk_load_database_functions();
 hesk_dbConnect();
@@ -978,17 +979,24 @@ function print_add_ticket()
                             :</label>
 
                         <div align="left" class="col-sm-9">
-                            <?php
+                            <div class="dropzone" id="filedrop">
-                            for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+                                <div class="fallback">
-                                $cls = ($i == 1 && in_array('attachments', $_SESSION['iserror'])) ? ' class="isError" ' : '';
+                                    <input type="hidden" name="use-legacy-attachments" value="1">
-                                echo '<input type="file" name="attachment[' . $i . ']" size="50" ' . $cls . ' /><br />';
+                                    <?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>
                     <?php
+                    display_dropzone_field($hesk_settings['hesk_url'] . '/internal-api/ticket/upload-attachment.php');
                 }
 
                 if ($hesk_settings['question_use'] || $hesk_settings['secimg_use'])
@@ -1178,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; ?>

install/mods-for-hesk/sql/installSql.php

@@ -713,5 +713,12 @@ function execute260Scripts()
       `id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
       `user_id` INT NOT NULL,
       `token` VARCHAR(500) NOT NULL) ENGINE = MyISAM  DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci");
+    executeQuery("CREATE TABLE `" . hesk_dbEscape($hesk_settings['db_pfix']) . "temp_attachment` (
+      `id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
+      `file_name` VARCHAR(255) NOT NULL,
+      `saved_name` VARCHAR(255) NOT NULL,
+      `size` INT(10) UNSIGNED NOT NULL,
+      `type` ENUM('0','1') NOT NULL,
+      `date_uploaded` TIMESTAMP NOT NULL) ENGINE = MyISAM  DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci");
     executeQuery("UPDATE `" . hesk_dbEscape($hesk_settings['db_pfix']) . "settings` SET `Value` = '2.6.0' WHERE `Key` = 'modsForHeskVersion'");
 }

internal-api/admin/knowledgebase/upload-attachment.php

@@ -0,0 +1,24 @@
+<?php
+define('IN_SCRIPT', 1);
+define('HESK_PATH', '../../../');
+define('INTERNAL_API_PATH', '../../');
+require_once(HESK_PATH . 'hesk_settings.inc.php');
+require_once(HESK_PATH . 'inc/common.inc.php');
+require_once(HESK_PATH . 'inc/attachments.inc.php');
+require_once(HESK_PATH . 'inc/posting_functions.inc.php');
+require_once(INTERNAL_API_PATH . 'core/output.php');
+require_once(INTERNAL_API_PATH . 'dao/attachment_dao.php');
+
+hesk_load_internal_api_database_functions();
+hesk_dbConnect();
+
+$modsForHesk_settings = mfh_getSettings();
+
+if (!empty($_FILES)) {
+    // Only 1 files is ever processed through this endpoint at a time.
+    $id = upload_temp_attachment(-1, false);
+    print json_encode($id);
+    return http_response_code(200);
+}
+
+return http_response_code(400);

internal-api/dao/attachment_dao.php

@@ -0,0 +1,26 @@
+<?php
+
+function upload_temp_attachment($i, $isTicket) {
+    global $hesk_settings;
+
+    $info = hesk_uploadFile($i, $isTicket);
+    $type = $isTicket ? 1 : 0;
+
+    // `type`: 0: ticket, 1: kb
+    hesk_dbQuery("INSERT INTO `" . hesk_dbEscape($hesk_settings['db_pfix']) . "temp_attachment` (`file_name`,`size`, `type`, `date_uploaded`, `saved_name`)
+        VALUES ('" . hesk_dbEscape($info['real_name']) . "','" . hesk_dbEscape($info['size']) . "','" . $type . "',
+            NOW(), '" . hesk_dbEscape($info['saved_name']) . "')");
+
+    return hesk_dbInsertID();
+}
+
+function delete_temp_attachment($id, $isTicket) {
+    global $hesk_settings;
+
+    $attachment_rs = hesk_dbQuery("SELECT `saved_name` FROM `" . hesk_dbEscape($hesk_settings['db_pfix']) . "temp_attachment` WHERE `id` = " . intval($id));
+    $attachment = hesk_dbFetchAssoc($attachment_rs);
+
+    if (hesk_removeAttachments(array($attachment), $isTicket)) {
+        hesk_dbQuery("DELETE FROM `" . hesk_dbEscape($hesk_settings['db_pfix']) . "temp_attachment` WHERE `id` = " . intval($id));
+    }
+}

internal-api/ticket/delete-attachment.php

@@ -0,0 +1,24 @@
+<?php
+define('IN_SCRIPT', 1);
+define('HESK_PATH', '../../');
+define('INTERNAL_API_PATH', '../');
+require_once(HESK_PATH . 'hesk_settings.inc.php');
+require_once(HESK_PATH . 'inc/common.inc.php');
+require_once(HESK_PATH . 'inc/attachments.inc.php');
+require_once(HESK_PATH . 'inc/posting_functions.inc.php');
+require_once(INTERNAL_API_PATH . 'core/output.php');
+require_once(INTERNAL_API_PATH . 'dao/attachment_dao.php');
+
+hesk_load_internal_api_database_functions();
+hesk_dbConnect();
+
+$modsForHesk_settings = mfh_getSettings();
+
+if (isset($_GET['id'])) {
+    $id = $_GET['id'];
+
+    $id = delete_temp_attachment($id, true);
+    return http_response_code(200);
+}
+
+return http_response_code(400);

internal-api/ticket/upload-attachment.php

@@ -0,0 +1,24 @@
+<?php
+define('IN_SCRIPT', 1);
+define('HESK_PATH', '../../');
+define('INTERNAL_API_PATH', '../');
+require_once(HESK_PATH . 'hesk_settings.inc.php');
+require_once(HESK_PATH . 'inc/common.inc.php');
+require_once(HESK_PATH . 'inc/attachments.inc.php');
+require_once(HESK_PATH . 'inc/posting_functions.inc.php');
+require_once(INTERNAL_API_PATH . 'core/output.php');
+require_once(INTERNAL_API_PATH . 'dao/attachment_dao.php');
+
+hesk_load_internal_api_database_functions();
+hesk_dbConnect();
+
+$modsForHesk_settings = mfh_getSettings();
+
+if (!empty($_FILES)) {
+    // Only 1 files is ever processed through this endpoint at a time.
+    $id = upload_temp_attachment(-1, true);
+    print json_encode($id);
+    return http_response_code(200);
+}
+
+return http_response_code(400);

js/modsForHesk-javascript.js

@@ -1,3 +1,6 @@
+//-- Turn off Dropzone autodetection.
+//Dropzone.autoDiscover = false;
+
 //-- Activate anything Mods for HESK needs, such as tooltips.
 var loadJquery = function()
 {
@@ -31,7 +34,6 @@ var loadJquery = function()
             todayBtn: "linked",
             clearBtn: true,
             autoclose: true,
-            autoclose: true,
             todayHighlight: true,
             format: "yyyy-mm-dd"
         });
@@ -203,4 +205,22 @@ function getFriendlyLocation(latitude, longitude) {
     });
 }
 
+function outputAttachmentIdHolder(value, id) {
+    $('#attachment-holder-' + id).append('<input type="hidden" name="attachment-ids[]" value="' + value + '">');
+}
+
+function removeAttachment(id) {
+    $('input[name="attachment-ids[]"][value="' + id + '"]').remove();
+    $.ajax({
+        url: getHelpdeskUrl() + '/internal-api/ticket/delete-attachment.php?id=' + id,
+        method: 'GET',
+        success: function() {
+            console.info('Removed attachment ' + id);
+        },
+        error: function() {
+            console.error('Error removing attachment ' + id);
+        }
+    });
+}
+
 jQuery(document).ready(loadJquery);

language/en/text.php

@@ -32,6 +32,13 @@ $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 files to upload.';
+$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.';
+$hesklang['attachment_too_large'] = 'This attachment is larger than the max filesize permitted.';
+$hesklang['attachment_cancel'] = 'Cancel';
+$hesklang['attachment_confirm_cancel'] = 'Are you sure you want to cancel this upload?';
+$hesklang['attachment_remove'] = 'Remove attachment';
 
 // ADDED OR MODIFIED IN Mods for HESK 2.5.2
 $hesklang['manage_statuses'] = 'Manage Statuses';

reply_ticket.php

@@ -88,10 +88,23 @@ if (strlen($message) && !$modsForHesk_settings['rich_text_for_tickets_for_custom
 if ($hesk_settings['attachments']['use']) {
     require(HESK_PATH . 'inc/attachments.inc.php');
     $attachments = array();
-    for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+
-        $att = hesk_uploadFile($i);
+    $use_legacy_attachments = hesk_POST('use-legacy-attachments', 0);
-        if ($att !== false && !empty($att)) {
+    if ($use_legacy_attachments) {
-            $attachments[$i] = $att;
+        for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+            $att = hesk_uploadFile($i);
+            if ($att !== false && !empty($att)) {
+                $attachments[$i] = $att;
+            }
+        }
+    } else {
+        // The user used the new drag-and-drop system.
+        $temp_attachment_ids = hesk_POST_array('attachment-ids');
+        foreach ($temp_attachment_ids as $temp_attachment_id) {
+            // Simply get the temp info and move it to the attachments table
+            $temp_attachment = mfh_getTemporaryAttachment($temp_attachment_id);
+            $attachments[] = $temp_attachment;
+            mfh_deleteTemporaryAttachment($temp_attachment_id);
         }
     }
 }

submit_ticket.php

@@ -292,10 +292,24 @@ if ($below_limit) {
         $attachments = array();
         $trackingID = $tmpvar['trackid'];
 
-        for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+        $use_legacy_attachments = hesk_POST('use-legacy-attachments', 0);
-            $att = hesk_uploadFile($i);
+
-            if ($att !== false && !empty($att)) {
+        if ($use_legacy_attachments) {
-                $attachments[$i] = $att;
+            // The user went to the fallback file upload system.
+            for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+                $att = hesk_uploadFile($i);
+                if ($att !== false && !empty($att)) {
+                    $attachments[$i] = $att;
+                }
+            }
+        } else {
+            // The user used the new drag-and-drop system.
+            $temp_attachment_ids = hesk_POST_array('attachment-ids');
+            foreach ($temp_attachment_ids as $temp_attachment_id) {
+                // Simply get the temp info and move it to the attachments table
+                $temp_attachment = mfh_getTemporaryAttachment($temp_attachment_id);
+                $attachments[] = $temp_attachment;
+                mfh_deleteTemporaryAttachment($temp_attachment_id);
             }
         }
     }

ticket.php

@@ -630,18 +630,28 @@ function hesk_printCustomerReplyForm($reopen = 0)
         if ($hesk_settings['attachments']['use']) {
             ?>
             <div class="form-group">
-                <label for="attachments" class="col-sm-3 control-label"><?php echo $hesklang['attachments']; ?>:</label>
+                <label for="attachments" class="col-sm-3 control-label"><?php echo $hesklang['attachments']; ?>
+                    :</label>
 
-                <div class="col-sm-9 text-left">
+                <div align="left" class="col-sm-9">
-                    <?php
+                    <div class="dropzone" id="filedrop">
-                    for ($i = 1; $i <= $hesk_settings['attachments']['max_number']; $i++) {
+                        <div class="fallback">
-                        echo '<input type="file" name="attachment[' . $i . ']" size="50" /><br />';
+                            <input type="hidden" name="use-legacy-attachments" value="1">
-                    }
+                            <?php
-                    echo '<a href="file_limits.php" target="_blank" onclick="Javascript:hesk_window(\'file_limits.php\',250,500);return false;">' . $hesklang['ful'] . '</a>';
+                            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>
             <?php
+            display_dropzone_field($hesk_settings['hesk_url'] . '/internal-api/ticket/upload-attachment.php');
         }
         ?>
         <input type="hidden" name="token" value="<?php hesk_token_echo(); ?>"/>