Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1923 from thostetler/library-owner-transfer
Library owner transfer widget
- Loading branch information
Showing
9 changed files
with
245 additions
and
85 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
81 changes: 50 additions & 31 deletions
81
src/js/widgets/library_individual/templates/make-public.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,34 +1,53 @@ | ||
|
||
|
||
{{#if public}} | ||
|
||
<h3><i class="fa fa-lg fa-unlock"></i> This Library is Public</h3> | ||
|
||
<div class="s-permissions-list-container"> | ||
|
||
<p><b>Public libraries</b> are available for all to read.</p> | ||
<p><b>Private libraries</b> are visible to only you and any collaborators.</p> | ||
|
||
<p> The public address of this library is <a target="_blank" rel="noopener" href="https://ui.adsabs.harvard.edu/public-libraries/{{id}}">https://ui.adsabs.harvard.edu/public-libraries/{{id}}</a></p> | ||
<p><button class="btn btn-danger btn-inverted public-button make-private"><i class="fa fa-lg fa-lock"></i> Make this library private. </button></p> | ||
|
||
<div> | ||
{{#if public}} | ||
<div class="row"> | ||
<div class="col-xs-12"> | ||
<h3><i class="fa fa-lg fa-unlock"></i> This Library is Public</h3> | ||
</div> | ||
|
||
{{else}} | ||
|
||
<h3> <i class="fa fa-lg fa-lock"></i> This Library is Private</h3> | ||
|
||
<div class="s-permissions-list-container"> | ||
|
||
<p><b>Public libraries</b> are available for all to read.</p> | ||
<p><b>Private libraries</b> are visible to only you and any collaborators.</p> | ||
|
||
<p> | ||
<button class="btn btn-success btn-inverted public-button make-public"><i class="fa fa-lg fa-unlock"></i> Make this library public. </button> | ||
</p> | ||
</div> | ||
<div class="row"> | ||
<div class="col-xs-12"> | ||
<div class="panel"> | ||
<div class="panel-body"> | ||
<p><b>Public libraries</b> are available for all to read.</p> | ||
<p><b>Private libraries</b> are visible to only you and any collaborators.</p> | ||
<p> The public address of this library is <a target="_blank" rel="noopener" | ||
href="https://ui.adsabs.harvard.edu/public-libraries/{{id}}">https://ui.adsabs.harvard.edu/public-libraries/{{id}}</a> | ||
</p> | ||
<div class="btn-toolbar"> | ||
<button class="btn btn-danger btn-inverted public-button make-private"><i class="fa fa-lg fa-lock"></i> | ||
Make this library private.</button> | ||
<button class="btn btn-danger btn-inverted public-button make-private"><i class="fa fa-lg fa-lock"></i> | ||
Make this library private.</button> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
{{/if}} | ||
|
||
|
||
</div> | ||
{{else}} | ||
<div class="row"> | ||
<div class="col-xs-12"> | ||
<h3><i class="fa fa-lg fa-lock"></i> This Library is Private</h3> | ||
</div> | ||
</div> | ||
<div class="row"> | ||
<div class="col-xs-12"> | ||
<div class="panel"> | ||
<div class="panel-body"> | ||
<p><b>Public libraries</b> are available for all to read.</p> | ||
<p><b>Private libraries</b> are visible to only you and any collaborators.</p> | ||
<p> The public address of this library is <a target="_blank" rel="noopener" | ||
href="https://ui.adsabs.harvard.edu/public-libraries/{{id}}">https://ui.adsabs.harvard.edu/public-libraries/{{id}}</a> | ||
</p> | ||
<div class="btn-toolbar"> | ||
<button class="btn btn-success btn-inverted public-button make-public"><i class="fa fa-lg fa-unlock" aria-hidden="true"></i> | ||
Make this library public.</button> | ||
<button class="btn btn-info btn-inverted" data-toggle="modal" data-target="#transferOwnershipModal"><i class="fa fa-lg fa-paper-plane" aria-hidden="true"></i> | ||
Transfer Ownership</button> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
{{/if}} | ||
</div> |
47 changes: 47 additions & 0 deletions
47
src/js/widgets/library_individual/templates/transfer-ownership-modal.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,47 @@ | ||
<div class="modal fade" id="transferOwnershipModal" tabindex="-1" role="dialog" | ||
aria-labelledby="transforOwnershipModal"> | ||
<div class="modal-dialog" role="document"> | ||
<div class="modal-content"> | ||
<div class="modal-header"> | ||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span | ||
aria-hidden="true">×</span></button> | ||
<h4 class="modal-title" id="transforOwnershipModal">Transfer Ownership</h4> | ||
</div> | ||
<div class="modal-body"> | ||
<form class="form-horizontal"> | ||
<fieldset> | ||
<!-- Text input--> | ||
<div class="form-group"> | ||
<label class="col-md-4 control-label" for="textinput">New Owner</label> | ||
<div class="col-md-7"> | ||
<input id="textinput" name="textinput" type="email" placeholder="new-owner@test.com" | ||
class="form-control input-md" required="" value="" autofocus aria-describedby="helpBlock"> | ||
<span class="help-block" id="helpBlock">Enter the email address of the new user</span> | ||
</div> | ||
</div> | ||
|
||
<div class="alert alert-danger" id="error-message" style="display: none;"> | ||
<i class="fa fa-exclamation-triangle" aria-hidden="true"></i> | ||
<span></span> | ||
</div> | ||
|
||
<div class="text-center" id="loader" style="display: none;"> | ||
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i> | ||
</div> | ||
|
||
<div class="alert alert-success" id="success-message" style="display: none;"> | ||
<i class="fa fa-checkmark" aria-hidden="true"></i> | ||
<span></span> | ||
</div> | ||
|
||
</fieldset> | ||
</form> | ||
|
||
</div> | ||
<div class="modal-footer"> | ||
<button type="button" class="btn btn-default close-button" data-dismiss="modal">Close</button> | ||
<button type="button" class="btn btn-primary confirm-button">Confirm</button> | ||
</div> | ||
</div> | ||
</div> | ||
</div> |
143 changes: 114 additions & 29 deletions
143
src/js/widgets/library_individual/views/manage_permissions.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,58 +1,143 @@ | ||
define([ | ||
'marionette', | ||
define(['marionette', | ||
'hbs!js/widgets/library_individual/templates/manage-permissions-container', | ||
'hbs!js/widgets/library_individual/templates/make-public', | ||
'bootstrap' | ||
], function ( | ||
Marionette, | ||
ManagePermissionsContainer, | ||
MakePublicTemplate, | ||
Bootstrap | ||
) { | ||
var PermissionsModel = Backbone.Model.extend({ | ||
|
||
}); | ||
|
||
'hbs!../templates/transfer-ownership-modal' | ||
], function (Marionette, ManagePermissionsContainer, MakePublicTemplate, transferOwnershipModal) { | ||
var PermissionsModel = Backbone.Model.extend({}); | ||
var PermissionsCollection = Backbone.Collection.extend({ | ||
|
||
model: PermissionsModel | ||
|
||
}); | ||
|
||
const TransferOwnershipModalView = Backbone.View.extend({ | ||
initialize() { | ||
this.render = _.debounce(this.render, 500); | ||
this.onConfirm = _.debounce(this.onConfirm, 1000); | ||
this.model = new (Backbone.Model.extend({ | ||
defaults: { | ||
error: false, | ||
loading: false | ||
} | ||
})); | ||
const container = document.createElement('div'); | ||
document.body.appendChild(container); | ||
this.setElement(container); | ||
this.model.on('change:error', () => { this.showErrorMessage(); }); | ||
this.model.on('change:loading', () => { this.showLoading(); }); | ||
this.model.on('change:success', () => { this.showSuccessMessage(); }); | ||
}, | ||
showErrorMessage() { | ||
const error = this.model.get('error'); | ||
const el = $('#error-message', this.el); | ||
if (error && error.length > 0) { | ||
el.fadeIn(); | ||
$('span', el).text(error); | ||
} else { | ||
el.hide(); | ||
} | ||
}, | ||
showSuccessMessage() { | ||
const success = this.model.get('success'); | ||
const el = $('#success-message', this.el); | ||
if (success && success.length > 0) { | ||
el.fadeIn(); | ||
$('span', el).text(success); | ||
} else { | ||
el.hide(); | ||
} | ||
}, | ||
showLoading() { | ||
const loading = this.model.get('loading'); | ||
const el = $('#loader', this.el); | ||
loading ? el.show() : el.hide(); | ||
}, | ||
getModal() { | ||
return $('#transferOwnershipModal', this.$el); | ||
}, | ||
render() { | ||
this.$el.html(transferOwnershipModal(this.model.toJSON())); | ||
this.getModal().off().on('show.bs.modal', () => { | ||
this.model.clear().set(this.model.defaults); | ||
}).on('shown.bs.modal', () => { | ||
$('input', this.$el).focus(); | ||
}); | ||
}, | ||
events: { | ||
'click .confirm-button': '_onConfirm', | ||
'submit form': '_onConfirm' | ||
}, | ||
getEmailAddress() { | ||
return $('input', this.el).val(); | ||
}, | ||
_onConfirm(e) { | ||
this.model.set({ | ||
loading: true, | ||
error: false | ||
}); | ||
|
||
const msg = 'Are you sure?'; | ||
if (confirm(msg)) { | ||
this.onConfirm(e); | ||
} else { | ||
this.model.set({ | ||
loading: false, | ||
error: true | ||
}); | ||
} | ||
|
||
var ManagePermissionsView = Marionette.ItemView.extend({ | ||
}, | ||
onConfirm(e) { | ||
e.preventDefault(); | ||
const email = this.getEmailAddress(); | ||
this.trigger('confirm-transfer-ownership', email, { | ||
done: () => { | ||
this.model.set({ | ||
success: `Success! Ownership has been transferred to ${ email }`, | ||
loading: false | ||
}); | ||
setTimeout(() => { | ||
this.getModal().modal('hide'); | ||
this.trigger('reset-and-navigate'); | ||
}, 2000); | ||
}, | ||
fail: ({ responseJSON }) => { | ||
if (responseJSON && responseJSON.error) { | ||
this.model.set({ | ||
error: responseJSON.error, | ||
loading: false | ||
}); | ||
} | ||
} | ||
}); | ||
} | ||
}); | ||
|
||
var ManagePermissionsView = Marionette.ItemView.extend({ | ||
className: 'library-admin-view', | ||
|
||
initialize: function (options) { | ||
var options = options || {}; | ||
|
||
this.model.set('host', window.location.host); | ||
}, | ||
this.modal = new TransferOwnershipModalView(); | ||
|
||
// just forward any trigger calls | ||
this.modal.on('all', (...args) => this.trigger(...args)); | ||
}, | ||
events: { | ||
'click .public-button': 'togglePublicState' | ||
}, | ||
|
||
togglePublicState: function (e) { | ||
var pub = $(e.target).hasClass('make-public'); | ||
this.trigger('update-public-status', pub); | ||
}, | ||
|
||
modelEvents: { | ||
|
||
'change:public': 'render' | ||
|
||
}, | ||
|
||
template: ManagePermissionsContainer, | ||
|
||
onRender: function () { | ||
this.$('.public-container').html(MakePublicTemplate(this.model.toJSON())); | ||
} | ||
this.$('.public-container').html(MakePublicTemplate(this.model | ||
.toJSON())); | ||
|
||
this.modal.render(); | ||
} | ||
}); | ||
|
||
|
||
return ManagePermissionsView; | ||
}); |
Oops, something went wrong.