From cd3c47f017375f733e100c8a7fa20b1822eb05ee Mon Sep 17 00:00:00 2001 From: guerler Date: Fri, 13 Mar 2015 23:42:29 -0400 Subject: [PATCH] Ui: Fix select all option for select2 field in Chrome, add help text --- client/galaxy/scripts/mvc/form/form-parameters.js | 7 ++++--- client/galaxy/scripts/mvc/ui/ui-select-default.js | 6 +++--- static/scripts/mvc/form/form-parameters.js | 7 ++++--- static/scripts/mvc/ui/ui-select-default.js | 6 +++--- static/scripts/packed/mvc/form/form-parameters.js | 2 +- static/scripts/packed/mvc/ui/ui-select-default.js | 2 +- 6 files changed, 16 insertions(+), 14 deletions(-) diff --git a/client/galaxy/scripts/mvc/form/form-parameters.js b/client/galaxy/scripts/mvc/form/form-parameters.js index d392c2c3b97..76bf4c5d312 100644 --- a/client/galaxy/scripts/mvc/form/form-parameters.js +++ b/client/galaxy/scripts/mvc/form/form-parameters.js @@ -113,9 +113,6 @@ define(['utils/utils', 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 = []; @@ -136,6 +133,10 @@ define(['utils/utils', case 'radio': SelectClass = Ui.Radio; break; + default: + if (input_def.multiple) { + input_def.help = 'You may press Ctrl+A/Ctrl+X to select/unselect all options. ' + input_def.help; + } } // select field diff --git a/client/galaxy/scripts/mvc/ui/ui-select-default.js b/client/galaxy/scripts/mvc/ui/ui-select-default.js index a800734b14a..c6ae0435f84 100644 --- a/client/galaxy/scripts/mvc/ui/ui-select-default.js +++ b/client/galaxy/scripts/mvc/ui/ui-select-default.js @@ -200,17 +200,17 @@ var View = Backbone.View.extend({ if (this.options.searchable) { this.$select.select2('destroy'); this.$select.select2(); - this.$('.select2-input').off('keypress.selectall').on('keypress.selectall', function(event){ + this.$('.select2-input').off('keydown.selectall').on('keydown.selectall', function(event){ if (event.ctrlKey || event.metaKey) { var id = $(this).parents('div[class*="select2-container"]').attr('id').replace('s2id_', ''); var element = $('#' + id); - if (event.which == 97){ + if (event.which == 65){ var selected = []; element.find('option').each(function(i, e){ selected[selected.length] = $(e).attr('value'); }); element.select2('val', selected); - } else if (event.which == 120){ + } else if (event.which == 88){ element.select2('val', ''); } $('.select2-drop-mask').click(); diff --git a/static/scripts/mvc/form/form-parameters.js b/static/scripts/mvc/form/form-parameters.js index d392c2c3b97..76bf4c5d312 100644 --- a/static/scripts/mvc/form/form-parameters.js +++ b/static/scripts/mvc/form/form-parameters.js @@ -113,9 +113,6 @@ define(['utils/utils', 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 = []; @@ -136,6 +133,10 @@ define(['utils/utils', case 'radio': SelectClass = Ui.Radio; break; + default: + if (input_def.multiple) { + input_def.help = 'You may press Ctrl+A/Ctrl+X to select/unselect all options. ' + input_def.help; + } } // select field diff --git a/static/scripts/mvc/ui/ui-select-default.js b/static/scripts/mvc/ui/ui-select-default.js index a800734b14a..c6ae0435f84 100644 --- a/static/scripts/mvc/ui/ui-select-default.js +++ b/static/scripts/mvc/ui/ui-select-default.js @@ -200,17 +200,17 @@ var View = Backbone.View.extend({ if (this.options.searchable) { this.$select.select2('destroy'); this.$select.select2(); - this.$('.select2-input').off('keypress.selectall').on('keypress.selectall', function(event){ + this.$('.select2-input').off('keydown.selectall').on('keydown.selectall', function(event){ if (event.ctrlKey || event.metaKey) { var id = $(this).parents('div[class*="select2-container"]').attr('id').replace('s2id_', ''); var element = $('#' + id); - if (event.which == 97){ + if (event.which == 65){ var selected = []; element.find('option').each(function(i, e){ selected[selected.length] = $(e).attr('value'); }); element.select2('val', selected); - } else if (event.which == 120){ + } else if (event.which == 88){ element.select2('val', ''); } $('.select2-drop-mask').click(); diff --git a/static/scripts/packed/mvc/form/form-parameters.js b/static/scripts/packed/mvc/form/form-parameters.js index 69f736b7159..cebf02ffd9e 100644 --- a/static/scripts/packed/mvc/form/form-parameters.js +++ b/static/scripts/packed/mvc/form/form-parameters.js @@ -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."}if(e.type=="genomebuild"){e.searchable=true}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}}); \ No newline at end of file +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;default:if(e.multiple){e.help="You may press Ctrl+A/Ctrl+X to select/unselect all options. "+e.help}}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}}); \ No newline at end of file diff --git a/static/scripts/packed/mvc/ui/ui-select-default.js b/static/scripts/packed/mvc/ui/ui-select-default.js index 2a10120290a..5e299f1a4c3 100644 --- a/static/scripts/packed/mvc/ui/ui-select-default.js +++ b/static/scripts/packed/mvc/ui/ui-select-default.js @@ -1 +1 @@ -define(["utils/utils"],function(a){var b=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(d){this.options=a.merge(d,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){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()}var c=this;this.$select.on("change",function(){c._change()});this.on("change",function(){c._change()})},value:function(c){if(c!==undefined){if(c===null){c="__null__"}if(this.exists(c)||this.options.multiple){this.$select.val(c);if(this.$select.select2){this.$select.select2("val",c)}}}return this._getValue()},first:function(){var c=this.$select.find("option").first();if(c.length>0){return c.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(c){this.$select.append(this._templateOption(c));this._refresh()},del:function(c){this.$select.find("option[value="+c+"]").remove();this.$select.trigger("change");this._refresh()},update:function(c){var e=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 d in c){this.$select.append(this._templateOption(c[d]))}this._refresh();if(this.options.searchable){this.$select.select2("destroy");this.$select.select2();this.$(".select2-input").off("keypress.selectall").on("keypress.selectall",function(h){if(h.ctrlKey||h.metaKey){var i=$(this).parents('div[class*="select2-container"]').attr("id").replace("s2id_","");var f=$("#"+i);if(h.which==97){var g=[];f.find("option").each(function(j,k){g[g.length]=$(k).attr("value")});f.select2("val",g)}else{if(h.which==120){f.select2("val","")}}$(".select2-drop-mask").click()}})}this.value(e);if(this._getValue()===null){this.value(this.first())}},setOnChange:function(c){this.options.onchange=c},exists:function(c){return this.$select.find('option[value="'+c+'"]').length>0},_change:function(){if(this.options.onchange){this.options.onchange(this._getValue())}},_getValue:function(){var c=this.$select.val();if(!a.validate(c)){return null}return c},_refresh:function(){var c=this.$select.find("option").length;if(c==0){this.disable();this.$select.empty();this.$select.append(this._templateOption({value:"__null__",label:this.options.error_text}))}else{this.enable()}},_templateOption:function(c){return'"},_template:function(c){return'
'}});return{View:b}}); \ No newline at end of file