Add fancy layout

3 files changed, 90 insertions, 5 deletions

diff --git a/apps/files_sharing/css/public.css b/apps/files_sharing/css/public.css
index d09947dab26..18c8781a469 100644
--- a/apps/files_sharing/css/public.css
+++ b/apps/files_sharing/css/public.css
@@ -158,3 +158,37 @@ thead {
 	opacity: 1;
 	cursor: pointer;
 }
+
+#body-public #emptycontent h2 {
+	margin: 10px 0 5px 0;
+}
+
+#body-public #emptycontent h2+p {
+	margin-bottom: 30px;
+}
+
+#body-public #emptycontent .icon-folder {
+	height: 16px;
+	width: 16px;
+	background-size: 16px;
+	display: inline-block;
+	vertical-align: text-top;
+	margin-bottom: 0;
+	opacity: 1;
+}
+
+#body-public #emptycontent .button {
+	background-size: 32px;
+	height: 32px;
+	width: 32px;
+	background-position: 16px; 
+	opacity: .7;
+	font-size: 20px;
+	margin: 20px;
+	padding: 10px 20px;
+	padding-left: 64px;
+}
+
+#body-public .avatardiv {
+	margin: 0 auto;
+}
\ No newline at end of file
diff --git a/apps/files_sharing/js/files_drop.js b/apps/files_sharing/js/files_drop.js
new file mode 100644
index 00000000000..ced26fda220
--- /dev/null
+++ b/apps/files_sharing/js/files_drop.js
@@ -0,0 +1,45 @@
+/*
+ * Copyright (c) 2016 Lukas Reschke <lukas@statuscode.ch>
+ *
+ * This file is licensed under the Affero General Public License version 3
+ * or later.
+ *
+ * See the COPYING-README file.
+ *
+ */
+
+(function ($) {
+	var Drop = {
+		initialize: function () {
+			$(document).bind('drop dragover', function (e) {
+				// Prevent the default browser drop action:
+				e.preventDefault();
+			});
+			$('#publicUploadDiv').fileupload({
+				url: OC.linkTo('files', 'ajax/upload.php'),
+				dataType: 'json',
+				//maxFileSize: fileUploadContainer.data('maxupload'),
+				messages: {
+					maxFileSize: t('files_sharing', 'File is bigger than allowed.')
+				},
+				dropZone: $('#publicUploadDiv'),
+				formData: {
+					dirToken: $('#sharingToken').val()
+				}
+			});
+
+		}
+	};
+
+	$(document).ready(function() {
+		if($('#uploadOnlyInterface').val() === "1") {
+			$('.avatardiv').avatar($('#sharingUserId').val(), 128, true);
+		}
+
+		OCA.Files_Sharing_Drop = Drop;
+		OCA.Files_Sharing_Drop.initialize();
+	});
+
+
+})(jQuery);
+
diff --git a/apps/files_sharing/templates/public.php b/apps/files_sharing/templates/public.php
index 500b187e36e..0989b35f3b1 100644
--- a/apps/files_sharing/templates/public.php
+++ b/apps/files_sharing/templates/public.php
@@ -9,6 +9,7 @@ OCP\Util::addScript('files_sharing', 'public');
 OCP\Util::addScript('files', 'fileactions');
 OCP\Util::addScript('files', 'fileactionsmenu');
 OCP\Util::addScript('files', 'jquery.fileupload');
+OCP\Util::addScript('files_sharing', 'files_drop');
 
 // JS required for folders
 OCP\Util::addStyle('files', 'files');
@@ -30,6 +31,7 @@ OCP\Util::addscript('files', 'keyboardshortcuts');
 	<div id="notification" style="display: none;"></div>
 </div>
 
+<input type="hidden" id="sharingUserId" value="<?php p($_['owner']) ?>">
 <input type="hidden" id="filesApp" name="filesApp" value="1">
 <input type="hidden" id="isPublic" name="isPublic" value="1">
 <input type="hidden" name="dir" value="<?php p($_['dir']) ?>" id="dir">
@@ -115,14 +117,18 @@ OCP\Util::addscript('files', 'keyboardshortcuts');
 			<?php endif; ?>
 		</div>
 		<?php } else { ?>
-			<div id="emptycontent" class="">
-			<div class="icon-upload"></div>
-			<h2><?php p($l->t('Upload files to %s', [$_['shareOwner']])) ?></h2>
-			<a href="#" class="inlineblock button">Select</a>
+		<input type="hidden" id="uploadOnlyInterface" value="1"/>
+			<div id="publicUploadDiv">
+				<div id="emptycontent" class="">
+					<div id="displayavatar"><div class="avatardiv"></div></div>
+					<h2><?php p($l->t('Upload files to %s', [$_['shareOwner']])) ?></h2>
+					<p><span class="icon-folder"></span> <?php p($_['filename']) ?></p>
+					<a href="#" class="button icon-upload"><?php p($l->t('Select')) ?></a>
+				</div>
 			</div>
 		<?php } ?>
 </div>
-<?php if (!isset($_['hideFileList']) || (isset($_['hideFileList']) && $_['hideFileList'] === true)): ?>
+<?php if (!isset($_['hideFileList']) || (isset($_['hideFileList']) && $_['hideFileList'] !== true)): ?>
 	<input type="hidden" name="dir" id="dir" value="" />
 	<div class="hiddenuploadfield">
 	<input type="file" id="file_upload_start" class="hiddenuploadfield" name="files[]"