keith/friendica
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

[frio] Add new asynchronous submission of modal form

Browse source 
- Add loading state for jot submit buttons
This commit is contained in:
Hypolite Petovan 2020-01-29 22:50:10 -05:00
parent 3370300376
commit b2143cae53
4 changed files with 56 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
include/conversation.php
View file

@ -1214,6 +1214,7 @@ function status_editor(App $a, $x, $notes_cid = 0, $popup = false)
'$return_path' => $query_str,
'$action' => 'item',
'$share' => ($x['button'] ?? '') ?: DI::l10n()->t('Share'),
'$loading' => DI::l10n()->t('Loading...'),
'$upload' => DI::l10n()->t('Upload photo'),
'$shortupload' => DI::l10n()->t('upload photo'),
'$attach' => DI::l10n()->t('Attach file'),

1
mod/editpost.php
View file

@ -70,6 +70,7 @@ function editpost_content(App $a)
'$return_path' => '/display/' . $item['guid'],
'$action' => 'item',
'$share' => DI::l10n()->t('Save'),
'$loading' => DI::l10n()->t('Loading...'),
'$upload' => DI::l10n()->t('Upload photo'),
'$shortupload' => DI::l10n()->t('upload photo'),
'$attach' => DI::l10n()->t('Attach file'),

46
view/theme/frio/templates/jot-header.tpl
View file

@ -67,11 +67,53 @@
jotTextOpenUI(document.getElementById("profile-jot-text"));
jotActive();
addeditortext(embedcode);
});
$('body').on('fbrowser.file.main', function(e, filename, embedcode, id) {
})
.on('fbrowser.file.main', function(e, filename, embedcode, id) {
jotTextOpenUI(document.getElementById("profile-jot-text"));
jotActive();
addeditortext(embedcode);
})
// Asynchronous jot submission
.on('submit', '#profile-jot-form', function (e) {
e.preventDefault();
// Disable jot submit buttons during processing
let $share = $('#profile-jot-submit').button('loading');
let $sharePreview = $('#profile-jot-preview-submit').button('loading');
let formData = new FormData(e.target);
// This cancels the automatic redirection after item submission
formData.delete('return');
$.ajax({
url: 'item',
data: formData,
processData: false,
contentType: false,
type: 'POST',
})
.then(function () {
// Reset to form for jot reuse in the same page
e.target.reset();
$('#jot-modal').modal('hide');
})
.always(function() {
// Reset the post_id_random to avoid duplicate post errors
let new_post_id_random = Math.floor(Math.random() * (Number.MAX_SAFE_INTEGER - (Number.MAX_SAFE_INTEGER / 10))) + Number.MAX_SAFE_INTEGER / 10;
$('#profile-jot-form [name=post_id_random]').val(new_post_id_random);
// Reset jot submit button state
$share.button('reset');
$sharePreview.button('reset');
// Force the display update of the edited post/comment
if (formData.get('post_id')) {
force_update = true;
update_item = formData.get('post_id');
}
NavUpdate();
})
});
$('#wall-image-upload').on('click', function(){

12
view/theme/frio/templates/jot.tpl
View file

@ -104,7 +104,11 @@
<li><button type="button" class="btn-link" id="profile-nolocation" onclick="jotClearLocation();" title="{{$noloc}}">{{$shortnoloc}}</button></li>
-->
<li role="presentation" class="pull-right"><button class="btn btn-primary" type="submit" id="profile-jot-submit" name="submit" ><i class="fa fa-paper-plane fa-fw" aria-hidden="true"></i> {{$share}}</button></li>
<li role="presentation" class="pull-right">
<button class="btn btn-primary" type="submit" id="profile-jot-submit" name="submit" data-loading-text="{{$loading}}">
<i class="fa fa-paper-plane fa-fw" aria-hidden="true"></i> {{$share}}
</button>
</li>
<li role="presentation" id="character-counter" class="grey jothidden text-info pull-right"></li>
<li role="presentation" id="profile-rotator-wrapper" class="pull-right" style="display: {{$visitor}};" >
<img role="presentation" id="profile-rotator" src="images/rotator.gif" alt="{{$wait}}" title="{{$wait}}" style="display: none;" />
@ -124,7 +128,11 @@
<div id="jot-preview-share" class="minimize" aria-labelledby="jot-preview-lnk" role="tabpanel" aria-hidden="true">
<ul id="profile-jot-preview-submit-wrapper" class="jothidden nav nav-pills">
<li role="presentation" class="pull-right"><button class="btn btn-primary" type="submit" id="profile-jot-peview-submit" name="submit" ><i class="fa fa-paper-plane fa-fw" aria-hidden="true"></i> {{$share}}</button></li>
<li role="presentation" class="pull-right">
<button class="btn btn-primary" type="submit" id="profile-jot-preview-submit" name="submit" data-loading-text="{{$loading}}">
<i class="fa fa-paper-plane fa-fw" aria-hidden="true"></i> {{$share}}
</button>
</li>
</ul>
</div>