diff --git a/static/scripts/mvc/upload/upload-ftp.js b/static/scripts/mvc/upload/upload-ftp.js index 62bf8584238..7a1242d9d3b 100644 --- a/static/scripts/mvc/upload/upload-ftp.js +++ b/static/scripts/mvc/upload/upload-ftp.js @@ -35,6 +35,7 @@ return Backbone.View.extend({ // fill table _fill: function(ftp_files) { + var self = this; if (ftp_files && ftp_files.length > 0) { // add table this.$el.find('#upload-ftp-content').html($(this._templateTable())); @@ -49,11 +50,43 @@ return Backbone.View.extend({ // update stats this.$el.find('#upload-ftp-number').html(ftp_files.length + ' files'); this.$el.find('#upload-ftp-disk').html(Utils.bytesToString (size, true)); + + var selectAll = this.$el.find('#selectAll'); + + // call method to determine and set selectAll status on loading + this._updateSelectAll(selectAll); + + // selectAll checkbox has been clicked + selectAll.on('click', function() { + var checkboxes=$(this).parents().find('tr.upload-ftp-row>td>div'); + var len = checkboxes.length; + $this = $(this); + var allChecked = !($this.hasClass('fa-check-square-o')); + + // change state of the sub-checkboxes + for(i = 0; i < len; i++) { + if(allChecked) { + // all checkboxes should be checked + if(checkboxes.eq(i).hasClass('fa-square-o')) { + // if they are not checked, check them + checkboxes.eq(i).trigger('updateUpBox'); + } + } else { + // no checkboxes should be checked + if(checkboxes.eq(i).hasClass('fa-check-square-o')) { + // if they are checked, uncheck them + checkboxes.eq(i).trigger('updateUpBox'); + } + } + } + + self._updateSelectAll(selectAll); + }); } else { // add info this.$el.find('#upload-ftp-content').html($(this._templateInfo())); } - + // hide spinner this.$el.find('#upload-ftp-wait').hide(); }, @@ -79,18 +112,18 @@ return Backbone.View.extend({ } else { icon_class = this.options.class_add; } - + // add icon class $icon.addClass(icon_class); - - // click to add ftp files - $it.on('click', function() { + + // add files to the uploadbox + $it.on('updateUpBox', function() { // find model var model_index = self._find(ftp_file); - + // update icon $icon.removeClass(); - + // add model if (!model_index) { // add to uploadbox @@ -100,19 +133,55 @@ return Backbone.View.extend({ size : ftp_file.size, path : ftp_file.path }]); - + // add new icon class $icon.addClass(self.options.class_remove); } else { // remove self.app.collection.remove(model_index); - + // add new icon class $icon.addClass(self.options.class_add); } }); + + // click to add ftp files + $it.on('click', function() { + //trigger my new event + $icon.trigger('updateUpBox'); + + // click to add ftp files + // modify selectAll box based on number of checkboxes checked + var selectBox=$icon.parents().find('#selectAll'); + // determine and set state of selectAll after sub-checkbox clicked + self._updateSelectAll(selectBox); + }); }, - + + _updateSelectAll: function(selectBox) { + // array of all checkboxes + var checkboxes=selectBox.parents().find('tr.upload-ftp-row>td>div'); + // array of only checked checkboxes + var checkedCheckboxes=selectBox.parents().find('tr.upload-ftp-row>td>div.fa-check-square-o'); + var lenAll = checkboxes.length; + var lenChecked = checkedCheckboxes.length; + + // determine which state the selectAll checkbox needs to be and setting it + if(lenChecked > 0 && lenChecked !== lenAll) { + // indeterminate state + selectBox.removeClass('fa-square-o fa-check-square-o'); + selectBox.addClass('fa-minus-square-o'); + } else if(lenChecked === lenAll) { + // checked state + selectBox.removeClass('fa-square-o fa-minus-square-o'); + selectBox.addClass('fa-check-square-o'); + } else if(lenChecked === 0) { + // unchecked state + selectBox.removeClass('fa-check-square-o fa-minus-square-o'); + selectBox.addClass('fa-square-o'); + } + }, + // get model index _find: function(ftp_file) { // check if exists already @@ -149,7 +218,7 @@ return Backbone.View.extend({ '
| ' + + ' | ' + ' | Name | ' + 'Size | ' + 'Created | ' + diff --git a/static/scripts/mvc/upload/upload-model.js b/static/scripts/mvc/upload/upload-model.js index 0acf8a36c2e..6d1757e3582 100644 --- a/static/scripts/mvc/upload/upload-model.js +++ b/static/scripts/mvc/upload/upload-model.js @@ -14,6 +14,7 @@ var Model = Backbone.Model.extend({ file_type : null, file_path : '', percentage : 0, + row : null, // settings space_to_tabs : false, diff --git a/static/scripts/mvc/upload/upload-row.js b/static/scripts/mvc/upload/upload-row.js index d7f9c385e80..ce40eb8ac12 100644 --- a/static/scripts/mvc/upload/upload-row.js +++ b/static/scripts/mvc/upload/upload-row.js @@ -42,6 +42,9 @@ return Backbone.View.extend({ // link app this.app = app; + // default value for extension of files + var default_ext = 'Auto-detect'; + // link this var self = this; @@ -75,15 +78,28 @@ return Backbone.View.extend({ // initialize genome this.model.set('genome', self.select_genome.value()); + // ensure files added after an individual row has changed + // default to Auto-detect instead of --- + if(!(this.app.select_extension.value() === '---')){ + this.default_ext = this.app.select_extension.value(); + } + // select extension this.select_extension = new Select.View({ css: 'extension', onchange : function() { self.model.set('extension', self.select_extension.value()); + // if user has changed individual row type, then change "set all" + // type to '---' + if(!(self.select_extension.value() === app.select_extension.value())) + { + var newExte = '---'; + app.select_extension.value(newExte); + } }, data: self.app.list_extensions, container: it.find('#extension'), - value: self.model.get('extension') + value: self.default_ext }); // initialize extension @@ -139,6 +155,7 @@ return Backbone.View.extend({ this.app.collection.on('reset', function() { self.remove(); }); + self.model.set('row', self); }, // render diff --git a/static/scripts/mvc/upload/upload-view.js b/static/scripts/mvc/upload/upload-view.js index bbec3bdad75..3aead73b2aa 100644 --- a/static/scripts/mvc/upload/upload-view.js +++ b/static/scripts/mvc/upload/upload-view.js @@ -6,6 +6,7 @@ define(["utils/utils", "mvc/upload/upload-ftp", "mvc/ui/ui-popover", "mvc/ui/ui-modal", + "mvc/ui/ui-select", "utils/uploadbox"], function( Utils, @@ -14,7 +15,8 @@ define(["utils/utils", UploadItem, UploadFtp, Popover, - Modal + Modal, + Select ) { // galaxy upload @@ -35,6 +37,9 @@ return Backbone.View.extend({ // current history current_history: null, + + // extension selector + select_extension : null, // current upload size upload_size: 0, @@ -119,11 +124,19 @@ return Backbone.View.extend({ description_url : datatypes[key].description_url }); } - + // sort self.list_extensions.sort(function(a, b) { return a.id > b.id ? 1 : a.id < b.id ? -1 : 0; }); + + // add the '---' extension for use when the row types are changed individually + self.list_extensions.push({ + id : "---", + text : "---", + description : "", + description_url : "" + }); // add auto field if (!self.options.datatypes_disable_auto) { @@ -218,6 +231,29 @@ return Backbone.View.extend({ title : 'FTP files', container : button }); + + // select extension + this.select_extension = new Select.View({ + css: 'extension', + onchange : function() { + var newExten = self.select_extension.value() + var len = self.collection.models.length; + // Only trigger changing the rows if the "set all" isn't set to '---' + // Prevents recursively changing the rows after an individual row has been changed + if(!(newExten === '---')){ + for(i = 0; i < len; i++){ + self.collection.models[i].attributes['row'].select_extension.value(newExten); + } + } + }, + data: self.list_extensions, + container: self.$el.parents().find('#extension'), + value: self.list_extensions[0] + }); + + // handle extension info popover + self.$el.parents().find('#extension-info_out').on('click' , function(e) { self._showExtensionInfo(); }) + .on('mousedown', function(e) { e.preventDefault(); }); } // show modal @@ -230,6 +266,60 @@ return Backbone.View.extend({ this._updateScreen(); }, + _showExtensionInfo : function() { + // initialize + var self = this; + var $el = $(this.el).parents().find('#extension-info_out'); + var extension = self.select_extension.value(); + + var title = this.select_extension.text(); + + var description = _.findWhere(self.list_extensions, {'id': extension}); + + // create popup + if (!this.extension_popup) { + this.extension_popup = new Popover.View({ + placement: 'bottom', + container: $el + }); + } + + // show / hide popup + if (!this.extension_popup.visible) { + this.extension_popup.title(title); + this.extension_popup.empty(); + this.extension_popup.append(this._templateDescription(description)); + this.extension_popup.show(); + } else { + this.extension_popup.hide(); + } + }, + + _showSettings : function() { + // check if popover is visible + if (!this.settings.visible) { + // show popover + this.settings.empty(); + this.settings.append((new UploadSettings(this)).$el); + this.settings.show(); + } else { + // hide popover + this.settings.hide(); + } + }, + + _templateDescription: function(options) { + if (options.description) { + var tmpl = options.description; + if (options.description_url) { + tmpl += ' (read more)'; + } + return tmpl; + } else { + return 'There is no description available for this file extension.'; + } + }, + // // events triggered by collection // @@ -513,6 +603,9 @@ return Backbone.View.extend({ // remove from queue this.uploadbox.reset(); + + // reset value for universal type drop-down + this.select_extension.value(this.list_extensions[0]); // reset button this.ui_button.set('percentage', 0); @@ -606,7 +699,12 @@ return Backbone.View.extend({ // load html template _template: function(id, idInfo) { - return '||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
'+b.path+' | '+a.bytesToString(b.size)+' | '+b.ctime+" |
| Name | Size | Created |
|---|
'+t.path+"
| Name | Size | Created |
|---|