galaxy/static/scripts/mvc/tools/tools-parameters.js

/**
    This class creates input elements. New input parameter types should be added to the types dictionary.
*/
define(['utils/utils',
        'mvc/ui/ui-misc',
        'mvc/tools/tools-select-content',
        'mvc/ui/ui-color-picker'],
    function(Utils, Ui, SelectContent, ColorPicker) {

    // create form view
    return Backbone.Model.extend({
        /** Available parameter types */
        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
        initialize: function(app, options) {
            this.app = app;
        },

        /** Returns an input field for a given field type
        */
        create: function(input_def) {
            // add regular/default value if missing
            if (input_def.value === undefined) {
                input_def.value = null;
            }
            if (input_def.default_value === undefined) {
                input_def.default_value = input_def.value;
            }

            // field wrapper
            var field = null;

            // get field class
            var fieldClass = this.types[input_def.type];
            if (fieldClass && typeof(this[fieldClass]) === 'function') {
                field = this[fieldClass].call(this, input_def);
            }
            
            // identify field type
            if (!field) {
                // flag
                this.app.incompatible = true;

                // with or without options
                if (input_def.options) {
                    // assign select field
                    field = this._fieldSelect(input_def);
                } else {
                    // assign text field
                    field = this._fieldText(input_def);
                }

                // log
                console.debug('tools-form::_addRow() : Auto matched field type (' + input_def.type + ').');
            }

            // set field value
            if (input_def.value !== undefined) {
                field.value(input_def.value);
            }

            // return field element
            return field;
        },

        /** Data input field
        */
        _fieldData : function(input_def) {
            if (!this.app.options.is_dynamic) {
                input_def.info = 'Data input \'' + input_def.name + '\' (' + Utils.textify(input_def.extensions.toString()) + ')';
                input_def.value = null;
                return this._fieldHidden(input_def);
            }
            var self = this;
            return new SelectContent.View(this.app, {
                id          : 'field-' + input_def.id,
                extensions  : input_def.extensions,
                optional    : input_def.optional,
                multiple    : input_def.multiple,
                type        : input_def.type,
                data        : input_def.options,
                onchange    : function() {
                    self.app.trigger('refresh');
                }
            });
        },

        /** Select/Checkbox/Radio options field
        */
        _fieldSelect : function (input_def) {
            // show text field in if dynamic fields are disabled e.g. in workflow editor
            if (!this.app.options.is_dynamic && input_def.is_dynamic) {
                return this._fieldText(input_def);
            }

            // customize properties
            if (input_def.type == 'data_column') {
                input_def.error_text = 'Missing columns in referenced dataset.'
            }
            if (input_def.type == 'genomebuild') {
                input_def.searchable = true;
            }

            // configure options fields
            var options = [];
            for (var i in input_def.options) {
                var option = input_def.options[i];
                options.push({
                    label: option[0],
                    value: option[1]
                });
            }

            // identify display type
            var SelectClass = Ui.Select;
            switch (input_def.display) {
                case 'checkboxes':
                    SelectClass = Ui.Checkbox;
                    break;
                case 'radio':
                    SelectClass = Ui.Radio;
                    break;
            }

            // select field
            var self = this;
            return new SelectClass.View({
                id          : 'field-' + input_def.id,
                data        : options,
                error_text  : input_def.error_text || 'No options available',
                multiple    : input_def.multiple,
                searchable  : input_def.searchable,
                onchange    : function() {
                    self.app.trigger('refresh');
                }
            });
        },

        /** Drill down options field
        */
        _fieldDrilldown : function (input_def) {
            // show text field in if dynamic fields are disabled e.g. in workflow editor
            if (!this.app.options.is_dynamic && input_def.is_dynamic) {
                return this._fieldText(input_def);
            }
            
            // create drill down field
            var self = this;
            return new Ui.Drilldown.View({
                id          : 'field-' + input_def.id,
                data        : input_def.options,
                display     : input_def.display,
                onchange    : function() {
                    self.app.trigger('refresh');
                }
            });
        },
        
        /** Text input field
        */
        _fieldText : function(input_def) {
            // field replaces e.g. a select field
            if (input_def.options) {
                // show text area if selecting multiple entries is allowed
                input_def.area = input_def.multiple;

                // validate value
                if (!Utils.validate(input_def.value)) {
                    input_def.value = '';
                } else {
                    if (input_def.value instanceof Array) {
                        input_def.value = value.toString();
                    } else {
                        input_def.value = String(input_def.value).replace(/[\[\]'"\s]/g, '');
                        if (input_def.multiple) {
                            input_def.value = input_def.value.replace(/,/g, '\n');
                        }
                    }
                }
            }

            // create input element
            var self = this;
            return new Ui.Input({
                id          : 'field-' + input_def.id,
                area        : input_def.area,
                onchange    : function() {
                    self.app.trigger('refresh');
                }
            });
        },

        /** Slider field
        */
        _fieldSlider: function(input_def) {
            var self = this;
            return new Ui.Slider.View({
                id          : 'field-' + input_def.id,
                precise     : input_def.type == 'float',
                min         : input_def.min,
                max         : input_def.max,
                onchange    : function() {
                    self.app.trigger('refresh');
                }
            });
        },

        /** Hidden field
        */
        _fieldHidden : function(input_def) {
            return new Ui.Hidden({
                id          : 'field-' + input_def.id,
                info        : input_def.info
            });
        },

        /** Boolean field
        */
        _fieldBoolean : function(input_def) {
            var self = this;
            return new Ui.RadioButton.View({
                id          : 'field-' + input_def.id,
                data        : [ { label : 'Yes', value : 'true'  },
                                { label : 'No',  value : 'false' }],
                onchange    : function() {
                    self.app.trigger('refresh');
                }
            });
        },

        /** Color picker field
        */
        _fieldColor : function(input_def) {
            var self = this;
            return new ColorPicker({
                id          : 'field-' + input_def.id,
                onchange    : function() {
                    self.app.trigger('refresh');
                }
            });
        }
    });

    return {
        View: View
    };
});