From 738b6ae5832fb7c2992ec0dc52399e4dbf3d096d Mon Sep 17 00:00:00 2001
From: Frederic Guillot <fred@kanboard.net>
Date: Sat, 13 Feb 2016 19:24:36 -0500
Subject: Add file drag and drop and asynchronous upload

---
 app/Template/file/new.php | 37 ++++++++++++++++++++++++++++---------
 1 file changed, 28 insertions(+), 9 deletions(-)

(limited to 'app/Template')

diff --git a/app/Template/file/new.php b/app/Template/file/new.php
index 1702638d..e84ef839 100644
--- a/app/Template/file/new.php
+++ b/app/Template/file/new.php
@@ -1,14 +1,33 @@
 <div class="page-header">
     <h2><?= t('Attach a document') ?></h2>
 </div>
+<div id="file-done" style="display:none">
+    <p class="alert alert-success">
+        <?= t('All files have been uploaded successfully.') ?>
+        <?= $this->url->link(t('View uploaded files'), 'task', 'show', array('task_id' => $task['id'], 'project_id' => $task['project_id'])) ?>
+    </p>
+</div>
+
+<div id="file-error-max-size" style="display:none">
+    <p class="alert alert-error">
+        <?= t('The maximum allowed file size is %sB.', $this->text->bytes($max_size)) ?>
+        <a href="#" id="file-browser"><?= t('Choose files again') ?></a>
+    </p>
+</div>
 
-<form action="<?= $this->url->href('file', 'save', array('task_id' => $task['id'], 'project_id' => $task['project_id'])) ?>" method="post" enctype="multipart/form-data">
-    <?= $this->form->csrf() ?>
-    <input type="file" name="files[]" multiple />
-    <div class="form-help"><?= t('Maximum size: ') ?><?= is_integer($max_size) ? $this->text->bytes($max_size) : $max_size ?></div>
-    <div class="form-actions">
-        <input type="submit" value="<?= t('Save') ?>" class="btn btn-blue">
-        <?= t('or') ?>
-        <?= $this->url->link(t('cancel'), 'task', 'show', array('task_id' => $task['id'], 'project_id' => $task['project_id']), false, 'close-popover') ?>
+<div
+    id="file-dropzone"
+    data-max-size="<?= $max_size ?>"
+    data-url="<?= $this->url->href('file', 'save', array('task_id' => $task['id'], 'project_id' => $task['project_id'])) ?>">
+    <div id="file-dropzone-inner">
+        <?= t('Drag and drop your files here') ?> <?= t('or') ?> <a href="#" id="file-browser"><?= t('choose files') ?></a>
     </div>
-</form>
\ No newline at end of file
+</div>
+
+<input type="file" name="files[]" multiple style="display:none" id="file-form-element">
+
+<div class="form-actions">
+    <input type="submit" value="<?= t('Save') ?>" class="btn btn-blue" id="file-upload-button" disabled>
+    <?= t('or') ?>
+    <?= $this->url->link(t('cancel'), 'task', 'show', array('task_id' => $task['id'], 'project_id' => $task['project_id']), false, 'close-popover') ?>
+</div>
-- 
cgit v1.2.3