From ce61543b9da3d561ed43544ecd8ae1fff3291385 Mon Sep 17 00:00:00 2001
From: Thomas Bruederli <thomas@roundcube.net>
Date: Thu, 14 Jun 2012 08:33:07 +0200
Subject: [PATCH] Add support for HTML5 drag & drop attachment uploads

---
 plugins/calendar/lib/calendar_ui.php          | 14 ++++++++-
 plugins/calendar/skins/larry/calendar.css     | 31 +++++++++++++++++--
 .../skins/larry/templates/eventedit.html      |  1 +
 3 files changed, 42 insertions(+), 4 deletions(-)

diff --git a/plugins/calendar/lib/calendar_ui.php b/plugins/calendar/lib/calendar_ui.php
index ba8cc83d..b42a7de3 100644
--- a/plugins/calendar/lib/calendar_ui.php
+++ b/plugins/calendar/lib/calendar_ui.php
@@ -7,7 +7,7 @@
  * @author Thomas Bruederli <bruederli@kolabsys.com>
  *
  * Copyright (C) 2010, Lazlo Westerhof <hello@lazlo.me>
- * Copyright (C) 2011, Kolab Systems AG <contact@kolabsys.com>
+ * Copyright (C) 2012, Kolab Systems AG <contact@kolabsys.com>
  *
  * This program is free software: you can redistribute it and/or modify
  * it under the terms of the GNU Affero General Public License as
@@ -82,6 +82,7 @@ class calendar_ui
     $this->cal->register_handler('plugin.recurrence_form', array($this, 'recurrence_form'));
     $this->cal->register_handler('plugin.attachments_form', array($this, 'attachments_form'));
     $this->cal->register_handler('plugin.attachments_list', array($this, 'attachments_list'));
+    $this->cal->register_handler('plugin.filedroparea', array($this, 'file_drop_area'));
     $this->cal->register_handler('plugin.attendees_list', array($this, 'attendees_list'));
     $this->cal->register_handler('plugin.attendees_form', array($this, 'attendees_form'));
     $this->cal->register_handler('plugin.attendees_freebusy_table', array($this, 'attendees_freebusy_table'));
@@ -628,6 +629,17 @@ class calendar_ui
     );
   }
 
+  /**
+   * Register UI object for HTML5 drag & drop file upload
+   */
+  function file_drop_area($attrib = array())
+  {
+      if ($attrib['id']) {
+          $this->rc->output->add_gui_object('filedrop', $attrib['id']);
+          $this->rc->output->set_env('filedrop', array('action' => 'upload', 'fieldname' => '_attachments'));
+      }
+  }
+
   /**
    * Generate HTML element for attachments list
    */
diff --git a/plugins/calendar/skins/larry/calendar.css b/plugins/calendar/skins/larry/calendar.css
index 0900ccfc..bdd3f71a 100644
--- a/plugins/calendar/skins/larry/calendar.css
+++ b/plugins/calendar/skins/larry/calendar.css
@@ -326,7 +326,7 @@ a.miniColors-trigger {
 }
 
 #edit-attachments {
-	margin-top: 0.6em;
+	margin: 0.6em 0;
 }
 
 #edit-attachments ul li {
@@ -344,13 +344,38 @@ a.miniColors-trigger {
 }
 
 #edit-attachments-form {
-	padding-top: 1.2em;
+	margin-top: 1em;
+	padding-top: 0.8em;
+	border-top: 2px solid #fafafa;
 }
 
 #edit-attachments-form .buttons {
 	margin: 0.5em 0;
 }
 
+#eventedit .droptarget {
+	background-image: url(../../../../skins/larry/images/filedrop.png) !important;
+	background-position: center bottom !important;
+	background-repeat: no-repeat !important;
+}
+
+#eventedit .droptarget.hover,
+#eventedit .droptarget.active {
+	border-color: #019bc6;
+	box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5);
+	-moz-box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5);
+	-webkit-box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5);
+	-o-box-shadow: 0 0 3px 2px rgba(71,135,177, 0.5);
+}
+
+#eventedit .droptarget.hover {
+	background-color: #d9ecf4;
+	box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9);
+	-moz-box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9);
+	-webkit-box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9);
+	-o-box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9);
+}
+
 #event-attachments .attachmentslist li {
 	float: left;
 	margin-right: 1em;
@@ -857,7 +882,7 @@ a.dropdown-link:after {
 }
 
 #eventedit .ui-tabs-panel {
-	min-height: 20em;
+	min-height: 24em;
 }
 
 .alarm-item {
diff --git a/plugins/calendar/skins/larry/templates/eventedit.html b/plugins/calendar/skins/larry/templates/eventedit.html
index a3f58e8b..041f6a51 100644
--- a/plugins/calendar/skins/larry/templates/eventedit.html
+++ b/plugins/calendar/skins/larry/templates/eventedit.html
@@ -91,6 +91,7 @@
 			<div id="edit-attachments-form">
 				<roundcube:object name="plugin.attachments_form" id="calendar-attachment-form" attachmentFieldSize="30" />
 			</div>
+			<roundcube:object name="plugin.filedroparea" id="event-tab-4" />
 		</div>
 	</form>