mirror of
https://github.com/galaxyproject/galaxy.git
synced 2026-09-24 16:30:27 +08:00
Ui: Add js-part of library data tool parameter, code adjustments to select/option fields
This commit is contained in:
guerler
@@ -4,8 +4,9 @@
|
||||
define(['utils/utils',
|
||||
'mvc/ui/ui-misc',
|
||||
'mvc/form/form-select-content',
|
||||
'mvc/ui/ui-select-library',
|
||||
'mvc/ui/ui-color-picker'],
|
||||
function(Utils, Ui, SelectContent, ColorPicker) {
|
||||
function(Utils, Ui, SelectContent, SelectLibrary, ColorPicker) {
|
||||
|
||||
// create form view
|
||||
return Backbone.Model.extend({
|
||||
@@ -24,7 +25,8 @@ define(['utils/utils',
|
||||
'color' : '_fieldColor',
|
||||
'hidden' : '_fieldHidden',
|
||||
'hidden_data' : '_fieldHidden',
|
||||
'baseurl' : '_fieldHidden'
|
||||
'baseurl' : '_fieldHidden',
|
||||
'library_data' : '_fieldLibrary'
|
||||
},
|
||||
|
||||
// initialize
|
||||
@@ -141,6 +143,7 @@ define(['utils/utils',
|
||||
id : 'field-' + input_def.id,
|
||||
data : options,
|
||||
error_text : input_def.error_text || 'No options available',
|
||||
optional : input_def.optional && input_def.default_value === null,
|
||||
multiple : input_def.multiple,
|
||||
searchable : input_def.searchable,
|
||||
onchange : function() {
|
||||
@@ -251,6 +254,20 @@ define(['utils/utils',
|
||||
self.app.trigger('change');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/** Library dataset field
|
||||
*/
|
||||
_fieldLibrary: function(input_def) {
|
||||
var self = this;
|
||||
return new SelectLibrary.View({
|
||||
id : 'field-' + input_def.id,
|
||||
optional : input_def.optional,
|
||||
multiple : input_def.multiple,
|
||||
onchange : function() {
|
||||
self.app.trigger('change');
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -39,7 +39,7 @@ var Base = Backbone.View.extend({
|
||||
this.all_button = new ButtonCheck({
|
||||
onclick: function() {
|
||||
self.$('input').prop('checked', self.all_button.value() !== 0);
|
||||
self._change();
|
||||
self.trigger('change');
|
||||
}
|
||||
});
|
||||
this.$menu.append(this.all_button.$el);
|
||||
@@ -60,7 +60,7 @@ var Base = Backbone.View.extend({
|
||||
|
||||
// add change event. fires on trigger
|
||||
this.on('change', function() {
|
||||
self._change();
|
||||
this.options.onchange && this.options.onchange(this.value());
|
||||
});
|
||||
},
|
||||
|
||||
@@ -91,7 +91,7 @@ var Base = Backbone.View.extend({
|
||||
var self = this;
|
||||
this.$('input').on('change', function() {
|
||||
self.value(self._getValue());
|
||||
self._change();
|
||||
self.trigger('change');
|
||||
});
|
||||
|
||||
// set previous value
|
||||
@@ -105,26 +105,30 @@ var Base = Backbone.View.extend({
|
||||
if (new_value !== undefined) {
|
||||
// reset selection
|
||||
this.$('input').prop('checked', false);
|
||||
|
||||
// set value
|
||||
if (new_value !== null) {
|
||||
// check if its an array
|
||||
if (!(new_value instanceof Array)) {
|
||||
new_value = [new_value];
|
||||
}
|
||||
|
||||
// update to new selection
|
||||
for (var i in new_value) {
|
||||
this.$('input[value="' + new_value[i] + '"]').first().prop('checked', true);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// refresh
|
||||
this._refresh();
|
||||
|
||||
// get and return value
|
||||
return this._getValue();
|
||||
// get current value
|
||||
var current = this._getValue();
|
||||
if (this.all_button) {
|
||||
var value = current;
|
||||
if (!(value instanceof Array)) {
|
||||
value = 0;
|
||||
} else {
|
||||
value = value.length;
|
||||
}
|
||||
this.all_button.value(value, this._size());
|
||||
}
|
||||
return current;
|
||||
},
|
||||
|
||||
/** Check if selected value exists (or any if multiple)
|
||||
@@ -167,21 +171,6 @@ var Base = Backbone.View.extend({
|
||||
/** Hide wait message
|
||||
*/
|
||||
unwait: function() {
|
||||
this._refresh();
|
||||
},
|
||||
|
||||
/** Trigger custom onchange callback function
|
||||
*/
|
||||
_change: function() {
|
||||
if (this.options.onchange) {
|
||||
this.options.onchange(this._getValue());
|
||||
}
|
||||
},
|
||||
|
||||
/** Refresh options view
|
||||
*/
|
||||
_refresh: function() {
|
||||
// show/hide messages
|
||||
var total = this._size();
|
||||
if (total == 0) {
|
||||
this._messageShow(this.options.error_text, 'danger');
|
||||
@@ -192,16 +181,6 @@ var Base = Backbone.View.extend({
|
||||
this.$options.css('display', 'inline-block');
|
||||
this.$menu.show();
|
||||
}
|
||||
// refresh select/unselect button
|
||||
if (this.all_button) {
|
||||
var value = this._getValue();
|
||||
if (!(value instanceof Array)) {
|
||||
value = 0;
|
||||
} else {
|
||||
value = value.length;
|
||||
}
|
||||
this.all_button.value(value, total);
|
||||
}
|
||||
},
|
||||
|
||||
/** Return current selection
|
||||
|
||||
@@ -6,7 +6,7 @@ define(['utils/utils', 'mvc/ui/ui-button-check'], function(Utils, ButtonCheck) {
|
||||
*/
|
||||
var View = Backbone.View.extend({
|
||||
// options
|
||||
optionsDefault : {
|
||||
optionsDefault: {
|
||||
id : Utils.uid(),
|
||||
cls : 'ui-select',
|
||||
error_text : 'No data available',
|
||||
@@ -19,7 +19,7 @@ var View = Backbone.View.extend({
|
||||
},
|
||||
|
||||
// initialize
|
||||
initialize : function(options) {
|
||||
initialize: function(options) {
|
||||
// link this
|
||||
var self = this;
|
||||
|
||||
@@ -45,7 +45,7 @@ var View = Backbone.View.extend({
|
||||
new_value = self._availableOptions();
|
||||
}
|
||||
self.value(new_value);
|
||||
self._change();
|
||||
self.trigger('change');
|
||||
}
|
||||
});
|
||||
this.$el.prepend(this.all_button.$el);
|
||||
@@ -56,7 +56,7 @@ var View = Backbone.View.extend({
|
||||
this.$button.remove();
|
||||
}
|
||||
|
||||
// refresh
|
||||
// update initial options
|
||||
this.update(this.options.data);
|
||||
|
||||
// set initial value
|
||||
@@ -78,18 +78,18 @@ var View = Backbone.View.extend({
|
||||
|
||||
// add change event. fires only on user activity
|
||||
this.$select.on('change', function() {
|
||||
self._change();
|
||||
self.trigger('change');
|
||||
});
|
||||
|
||||
// add change event. fires on trigger
|
||||
this.on('change', function() {
|
||||
self._change();
|
||||
self.options.onchange && self.options.onchange(this.value());
|
||||
});
|
||||
},
|
||||
|
||||
/** Return/Set current selection
|
||||
*/
|
||||
value : function (new_value) {
|
||||
value: function (new_value) {
|
||||
// set new value
|
||||
if (new_value !== undefined) {
|
||||
if (new_value === null) {
|
||||
@@ -102,12 +102,12 @@ var View = Backbone.View.extend({
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// refresh
|
||||
this._refresh();
|
||||
|
||||
// validate and return value
|
||||
return this._getValue();
|
||||
// get current value
|
||||
var current = this._getValue();
|
||||
if (this.all_button) {
|
||||
this.all_button.value($.isArray(current) && current.length || 0, this._size());
|
||||
}
|
||||
return current;
|
||||
},
|
||||
|
||||
/** Return the first select option
|
||||
@@ -123,7 +123,7 @@ var View = Backbone.View.extend({
|
||||
|
||||
/** Return the label/text of the current selection
|
||||
*/
|
||||
text : function () {
|
||||
text: function () {
|
||||
return this.$select.find('option:selected').text();
|
||||
},
|
||||
|
||||
@@ -173,28 +173,7 @@ var View = Backbone.View.extend({
|
||||
this.$select.prop('disabled', true);
|
||||
},
|
||||
|
||||
/** Add a select option
|
||||
*/
|
||||
add: function(options) {
|
||||
// add options
|
||||
this.$select.append(this._templateOption(options));
|
||||
|
||||
// refresh
|
||||
this._refresh();
|
||||
},
|
||||
|
||||
/** Delete a select option
|
||||
*/
|
||||
del: function(value) {
|
||||
// remove option
|
||||
this.$select.find('option[value=' + value + ']').remove();
|
||||
this.$select.trigger('change');
|
||||
|
||||
// refresh
|
||||
this._refresh();
|
||||
},
|
||||
|
||||
/** Update select options
|
||||
/** Update all available options at once
|
||||
*/
|
||||
update: function(options) {
|
||||
// backup current value
|
||||
@@ -213,6 +192,18 @@ var View = Backbone.View.extend({
|
||||
this.$select.append(this._templateOption(options[key]));
|
||||
}
|
||||
|
||||
// count remaining entries
|
||||
if (this._size() == 0) {
|
||||
// disable select field
|
||||
this.disable();
|
||||
|
||||
// create placeholder
|
||||
this.$select.append(this._templateOption({value : '__null__', label : this.options.error_text}));
|
||||
} else {
|
||||
// enable select field
|
||||
this.enable();
|
||||
}
|
||||
|
||||
// update to searchable field (in this case select2)
|
||||
if (this.options.searchable) {
|
||||
this.$select.select2('destroy');
|
||||
@@ -240,15 +231,8 @@ var View = Backbone.View.extend({
|
||||
return this.$select.find('option[value="' + value + '"]').length > 0;
|
||||
},
|
||||
|
||||
/** Trigger custom onchange callback
|
||||
/** Get current value from dom
|
||||
*/
|
||||
_change: function() {
|
||||
if (this.options.onchange) {
|
||||
this.options.onchange(this._getValue());
|
||||
}
|
||||
},
|
||||
|
||||
/** Validate */
|
||||
_getValue: function() {
|
||||
var val = this.$select.val();
|
||||
if (!Utils.validate(val)) {
|
||||
@@ -257,29 +241,6 @@ var View = Backbone.View.extend({
|
||||
return val;
|
||||
},
|
||||
|
||||
/** Refresh the select view
|
||||
*/
|
||||
_refresh: function() {
|
||||
// count remaining entries
|
||||
var total = this.$select.find('option').length;
|
||||
if (total == 0) {
|
||||
// disable select field
|
||||
this.disable();
|
||||
|
||||
// create placeholder
|
||||
this.$select.empty();
|
||||
this.$select.append(this._templateOption({value : '__null__', label : this.options.error_text}));
|
||||
} else {
|
||||
// enable select field
|
||||
this.enable();
|
||||
}
|
||||
// refresh select/unselect button
|
||||
if (this.all_button) {
|
||||
var value = this._getValue();
|
||||
this.all_button.value($.isArray(value) && value.length || 0, total);
|
||||
}
|
||||
},
|
||||
|
||||
/** Returns all currently available options
|
||||
*/
|
||||
_availableOptions: function() {
|
||||
@@ -290,6 +251,12 @@ var View = Backbone.View.extend({
|
||||
return available;
|
||||
},
|
||||
|
||||
/** Number of available options
|
||||
*/
|
||||
_size: function() {
|
||||
return this.$select.find('option').length;
|
||||
},
|
||||
|
||||
/** Template for select options
|
||||
*/
|
||||
_templateOption: function(options) {
|
||||
|
||||
@@ -0,0 +1,132 @@
|
||||
// dependencies
|
||||
define(['utils/utils', 'mvc/ui/ui-misc', 'mvc/ui/ui-tabs', 'mvc/tools/tools-template'],
|
||||
function(Utils, Ui, Tabs, ToolTemplate) {
|
||||
|
||||
// collection of libraries
|
||||
var Libraries = Backbone.Collection.extend({
|
||||
url: galaxy_config.root + 'api/libraries'
|
||||
});
|
||||
|
||||
// collection of dataset
|
||||
var LibraryDatasets = Backbone.Collection.extend({
|
||||
initialize: function() {
|
||||
var self = this;
|
||||
this.config = new Backbone.Model({ library_id: null });
|
||||
this.config.on('change', function() {
|
||||
self.fetch({reset: true});
|
||||
});
|
||||
},
|
||||
url: function() {
|
||||
return galaxy_config.root + 'api/libraries/' + this.config.get('library_id') + '/contents'
|
||||
}
|
||||
});
|
||||
|
||||
// hda/hdca content selector ui element
|
||||
var View = Backbone.View.extend({
|
||||
// initialize
|
||||
initialize : function(options) {
|
||||
// link this
|
||||
var self = this;
|
||||
|
||||
// collections
|
||||
this.libraries = new Libraries();
|
||||
this.datasets = new LibraryDatasets();
|
||||
|
||||
// link app and options
|
||||
this.options = options;
|
||||
|
||||
// select field for the library
|
||||
this.library_select = new Ui.Select.View({
|
||||
optional : options.optional,
|
||||
onchange : function(value) {
|
||||
self.datasets.config.set('library_id', value);
|
||||
}
|
||||
});
|
||||
|
||||
// select field for the library dataset
|
||||
this.dataset_select = new Ui.Select.View({
|
||||
optional : options.optional,
|
||||
multiple : options.multiple,
|
||||
onchange : function() {
|
||||
self.trigger('change');
|
||||
}
|
||||
});
|
||||
|
||||
// add reset handler for fetched libraries
|
||||
this.libraries.on('reset', function() {
|
||||
var data = [];
|
||||
self.libraries.each(function(model) {
|
||||
data.push({
|
||||
value : model.id,
|
||||
label : model.get('name')
|
||||
});
|
||||
});
|
||||
self.library_select.update(data);
|
||||
self.trigger('change');
|
||||
});
|
||||
|
||||
// add reset handler for fetched library datasets
|
||||
this.datasets.on('reset', function() {
|
||||
var data = [];
|
||||
var library_current = self.library_select.text();
|
||||
if (library_current !== null) {
|
||||
self.datasets.each(function(model) {
|
||||
if (model.get('type') === 'file') {
|
||||
data.push({
|
||||
value : model.id,
|
||||
label : library_current + model.get('name')
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
self.dataset_select.update(data);
|
||||
self.trigger('change');
|
||||
});
|
||||
|
||||
// add change event. fires on trigger
|
||||
this.on('change', function() {
|
||||
options.onchange && options.onchange(self.value());
|
||||
});
|
||||
|
||||
// create element
|
||||
this.setElement(this._template());
|
||||
this.$('.library-select').append(this.library_select.$el);
|
||||
this.$('.dataset-select').append(this.dataset_select.$el);
|
||||
|
||||
// initial fetch of libraries
|
||||
this.libraries.fetch({
|
||||
reset: true,
|
||||
success: function() {
|
||||
self.library_select.trigger('change');
|
||||
if (self.options.value !== undefined) {
|
||||
self.value(self.options.value);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/** Return/Set currently selected library datasets */
|
||||
value: function(new_val) {
|
||||
return this.dataset_select.value();
|
||||
},
|
||||
|
||||
/** Template */
|
||||
_template: function() {
|
||||
return '<div class="ui-select-library">' +
|
||||
'<div class="library ui-margin-bottom">' +
|
||||
'<span class="library-title">Select Library</span>' +
|
||||
'<span class="library-select"/>' +
|
||||
'</div>' +
|
||||
'<div class="dataset">' +
|
||||
'<span class="dataset-title">Select Dataset</span>' +
|
||||
'<span class="dataset-select"/>' +
|
||||
'</div>' +
|
||||
'</div>';
|
||||
}
|
||||
});
|
||||
|
||||
return {
|
||||
View: View
|
||||
}
|
||||
|
||||
});
|
||||
@@ -4,8 +4,9 @@
|
||||
define(['utils/utils',
|
||||
'mvc/ui/ui-misc',
|
||||
'mvc/form/form-select-content',
|
||||
'mvc/ui/ui-select-library',
|
||||
'mvc/ui/ui-color-picker'],
|
||||
function(Utils, Ui, SelectContent, ColorPicker) {
|
||||
function(Utils, Ui, SelectContent, SelectLibrary, ColorPicker) {
|
||||
|
||||
// create form view
|
||||
return Backbone.Model.extend({
|
||||
@@ -24,7 +25,8 @@ define(['utils/utils',
|
||||
'color' : '_fieldColor',
|
||||
'hidden' : '_fieldHidden',
|
||||
'hidden_data' : '_fieldHidden',
|
||||
'baseurl' : '_fieldHidden'
|
||||
'baseurl' : '_fieldHidden',
|
||||
'library_data' : '_fieldLibrary'
|
||||
},
|
||||
|
||||
// initialize
|
||||
@@ -141,6 +143,7 @@ define(['utils/utils',
|
||||
id : 'field-' + input_def.id,
|
||||
data : options,
|
||||
error_text : input_def.error_text || 'No options available',
|
||||
optional : input_def.optional && input_def.default_value === null,
|
||||
multiple : input_def.multiple,
|
||||
searchable : input_def.searchable,
|
||||
onchange : function() {
|
||||
@@ -251,6 +254,20 @@ define(['utils/utils',
|
||||
self.app.trigger('change');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/** Library dataset field
|
||||
*/
|
||||
_fieldLibrary: function(input_def) {
|
||||
var self = this;
|
||||
return new SelectLibrary.View({
|
||||
id : 'field-' + input_def.id,
|
||||
optional : input_def.optional,
|
||||
multiple : input_def.multiple,
|
||||
onchange : function() {
|
||||
self.app.trigger('change');
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -39,7 +39,7 @@ var Base = Backbone.View.extend({
|
||||
this.all_button = new ButtonCheck({
|
||||
onclick: function() {
|
||||
self.$('input').prop('checked', self.all_button.value() !== 0);
|
||||
self._change();
|
||||
self.trigger('change');
|
||||
}
|
||||
});
|
||||
this.$menu.append(this.all_button.$el);
|
||||
@@ -60,7 +60,7 @@ var Base = Backbone.View.extend({
|
||||
|
||||
// add change event. fires on trigger
|
||||
this.on('change', function() {
|
||||
self._change();
|
||||
this.options.onchange && this.options.onchange(this.value());
|
||||
});
|
||||
},
|
||||
|
||||
@@ -91,7 +91,7 @@ var Base = Backbone.View.extend({
|
||||
var self = this;
|
||||
this.$('input').on('change', function() {
|
||||
self.value(self._getValue());
|
||||
self._change();
|
||||
self.trigger('change');
|
||||
});
|
||||
|
||||
// set previous value
|
||||
@@ -105,26 +105,30 @@ var Base = Backbone.View.extend({
|
||||
if (new_value !== undefined) {
|
||||
// reset selection
|
||||
this.$('input').prop('checked', false);
|
||||
|
||||
// set value
|
||||
if (new_value !== null) {
|
||||
// check if its an array
|
||||
if (!(new_value instanceof Array)) {
|
||||
new_value = [new_value];
|
||||
}
|
||||
|
||||
// update to new selection
|
||||
for (var i in new_value) {
|
||||
this.$('input[value="' + new_value[i] + '"]').first().prop('checked', true);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// refresh
|
||||
this._refresh();
|
||||
|
||||
// get and return value
|
||||
return this._getValue();
|
||||
// get current value
|
||||
var current = this._getValue();
|
||||
if (this.all_button) {
|
||||
var value = current;
|
||||
if (!(value instanceof Array)) {
|
||||
value = 0;
|
||||
} else {
|
||||
value = value.length;
|
||||
}
|
||||
this.all_button.value(value, this._size());
|
||||
}
|
||||
return current;
|
||||
},
|
||||
|
||||
/** Check if selected value exists (or any if multiple)
|
||||
@@ -167,21 +171,6 @@ var Base = Backbone.View.extend({
|
||||
/** Hide wait message
|
||||
*/
|
||||
unwait: function() {
|
||||
this._refresh();
|
||||
},
|
||||
|
||||
/** Trigger custom onchange callback function
|
||||
*/
|
||||
_change: function() {
|
||||
if (this.options.onchange) {
|
||||
this.options.onchange(this._getValue());
|
||||
}
|
||||
},
|
||||
|
||||
/** Refresh options view
|
||||
*/
|
||||
_refresh: function() {
|
||||
// show/hide messages
|
||||
var total = this._size();
|
||||
if (total == 0) {
|
||||
this._messageShow(this.options.error_text, 'danger');
|
||||
@@ -192,16 +181,6 @@ var Base = Backbone.View.extend({
|
||||
this.$options.css('display', 'inline-block');
|
||||
this.$menu.show();
|
||||
}
|
||||
// refresh select/unselect button
|
||||
if (this.all_button) {
|
||||
var value = this._getValue();
|
||||
if (!(value instanceof Array)) {
|
||||
value = 0;
|
||||
} else {
|
||||
value = value.length;
|
||||
}
|
||||
this.all_button.value(value, total);
|
||||
}
|
||||
},
|
||||
|
||||
/** Return current selection
|
||||
|
||||
@@ -6,7 +6,7 @@ define(['utils/utils', 'mvc/ui/ui-button-check'], function(Utils, ButtonCheck) {
|
||||
*/
|
||||
var View = Backbone.View.extend({
|
||||
// options
|
||||
optionsDefault : {
|
||||
optionsDefault: {
|
||||
id : Utils.uid(),
|
||||
cls : 'ui-select',
|
||||
error_text : 'No data available',
|
||||
@@ -19,7 +19,7 @@ var View = Backbone.View.extend({
|
||||
},
|
||||
|
||||
// initialize
|
||||
initialize : function(options) {
|
||||
initialize: function(options) {
|
||||
// link this
|
||||
var self = this;
|
||||
|
||||
@@ -45,7 +45,7 @@ var View = Backbone.View.extend({
|
||||
new_value = self._availableOptions();
|
||||
}
|
||||
self.value(new_value);
|
||||
self._change();
|
||||
self.trigger('change');
|
||||
}
|
||||
});
|
||||
this.$el.prepend(this.all_button.$el);
|
||||
@@ -56,7 +56,7 @@ var View = Backbone.View.extend({
|
||||
this.$button.remove();
|
||||
}
|
||||
|
||||
// refresh
|
||||
// update initial options
|
||||
this.update(this.options.data);
|
||||
|
||||
// set initial value
|
||||
@@ -78,18 +78,18 @@ var View = Backbone.View.extend({
|
||||
|
||||
// add change event. fires only on user activity
|
||||
this.$select.on('change', function() {
|
||||
self._change();
|
||||
self.trigger('change');
|
||||
});
|
||||
|
||||
// add change event. fires on trigger
|
||||
this.on('change', function() {
|
||||
self._change();
|
||||
self.options.onchange && self.options.onchange(this.value());
|
||||
});
|
||||
},
|
||||
|
||||
/** Return/Set current selection
|
||||
*/
|
||||
value : function (new_value) {
|
||||
value: function (new_value) {
|
||||
// set new value
|
||||
if (new_value !== undefined) {
|
||||
if (new_value === null) {
|
||||
@@ -102,12 +102,12 @@ var View = Backbone.View.extend({
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// refresh
|
||||
this._refresh();
|
||||
|
||||
// validate and return value
|
||||
return this._getValue();
|
||||
// get current value
|
||||
var current = this._getValue();
|
||||
if (this.all_button) {
|
||||
this.all_button.value($.isArray(current) && current.length || 0, this._size());
|
||||
}
|
||||
return current;
|
||||
},
|
||||
|
||||
/** Return the first select option
|
||||
@@ -123,7 +123,7 @@ var View = Backbone.View.extend({
|
||||
|
||||
/** Return the label/text of the current selection
|
||||
*/
|
||||
text : function () {
|
||||
text: function () {
|
||||
return this.$select.find('option:selected').text();
|
||||
},
|
||||
|
||||
@@ -173,28 +173,7 @@ var View = Backbone.View.extend({
|
||||
this.$select.prop('disabled', true);
|
||||
},
|
||||
|
||||
/** Add a select option
|
||||
*/
|
||||
add: function(options) {
|
||||
// add options
|
||||
this.$select.append(this._templateOption(options));
|
||||
|
||||
// refresh
|
||||
this._refresh();
|
||||
},
|
||||
|
||||
/** Delete a select option
|
||||
*/
|
||||
del: function(value) {
|
||||
// remove option
|
||||
this.$select.find('option[value=' + value + ']').remove();
|
||||
this.$select.trigger('change');
|
||||
|
||||
// refresh
|
||||
this._refresh();
|
||||
},
|
||||
|
||||
/** Update select options
|
||||
/** Update all available options at once
|
||||
*/
|
||||
update: function(options) {
|
||||
// backup current value
|
||||
@@ -213,6 +192,18 @@ var View = Backbone.View.extend({
|
||||
this.$select.append(this._templateOption(options[key]));
|
||||
}
|
||||
|
||||
// count remaining entries
|
||||
if (this._size() == 0) {
|
||||
// disable select field
|
||||
this.disable();
|
||||
|
||||
// create placeholder
|
||||
this.$select.append(this._templateOption({value : '__null__', label : this.options.error_text}));
|
||||
} else {
|
||||
// enable select field
|
||||
this.enable();
|
||||
}
|
||||
|
||||
// update to searchable field (in this case select2)
|
||||
if (this.options.searchable) {
|
||||
this.$select.select2('destroy');
|
||||
@@ -240,15 +231,8 @@ var View = Backbone.View.extend({
|
||||
return this.$select.find('option[value="' + value + '"]').length > 0;
|
||||
},
|
||||
|
||||
/** Trigger custom onchange callback
|
||||
/** Get current value from dom
|
||||
*/
|
||||
_change: function() {
|
||||
if (this.options.onchange) {
|
||||
this.options.onchange(this._getValue());
|
||||
}
|
||||
},
|
||||
|
||||
/** Validate */
|
||||
_getValue: function() {
|
||||
var val = this.$select.val();
|
||||
if (!Utils.validate(val)) {
|
||||
@@ -257,29 +241,6 @@ var View = Backbone.View.extend({
|
||||
return val;
|
||||
},
|
||||
|
||||
/** Refresh the select view
|
||||
*/
|
||||
_refresh: function() {
|
||||
// count remaining entries
|
||||
var total = this.$select.find('option').length;
|
||||
if (total == 0) {
|
||||
// disable select field
|
||||
this.disable();
|
||||
|
||||
// create placeholder
|
||||
this.$select.empty();
|
||||
this.$select.append(this._templateOption({value : '__null__', label : this.options.error_text}));
|
||||
} else {
|
||||
// enable select field
|
||||
this.enable();
|
||||
}
|
||||
// refresh select/unselect button
|
||||
if (this.all_button) {
|
||||
var value = this._getValue();
|
||||
this.all_button.value($.isArray(value) && value.length || 0, total);
|
||||
}
|
||||
},
|
||||
|
||||
/** Returns all currently available options
|
||||
*/
|
||||
_availableOptions: function() {
|
||||
@@ -290,6 +251,12 @@ var View = Backbone.View.extend({
|
||||
return available;
|
||||
},
|
||||
|
||||
/** Number of available options
|
||||
*/
|
||||
_size: function() {
|
||||
return this.$select.find('option').length;
|
||||
},
|
||||
|
||||
/** Template for select options
|
||||
*/
|
||||
_templateOption: function(options) {
|
||||
|
||||
@@ -0,0 +1,132 @@
|
||||
// dependencies
|
||||
define(['utils/utils', 'mvc/ui/ui-misc', 'mvc/ui/ui-tabs', 'mvc/tools/tools-template'],
|
||||
function(Utils, Ui, Tabs, ToolTemplate) {
|
||||
|
||||
// collection of libraries
|
||||
var Libraries = Backbone.Collection.extend({
|
||||
url: galaxy_config.root + 'api/libraries'
|
||||
});
|
||||
|
||||
// collection of dataset
|
||||
var LibraryDatasets = Backbone.Collection.extend({
|
||||
initialize: function() {
|
||||
var self = this;
|
||||
this.config = new Backbone.Model({ library_id: null });
|
||||
this.config.on('change', function() {
|
||||
self.fetch({reset: true});
|
||||
});
|
||||
},
|
||||
url: function() {
|
||||
return galaxy_config.root + 'api/libraries/' + this.config.get('library_id') + '/contents'
|
||||
}
|
||||
});
|
||||
|
||||
// hda/hdca content selector ui element
|
||||
var View = Backbone.View.extend({
|
||||
// initialize
|
||||
initialize : function(options) {
|
||||
// link this
|
||||
var self = this;
|
||||
|
||||
// collections
|
||||
this.libraries = new Libraries();
|
||||
this.datasets = new LibraryDatasets();
|
||||
|
||||
// link app and options
|
||||
this.options = options;
|
||||
|
||||
// select field for the library
|
||||
this.library_select = new Ui.Select.View({
|
||||
optional : options.optional,
|
||||
onchange : function(value) {
|
||||
self.datasets.config.set('library_id', value);
|
||||
}
|
||||
});
|
||||
|
||||
// select field for the library dataset
|
||||
this.dataset_select = new Ui.Select.View({
|
||||
optional : options.optional,
|
||||
multiple : options.multiple,
|
||||
onchange : function() {
|
||||
self.trigger('change');
|
||||
}
|
||||
});
|
||||
|
||||
// add reset handler for fetched libraries
|
||||
this.libraries.on('reset', function() {
|
||||
var data = [];
|
||||
self.libraries.each(function(model) {
|
||||
data.push({
|
||||
value : model.id,
|
||||
label : model.get('name')
|
||||
});
|
||||
});
|
||||
self.library_select.update(data);
|
||||
self.trigger('change');
|
||||
});
|
||||
|
||||
// add reset handler for fetched library datasets
|
||||
this.datasets.on('reset', function() {
|
||||
var data = [];
|
||||
var library_current = self.library_select.text();
|
||||
if (library_current !== null) {
|
||||
self.datasets.each(function(model) {
|
||||
if (model.get('type') === 'file') {
|
||||
data.push({
|
||||
value : model.id,
|
||||
label : library_current + model.get('name')
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
self.dataset_select.update(data);
|
||||
self.trigger('change');
|
||||
});
|
||||
|
||||
// add change event. fires on trigger
|
||||
this.on('change', function() {
|
||||
options.onchange && options.onchange(self.value());
|
||||
});
|
||||
|
||||
// create element
|
||||
this.setElement(this._template());
|
||||
this.$('.library-select').append(this.library_select.$el);
|
||||
this.$('.dataset-select').append(this.dataset_select.$el);
|
||||
|
||||
// initial fetch of libraries
|
||||
this.libraries.fetch({
|
||||
reset: true,
|
||||
success: function() {
|
||||
self.library_select.trigger('change');
|
||||
if (self.options.value !== undefined) {
|
||||
self.value(self.options.value);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/** Return/Set currently selected library datasets */
|
||||
value: function(new_val) {
|
||||
return this.dataset_select.value();
|
||||
},
|
||||
|
||||
/** Template */
|
||||
_template: function() {
|
||||
return '<div class="ui-select-library">' +
|
||||
'<div class="library ui-margin-bottom">' +
|
||||
'<span class="library-title">Select Library</span>' +
|
||||
'<span class="library-select"/>' +
|
||||
'</div>' +
|
||||
'<div class="dataset">' +
|
||||
'<span class="dataset-title">Select Dataset</span>' +
|
||||
'<span class="dataset-select"/>' +
|
||||
'</div>' +
|
||||
'</div>';
|
||||
}
|
||||
});
|
||||
|
||||
return {
|
||||
View: View
|
||||
}
|
||||
|
||||
});
|
||||
@@ -1 +1 @@
|
||||
define(["utils/utils","mvc/ui/ui-misc","mvc/form/form-select-content","mvc/ui/ui-color-picker"],function(c,d,a,b){return Backbone.Model.extend({types:{text:"_fieldText",select:"_fieldSelect",data_column:"_fieldSelect",genomebuild:"_fieldSelect",data:"_fieldData",data_collection:"_fieldData",integer:"_fieldSlider","float":"_fieldSlider","boolean":"_fieldBoolean",drill_down:"_fieldDrilldown",color:"_fieldColor",hidden:"_fieldHidden",hidden_data:"_fieldHidden",baseurl:"_fieldHidden"},initialize:function(f,e){this.app=f},create:function(e){if(e.value===undefined){e.value=null}if(e.default_value===undefined){e.default_value=e.value}var g=null;var f=this.types[e.type];if(f&&typeof(this[f])==="function"){g=this[f].call(this,e)}if(!g){this.app.incompatible=true;if(e.options){g=this._fieldSelect(e)}else{g=this._fieldText(e)}console.debug("tools-form::_addRow() : Auto matched field type ("+e.type+").")}if(e.value!==undefined){g.value(e.value)}return g},_fieldData:function(e){if(!this.app.options.is_dynamic){e.info="Data input '"+e.name+"' ("+c.textify(e.extensions.toString())+")";e.value=null;return this._fieldHidden(e)}var f=this;return new a.View(this.app,{id:"field-"+e.id,extensions:e.extensions,optional:e.optional,multiple:e.multiple,type:e.type,data:e.options,onchange:function(){f.app.trigger("change")}})},_fieldSelect:function(e){if(!this.app.options.is_dynamic&&e.is_dynamic){return this._fieldText(e)}if(e.type=="data_column"){e.error_text="Missing columns in referenced dataset."}var g=[];for(var h in e.options){var j=e.options[h];g.push({label:j[0],value:j[1]})}var k=d.Select;switch(e.display){case"checkboxes":k=d.Checkbox;break;case"radio":k=d.Radio;break}var f=this;return new k.View({id:"field-"+e.id,data:g,error_text:e.error_text||"No options available",multiple:e.multiple,searchable:e.searchable,onchange:function(){f.app.trigger("change")}})},_fieldDrilldown:function(e){if(!this.app.options.is_dynamic&&e.is_dynamic){return this._fieldText(e)}var f=this;return new d.Drilldown.View({id:"field-"+e.id,data:e.options,display:e.display,onchange:function(){f.app.trigger("change")}})},_fieldText:function(e){if(e.options){e.area=e.multiple;if(!c.validate(e.value)){e.value=""}else{if(e.value instanceof Array){e.value=value.toString()}else{e.value=String(e.value).replace(/[\[\]'"\s]/g,"");if(e.multiple){e.value=e.value.replace(/,/g,"\n")}}}}var f=this;return new d.Input({id:"field-"+e.id,area:e.area,onchange:function(){f.app.trigger("change")}})},_fieldSlider:function(e){var f=this;return new d.Slider.View({id:"field-"+e.id,precise:e.type=="float",min:e.min,max:e.max,onchange:function(){f.app.trigger("change")}})},_fieldHidden:function(e){return new d.Hidden({id:"field-"+e.id,info:e.info})},_fieldBoolean:function(e){var f=this;return new d.RadioButton.View({id:"field-"+e.id,data:[{label:"Yes",value:"true"},{label:"No",value:"false"}],onchange:function(){f.app.trigger("change")}})},_fieldColor:function(e){var f=this;return new b({id:"field-"+e.id,onchange:function(){f.app.trigger("change")}})}});return{View:View}});
|
||||
define(["utils/utils","mvc/ui/ui-misc","mvc/form/form-select-content","mvc/ui/ui-select-library","mvc/ui/ui-color-picker"],function(d,e,a,c,b){return Backbone.Model.extend({types:{text:"_fieldText",select:"_fieldSelect",data_column:"_fieldSelect",genomebuild:"_fieldSelect",data:"_fieldData",data_collection:"_fieldData",integer:"_fieldSlider","float":"_fieldSlider","boolean":"_fieldBoolean",drill_down:"_fieldDrilldown",color:"_fieldColor",hidden:"_fieldHidden",hidden_data:"_fieldHidden",baseurl:"_fieldHidden",library_data:"_fieldLibrary"},initialize:function(g,f){this.app=g},create:function(f){if(f.value===undefined){f.value=null}if(f.default_value===undefined){f.default_value=f.value}var h=null;var g=this.types[f.type];if(g&&typeof(this[g])==="function"){h=this[g].call(this,f)}if(!h){this.app.incompatible=true;if(f.options){h=this._fieldSelect(f)}else{h=this._fieldText(f)}console.debug("tools-form::_addRow() : Auto matched field type ("+f.type+").")}if(f.value!==undefined){h.value(f.value)}return h},_fieldData:function(f){if(!this.app.options.is_dynamic){f.info="Data input '"+f.name+"' ("+d.textify(f.extensions.toString())+")";f.value=null;return this._fieldHidden(f)}var g=this;return new a.View(this.app,{id:"field-"+f.id,extensions:f.extensions,optional:f.optional,multiple:f.multiple,type:f.type,data:f.options,onchange:function(){g.app.trigger("change")}})},_fieldSelect:function(f){if(!this.app.options.is_dynamic&&f.is_dynamic){return this._fieldText(f)}if(f.type=="data_column"){f.error_text="Missing columns in referenced dataset."}var h=[];for(var j in f.options){var k=f.options[j];h.push({label:k[0],value:k[1]})}var l=e.Select;switch(f.display){case"checkboxes":l=e.Checkbox;break;case"radio":l=e.Radio;break}var g=this;return new l.View({id:"field-"+f.id,data:h,error_text:f.error_text||"No options available",optional:f.optional&&f.default_value===null,multiple:f.multiple,searchable:f.searchable,onchange:function(){g.app.trigger("change")}})},_fieldDrilldown:function(f){if(!this.app.options.is_dynamic&&f.is_dynamic){return this._fieldText(f)}var g=this;return new e.Drilldown.View({id:"field-"+f.id,data:f.options,display:f.display,onchange:function(){g.app.trigger("change")}})},_fieldText:function(f){if(f.options){f.area=f.multiple;if(!d.validate(f.value)){f.value=""}else{if(f.value instanceof Array){f.value=value.toString()}else{f.value=String(f.value).replace(/[\[\]'"\s]/g,"");if(f.multiple){f.value=f.value.replace(/,/g,"\n")}}}}var g=this;return new e.Input({id:"field-"+f.id,area:f.area,onchange:function(){g.app.trigger("change")}})},_fieldSlider:function(f){var g=this;return new e.Slider.View({id:"field-"+f.id,precise:f.type=="float",min:f.min,max:f.max,onchange:function(){g.app.trigger("change")}})},_fieldHidden:function(f){return new e.Hidden({id:"field-"+f.id,info:f.info})},_fieldBoolean:function(f){var g=this;return new e.RadioButton.View({id:"field-"+f.id,data:[{label:"Yes",value:"true"},{label:"No",value:"false"}],onchange:function(){g.app.trigger("change")}})},_fieldColor:function(f){var g=this;return new b({id:"field-"+f.id,onchange:function(){g.app.trigger("change")}})},_fieldLibrary:function(f){var g=this;return new c.View({id:"field-"+f.id,optional:f.optional,multiple:f.multiple,onchange:function(){g.app.trigger("change")}})}});return{View:View}});
|
||||
@@ -1 +1 @@
|
||||
define(["utils/utils","mvc/ui/ui-button-check"],function(c,e){var b=Backbone.View.extend({initialize:function(i){var h=this;this.optionsDefault={visible:true,data:[],id:c.uid(),error_text:"No data available.",wait_text:"Please wait...",multiple:false};this.options=c.merge(i,this.optionsDefault);this.setElement('<div class="ui-options"/>');this.$message=$("<div/>");this.$options=$(this._template(i));this.$menu=$('<div class="ui-options-menu"/>');this.$el.append(this.$message);this.$el.append(this.$menu);this.$el.append(this.$options);if(this.options.multiple){this.all_button=new e({onclick:function(){h.$("input").prop("checked",h.all_button.value()!==0);h._change()}});this.$menu.append(this.all_button.$el)}if(!this.options.visible){this.$el.hide()}this.update(this.options.data);if(this.options.value!==undefined){this.value(this.options.value)}this.on("change",function(){h._change()})},update:function(i){var l=this._getValue();this.$options.empty();if(this._templateOptions){this.$options.append(this._templateOptions(i))}else{for(var j in i){var k=$(this._templateOption(i[j]));k.addClass("ui-option");k.tooltip({title:i[j].tooltip,placement:"bottom"});this.$options.append(k)}}var h=this;this.$("input").on("change",function(){h.value(h._getValue());h._change()});this.value(l)},value:function(j){if(j!==undefined){this.$("input").prop("checked",false);if(j!==null){if(!(j instanceof Array)){j=[j]}for(var h in j){this.$('input[value="'+j[h]+'"]').first().prop("checked",true)}}}this._refresh();return this._getValue()},exists:function(j){if(j!==undefined){if(!(j instanceof Array)){j=[j]}for(var h in j){if(this.$('input[value="'+j[h]+'"]').length>0){return true}}}return false},first:function(){var h=this.$("input").first();if(h.length>0){return h.val()}else{return null}},wait:function(){if(this._size()==0){this._messageShow(this.options.wait_text,"info");this.$options.hide();this.$menu.hide()}},unwait:function(){this._refresh()},_change:function(){if(this.options.onchange){this.options.onchange(this._getValue())}},_refresh:function(){var h=this._size();if(h==0){this._messageShow(this.options.error_text,"danger");this.$options.hide();this.$menu.hide()}else{this._messageHide();this.$options.css("display","inline-block");this.$menu.show()}if(this.all_button){var i=this._getValue();if(!(i instanceof Array)){i=0}else{i=i.length}this.all_button.value(i,h)}},_getValue:function(){var h=[];this.$(":checked").each(function(){h.push($(this).val())});if(!c.validate(h)){return null}if(this.options.multiple){return h}else{return h[0]}},_size:function(){return this.$(".ui-option").length},_messageShow:function(i,h){this.$message.show();this.$message.removeClass();this.$message.addClass("ui-message alert alert-"+h);this.$message.html(i)},_messageHide:function(){this.$message.hide()},_template:function(){return'<div class="ui-options-list"/>'}});var a=b.extend({_templateOption:function(h){var i=c.uid();return'<div class="ui-option"><input id="'+i+'" type="'+this.options.type+'" name="'+this.options.id+'" value="'+h.value+'"/><label class="ui-options-label" for="'+i+'">'+h.label+"</label></div>"}});var f={};f.View=a.extend({initialize:function(h){h.type="radio";a.prototype.initialize.call(this,h)}});var d={};d.View=a.extend({initialize:function(h){h.multiple=true;h.type="checkbox";a.prototype.initialize.call(this,h)}});var g={};g.View=b.extend({initialize:function(h){b.prototype.initialize.call(this,h)},value:function(h){if(h!==undefined){this.$("input").prop("checked",false);this.$("label").removeClass("active");this.$('[value="'+h+'"]').prop("checked",true).closest("label").addClass("active")}return this._getValue()},_templateOption:function(j){var h="fa "+j.icon;if(!j.label){h+=" no-padding"}var i='<label class="btn btn-default">';if(j.icon){i+='<i class="'+h+'"/>'}i+='<input type="radio" name="'+this.options.id+'" value="'+j.value+'"/>';if(j.label){i+=j.label}i+="</label>";return i},_template:function(){return'<div class="btn-group ui-radiobutton" data-toggle="buttons"/>'}});return{Base:b,BaseIcons:a,Radio:f,RadioButton:g,Checkbox:d}});
|
||||
define(["utils/utils","mvc/ui/ui-button-check"],function(c,e){var b=Backbone.View.extend({initialize:function(i){var h=this;this.optionsDefault={visible:true,data:[],id:c.uid(),error_text:"No data available.",wait_text:"Please wait...",multiple:false};this.options=c.merge(i,this.optionsDefault);this.setElement('<div class="ui-options"/>');this.$message=$("<div/>");this.$options=$(this._template(i));this.$menu=$('<div class="ui-options-menu"/>');this.$el.append(this.$message);this.$el.append(this.$menu);this.$el.append(this.$options);if(this.options.multiple){this.all_button=new e({onclick:function(){h.$("input").prop("checked",h.all_button.value()!==0);h.trigger("change")}});this.$menu.append(this.all_button.$el)}if(!this.options.visible){this.$el.hide()}this.update(this.options.data);if(this.options.value!==undefined){this.value(this.options.value)}this.on("change",function(){this.options.onchange&&this.options.onchange(this.value())})},update:function(i){var l=this._getValue();this.$options.empty();if(this._templateOptions){this.$options.append(this._templateOptions(i))}else{for(var j in i){var k=$(this._templateOption(i[j]));k.addClass("ui-option");k.tooltip({title:i[j].tooltip,placement:"bottom"});this.$options.append(k)}}var h=this;this.$("input").on("change",function(){h.value(h._getValue());h.trigger("change")});this.value(l)},value:function(j){if(j!==undefined){this.$("input").prop("checked",false);if(j!==null){if(!(j instanceof Array)){j=[j]}for(var h in j){this.$('input[value="'+j[h]+'"]').first().prop("checked",true)}}}var l=this._getValue();if(this.all_button){var k=l;if(!(k instanceof Array)){k=0}else{k=k.length}this.all_button.value(k,this._size())}return l},exists:function(j){if(j!==undefined){if(!(j instanceof Array)){j=[j]}for(var h in j){if(this.$('input[value="'+j[h]+'"]').length>0){return true}}}return false},first:function(){var h=this.$("input").first();if(h.length>0){return h.val()}else{return null}},wait:function(){if(this._size()==0){this._messageShow(this.options.wait_text,"info");this.$options.hide();this.$menu.hide()}},unwait:function(){var h=this._size();if(h==0){this._messageShow(this.options.error_text,"danger");this.$options.hide();this.$menu.hide()}else{this._messageHide();this.$options.css("display","inline-block");this.$menu.show()}},_getValue:function(){var h=[];this.$(":checked").each(function(){h.push($(this).val())});if(!c.validate(h)){return null}if(this.options.multiple){return h}else{return h[0]}},_size:function(){return this.$(".ui-option").length},_messageShow:function(i,h){this.$message.show();this.$message.removeClass();this.$message.addClass("ui-message alert alert-"+h);this.$message.html(i)},_messageHide:function(){this.$message.hide()},_template:function(){return'<div class="ui-options-list"/>'}});var a=b.extend({_templateOption:function(h){var i=c.uid();return'<div class="ui-option"><input id="'+i+'" type="'+this.options.type+'" name="'+this.options.id+'" value="'+h.value+'"/><label class="ui-options-label" for="'+i+'">'+h.label+"</label></div>"}});var f={};f.View=a.extend({initialize:function(h){h.type="radio";a.prototype.initialize.call(this,h)}});var d={};d.View=a.extend({initialize:function(h){h.multiple=true;h.type="checkbox";a.prototype.initialize.call(this,h)}});var g={};g.View=b.extend({initialize:function(h){b.prototype.initialize.call(this,h)},value:function(h){if(h!==undefined){this.$("input").prop("checked",false);this.$("label").removeClass("active");this.$('[value="'+h+'"]').prop("checked",true).closest("label").addClass("active")}return this._getValue()},_templateOption:function(j){var h="fa "+j.icon;if(!j.label){h+=" no-padding"}var i='<label class="btn btn-default">';if(j.icon){i+='<i class="'+h+'"/>'}i+='<input type="radio" name="'+this.options.id+'" value="'+j.value+'"/>';if(j.label){i+=j.label}i+="</label>";return i},_template:function(){return'<div class="btn-group ui-radiobutton" data-toggle="buttons"/>'}});return{Base:b,BaseIcons:a,Radio:f,RadioButton:g,Checkbox:d}});
|
||||
@@ -1 +1 @@
|
||||
define(["utils/utils","mvc/ui/ui-button-check"],function(a,b){var c=Backbone.View.extend({optionsDefault:{id:a.uid(),cls:"ui-select",error_text:"No data available",empty_text:"No selection",visible:true,wait:false,multiple:false,searchable:true,optional:false},initialize:function(e){var d=this;this.options=a.merge(e,this.optionsDefault);this.setElement(this._template(this.options));this.$select=this.$el.find(".select");this.$icon=this.$el.find(".icon");this.$button=this.$el.find(".button");if(this.options.multiple){if(this.options.searchable){this.all_button=new b({onclick:function(){var f=[];if(d.all_button.value()!==0){f=d._availableOptions()}d.value(f);d._change()}});this.$el.prepend(this.all_button.$el)}this.$el.addClass("ui-select-multiple");this.$select.prop("multiple",true);this.$button.remove()}this.update(this.options.data);if(this.options.value!==undefined){this.value(this.options.value)}if(!this.options.visible){this.hide()}if(this.options.wait){this.wait()}else{this.show()}this.$select.on("change",function(){d._change()});this.on("change",function(){d._change()})},value:function(d){if(d!==undefined){if(d===null){d="__null__"}if(this.exists(d)||this.options.multiple){this.$select.val(d);if(this.$select.select2){this.$select.select2("val",d)}}}this._refresh();return this._getValue()},first:function(){var d=this.$select.find("option").first();if(d.length>0){return d.val()}else{return null}},text:function(){return this.$select.find("option:selected").text()},show:function(){this.unwait();this.$select.show();this.$el.show()},hide:function(){this.$el.hide()},wait:function(){this.$icon.removeClass();this.$icon.addClass("fa fa-spinner fa-spin")},unwait:function(){this.$icon.removeClass();this.$icon.addClass("fa fa-caret-down")},disabled:function(){return this.$select.is(":disabled")},enable:function(){this.$select.prop("disabled",false)},disable:function(){this.$select.prop("disabled",true)},add:function(d){this.$select.append(this._templateOption(d));this._refresh()},del:function(d){this.$select.find("option[value="+d+"]").remove();this.$select.trigger("change");this._refresh()},update:function(d){var f=this._getValue();this.$select.find("option").remove();if(!this.options.multiple&&this.options.optional){this.$select.append(this._templateOption({value:"__null__",label:this.options.empty_text}))}for(var e in d){this.$select.append(this._templateOption(d[e]))}if(this.options.searchable){this.$select.select2("destroy");this.$select.select2()}this.value(f);if(this._getValue()===null){this.value(this.first())}},setOnChange:function(d){this.options.onchange=d},exists:function(d){return this.$select.find('option[value="'+d+'"]').length>0},_change:function(){if(this.options.onchange){this.options.onchange(this._getValue())}},_getValue:function(){var d=this.$select.val();if(!a.validate(d)){return null}return d},_refresh:function(){var d=this.$select.find("option").length;if(d==0){this.disable();this.$select.empty();this.$select.append(this._templateOption({value:"__null__",label:this.options.error_text}))}else{this.enable()}if(this.all_button){var e=this._getValue();this.all_button.value($.isArray(e)&&e.length||0,d)}},_availableOptions:function(){var d=[];this.$select.find("option").each(function(f,g){d.push($(g).attr("value"))});return d},_templateOption:function(d){return'<option value="'+d.value+'">'+d.label+"</option>"},_template:function(d){return'<div id="'+d.id+'" class="'+d.cls+'"><select id="'+d.id+'_select" class="select"/><div class="button"><i class="icon"/></div></div>'}});return{View:c}});
|
||||
define(["utils/utils","mvc/ui/ui-button-check"],function(a,b){var c=Backbone.View.extend({optionsDefault:{id:a.uid(),cls:"ui-select",error_text:"No data available",empty_text:"No selection",visible:true,wait:false,multiple:false,searchable:true,optional:false},initialize:function(e){var d=this;this.options=a.merge(e,this.optionsDefault);this.setElement(this._template(this.options));this.$select=this.$el.find(".select");this.$icon=this.$el.find(".icon");this.$button=this.$el.find(".button");if(this.options.multiple){if(this.options.searchable){this.all_button=new b({onclick:function(){var f=[];if(d.all_button.value()!==0){f=d._availableOptions()}d.value(f);d.trigger("change")}});this.$el.prepend(this.all_button.$el)}this.$el.addClass("ui-select-multiple");this.$select.prop("multiple",true);this.$button.remove()}this.update(this.options.data);if(this.options.value!==undefined){this.value(this.options.value)}if(!this.options.visible){this.hide()}if(this.options.wait){this.wait()}else{this.show()}this.$select.on("change",function(){d.trigger("change")});this.on("change",function(){d.options.onchange&&d.options.onchange(this.value())})},value:function(d){if(d!==undefined){if(d===null){d="__null__"}if(this.exists(d)||this.options.multiple){this.$select.val(d);if(this.$select.select2){this.$select.select2("val",d)}}}var e=this._getValue();if(this.all_button){this.all_button.value($.isArray(e)&&e.length||0,this._size())}return e},first:function(){var d=this.$select.find("option").first();if(d.length>0){return d.val()}else{return null}},text:function(){return this.$select.find("option:selected").text()},show:function(){this.unwait();this.$select.show();this.$el.show()},hide:function(){this.$el.hide()},wait:function(){this.$icon.removeClass();this.$icon.addClass("fa fa-spinner fa-spin")},unwait:function(){this.$icon.removeClass();this.$icon.addClass("fa fa-caret-down")},disabled:function(){return this.$select.is(":disabled")},enable:function(){this.$select.prop("disabled",false)},disable:function(){this.$select.prop("disabled",true)},update:function(d){var f=this._getValue();this.$select.find("option").remove();if(!this.options.multiple&&this.options.optional){this.$select.append(this._templateOption({value:"__null__",label:this.options.empty_text}))}for(var e in d){this.$select.append(this._templateOption(d[e]))}if(this._size()==0){this.disable();this.$select.append(this._templateOption({value:"__null__",label:this.options.error_text}))}else{this.enable()}if(this.options.searchable){this.$select.select2("destroy");this.$select.select2()}this.value(f);if(this._getValue()===null){this.value(this.first())}},setOnChange:function(d){this.options.onchange=d},exists:function(d){return this.$select.find('option[value="'+d+'"]').length>0},_getValue:function(){var d=this.$select.val();if(!a.validate(d)){return null}return d},_availableOptions:function(){var d=[];this.$select.find("option").each(function(f,g){d.push($(g).attr("value"))});return d},_size:function(){return this.$select.find("option").length},_templateOption:function(d){return'<option value="'+d.value+'">'+d.label+"</option>"},_template:function(d){return'<div id="'+d.id+'" class="'+d.cls+'"><select id="'+d.id+'_select" class="select"/><div class="button"><i class="icon"/></div></div>'}});return{View:c}});
|
||||
@@ -0,0 +1 @@
|
||||
define(["utils/utils","mvc/ui/ui-misc","mvc/ui/ui-tabs","mvc/tools/tools-template"],function(e,g,b,a){var d=Backbone.Collection.extend({url:galaxy_config.root+"api/libraries"});var c=Backbone.Collection.extend({initialize:function(){var h=this;this.config=new Backbone.Model({library_id:null});this.config.on("change",function(){h.fetch({reset:true})})},url:function(){return galaxy_config.root+"api/libraries/"+this.config.get("library_id")+"/contents"}});var f=Backbone.View.extend({initialize:function(i){var h=this;this.libraries=new d();this.datasets=new c();this.options=i;this.library_select=new g.Select.View({optional:i.optional,onchange:function(j){h.datasets.config.set("library_id",j)}});this.dataset_select=new g.Select.View({optional:i.optional,multiple:i.multiple,onchange:function(){h.trigger("change")}});this.libraries.on("reset",function(){var j=[];h.libraries.each(function(k){j.push({value:k.id,label:k.get("name")})});h.library_select.update(j);h.trigger("change")});this.datasets.on("reset",function(){var k=[];var j=h.library_select.text();if(j!==null){h.datasets.each(function(l){if(l.get("type")==="file"){k.push({value:l.id,label:j+l.get("name")})}})}h.dataset_select.update(k);h.trigger("change")});this.on("change",function(){i.onchange&&i.onchange(h.value())});this.setElement(this._template());this.$(".library-select").append(this.library_select.$el);this.$(".dataset-select").append(this.dataset_select.$el);this.libraries.fetch({reset:true,success:function(){h.library_select.trigger("change");if(h.options.value!==undefined){h.value(h.options.value)}}})},value:function(h){return this.dataset_select.value()},_template:function(){return'<div class="ui-select-library"><div class="library ui-margin-bottom"><span class="library-title">Select Library</span><span class="library-select"/></div><div class="dataset"><span class="dataset-title">Select Dataset</span><span class="dataset-select"/></div></div>'}});return{View:f}});
|
||||
Reference in New Issue
Block a user