define(['underscore', 'jquery', 'backbone', 'models/metadata/eml211/EMLText',
'text!themes/ess-dive/templates/metadata/referencePaper.html'],
function (_, $, Backbone, EMLText, Template) {
/***
* SubView for managing Funding Organizations
*
* @type {void|*}
*/
var EMLReferencePaperSubView = Backbone.View.extend({
tagName: "div",
attributes: {
"data-category":"referencePaper"
},
events: {
"change" : "handleUpdate",
"click .remove" : "handleRemove",
"mouseover .remove" : "previewRemove",
"mouseout .remove" : "previewRemove"
},
className: "row-fluid eml-additional-info",
template: _.template(Template),
/**
* Initialize the Sub View
* @param options
*/
initialize: function(options){
this.papers =[];
this.parentModel = options.parentModel;
// Restrict Additional Information to a single element. Otherwise
// we will not know where the reference papers are.
this.additionalInfo = this.parentModel.get("additionalInfo");
if(Array.isArray(this.additionalInfo) && this.additionalInfo.length !=0){
this.additionalInfo = this.additionalInfo[0]
}
if (!this.additionalInfo || this.additionalInfo.length == 0 || !this.additionalInfo.get("section")){
this.additionalInfo = new EMLText({
text:[],
section: new EMLText({
type: "section",
title: "Related References",
text:[]
})
});
}
if (_.isArray(this.additionalInfo.get("section"))) {
var section = this.additionalInfo.get("section")[0];
this.papers = section.text;
}
else
this.papers = this.additionalInfo.get("section").text;
},
/**
* Render the template with the data
*
* @returns {EMLReferencePaperSubView}
*/
render: function () {
// Render the template with the selected funding organizations
this.$el.html(this.template({
"referencePapers": this.papers
}
));
// This is a Subview
this.delegateEvents();
return this;
},
/**
* Update reference paper
*
* @param e
* @returns {boolean}
*/
handleUpdate: function(e){
if(!e) return false;
// Get the DOM position so we know which one to update
var position = this.$(".reference-paper-item").index($(e.target));
// Stop if, for some odd reason, the target isn't found
if (position === -1) {
return;
}
// Create an EML Text
this.papers[position] =$(e.target).val();
//Add this model to the parent EML model when it is valid
this.parentModel.set("additionalInfo", new EMLText({
text:[],
section: new EMLText({
type: "section",
title: "Related References",
text: this.papers
})
}));
//Show the remove button
$(e.target).parents(".reference-paper-container").find(".remove").show();
this.render()
},
/***
* Remove this reference paper
*
* @param e
*/
handleRemove: function(e){
//Get the index of this step
var stepEl = $(e.target).parent(".reference-paper-container").find(".reference-paper-item"),
index = this.$(".reference-paper-item").index(stepEl),
view = this;
//Remove this step from the model
this.papers = _.without(this.papers, this.papers[index]);
//Add this model to the parent EML model when it is valid
this.parentModel.set("additionalInfo", new EMLText({
text:[],
section: new EMLText({
type: "section",
title: "Related References",
text:this.papers
})
}));
this.render();
},
previewRemove: function(e){
$(e.target).parents(".reference-paper-container").toggleClass("remove-preview");
}
});
return EMLReferencePaperSubView;
}
);