Skip to content

Commit

Permalink
Merge pull request #2146 from shinyichen/addToLib
Browse files Browse the repository at this point in the history
Add to library widget
  • Loading branch information
shinyichen authored Apr 23, 2021
2 parents 53cc375 + 486af4c commit 703d7e5
Show file tree
Hide file tree
Showing 4 changed files with 81 additions and 55 deletions.
29 changes: 17 additions & 12 deletions src/js/widgets/query_info/query_info_template.html
Original file line number Diff line number Diff line change
Expand Up @@ -50,27 +50,30 @@
<div style="margin-top: 8px" class="">
<label for="library-select">to an <span class="s-text-bold">existing library:</span></label>
<select id="library-select" name="library-select" class="form-control input-sm s-library-select" aria-label="select existing library">
<option value="0" {{#compare selectedLibrary undefined}} selected="true" {{/compare}}>Select a library...</option>
{{#each libraries}}
<option value="{{this.id}}" {{#compare id ../selectedLibrary}} selected="true" {{/compare}}>{{this.name}}{{#compare permission "owner" operator="!=="}} ({{this.owner}}){{/compare}}</option>
{{/each}}
</select>
<button class="btn btn-sm btn-primary-faded submit-add-to-library">submit</button>
</div>
<div style="margin:10px 0 4px 0">
OR
</div>
{{/if}}

<label for="create-new">create a new library </label>
<input id="create-new"
class="form-control input-sm new-library-name s-display-inline"
type="text"
name="new-library-name"
placeholder="New Library Name"
value="{{newLibraryName}}"
style="max-width:166px;margin-bottom:10px;"
aria-label="enter new library name"/>
<button class="btn btn-sm btn-primary-faded submit-create-library"></i>submit</button>

<div>
<label for="create-new">create a new library </label>
<input id="create-new"
class="form-control input-sm new-library-name s-display-inline"
type="text"
name="new-library-name"
placeholder="New Library Name"
value="{{newLibraryName}}"
style="max-width:166px;margin-bottom:10px;"
aria-label="enter new library name"/>
</div>

<button class="btn btn-md btn-primary-faded submit-add-to-library"></i>Add</button>

</div>

Expand Down Expand Up @@ -107,7 +110,9 @@
<b>{{feedback.name}}</b> was not created, error occured.
<em>{{feedback.error}}</em>
{{else}}
{{#if feedback.name}}
Records were not added to <b>{{feedback.name}}</b>, error occurred.
{{/if}}
<em>{{feedback.error}}</em>
{{/if}}
</div>
Expand Down
76 changes: 47 additions & 29 deletions src/js/widgets/query_info/query_info_widget.js
Original file line number Diff line number Diff line change
Expand Up @@ -68,8 +68,7 @@ define([
'change #library-select': 'recordLibrarySelection',
'keyup .new-library-name': 'recordNewLibraryName',
'click .library-add-title': 'toggleLibraryDrawer',
'click .submit-add-to-library': 'libraryAdd',
'click .submit-create-library': 'libraryCreate',
'click .submit-add-to-library': 'libraryAddOrCreate',
},

recordLibrarySelection: function(e) {
Expand All @@ -84,42 +83,60 @@ define([
this.model.set('selectedVsAll', $(e.currentTarget).val());
},

libraryAdd: function() {
// show loading view
this.$('.submit-add-to-library').html(
'<i class="fa fa-spinner fa-pulse" aria-hidden="true"></i>'
);

libraryAddOrCreate: function() {
var data = {};

// we have the selected library in the model but only if there was a select event, so query DOM
data.libraryID = this.$('#library-select').val();
const selected = this.$('#library-select').val();
const createNew = this.model.get('newLibraryName');

if (this.model.get('selected')) {
data.recordsToAdd = this.$('#all-vs-selected').val();
} else {
data.recordsToAdd = 'all';
// if selected existing library
if (selected !== '0' && !createNew) {
data.libraryID = this.$('#library-select').val();
if (this.model.get('selected')) {
data.recordsToAdd = this.$('#all-vs-selected').val();
} else {
data.recordsToAdd = 'all';
}
// show loading view
this.$('.submit-add-to-library').html(
'<i class="fa fa-spinner fa-pulse" aria-hidden="true"></i>'
);
this.trigger('library-add', data);
}
this.trigger('library-add', data);
},

libraryCreate: function() {
// show loading view
this.$('.submit-create-library').html(
'<i class="fa fa-spinner fa-pulse" aria-hidden="true"></i>'
);
// else if creating new library
else if (selected === '0' && createNew) {
data.name = this.model.get('newLibraryName');
if (this.model.get('selected')) {
data.recordsToAdd = this.$('#all-vs-selected').val();
} else {
data.recordsToAdd = 'all';
}

var data = {};
data.name = this.model.get('newLibraryName') || '';
data.name = data.name.trim();
// show loading view
this.$('.submit-add-to-library').html(
'<i class="fa fa-spinner fa-pulse" aria-hidden="true"></i>'
);
this.trigger('library-create', data);
}

if (this.model.get('selected')) {
data.recordsToAdd = this.$('#all-vs-selected').val();
} else {
data.recordsToAdd = 'all';
// both selected, invalid
else if (selected !== '0' && createNew) {
this.model.set('feedback', {
success: false,
error: 'Either select from an existing or create a new one',
});
}

data.name = this.model.get('newLibraryName') || '';
data.name = data.name.trim();
this.trigger('library-create', data);
// none selected, invalid
else {
this.model.set('feedback', {
success: false,
error: 'Select from an existing library or create a new one',
});
}
},

toggleLibraryDrawer: function() {
Expand Down Expand Up @@ -269,6 +286,7 @@ define([
.done(function(response, status) {
var numAlreadyInLib =
response.numBibcodesRequested - parseInt(response.number_added);
that.model.set('selectedLibrary', undefined);
that.model.set('feedback', {
success: true,
name: name,
Expand Down
20 changes: 11 additions & 9 deletions src/js/wraps/abstract_page_library_add/template.html
Original file line number Diff line number Diff line change
Expand Up @@ -27,22 +27,24 @@
<div style="margin-top: 8px" class="">
<label for="#library-select">add to an existing library:</label>
<select id="library-select" name="library-select" class="form-control input-sm s-library-select" aria-label="select existing library">
{{#each libraries}}
<option value="{{this.id}}" {{#compare id ../selectedLibrary}} selected="true" {{/compare}}>{{this.name}}{{#compare permission "owner" operator="!=="}} ({{this.owner}}){{/compare}}</option>
{{/each}}
<option value="0" selected="true">Select a library...</option>
{{#each libraries}}
<option value="{{this.id}}">{{this.name}}{{#compare permission "owner" operator="!=="}} ({{this.owner}}){{/compare}}</option>
{{/each}}
</select>
<button class="btn btn-sm btn-primary-faded submit-add-to-library">submit</button>
</div>
<div style="margin:10px 0 4px 0">
OR
</div>
{{/if}}
<div>
<label for="#create-new">create a new library </label>
<input id="#create-new" class="form-control input-sm new-library-name s-display-inline" type="text" name="new-library-name" placeholder="New Library Name" value="{{newLibraryName}}" style="margin-bottom:10px;" aria-label="create new library"/>
</div>

<button class="btn btn-sm btn-primary-faded submit-add-to-library">Add</button>

<label for="#create-new">create a new library </label>
<input id="#create-new" class="form-control input-sm new-library-name s-display-inline" type="text" name="new-library-name" placeholder="New Library Name" value="{{newLibraryName}}" style="max-width:188px" aria-label="create new library"/>
<button class="btn btn-sm btn-primary-faded submit-create-library"></i>submit</button>

</div>
</div>

<div style="margin-top:6px" class="feedback s-feedback">

Expand Down
11 changes: 6 additions & 5 deletions test/mocha/js/widgets/query_info_widget.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -120,18 +120,19 @@ define([
expect($("#test #all-vs-selected")[0].options[0].value).to.eql("selected");
expect($("#test #all-vs-selected")[0].options[1].value).to.eql("all");

expect($("#test #library-select")[0].options[1].value).to.eql("1");
expect($("#test #library-select")[0].options[1].textContent).to.eql("Stars? Stars!!! ()");

expect($("#test #library-select")[0].options[1].value).to.eql("2");
expect($("#test #library-select")[0].options[1].textContent).to.eql("I See the Moon ()");

$('#test #library-select').val('2');
$("#test .submit-add-to-library").click();

expect(fakeLibraryController.addBibcodesToLib.args[0][0]).to.eql({library: "2", bibcodes: "selected"});
expect(fakeLibraryController.addBibcodesToLib.args[0][0]).to.eql({ library: '2', bibcodes: 'selected' });

$("#test input[name=new-library-name]").val("fakeName");
$("#test input[name=new-library-name]").trigger("keyup");

$("#test .submit-create-library").click();
$('#test #library-select').val('0');
$('#test .submit-add-to-library').click();

expect(fakeLibraryController.createLibAndAddBibcodes.args[0][0]).to.eql({ bibcodes: "selected", name : "fakeName" });

Expand Down

0 comments on commit 703d7e5

Please sign in to comment.