Added spinners in share dropdown
Added spinners for the following actions: - adding user - removing user - changing password - toggling allowing upload - setting a password
This commit is contained in:
Vincent Petry
Lukas Reschke
parent
e5a111b80e
commit
16cad5862a
2 changed files with 102 additions and 22 deletions
|
|
@ -16,6 +16,20 @@
|
|||
padding:16px;
|
||||
}
|
||||
|
||||
#dropdown.shareDropDown .unshare.icon-loading-small {
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
#dropdown.shareDropDown .shareWithLoading,
|
||||
#dropdown.shareDropDown .linkShare .icon-loading-small {
|
||||
display: inline-block !important;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
#dropdown.shareDropDown .icon-loading-small.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#shareWithList {
|
||||
list-style-type:none;
|
||||
padding:8px;
|
||||
|
|
|
|||
110
core/js/share.js
110
core/js/share.js
|
|
@ -304,7 +304,7 @@ OC.Share={
|
|||
);
|
||||
}
|
||||
|
||||
$.post(OC.filePath('core', 'ajax', 'share.php'),
|
||||
return $.post(OC.filePath('core', 'ajax', 'share.php'),
|
||||
{
|
||||
action: 'share',
|
||||
itemType: itemType,
|
||||
|
|
@ -351,7 +351,7 @@ OC.Share={
|
|||
showDropDown:function(itemType, itemSource, appendTo, link, possiblePermissions, filename) {
|
||||
var data = OC.Share.loadItem(itemType, itemSource);
|
||||
var dropDownEl;
|
||||
var html = '<div id="dropdown" class="drop" data-item-type="'+itemType+'" data-item-source="'+itemSource+'">';
|
||||
var html = '<div id="dropdown" class="drop shareDropDown" data-item-type="'+itemType+'" data-item-source="'+itemSource+'">';
|
||||
if (data !== false && data.reshare !== false && data.reshare.uid_owner !== undefined) {
|
||||
if (data.reshare.share_type == OC.Share.SHARE_TYPE_GROUP) {
|
||||
html += '<span class="reshare">'+t('core', 'Shared with you and the group {group} by {owner}', {group: escapeHTML(data.reshare.share_with), owner: escapeHTML(data.reshare.displayname_owner)})+'</span>';
|
||||
|
|
@ -381,11 +381,13 @@ OC.Share={
|
|||
});
|
||||
|
||||
html += '<input id="shareWith" type="text" placeholder="'+t('core', 'Share with user or group …')+'" />';
|
||||
html += '<span class="shareWithLoading icon-loading-small hidden"></span>';
|
||||
html += '<ul id="shareWithList">';
|
||||
html += '</ul>';
|
||||
var linksAllowed = $('#allowShareWithLink').val() === 'yes';
|
||||
if (link && linksAllowed) {
|
||||
html += '<div id="link">';
|
||||
html += '<div id="link" class="linkShare">';
|
||||
html += '<span class="icon-loading-small hidden"></span>';
|
||||
html += '<input type="checkbox" name="linkCheckbox" id="linkCheckbox" value="1" /><label for="linkCheckbox">'+t('core', 'Share link')+'</label>';
|
||||
html += '<br />';
|
||||
|
||||
|
|
@ -398,10 +400,12 @@ OC.Share={
|
|||
html += '<input type="checkbox" name="showPassword" id="showPassword" value="1" style="display:none;" /><label for="showPassword" style="display:none;">'+t('core', 'Password protect')+'</label>';
|
||||
html += '<div id="linkPass">';
|
||||
html += '<input id="linkPassText" type="password" placeholder="'+t('core', 'Choose a password for the public link')+'" />';
|
||||
html += '<span class="icon-loading-small hidden"></span>';
|
||||
html += '</div>';
|
||||
|
||||
if (itemType === 'folder' && (possiblePermissions & OC.PERMISSION_CREATE) && publicUploadEnabled === 'yes') {
|
||||
html += '<div id="allowPublicUploadWrapper" style="display:none;">';
|
||||
html += '<span class="icon-loading-small hidden"></span>';
|
||||
html += '<input type="checkbox" value="1" name="allowPublicUpload" id="sharingDialogAllowPublicUpload"' + ((allowPublicUploadStatus) ? 'checked="checked"' : '') + ' />';
|
||||
html += '<label for="sharingDialogAllowPublicUpload">' + t('core', 'Allow Public Upload') + '</label>';
|
||||
html += '</div>';
|
||||
|
|
@ -441,23 +445,27 @@ OC.Share={
|
|||
});
|
||||
}
|
||||
$('#shareWith').autocomplete({minLength: 1, source: function(search, response) {
|
||||
$.get(OC.filePath('core', 'ajax', 'share.php'), { fetch: 'getShareWith', search: search.term, itemShares: OC.Share.itemShares }, function(result) {
|
||||
if (result.status == 'success' && result.data.length > 0) {
|
||||
$( "#shareWith" ).autocomplete( "option", "autoFocus", true );
|
||||
response(result.data);
|
||||
} else {
|
||||
response();
|
||||
}
|
||||
});
|
||||
var $loading = $('#dropdown .shareWithLoading');
|
||||
$loading.removeClass('hidden');
|
||||
$.get(OC.filePath('core', 'ajax', 'share.php'), { fetch: 'getShareWith', search: search.term, itemShares: OC.Share.itemShares }, function(result) {
|
||||
$loading.addClass('hidden');
|
||||
if (result.status == 'success' && result.data.length > 0) {
|
||||
$( "#shareWith" ).autocomplete( "option", "autoFocus", true );
|
||||
response(result.data);
|
||||
} else {
|
||||
response();
|
||||
}
|
||||
});
|
||||
},
|
||||
focus: function(event, focused) {
|
||||
event.preventDefault();
|
||||
},
|
||||
select: function(event, selected) {
|
||||
event.stopPropagation();
|
||||
var itemType = $('#dropdown').data('item-type');
|
||||
var itemSource = $('#dropdown').data('item-source');
|
||||
var itemSourceName = $('#dropdown').data('item-source-name');
|
||||
var $dropDown = $('#dropdown');
|
||||
var itemType = $dropDown.data('item-type');
|
||||
var itemSource = $dropDown.data('item-source');
|
||||
var itemSourceName = $dropDown.data('item-source-name');
|
||||
var expirationDate = '';
|
||||
if ( $('#expirationCheckbox').is(':checked') === true ) {
|
||||
expirationDate = $( "#expirationDate" ).val();
|
||||
|
|
@ -481,7 +489,16 @@ OC.Share={
|
|||
permissions = permissions | OC.PERMISSION_SHARE;
|
||||
}
|
||||
|
||||
|
||||
var $input = $(this);
|
||||
var $loading = $dropDown.find('.shareWithLoading');
|
||||
$loading.removeClass('hidden');
|
||||
$input.val(t('core', 'Adding user...'));
|
||||
$input.prop('disabled', true);
|
||||
|
||||
OC.Share.share(itemType, itemSource, shareType, shareWith, permissions, itemSourceName, expirationDate, function() {
|
||||
$input.prop('disabled', false);
|
||||
$loading.addClass('hidden');
|
||||
OC.Share.addShareWith(shareType, shareWith, selected.item.label, permissions, possiblePermissions);
|
||||
$('#shareWith').val('');
|
||||
$('#dropdown').trigger(new $.Event('sharesChanged', {shares: OC.Share.currentShares}));
|
||||
|
|
@ -810,6 +827,18 @@ $(document).ready(function() {
|
|||
var itemSource = $('#dropdown').data('item-source');
|
||||
var shareType = $li.data('share-type');
|
||||
var shareWith = $li.attr('data-share-with');
|
||||
var $button = $(this);
|
||||
|
||||
if (!$button.is('a')) {
|
||||
$button = $button.closest('a');
|
||||
}
|
||||
|
||||
if ($button.hasClass('icon-loading-small')) {
|
||||
// deletion in progress
|
||||
return false;
|
||||
}
|
||||
$button.empty().addClass('icon-loading-small');
|
||||
|
||||
OC.Share.unshare(itemType, itemSource, shareType, shareWith, function() {
|
||||
$li.remove();
|
||||
var index = OC.Share.itemShares[shareType].indexOf(shareWith);
|
||||
|
|
@ -822,6 +851,7 @@ $(document).ready(function() {
|
|||
$('#expiration').hide('blind');
|
||||
}
|
||||
});
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
|
|
@ -863,9 +893,17 @@ $(document).ready(function() {
|
|||
});
|
||||
|
||||
$(document).on('change', '#dropdown #linkCheckbox', function() {
|
||||
var itemType = $('#dropdown').data('item-type');
|
||||
var itemSource = $('#dropdown').data('item-source');
|
||||
var itemSourceName = $('#dropdown').data('item-source-name');
|
||||
var $dropDown = $('#dropdown');
|
||||
var itemType = $dropDown.data('item-type');
|
||||
var itemSource = $dropDown.data('item-source');
|
||||
var itemSourceName = $dropDown.data('item-source-name');
|
||||
var $loading = $dropDown.find('#link .icon-loading-small');
|
||||
var $button = $(this);
|
||||
|
||||
if (!$loading.hasClass('hidden')) {
|
||||
// already in progress
|
||||
return false;
|
||||
}
|
||||
|
||||
if (this.checked) {
|
||||
var expireDateString = '';
|
||||
|
|
@ -880,7 +918,11 @@ $(document).ready(function() {
|
|||
}
|
||||
// Create a link
|
||||
if (oc_appconfig.core.enforcePasswordForPublicLink === false) {
|
||||
$loading.removeClass('hidden');
|
||||
$button.addClass('hidden');
|
||||
OC.Share.share(itemType, itemSource, OC.Share.SHARE_TYPE_LINK, '', OC.PERMISSION_READ, itemSourceName, expireDateString, function(data) {
|
||||
$loading.addClass('hidden');
|
||||
$button.removeClass('hidden');
|
||||
OC.Share.showLink(data.token, null, itemSource);
|
||||
$('#dropdown').trigger(new $.Event('sharesChanged', {shares: OC.Share.currentShares}));
|
||||
OC.Share.updateIcon(itemType, itemSource);
|
||||
|
|
@ -897,7 +939,11 @@ $(document).ready(function() {
|
|||
OC.Share.hideLink();
|
||||
$('#expiration').hide('blind');
|
||||
if ($('#linkText').val() !== '') {
|
||||
$loading.removeClass('hidden');
|
||||
$button.addClass('hidden');
|
||||
OC.Share.unshare(itemType, itemSource, OC.Share.SHARE_TYPE_LINK, '', function() {
|
||||
$loading.addClass('hidden');
|
||||
$button.removeClass('hidden');
|
||||
OC.Share.itemShares[OC.Share.SHARE_TYPE_LINK] = false;
|
||||
$('#dropdown').trigger(new $.Event('sharesChanged', {shares: OC.Share.currentShares}));
|
||||
OC.Share.updateIcon(itemType, itemSource);
|
||||
|
|
@ -918,15 +964,23 @@ $(document).ready(function() {
|
|||
$(document).on('click', '#sharingDialogAllowPublicUpload', function() {
|
||||
|
||||
// Gather data
|
||||
var $dropDown = $('#dropdown');
|
||||
var allowPublicUpload = $(this).is(':checked');
|
||||
var itemType = $('#dropdown').data('item-type');
|
||||
var itemSource = $('#dropdown').data('item-source');
|
||||
var itemSourceName = $('#dropdown').data('item-source-name');
|
||||
var itemType = $dropDown.data('item-type');
|
||||
var itemSource = $dropDown.data('item-source');
|
||||
var itemSourceName = $dropDown.data('item-source-name');
|
||||
var expirationDate = '';
|
||||
if ($('#expirationCheckbox').is(':checked') === true) {
|
||||
expirationDate = $( "#expirationDate" ).val();
|
||||
}
|
||||
var permissions = 0;
|
||||
var $button = $(this);
|
||||
var $loading = $dropDown.find('#allowPublicUploadWrapper .icon-loading-small');
|
||||
|
||||
if (!$loading.hasClass('hidden')) {
|
||||
// already in progress
|
||||
return false;
|
||||
}
|
||||
|
||||
// Calculate permissions
|
||||
if (allowPublicUpload) {
|
||||
|
|
@ -936,7 +990,13 @@ $(document).ready(function() {
|
|||
}
|
||||
|
||||
// Update the share information
|
||||
$button.addClass('hidden');
|
||||
$button.prop('disabled', true);
|
||||
$loading.removeClass('hidden');
|
||||
OC.Share.share(itemType, itemSource, OC.Share.SHARE_TYPE_LINK, '', permissions, itemSourceName, expirationDate, function(data) {
|
||||
$loading.addClass('hidden');
|
||||
$button.removeClass('hidden');
|
||||
$button.prop('disabled', false);
|
||||
});
|
||||
});
|
||||
|
||||
|
|
@ -948,6 +1008,7 @@ $(document).ready(function() {
|
|||
var itemSourceName = $('#dropdown').data('item-source-name');
|
||||
var allowPublicUpload = $('#sharingDialogAllowPublicUpload').is(':checked');
|
||||
var permissions = 0;
|
||||
var $loading = $('#showPassword .icon-loading-small');
|
||||
|
||||
// Calculate permissions
|
||||
if (allowPublicUpload) {
|
||||
|
|
@ -956,8 +1017,10 @@ $(document).ready(function() {
|
|||
permissions = OC.PERMISSION_READ;
|
||||
}
|
||||
|
||||
|
||||
OC.Share.share(itemType, itemSource, OC.Share.SHARE_TYPE_LINK, '', permissions, itemSourceName);
|
||||
$loading.removeClass('hidden');
|
||||
OC.Share.share(itemType, itemSource, OC.Share.SHARE_TYPE_LINK, '', permissions, itemSourceName).then(function() {
|
||||
$loading.addClass('hidden');
|
||||
});
|
||||
} else {
|
||||
$('#linkPassText').focus();
|
||||
}
|
||||
|
|
@ -973,6 +1036,7 @@ $(document).ready(function() {
|
|||
var itemSource = dropDown.data('item-source');
|
||||
var itemSourceName = $('#dropdown').data('item-source-name');
|
||||
var permissions = 0;
|
||||
var $loading = dropDown.find('#linkPass .icon-loading-small');
|
||||
|
||||
// Calculate permissions
|
||||
if (allowPublicUpload) {
|
||||
|
|
@ -981,7 +1045,9 @@ $(document).ready(function() {
|
|||
permissions = OC.PERMISSION_READ;
|
||||
}
|
||||
|
||||
$loading.removeClass('hidden');
|
||||
OC.Share.share(itemType, itemSource, OC.Share.SHARE_TYPE_LINK, $('#linkPassText').val(), permissions, itemSourceName, function(data) {
|
||||
$loading.addClass('hidden');
|
||||
linkPassText.val('');
|
||||
linkPassText.attr('placeholder', t('core', 'Password protected'));
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue