[frio] Add loading animation on comment form submit

diff --git a/mod/photos.php b/mod/photos.php
index c683cc086a887e8ee961926b24d9c721d6ccdde5..5e5917452cae8df359e2dc4549916aedb5ded84c 100644 (file)
--- a/mod/photos.php
+++ b/mod/photos.php
@@ -1404,6 +1404,7 @@ function photos_content(App $a)
                                                '$comment' => DI::l10n()->t('Comment'),
                                                '$submit' => DI::l10n()->t('Submit'),
                                                '$preview' => DI::l10n()->t('Preview'),
+                                               '$loading' => DI::l10n()->t('Loading...'),
                                                '$sourceapp' => DI::l10n()->t($a->sourcename),
                                                '$ww' => '',
                                                '$rand_num' => Crypto::randomDigits(12)

diff --git a/src/Object/Post.php b/src/Object/Post.php
index f55dbde0d5791c7e37b59bbc8131095e6fb31c03..7b8f4b00d6b2ce4879bc735cc1f9898f08b1afaa 100644 (file)
--- a/src/Object/Post.php
+++ b/src/Object/Post.php
@@ -919,6 +919,7 @@ class Post
                                '$myphoto'     => DI::baseUrl()->remove($a->contact['thumb']),
                                '$comment'     => DI::l10n()->t('Comment'),
                                '$submit'      => DI::l10n()->t('Submit'),
+                               '$loading'     => DI::l10n()->t('Loading...'),
                                '$edbold'      => DI::l10n()->t('Bold'),
                                '$editalic'    => DI::l10n()->t('Italic'),
                                '$eduline'     => DI::l10n()->t('Underline'),

diff --git a/view/theme/frio/js/theme.js b/view/theme/frio/js/theme.js
index 29d043a6a41ebaf1ab7cfbc82c83c77dae399f2d..2ea3aa6d2fb2973021264cf4b8e3caa5600b41c1 100644 (file)
--- a/view/theme/frio/js/theme.js
+++ b/view/theme/frio/js/theme.js
@@ -94,6 +94,8 @@ $(document).ready(function(){
                }
        }
 
+       let $body = $('body');
+
        // show bulk deletion button at network page if checkbox is checked
        $("body").change("input.item-select", function(){
                var checked = false;
@@ -368,6 +370,45 @@ $(document).ready(function(){
                showHideEventMap(this);
        });
 
+       // Comment form submit
+       $body.on('submit', '.comment-edit-form', function(e) {
+               e.preventDefault();
+
+               let $form = $(this);
+               let id = $form.data('item-id');
+               let $commentSubmit = $form.find('.comment-edit-submit').button('loading');
+
+               unpause();
+               commentBusy = true;
+
+               $.post(
+                       'item',
+                       $form.serialize(),
+                       'json'
+               )
+               .then(function(data) {
+                       if (data.success) {
+                               $('#comment-edit-wrapper-' + id).hide();
+                               let $textarea = $('#comment-edit-text-' + id);
+                               $textarea.val('');
+                               if ($textarea.get(0)) {
+                                       commentClose($textarea.get(0), id);
+                               }
+                               if (timer) {
+                                       clearTimeout(timer);
+                               }
+                               timer = setTimeout(NavUpdate,10);
+                               force_update = true;
+                               update_item = id;
+                       }
+                       if (data.reload) {
+                               window.location.href = data.reload;
+                       }
+               })
+               .always(function() {
+                       $commentSubmit.button('reset');
+               });
+       })
 });
 
 function openClose(theID) {

diff --git a/view/theme/frio/templates/comment_item.tpl b/view/theme/frio/templates/comment_item.tpl
index b60f5c429e8fb76074ff7e94092e336967d14105..d4284d39b8ce33d0b574abb659396402a8e80e3d 100644 (file)
--- a/view/theme/frio/templates/comment_item.tpl
+++ b/view/theme/frio/templates/comment_item.tpl
@@ -4,7 +4,7 @@
 {{else}}
 <div class="comment-wwedit-wrapper" id="comment-edit-wrapper-{{$id}}">
 {{/if}}
-       <form class="comment-edit-form" data-item-id="{{$id}}" id="comment-edit-form-{{$id}}" action="item" method="post" onsubmit="post_comment({{$id}}); return false;">
+       <form class="comment-edit-form" data-item-id="{{$id}}" id="comment-edit-form-{{$id}}" action="item" method="post">
                <input type="hidden" name="type" value="{{$type}}" />
                <input type="hidden" name="profile_uid" value="{{$profile_uid}}" />
                <input type="hidden" name="parent" value="{{$parent}}" />
@@ -55,9 +55,9 @@
 
                <p class="comment-edit-submit-wrapper">
 {{if $preview}}
-                       <button type="button" class="btn btn-defaul btn-sm" onclick="preview_comment({{$id}});" id="comment-edit-preview-link-{{$id}}"><i class="fa fa-eye"></i> {{$preview}}</button>
+                       <button type="button" class="btn btn-defaul btn-sm comment-edit-preview" onclick="preview_comment({{$id}});" id="comment-edit-preview-link-{{$id}}"><i class="fa fa-eye"></i> {{$preview}}</button>
 {{/if}}
-                       <button type="submit" class="btn btn-primary btn-sm" id="comment-edit-submit-{{$id}}" name="submit"><i class="fa fa-envelope"></i> {{$submit}}</button>
+                       <button type="submit" class="btn btn-primary btn-sm comment-edit-submit" id="comment-edit-submit-{{$id}}" name="submit" data-loading-text="{{$loading}}"><i class="fa fa-envelope"></i> {{$submit}}</button>
                </p>
 
                <div class="comment-edit-end clear"></div>