From 4e09acb0ae8f4330287e2739e8edb504598cc856 Mon Sep 17 00:00:00 2001 From: Martin Cech Date: Mon, 20 Jan 2014 14:19:48 -0500 Subject: [PATCH] upload button and modal tweaks, mostly labels, binding of closing events --- static/scripts/mvc/upload/upload-row.js | 2 +- static/scripts/mvc/upload/upload-view.js | 35 ++++++++++--------- static/scripts/packed/galaxy.masthead.js | 2 +- .../scripts/packed/mvc/upload/upload-row.js | 2 +- .../scripts/packed/mvc/upload/upload-view.js | 2 +- static/style/blue/base.css | 2 +- static/style/src/less/upload.less | 4 +-- 7 files changed, 26 insertions(+), 23 deletions(-) diff --git a/static/scripts/mvc/upload/upload-row.js b/static/scripts/mvc/upload/upload-row.js index bb5a1b48b24..26f13c629bf 100644 --- a/static/scripts/mvc/upload/upload-row.js +++ b/static/scripts/mvc/upload/upload-row.js @@ -238,7 +238,7 @@ return Backbone.View.extend({ '
' + '
' + '
' + - '
You may specify a list of URLs (one per line) or paste the contents of a file.
' + + '
You can tell Galaxy to download data from web by entering URL in this box (one per line). You can also directly paste the contents of a file.
' + '' + '
' + '
' + diff --git a/static/scripts/mvc/upload/upload-view.js b/static/scripts/mvc/upload/upload-view.js index f384fef9ef9..2f6b21f4350 100644 --- a/static/scripts/mvc/upload/upload-view.js +++ b/static/scripts/mvc/upload/upload-view.js @@ -165,8 +165,8 @@ return Backbone.View.extend( // create model this.button_show = new ProgressButtonModel({ icon : 'fa-upload', - tooltip : 'Upload files', - label : 'Upload', + tooltip : 'Download from URL or upload files from disk', + label : 'Load Data', onclick : function(e) { if (e) { self._eventShow(e) @@ -240,6 +240,8 @@ return Backbone.View.extend( { // prevent default e.preventDefault(); + // stop propagation of event (for click-outside-of-modal-to-close functionality) + e.stopPropagation(); // create modal if (!this.modal) @@ -248,18 +250,19 @@ return Backbone.View.extend( var self = this; this.modal = new Modal.GalaxyModal( { - title : 'Upload files from your local drive', + title : 'Download data directly from web or upload files from your disk', body : this._template('upload-box', 'upload-info'), buttons : { - 'Select' : function() {self.uploadbox.select()}, - 'Create' : function() {self._eventCreate()}, - 'Upload' : function() {self._eventStart()}, + 'Choose file' : function() {self.uploadbox.select()}, + 'from URL' : function() {self._eventCreate()}, + 'Start' : function() {self._eventStart()}, 'Pause' : function() {self._eventStop()}, 'Reset' : function() {self._eventReset()}, 'Close' : function() {self.modal.hide()}, }, height : '400', - width : '900' + width : '900', + bindClosingEvents: true }); // set element @@ -554,12 +557,12 @@ return Backbone.View.extend( if(this.counter.announce == 0) { if (this.uploadbox.compatible()) - message = 'Drag&drop files into this box or click \'Select\' to select files!'; + message = 'You can Drag & Drop files into this box.'; else - message = 'Unfortunately, your browser does not support multiple file uploads or drag&drop.
Please upgrade to i.e. Firefox 4+, Chrome 7+, IE 10+, Opera 12+ or Safari 6+.' + message = 'Unfortunately, your browser does not support multiple file uploads or drag&drop.
Some supported browsers are: Firefox 4+, Chrome 7+, IE 10+, Opera 12+ or Safari 6+.' } else { if (this.counter.running == 0) - message = 'You added ' + this.counter.announce + ' file(s) to the queue. Add more files or click \'Upload\' to proceed.'; + message = 'You added ' + this.counter.announce + ' file(s) to the queue. Add more files or click \'Start\' to proceed.'; else message = 'Please wait...' + this.counter.announce + ' out of ' + this.counter.running + ' remaining.'; } @@ -579,9 +582,9 @@ return Backbone.View.extend( // update upload button if (this.counter.running == 0 && this.counter.announce > 0) - this.modal.enableButton('Upload'); + this.modal.enableButton('Start'); else - this.modal.disableButton('Upload'); + this.modal.disableButton('Start'); // pause upload button if (this.counter.running > 0) @@ -592,11 +595,11 @@ return Backbone.View.extend( // select upload button if (this.counter.running == 0) { - this.modal.enableButton('Select'); - this.modal.enableButton('Create'); + this.modal.enableButton('Choose file'); + this.modal.enableButton('from URL'); } else { - this.modal.disableButton('Select'); - this.modal.disableButton('Create'); + this.modal.disableButton('Choose file'); + this.modal.disableButton('from URL'); } // table visibility diff --git a/static/scripts/packed/galaxy.masthead.js b/static/scripts/packed/galaxy.masthead.js index 721a60a67ba..1cb85a853dd 100644 --- a/static/scripts/packed/galaxy.masthead.js +++ b/static/scripts/packed/galaxy.masthead.js @@ -1 +1 @@ -define([],function(){var a=Backbone.View.extend({el_masthead:"#everything",options:null,$background:null,list:[],initialize:function(e){this.options=e;$("body").off();this.setElement($(this._template(e)));$(this.el_masthead).append($(this.el));this.$background=$(this.el).find("#masthead-background");var d=this;$(window).on("beforeunload",function(){var g="";for(key in d.list){if(d.list[key].options.onunload){var f=d.list[key].options.onunload();if(f){g+=f+" "}}}if(g!=""){return g}})},events:{click:"_click",mousedown:function(d){d.preventDefault()}},append:function(d){return this._add(d,true)},prepend:function(d){return this._add(d,false)},highlight:function(e){var d=$(this.el).find("#"+e+"> li");if(d){d.addClass("active")}},_add:function(g,e){var d=$(this.el).find("#"+g.location);if(d){var f=$(g.el);f.addClass("masthead-item");if(e){d.append(f)}else{d.prepend(f)}this.list.push(g)}return null},_click:function(g){var f=$(this.el).find(".popup");if(f){f.hide()}var d=$(g.target).closest(".masthead-item").find(".popup");if($(g.target).hasClass("head")){d.show();this.$background.show()}else{this.$background.hide()}},_template:function(d){return'
'}});var b=Backbone.View.extend({options:{id:"",icon:"fa-cog",tooltip:"",with_number:false,onclick:function(){alert("clicked")},onunload:null,visible:true},location:"iconbar",initialize:function(e){if(e){this.options=_.defaults(e,this.options)}this.setElement($(this._template(this.options)));var d=this;$(this.el).find(".icon").tooltip({title:this.options.tooltip,placement:"bottom"}).on("mouseup",d.options.onclick);if(!this.options.visible){this.hide()}},show:function(){$(this.el).css({visibility:"visible"})},hide:function(){$(this.el).css({visibility:"hidden"})},icon:function(d){$(this.el).find(".icon").removeClass(this.options.icon).addClass(d);this.options.icon=d},toggle:function(){$(this.el).addClass("toggle")},untoggle:function(){$(this.el).removeClass("toggle")},number:function(d){$(this.el).find(".number").text(d)},_template:function(e){var d='
';if(e.with_number){d+='
'}d+="
";return d}});var c=Backbone.View.extend({options:{id:"",title:"",target:"_parent",content:"",type:"url",scratchbook:false,onunload:null,visible:true,disabled:false,title_attribute:""},location:"navbar",$menu:null,events:{"click .head":"_head"},initialize:function(d){if(d){this.options=_.defaults(d,this.options)}if(this.options.content&&this.options.content.indexOf("//")===-1){this.options.content=galaxy_config.root+this.options.content}this.setElement($(this._template(this.options)));if(this.options.disabled){$(this.el).find(".root").addClass("disabled");this._attachPopover()}if(!this.options.visible){this.hide()}},show:function(){$(this.el).css({visibility:"visible"})},hide:function(){$(this.el).css({visibility:"hidden"})},add:function(f){var g={title:"Title",content:"",type:"url",target:"_parent",scratchbook:false,divider:false};if(f){g=_.defaults(f,g)}if(g.content&&g.content.indexOf("//")===-1){g.content=galaxy_config.root+g.content}if(!this.$menu){$(this.el).find(".root").append(this._templateMenu());$(this.el).find(".symbol").addClass("caret");this.$menu=$(this.el).find(".popup")}var e=$(this._templateMenuItem(g));this.$menu.append(e);var d=this;e.on("click",function(h){h.preventDefault();if(d.options.target==="_blank"){return true}Galaxy.frame.add(f)});if(g.divider){this.$menu.append($(this._templateDivider()))}},_head:function(d){d.preventDefault();if(this.options.disabled){return}if(!this.$menu){Galaxy.frame.add(this.options)}},_attachPopover:function(){var d=$(this.el).find(".head");d.popover({html:true,content:'Please log in or register to use this feature.',placement:"bottom"}).on("shown.bs.popover",function(){setTimeout(function(){d.popover("hide")},5000)})},_templateMenuItem:function(d){return'
  • '+d.title+"
  • "},_templateMenu:function(){return''},_templateDivider:function(){return'
  • '},_template:function(e){var d='';return d}});return{GalaxyMasthead:a,GalaxyMastheadTab:c,GalaxyMastheadIcon:b}}); \ No newline at end of file +define([],function(){var a=Backbone.View.extend({el_masthead:"#everything",options:null,$background:null,list:[],initialize:function(e){this.options=e;$("body").off();this.setElement($(this._template(e)));$(this.el_masthead).append($(this.el));this.$background=$(this.el).find("#masthead-background");var d=this;$(window).on("beforeunload",function(){var g="";for(key in d.list){if(d.list[key].options.onunload){var f=d.list[key].options.onunload();if(f){g+=f+" "}}}if(g!=""){return g}})},events:{click:"_click",mousedown:function(d){d.preventDefault()}},append:function(d){return this._add(d,true)},prepend:function(d){return this._add(d,false)},highlight:function(e){var d=$(this.el).find("#"+e+"> li");if(d){d.addClass("active")}},_add:function(g,e){var d=$(this.el).find("#"+g.location);if(d){var f=$(g.el);f.addClass("masthead-item");if(e){d.append(f)}else{d.prepend(f)}this.list.push(g)}return null},_click:function(g){var f=$(this.el).find(".popup");if(f){f.hide()}var d=$(g.target).closest(".masthead-item").find(".popup");if($(g.target).hasClass("head")){d.show();this.$background.show()}else{this.$background.hide()}},_template:function(d){var e=d.brand?("/ "+d.brand):"";return'
    '}});var b=Backbone.View.extend({options:{id:"",icon:"fa-cog",tooltip:"",with_number:false,onclick:function(){alert("clicked")},onunload:null,visible:true},location:"iconbar",initialize:function(e){if(e){this.options=_.defaults(e,this.options)}this.setElement($(this._template(this.options)));var d=this;$(this.el).find(".icon").tooltip({title:this.options.tooltip,placement:"bottom"}).on("mouseup",d.options.onclick);if(!this.options.visible){this.hide()}},show:function(){$(this.el).css({visibility:"visible"})},hide:function(){$(this.el).css({visibility:"hidden"})},icon:function(d){$(this.el).find(".icon").removeClass(this.options.icon).addClass(d);this.options.icon=d},toggle:function(){$(this.el).addClass("toggle")},untoggle:function(){$(this.el).removeClass("toggle")},number:function(d){$(this.el).find(".number").text(d)},_template:function(e){var d='
    ';if(e.with_number){d+='
    '}d+="
    ";return d}});var c=Backbone.View.extend({options:{id:"",title:"",target:"_parent",content:"",type:"url",scratchbook:false,onunload:null,visible:true,disabled:false,title_attribute:""},location:"navbar",$menu:null,events:{"click .head":"_head"},initialize:function(d){if(d){this.options=_.defaults(d,this.options)}if(this.options.content&&this.options.content.indexOf("//")===-1){this.options.content=galaxy_config.root+this.options.content}this.setElement($(this._template(this.options)));if(this.options.disabled){$(this.el).find(".root").addClass("disabled");this._attachPopover()}if(!this.options.visible){this.hide()}},show:function(){$(this.el).css({visibility:"visible"})},hide:function(){$(this.el).css({visibility:"hidden"})},add:function(f){var g={title:"Title",content:"",type:"url",target:"_parent",scratchbook:false,divider:false};if(f){g=_.defaults(f,g)}if(g.content&&g.content.indexOf("//")===-1){g.content=galaxy_config.root+g.content}if(!this.$menu){$(this.el).find(".root").append(this._templateMenu());$(this.el).find(".symbol").addClass("caret");this.$menu=$(this.el).find(".popup")}var e=$(this._templateMenuItem(g));this.$menu.append(e);var d=this;e.on("click",function(h){h.preventDefault();if(d.options.target==="_blank"){return true}Galaxy.frame.add(f)});if(g.divider){this.$menu.append($(this._templateDivider()))}},_head:function(d){d.preventDefault();if(this.options.disabled){return}if(!this.$menu){Galaxy.frame.add(this.options)}},_attachPopover:function(){var d=$(this.el).find(".head");d.popover({html:true,content:'Please log in or register to use this feature.',placement:"bottom"}).on("shown.bs.popover",function(){setTimeout(function(){d.popover("hide")},5000)})},_templateMenuItem:function(d){return'
  • '+d.title+"
  • "},_templateMenu:function(){return''},_templateDivider:function(){return'
  • '},_template:function(e){var d='';return d}});return{GalaxyMasthead:a,GalaxyMastheadTab:c,GalaxyMastheadIcon:b}}); \ No newline at end of file diff --git a/static/scripts/packed/mvc/upload/upload-row.js b/static/scripts/packed/mvc/upload/upload-row.js index 52c448f7f80..6e12601bc25 100644 --- a/static/scripts/packed/mvc/upload/upload-row.js +++ b/static/scripts/packed/mvc/upload/upload-row.js @@ -1 +1 @@ -define(["mvc/upload/upload-model"],function(a){return Backbone.View.extend({options:{padding:8},status_classes:{init:"symbol fa fa-trash-o",queued:"symbol fa fa-spinner fa-spin",running:"symbol fa fa-spinner fa-spin",success:"symbol fa fa-check",error:"symbol fa fa-exclamation-triangle"},initialize:function(e,c){this.app=e;var b=this;this.model=new a.Model(c);this.setElement(this._template(c));var d=this.$el;d.find("#symbol").on("click",function(){var f=b.model.get("status");if(f=="init"||f=="success"||f=="error"){b.app.collection.remove(b.model)}});d.find("#text-content").on("keyup",function(){var f=d.find("#text-content");var h=f.val();var g=h.length;d.find("#size").html(b._formatSize(g));b.model.set("url_paste",h);b.model.set("file_size",g)});d.find("#genome").on("change",function(f){b.model.set("genome",$(f.target).val())});d.find("#extension").on("change",function(f){b.model.set("extension",$(f.target).val())});d.find("#space_to_tabs").on("change",function(f){b.model.set("space_to_tabs",$(f.target).prop("checked"))});this.model.on("change:percentage",function(){b._refreshPercentage()});this.model.on("change:status",function(){b._refreshStatus()});this.model.on("change:info",function(){b._refreshInfo()});this.model.on("change:genome",function(){b._refreshGenome()});this.model.on("remove",function(){b.remove()});this.app.collection.on("reset",function(){b.remove()})},render:function(){var h=this.model.get("file_name");var c=this.model.get("file_size");var e=this.$el;e.find("#title").html(h);e.find("#size").html(this._formatSize(c));if(c==-1){var g=e.find("#text");var f=this.options.padding;var d=e.width()-2*f;var b=e.height()-f;g.css("width",d+"px");g.css("top",b+"px");e.height(b+g.height()+2*f);g.show()}},_refreshGenome:function(){var b=this.model.get("genome");this.$el.find("#genome").val(b)},_refreshInfo:function(){var b=this.model.get("info");if(b){this.$el.find("#info").html("Failed: "+b).show()}else{this.$el.find("#info").hide()}},_refreshPercentage:function(){var b=parseInt(this.model.get("percentage"));this.$el.find(".progress-bar").css({width:b+"%"});if(b!=100){this.$el.find("#percentage").html(b+"%")}else{this.$el.find("#percentage").html("Adding to history...")}},_refreshStatus:function(){var c=this.$el;var b=this.model.get("status");var e=this.status_classes[b];var d=this.$el.find("#symbol");d.removeClass();d.addClass(e);if(b=="init"){c.find("#text-content").attr("disabled",false);c.find("#genome").attr("disabled",false);c.find("#extension").attr("disabled",false);c.find("#space_to_tabs").attr("disabled",false)}else{c.find("#text-content").attr("disabled",true);c.find("#genome").attr("disabled",true);c.find("#extension").attr("disabled",true);c.find("#space_to_tabs").attr("disabled",true)}if(b=="success"){c.addClass("success");c.find("#percentage").html("100%")}if(b=="error"){c.addClass("danger");c.find(".progress").remove()}},_formatSize:function(b){var c="";if(b>=100000000000){b=b/100000000000;c="TB"}else{if(b>=100000000){b=b/100000000;c="GB"}else{if(b>=100000){b=b/100000;c="MB"}else{if(b>=100){b=b/100;c="KB"}else{if(b>0){b=b*10;c="b"}else{return"-"}}}}}return""+(Math.round(b)/10)+" "+c},_template:function(d){var c=this;var b='
    You may specify a list of URLs (one per line) or paste the contents of a file.
    ';b+='";b+='";b+='
    0%
    ';return b}})}); \ No newline at end of file +define(["mvc/upload/upload-model"],function(a){return Backbone.View.extend({options:{padding:8},status_classes:{init:"symbol fa fa-trash-o",queued:"symbol fa fa-spinner fa-spin",running:"symbol fa fa-spinner fa-spin",success:"symbol fa fa-check",error:"symbol fa fa-exclamation-triangle"},initialize:function(e,c){this.app=e;var b=this;this.model=new a.Model(c);this.setElement(this._template(c));var d=this.$el;d.find("#symbol").on("click",function(){var f=b.model.get("status");if(f=="init"||f=="success"||f=="error"){b.app.collection.remove(b.model)}});d.find("#text-content").on("keyup",function(){var f=d.find("#text-content");var h=f.val();var g=h.length;d.find("#size").html(b._formatSize(g));b.model.set("url_paste",h);b.model.set("file_size",g)});d.find("#genome").on("change",function(f){b.model.set("genome",$(f.target).val())});d.find("#extension").on("change",function(f){b.model.set("extension",$(f.target).val())});d.find("#space_to_tabs").on("change",function(f){b.model.set("space_to_tabs",$(f.target).prop("checked"))});this.model.on("change:percentage",function(){b._refreshPercentage()});this.model.on("change:status",function(){b._refreshStatus()});this.model.on("change:info",function(){b._refreshInfo()});this.model.on("change:genome",function(){b._refreshGenome()});this.model.on("remove",function(){b.remove()});this.app.collection.on("reset",function(){b.remove()})},render:function(){var h=this.model.get("file_name");var c=this.model.get("file_size");var e=this.$el;e.find("#title").html(h);e.find("#size").html(this._formatSize(c));if(c==-1){var g=e.find("#text");var f=this.options.padding;var d=e.width()-2*f;var b=e.height()-f;g.css("width",d+"px");g.css("top",b+"px");e.height(b+g.height()+2*f);g.show()}},_refreshGenome:function(){var b=this.model.get("genome");this.$el.find("#genome").val(b)},_refreshInfo:function(){var b=this.model.get("info");if(b){this.$el.find("#info").html("Failed: "+b).show()}else{this.$el.find("#info").hide()}},_refreshPercentage:function(){var b=parseInt(this.model.get("percentage"));this.$el.find(".progress-bar").css({width:b+"%"});if(b!=100){this.$el.find("#percentage").html(b+"%")}else{this.$el.find("#percentage").html("Adding to history...")}},_refreshStatus:function(){var c=this.$el;var b=this.model.get("status");var e=this.status_classes[b];var d=this.$el.find("#symbol");d.removeClass();d.addClass(e);if(b=="init"){c.find("#text-content").attr("disabled",false);c.find("#genome").attr("disabled",false);c.find("#extension").attr("disabled",false);c.find("#space_to_tabs").attr("disabled",false)}else{c.find("#text-content").attr("disabled",true);c.find("#genome").attr("disabled",true);c.find("#extension").attr("disabled",true);c.find("#space_to_tabs").attr("disabled",true)}if(b=="success"){c.addClass("success");c.find("#percentage").html("100%")}if(b=="error"){c.addClass("danger");c.find(".progress").remove()}},_formatSize:function(b){var c="";if(b>=100000000000){b=b/100000000000;c="TB"}else{if(b>=100000000){b=b/100000000;c="GB"}else{if(b>=100000){b=b/100000;c="MB"}else{if(b>=100){b=b/100;c="KB"}else{if(b>0){b=b*10;c="b"}else{return"-"}}}}}return""+(Math.round(b)/10)+" "+c},_template:function(d){var c=this;var b='
    You can tell Galaxy to download data from web by entering URL in this box (one per line). You can also directly paste the contents of a file.
    ';b+='";b+='";b+='
    0%
    ';return b}})}); \ No newline at end of file diff --git a/static/scripts/packed/mvc/upload/upload-view.js b/static/scripts/packed/mvc/upload/upload-view.js index 921ed615b2b..3024abc7c42 100644 --- a/static/scripts/packed/mvc/upload/upload-view.js +++ b/static/scripts/packed/mvc/upload/upload-view.js @@ -1 +1 @@ -define(["galaxy.modal","utils/utils","mvc/upload/upload-model","mvc/upload/upload-row","mvc/ui","utils/uploadbox"],function(c,f,e,d){var b=Backbone.Model.extend({defaults:{percentage:0,icon:"fa-circle",label:"",status:""}});var a=Backbone.View.extend({model:null,initialize:function(h){var g=this;this.model=h;this.options=this.model.attributes;this.setElement(this._template(this.options));$(this.el).on("click",this.options.onclick);if(this.options.tooltip){$(this.el).tooltip({title:this.options.tooltip,placement:"bottom"})}this.model.on("change:percentage",function(){g._percentage(g.model.get("percentage"))});this.model.on("change:status",function(){g._status(g.model.get("status"))});var g=this;$(window).on("beforeunload",function(){var i="";if(g.options.onunload){i=g.options.onunload()}if(i!=""){return i}})},_status:function(h){var g=this.$el.find(".progress-bar");g.removeClass();g.addClass("progress-bar");g.addClass("progress-bar-notransition");if(h!=""){g.addClass("progress-bar-"+h)}},_percentage:function(h){var g=this.$el.find(".progress-bar");g.css({width:h+"%"})},_template:function(g){return'
     '+g.label+"
    "}});return Backbone.View.extend({modal:null,button_show:null,uploadbox:null,current_history:null,upload_size:0,select_extension:[["Auto-detect","auto"]],select_genome:[["Unspecified (?)","?"]],collection:new e.Collection(),counter:{announce:0,success:0,error:0,running:0,reset:function(){this.announce=this.success=this.error=this.running=0}},options:{nginx_upload_path:""},initialize:function(h){var g=this;if(!Galaxy.currHistoryPanel){window.setTimeout(function(){g.initialize()},500);return}if(!Galaxy.currUser.get("id")){return}this.button_show=new b({icon:"fa-upload",tooltip:"Upload files",label:"Upload",onclick:function(i){if(i){g._eventShow(i)}},onunload:function(){if(g.counter.running>0){return"Several uploads are still processing."}}});$("#left .unified-panel-header-inner").append((new a(this.button_show)).$el);var g=this;f.jsonFromUrl(galaxy_config.root+"api/datatypes",function(i){for(key in i){g.select_extension.push([i[key],i[key]])}});f.jsonFromUrl(galaxy_config.root+"api/genomes",function(i){var j=g.select_genome[0];g.select_genome=[];for(key in i){if(i[key].length>1){if(i[key][1]!==j[1]){g.select_genome.push(i[key])}}}g.select_genome.sort(function(l,k){return l[0]>k[0]?1:l[0]0)){return null}this.uploadbox.configure({url:this.options.nginx_upload_path,paramname:"files_0|file_data"});tool_input={};tool_input.dbkey=n;tool_input.file_type=h;tool_input["files_0|NAME"]=l;tool_input["files_0|type"]="upload_dataset";tool_input["files_0|url_paste"]=m;tool_input.space_to_tabs=j;data={};data.history_id=this.current_history;data.tool_id="upload1";data.inputs=JSON.stringify(tool_input);return data},_eventProgress:function(h,i,g){var j=this.collection.get(h);j.set("percentage",g);this.button_show.set("percentage",this._upload_percentage(g,i.size))},_eventSuccess:function(h,i,k){var j=this.collection.get(h);j.set("status","success");var g=j.get("file_size");this.button_show.set("percentage",this._upload_percentage(100,g));this.upload_completed+=g*100;this.counter.announce--;this.counter.success++;this._updateScreen();Galaxy.currHistoryPanel.refreshHdas()},_eventError:function(g,h,j){var i=this.collection.get(g);i.set("status","error");i.set("info",j);this.button_show.set("percentage",this._upload_percentage(100,h.size));this.button_show.set("status","danger");this.upload_completed+=h.size*100;this.counter.announce--;this.counter.error++;this._updateScreen()},_eventComplete:function(){this.collection.each(function(g){if(g.get("status")=="queued"){g.set("status","init")}});this.counter.running=0;this._updateScreen()},_eventCreate:function(){this.uploadbox.add([{name:"New File",size:-1}])},_eventStart:function(){if(this.counter.announce==0||this.counter.running>0){return}var g=this;this.upload_size=0;this.upload_completed=0;this.collection.each(function(h){if(h.get("status")=="init"){h.set("status","queued");g.upload_size+=h.get("file_size")}});this.button_show.set("percentage",0);this.button_show.set("status","success");this.current_history=Galaxy.currHistoryPanel.model.get("id");this.counter.running=this.counter.announce;this._updateScreen();this.uploadbox.start()},_eventStop:function(){if(this.counter.running==0){return}this.button_show.set("status","info");this.uploadbox.stop();$("#upload-info").html("Queue will pause after completing the current file...")},_eventReset:function(){if(this.counter.running==0){this.collection.reset();this.counter.reset();this._updateScreen();this.uploadbox.reset();this.button_show.set("percentage",0)}},_updateScreen:function(){if(this.counter.announce==0){if(this.uploadbox.compatible()){message="Drag&drop files into this box or click 'Select' to select files!"}else{message="Unfortunately, your browser does not support multiple file uploads or drag&drop.
    Please upgrade to i.e. Firefox 4+, Chrome 7+, IE 10+, Opera 12+ or Safari 6+."}}else{if(this.counter.running==0){message="You added "+this.counter.announce+" file(s) to the queue. Add more files or click 'Upload' to proceed."}else{message="Please wait..."+this.counter.announce+" out of "+this.counter.running+" remaining."}}$("#upload-info").html(message);if(this.counter.running==0&&this.counter.announce+this.counter.success+this.counter.error>0){this.modal.enableButton("Reset")}else{this.modal.disableButton("Reset")}if(this.counter.running==0&&this.counter.announce>0){this.modal.enableButton("Upload")}else{this.modal.disableButton("Upload")}if(this.counter.running>0){this.modal.enableButton("Pause")}else{this.modal.disableButton("Pause")}if(this.counter.running==0){this.modal.enableButton("Select");this.modal.enableButton("Create")}else{this.modal.disableButton("Select");this.modal.disableButton("Create")}if(this.counter.announce+this.counter.success+this.counter.error>0){$(this.el).find("table").show()}else{$(this.el).find("table").hide()}},_upload_percentage:function(g,h){return(this.upload_completed+(g*h))/this.upload_size},_template:function(h,g){return'
    '}})}); \ No newline at end of file +define(["galaxy.modal","utils/utils","mvc/upload/upload-model","mvc/upload/upload-row","mvc/ui","utils/uploadbox"],function(c,f,e,d){var b=Backbone.Model.extend({defaults:{percentage:0,icon:"fa-circle",label:"",status:""}});var a=Backbone.View.extend({model:null,initialize:function(h){var g=this;this.model=h;this.options=this.model.attributes;this.setElement(this._template(this.options));$(this.el).on("click",this.options.onclick);if(this.options.tooltip){$(this.el).tooltip({title:this.options.tooltip,placement:"bottom"})}this.model.on("change:percentage",function(){g._percentage(g.model.get("percentage"))});this.model.on("change:status",function(){g._status(g.model.get("status"))});var g=this;$(window).on("beforeunload",function(){var i="";if(g.options.onunload){i=g.options.onunload()}if(i!=""){return i}})},_status:function(h){var g=this.$el.find(".progress-bar");g.removeClass();g.addClass("progress-bar");g.addClass("progress-bar-notransition");if(h!=""){g.addClass("progress-bar-"+h)}},_percentage:function(h){var g=this.$el.find(".progress-bar");g.css({width:h+"%"})},_template:function(g){return'
     '+g.label+"
    "}});return Backbone.View.extend({modal:null,button_show:null,uploadbox:null,current_history:null,upload_size:0,select_extension:[["Auto-detect","auto"]],select_genome:[["Unspecified (?)","?"]],collection:new e.Collection(),counter:{announce:0,success:0,error:0,running:0,reset:function(){this.announce=this.success=this.error=this.running=0}},options:{nginx_upload_path:""},initialize:function(h){var g=this;if(!Galaxy.currHistoryPanel){window.setTimeout(function(){g.initialize()},500);return}if(!Galaxy.currUser.get("id")){return}this.button_show=new b({icon:"fa-upload",tooltip:"Download from URL or upload files from disk",label:"Load Data",onclick:function(i){if(i){g._eventShow(i)}},onunload:function(){if(g.counter.running>0){return"Several uploads are still processing."}}});$("#left .unified-panel-header-inner").append((new a(this.button_show)).$el);var g=this;f.jsonFromUrl(galaxy_config.root+"api/datatypes",function(i){for(key in i){g.select_extension.push([i[key],i[key]])}});f.jsonFromUrl(galaxy_config.root+"api/genomes",function(i){var j=g.select_genome[0];g.select_genome=[];for(key in i){if(i[key].length>1){if(i[key][1]!==j[1]){g.select_genome.push(i[key])}}}g.select_genome.sort(function(l,k){return l[0]>k[0]?1:l[0]0)){return null}this.uploadbox.configure({url:this.options.nginx_upload_path,paramname:"files_0|file_data"});tool_input={};tool_input.dbkey=n;tool_input.file_type=h;tool_input["files_0|NAME"]=l;tool_input["files_0|type"]="upload_dataset";tool_input["files_0|url_paste"]=m;tool_input.space_to_tabs=j;data={};data.history_id=this.current_history;data.tool_id="upload1";data.inputs=JSON.stringify(tool_input);return data},_eventProgress:function(h,i,g){var j=this.collection.get(h);j.set("percentage",g);this.button_show.set("percentage",this._upload_percentage(g,i.size))},_eventSuccess:function(h,i,k){var j=this.collection.get(h);j.set("status","success");var g=j.get("file_size");this.button_show.set("percentage",this._upload_percentage(100,g));this.upload_completed+=g*100;this.counter.announce--;this.counter.success++;this._updateScreen();Galaxy.currHistoryPanel.refreshHdas()},_eventError:function(g,h,j){var i=this.collection.get(g);i.set("status","error");i.set("info",j);this.button_show.set("percentage",this._upload_percentage(100,h.size));this.button_show.set("status","danger");this.upload_completed+=h.size*100;this.counter.announce--;this.counter.error++;this._updateScreen()},_eventComplete:function(){this.collection.each(function(g){if(g.get("status")=="queued"){g.set("status","init")}});this.counter.running=0;this._updateScreen()},_eventCreate:function(){this.uploadbox.add([{name:"New File",size:-1}])},_eventStart:function(){if(this.counter.announce==0||this.counter.running>0){return}var g=this;this.upload_size=0;this.upload_completed=0;this.collection.each(function(h){if(h.get("status")=="init"){h.set("status","queued");g.upload_size+=h.get("file_size")}});this.button_show.set("percentage",0);this.button_show.set("status","success");this.current_history=Galaxy.currHistoryPanel.model.get("id");this.counter.running=this.counter.announce;this._updateScreen();this.uploadbox.start()},_eventStop:function(){if(this.counter.running==0){return}this.button_show.set("status","info");this.uploadbox.stop();$("#upload-info").html("Queue will pause after completing the current file...")},_eventReset:function(){if(this.counter.running==0){this.collection.reset();this.counter.reset();this._updateScreen();this.uploadbox.reset();this.button_show.set("percentage",0)}},_updateScreen:function(){if(this.counter.announce==0){if(this.uploadbox.compatible()){message="You can Drag & Drop files into this box."}else{message="Unfortunately, your browser does not support multiple file uploads or drag&drop.
    Some supported browsers are: Firefox 4+, Chrome 7+, IE 10+, Opera 12+ or Safari 6+."}}else{if(this.counter.running==0){message="You added "+this.counter.announce+" file(s) to the queue. Add more files or click 'Start' to proceed."}else{message="Please wait..."+this.counter.announce+" out of "+this.counter.running+" remaining."}}$("#upload-info").html(message);if(this.counter.running==0&&this.counter.announce+this.counter.success+this.counter.error>0){this.modal.enableButton("Reset")}else{this.modal.disableButton("Reset")}if(this.counter.running==0&&this.counter.announce>0){this.modal.enableButton("Start")}else{this.modal.disableButton("Start")}if(this.counter.running>0){this.modal.enableButton("Pause")}else{this.modal.disableButton("Pause")}if(this.counter.running==0){this.modal.enableButton("Choose file");this.modal.enableButton("from URL")}else{this.modal.disableButton("Choose file");this.modal.disableButton("from URL")}if(this.counter.announce+this.counter.success+this.counter.error>0){$(this.el).find("table").show()}else{$(this.el).find("table").hide()}},_upload_percentage:function(g,h){return(this.upload_completed+(g*h))/this.upload_size},_template:function(h,g){return'
    '}})}); \ No newline at end of file diff --git a/static/style/blue/base.css b/static/style/blue/base.css index af80526cc43..75ac0b5c5c3 100644 --- a/static/style/blue/base.css +++ b/static/style/blue/base.css @@ -1260,7 +1260,7 @@ label{font-weight:normal} .upload-box .table td{margin:0px;paddign:0px} .upload-box .title{width:130px;word-wrap:break-word;font-size:11px} .upload-box .text{position:absolute;display:none}.upload-box .text .text-content{font-size:11px;width:100%;height:50px;resize:none;background:inherit;color:#000} -.upload-box .text .text-info{font-size:11px;color:#999} +.upload-box .text .text-info{font-size:11px} .upload-box .extension{width:100px;font-size:11px} .upload-box .genome{width:150px;font-size:11px} .upload-box .size{width:60px;white-space:nowrap} diff --git a/static/style/src/less/upload.less b/static/style/src/less/upload.less index 6a1f43d519d..d1019ac8777 100644 --- a/static/style/src/less/upload.less +++ b/static/style/src/less/upload.less @@ -85,7 +85,7 @@ .text-info { font-size : @font-size-small; - color : @gray-light; + // color : @gray-light; } } @@ -133,4 +133,4 @@ font-size: 1.2em; cursor: pointer; } -} \ No newline at end of file +}