Replace information icon with confirmation button in share input

The confirmation button right now is just an icon; its behaviour will be
added in the following commits.

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
This commit is contained in:
Jan-Christoph Borchardt 2017-11-16 17:27:20 +01:00 committed by Daniel Calviño Sánchez
parent 29c551c88f
commit ce7775acd0
3 changed files with 19 additions and 62 deletions

View File

@ -13,15 +13,23 @@
top: 0px;
}
.shareTabView .shareWithRemoteInfo,
.shareTabView .shareWithConfirm,
.shareTabView .clipboardButton,
.shareTabView .linkPass .icon-loading-small {
position: absolute;
right: -7px;
top: -4px;
top: -2px;
padding: 14px;
}
.shareTabView .shareWithConfirm {
opacity: .5;
}
.shareTabView .shareWithField:focus ~ .shareWithConfirm {
opacity: 1;
}
.shareTabView .linkMore {
position: absolute;
right: -7px;

View File

@ -22,7 +22,7 @@
'<div class="oneline">' +
' <input id="shareWith-{{cid}}" class="shareWithField" type="text" placeholder="{{sharePlaceholder}}" />' +
' <span class="shareWithLoading icon-loading-small hidden"></span>'+
'{{{shareInfo}}}' +
' <span class="shareWithConfirm icon icon-confirm"></span>' +
'</div>' +
'{{/if}}' +
'<div class="shareeListView subView"></div>' +
@ -30,10 +30,6 @@
'<div class="expirationView subView"></div>' +
'<div class="loading hidden" style="height: 50px"></div>';
var TEMPLATE_SHARE_INFO =
'<span class="icon icon-info shareWithRemoteInfo hasTooltip" ' +
'title="{{tooltip}}"></span>';
/**
* @class OCA.Share.ShareDialogView
* @member {OC.Share.ShareItemModel} model
@ -142,7 +138,7 @@
var $shareWithField = $('.shareWithField'),
view = this,
$loading = this.$el.find('.shareWithLoading'),
$shareInfo = this.$el.find('.shareWithRemoteInfo');
$confirm = this.$el.find('.shareWithConfirm');
var count = oc_config['sharing.minSearchStringLength'];
if (search.term.trim().length < count) {
@ -167,7 +163,7 @@
$loading.removeClass('hidden');
$loading.addClass('inlineblock');
$shareInfo.addClass('hidden');
$confirm.addClass('hidden');
$shareWithField.removeClass('error')
.tooltip('hide');
@ -184,7 +180,7 @@
function (result) {
$loading.addClass('hidden');
$loading.removeClass('inlineblock');
$shareInfo.removeClass('hidden');
$confirm.removeClass('hidden');
if (result.ocs.meta.statuscode === 100) {
var users = result.ocs.data.exact.users.concat(result.ocs.data.users);
var groups = result.ocs.data.exact.groups.concat(result.ocs.data.groups);
@ -318,7 +314,7 @@
).fail(function() {
$loading.addClass('hidden');
$loading.removeClass('inlineblock');
$shareInfo.removeClass('hidden');
$confirm.removeClass('hidden');
OC.Notification.show(t('core', 'An error occurred. Please try again'));
window.setTimeout(OC.Notification.hide, 5000);
});
@ -363,22 +359,22 @@
var $loading = this.$el.find('.shareWithLoading');
$loading.removeClass('hidden')
.addClass('inlineblock');
var $shareInfo = this.$el.find('.shareWithRemoteInfo');
$shareInfo.addClass('hidden');
var $confirm = this.$el.find('.shareWithConfirm');
$confirm.addClass('hidden');
this.model.addShare(s.item.value, {success: function() {
$(e.target).val('')
.attr('disabled', false);
$loading.addClass('hidden')
.removeClass('inlineblock');
$shareInfo.removeClass('hidden');
$confirm.removeClass('hidden');
}, error: function(obj, msg) {
OC.Notification.showTemporary(msg);
$(e.target).attr('disabled', false)
.autocomplete('search', $(e.target).val());
$loading.addClass('hidden')
.removeClass('inlineblock');
$shareInfo.removeClass('hidden');
$confirm.removeClass('hidden');
}});
},
@ -416,7 +412,6 @@
cid: this.cid,
shareLabel: t('core', 'Share'),
sharePlaceholder: this._renderSharePlaceholderPart(),
shareInfo: this._renderShareInfoPart(),
isSharingAllowed: this.model.sharePermissionPossible()
}));
@ -461,27 +456,6 @@
this.linkShareView.showLink = this._showLink;
},
_renderShareInfoPart: function() {
var shareInfo = '';
var infoTemplate = this._getShareInfoTemplate();
if(this.configModel.get('isMailShareAllowed') && this.configModel.get('isRemoteShareAllowed')) {
shareInfo = infoTemplate({
tooltip: t('core', 'Share with other people by entering a user or group, a federated cloud ID or an email address.')
});
} else if(this.configModel.get('isRemoteShareAllowed')) {
shareInfo = infoTemplate({
tooltip: t('core', 'Share with other people by entering a user or group or a federated cloud ID.')
});
} else if(this.configModel.get('isMailShareAllowed')) {
shareInfo = infoTemplate({
tooltip: t('core', 'Share with other people by entering a user or group or an email address.')
});
}
return shareInfo;
},
_renderSharePlaceholderPart: function () {
var allowRemoteSharing = this.configModel.get('isRemoteShareAllowed');
var allowMailSharing = this.configModel.get('isMailShareAllowed');
@ -513,15 +487,6 @@
return this._templates[key];
},
/**
* returns the info template for remote sharing
*
* @returns {Function}
* @private
*/
_getShareInfoTemplate: function() {
return this._getTemplate('shareInfo', TEMPLATE_SHARE_INFO);
}
});
OC.Share.ShareDialogView = ShareDialogView;

View File

@ -472,22 +472,6 @@ describe('OC.Share.ShareDialogView', function() {
});
});
});
describe('remote sharing', function() {
it('shows remote share info when allowed', function() {
configModel.set({
isRemoteShareAllowed: true
});
dialog.render();
expect(dialog.$el.find('.shareWithRemoteInfo').length).toEqual(1);
});
it('does not show remote share info when not allowed', function() {
configModel.set({
isRemoteShareAllowed: false
});
dialog.render();
expect(dialog.$el.find('.shareWithRemoteInfo').length).toEqual(0);
});
});
describe('autocompletion of users', function() {
it('triggers autocomplete display and focus with data when ajax search succeeds', function () {
dialog.render();