diff --git a/src/Content/Conversation.php b/src/Content/Conversation.php
index 249190b1a..7cf207627 100644
--- a/src/Content/Conversation.php
+++ b/src/Content/Conversation.php
@@ -445,6 +445,7 @@ class Conversation
$this->page->registerFooterScript(Theme::getPathForFile('js/friendica-tagsinput/friendica-tagsinput.js'));
$this->page->registerStylesheet(Theme::getPathForFile('js/friendica-tagsinput/friendica-tagsinput.css'));
$this->page->registerStylesheet(Theme::getPathForFile('js/friendica-tagsinput/friendica-tagsinput-typeahead.css'));
+ $this->page->registerStylesheet(Theme::getPathForFile('vendor/enyo/dropzone/dist/min/dropzone.min.css'));
$live_update_div = '';
diff --git a/src/Core/ACL.php b/src/Core/ACL.php
index 4ed8d602a..45f8e1128 100644
--- a/src/Core/ACL.php
+++ b/src/Core/ACL.php
@@ -59,8 +59,10 @@ class ACL
$page->registerFooterScript(Theme::getPathForFile('asset/typeahead.js/dist/typeahead.bundle.js'));
$page->registerFooterScript(Theme::getPathForFile('js/friendica-tagsinput/friendica-tagsinput.js'));
+ $page->registerFooterScript(Theme::getPathForFile('../vendor/enyo/dropzone/dist/min/dropzone.min.js'));
$page->registerStylesheet(Theme::getPathForFile('js/friendica-tagsinput/friendica-tagsinput.css'));
$page->registerStylesheet(Theme::getPathForFile('js/friendica-tagsinput/friendica-tagsinput-typeahead.css'));
+ $page->registerStylesheet(Theme::getPathForFile('../vendor/enyo/dropzone/dist/min/dropzone.min.css'));
$contacts = self::getValidMessageRecipientsForUser(DI::userSession()->getLocalUserId());
diff --git a/src/Module/Item/Compose.php b/src/Module/Item/Compose.php
index d44fe2cd7..1bb56a3f7 100644
--- a/src/Module/Item/Compose.php
+++ b/src/Module/Item/Compose.php
@@ -164,7 +164,7 @@ class Compose extends BaseModule
$this->page->registerFooterScript(Theme::getPathForFile('js/ajaxupload.js'));
$this->page->registerFooterScript(Theme::getPathForFile('js/linkPreview.js'));
$this->page->registerFooterScript(Theme::getPathForFile('js/compose.js'));
-
+ $this->page->registerFooterScript(Theme::getPathForFile('../vendor/enyo/dropzone/dist/min/dropzone.min.js'));
$contact = Contact::getById($a->getContactId());
if ($this->pConfig->get(DI::userSession()->getLocalUserId(), 'system', 'set_creation_date')) {
diff --git a/view/templates/item/compose.tpl b/view/templates/item/compose.tpl
index 50e21b149..1143a5efb 100644
--- a/view/templates/item/compose.tpl
+++ b/view/templates/item/compose.tpl
@@ -1,10 +1,17 @@
-<div class="generic-page-wrapper">
+<div class="generic-page-wrapper"css>
<h2>{{$l10n.compose_title}}</h2>
{{if $l10n.always_open_compose}}
<p>{{$l10n.always_open_compose nofilter}}</p>
{{/if}}
<div id="profile-jot-wrapper">
- <form class="comment-edit-form" data-item-id="{{$id}}" id="comment-edit-form-{{$id}}" action="compose/{{$type}}" method="post">
+ <!--form action="/media/photo/upload?response=url&album="
+ class="dropzone" id="my-great-dropzone"></form-->
+ <!--form id="dropzone" action="/media/photo/upload?response=json&album=" class="dropzone" method="post" enctype="multipart/form-data">
+ <div class="fallback">
+ <input name="file" type="file" multiple />
+ </div>
+ </form-->
+ <form class="comment-edit-form" data-item-id="{{$id}}" id="comment-edit-form-{{$id}}" action="compose/{{$type}}" method="post" class="dropzone">
{{*<!--<input type="hidden" name="return" value="{{$return_path}}" />-->*}}
<input type="hidden" name="post_id_random" value="{{$rand_num}}" />
<input type="hidden" name="post_type" value="{{$posttype}}" />
@@ -71,6 +78,7 @@
<span role="presentation" id="character-counter" class="grey text-info"></span>
<button type="button" class="btn btn-defaul" onclick="preview_comment({{$id}});" id="comment-edit-preview-link-{{$id}}" tabindex="5"><i class="fa fa-eye"></i> {{$l10n.preview}}</button>
<button type="submit" class="btn btn-primary" id="comment-edit-submit-{{$id}}" name="submit" tabindex="4"><i class="fa fa-envelope"></i> {{$l10n.submit}}</button>
+ <div id="dz-previewsCompose" class="dropzone-previews"></div>
</p>
<div id="comment-edit-preview-{{$id}}" class="comment-edit-preview" style="display:none;"></div>
@@ -94,3 +102,41 @@
</form>
</div>
</div>
+<script>
+ var dropzoneCompose = new Dropzone(document.body, { // camelized version of the `id`
+ paramName: "userfile", // The name that will be used to transfer the file
+ maxFilesize: 2, // MB
+ previewsContainer: '#dz-previewsCompose',
+ preventDuplicates: true,
+ clickable: true,
+ thumbnailWidth: 100,
+ thumbnailHeight: 100,
+ url: "/media/photo/upload?response=url&album=",
+ accept: function(file, done) {
+ done();
+ },
+ init: function() {
+ this.on("success", function(file, serverResponse) {
+ var target = $(':focus').closest('.comment-edit-form').find('.comment-edit-text');
+ var resp = $(serverResponse).find('div#content').text()
+ if (target.setRangeText) {
+ //if setRangeText function is supported by current browser
+ target.setRangeText(" " + $.trim(resp) + " ")
+ } else {
+ target.focus()
+ document.execCommand('insertText', false /*no UI*/, $.trim(resp));
+ }
+ });
+ },
+ });
+ document.onpaste = function(event){
+ const items = (event.clipboardData || event.originalEvent.clipboardData).items;
+ items.forEach((item) => {
+ if (item.kind === 'file') {
+ // adds the file to your dropzone instance
+ console.log(item);
+ dropzoneCompose.addFile(item.getAsFile())
+ }
+ })
+ }
+</script>
diff --git a/view/theme/frio/templates/comment_item.tpl b/view/theme/frio/templates/comment_item.tpl
index 7bce14ee1..ee09b36f3 100644
--- a/view/theme/frio/templates/comment_item.tpl
+++ b/view/theme/frio/templates/comment_item.tpl
@@ -1,8 +1,8 @@
{{if $threaded}}
-<div class="comment-wwedit-wrapper threaded" id="comment-edit-wrapper-{{$id}}">
+<div class="comment-wwedit-wrapper threaded dropzone" id="comment-edit-wrapper-{{$id}}">
{{else}}
-<div class="comment-wwedit-wrapper" id="comment-edit-wrapper-{{$id}}">
+<div class="comment-wwedit-wrapper dropzone" id="comment-edit-wrapper-{{$id}}">
{{/if}}
<form class="comment-edit-form" data-item-id="{{$id}}" id="comment-edit-form-{{$id}}" action="item" method="post">
<input type="hidden" name="profile_uid" value="{{$profile_uid}}" />
@@ -61,6 +61,50 @@
<div class="comment-edit-end clear"></div>
</form>
+ <div id="dz-preview-{{$id}}" class="dropzone-preview"></div>
<div id="comment-edit-preview-{{$id}}" class="comment-edit-preview" style="display:none;"></div>
</div>
+<script>
+ Dropzone.autoDiscover = false;
+ var dropzone{{$id}} = new Dropzone( '#comment-edit-wrapper-{{$id}}', {
+ //var dropzone{{$id}} = new Dropzone( document.body, {
+ paramName: "userfile", // The name that will be used to transfer the file
+ maxFilesize: 6, // MB
+ previewsContainer: '#dz-preview-{{$id}}',
+ preventDuplicates: true,
+ clickable: true,
+ thumbnailWidth: 100,
+ thumbnailHeight: 100,
+ url: "/media/photo/upload?response=url&album=",
+ accept: function(file, done) {
+ done();
+ },
+ init: function() {
+ this.on("success", function(file, serverResponse) {
+ var target = $('#comment-edit-text-{{$id}}')
+ var resp = $(serverResponse).find('div#content').text()
+ if (target.setRangeText) {
+ //if setRangeText function is supported by current browser
+ target.setRangeText(" " + $.trim(resp) + " ")
+ } else {
+ target.focus()
+ document.execCommand('insertText', false /*no UI*/, " " + $.trim(resp) + " ");
+ }
+ });
+ },
+ });
+
+ $('#comment-edit-wrapper-{{$id}}').on('paste', function(event){
+ const items = (event.clipboardData || event.originalEvent.clipboardData).items;
+ items.forEach((item) => {
+ if (item.kind === 'file') {
+ // adds the file to your dropzone instance
+ console.log(item);
+ dropzone{{$id}}.addFile(item.getAsFile())
+ }
+ })
+ })
+
+
+</script>
diff --git a/view/theme/frio/templates/head.tpl b/view/theme/frio/templates/head.tpl
index 7851dacbd..b506ad278 100644
--- a/view/theme/frio/templates/head.tpl
+++ b/view/theme/frio/templates/head.tpl
@@ -55,6 +55,8 @@
media="screen" />
<link rel="stylesheet" href="view/theme/frio/css/font-awesome.custom.css?v={{$smarty.const.FRIENDICA_VERSION}}"
type="text/css" media="screen" />
+<link rel="stylesheet" href="vendor/enyo/dropzone/dist/min/dropzone.min.css?v={{$smarty.const.FRIENDICA_VERSION}}"
+ type="text/css" media="screen" />
{{foreach $stylesheets as $stylesheetUrl => $media}}
<link rel="stylesheet" href="{{$stylesheetUrl}}" type="text/css" media="{{$media}}" />
@@ -137,6 +139,7 @@
<script type="text/javascript" src="view/theme/frio/js/hovercard.js?v={{$smarty.const.FRIENDICA_VERSION}}"></script>
{{/if}}
<script type="text/javascript" src="view/theme/frio/js/textedit.js?v={{$smarty.const.FRIENDICA_VERSION}}"></script>
+ <script type="text/javascript" src="vendor/enyo/dropzone/dist/min/dropzone.min.js?v={{$smarty.const.FRIENDICA_VERSION}}"></script>
{{* Include the strings which are needed for some js functions (e.g. translation)
They are loaded into the html <head> so that js functions can use them *}}
diff --git a/view/theme/frio/templates/jot.tpl b/view/theme/frio/templates/jot.tpl
index c38e8531c..285b8e8d7 100644
--- a/view/theme/frio/templates/jot.tpl
+++ b/view/theme/frio/templates/jot.tpl
@@ -70,7 +70,7 @@
</div>
</div>
- <div id="jot-modal-body" class="modal-body">
+ <div id="jot-modal-body" class="modal-body dropzone">
<form id="profile-jot-form" action="{{$action}}" method="post">
<div id="profile-jot-wrapper" aria-labelledby="jot-text-lnk" role="tabpanel" aria-hidden="false">
<div>
@@ -152,6 +152,7 @@
<div id="jot-fbrowser-wrapper" class="minimize" aria-labelledby="jot-browser-link" role="tabpanel" aria-hidden="true"></div>
</form>
+ <div id="dz-preview-jot" class="dropzone-preview"></div>
{{if $content}}<script type="text/javascript">initEditor();</script>{{/if}}
</div>
@@ -178,3 +179,48 @@ can load different content into the jot moadl (e.g. the item edit jot)
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
});
</script>
+<script>
+ Dropzone.autoDiscover = false;
+ var dropzoneJot = new Dropzone( '#jot-modal-body', {
+ //var dropzone{{$id}} = new Dropzone( document.body, {
+ paramName: "userfile", // The name that will be used to transfer the file
+ maxFilesize: 6, // MB
+ previewsContainer: '#dz-preview-jot',
+ url: "/media/photo/upload?response=url&album=",
+ accept: function(file, done) {
+ if (file.name == "justinbieber.jpg") {
+ done("Naha, you don't.");
+ } else {
+ done();
+ }
+ },
+ init: function() {
+ this.on("success", function(file, serverResponse) {
+ var target = $('#profile-jot-text')
+ var resp = $(serverResponse).find('div#content').text()
+ if (target.setRangeText) {
+ //if setRangeText function is supported by current browser
+ target.setRangeText(" " + $.trim(resp) + " ")
+ } else {
+ target.focus()
+ document.execCommand('insertText', false /*no UI*/, " " + $.trim(resp) + " ");
+ }
+ });
+ },
+ });
+
+// document.onpaste = function(event){
+ $('#jot-modal-body').on('paste', function(event){
+ const items = (event.clipboardData || event.originalEvent.clipboardData).items;
+ items.forEach((item) => {
+ if (item.kind === 'file') {
+ // adds the file to your dropzone instance
+ console.log(item);
+ dropzoneJot.addFile(item.getAsFile())
+ }
+ })
+ })
+
+
+</script>
+