commit/galaxy-central: guerler: Upload: Introduce progress button
1 new commit in galaxy-central: https://bitbucket.org/galaxy/galaxy-central/commits/4a926eff735e/ Changeset: 4a926eff735e User: guerler Date: 2014-01-18 20:48:10 Summary: Upload: Introduce progress button Affected #: 8 files diff -r bb5ee4189ada638491879e082d7c226bba332575 -r 4a926eff735eef13634c76c258f8a82dd17e3ea4 static/scripts/mvc/upload/upload-row.js --- a/static/scripts/mvc/upload/upload-row.js +++ b/static/scripts/mvc/upload/upload-row.js @@ -58,6 +58,7 @@ // update url paste content self.model.set('url_paste', value); + self.model.set('file_size', count); }); // handle genome selection diff -r bb5ee4189ada638491879e082d7c226bba332575 -r 4a926eff735eef13634c76c258f8a82dd17e3ea4 static/scripts/mvc/upload/upload-view.js --- a/static/scripts/mvc/upload/upload-view.js +++ b/static/scripts/mvc/upload/upload-view.js @@ -4,15 +4,89 @@ "utils/utils", "mvc/upload/upload-model", "mvc/upload/upload-row", + "mvc/ui", "utils/uploadbox"], - function( mod_modal, - mod_masthead, - mod_utils, + function( Modal, + Masthead, + Utils, UploadModel, UploadItem ) { +// create model +var ProgressButtonModel = Backbone.Model.extend({ + defaults: { + percentage : 0, + icon : 'fa-circle', + label : '', + status : '' + } +}); + +// progress bar button on ui +var ProgressButton = Backbone.View.extend({ + // model + model : null, + + // initialize + initialize : function(model) { + // link this + var self = this; + + // create model + this.model = model; + + // get options + this.options = this.model.attributes; + + // create new element + this.setElement(this._template(this.options)); + + // add event + $(this.el).on('click', this.options.onclick); + + // add tooltip + if (this.options.tooltip) { + $(this.el).tooltip({title: this.options.tooltip, placement: 'bottom'}); + } + + // events + this.model.on('change:percentage', function() { + self._percentage(self.model.get('percentage')); + }); + this.model.on('change:status', function() { + self._status(self.model.get('status')); + }); + }, + + // set status + _status: function(value) { + var $el = this.$el.find('.progress-bar'); + if (value != '') { + $el.addClass('progress-bar-' + value); + } else { + $el.removeClass(); + $el.addClass('progress-bar'); + } + }, + + // set percentage + _percentage: function(value) { + this.$el.find('.progress-bar').css({ width : value + '%' }); + }, + + // template + _template: function(options) { + return '<div style="position: absolute; width: 100px; right: 10px; top: 7px; cursor: pointer;">' + + '<div class="progress">' + + '<div class="progress-bar"></div>' + + '</div>' + + '<div id="label" class="label" style="position: absolute; top: 0px; width: inherit; text-align: center;"><div class="fa ' + options.icon + '"></div> ' + options.label + '</div>' + + '</div>'; + } +}); + // galaxy upload return Backbone.View.extend( { @@ -28,6 +102,9 @@ // current history current_history: null, + // current upload size + upload_size: 0, + // extension types select_extension :[['Auto-detect', 'auto']], @@ -74,32 +151,35 @@ if (!Galaxy.currUser.get('id')) return; - // add activate icon - this.button_show = new mod_masthead.GalaxyMastheadIcon ( - { - icon : 'fa-arrow-circle-o-up', + // create model + this.button_show = new ProgressButtonModel({ + icon : 'fa-upload', tooltip : 'Upload Files', - on_click : function(e) { self._eventShow(e) }, - on_unload : function() { + label : 'Upload', + onclick : function(e) { + if (e) { + self._eventShow(e) + } + }, + onunload : function() { if (self.counter.running > 0) return "Several uploads are still processing."; - }, - with_number : true + } }); - // add to masthead - Galaxy.masthead.prepend(this.button_show); + // define location + $('#left .unified-panel-header-inner').append((new ProgressButton(this.button_show)).$el); // load extension var self = this; - mod_utils.jsonFromUrl(galaxy_config.root + "api/datatypes", + Utils.jsonFromUrl(galaxy_config.root + "api/datatypes", function(datatypes) { for (key in datatypes) self.select_extension.push([datatypes[key], datatypes[key]]); }); // load genomes - mod_utils.jsonFromUrl(galaxy_config.root + "api/genomes", + Utils.jsonFromUrl(galaxy_config.root + "api/genomes", function(genomes) { // backup default var def = self.select_genome[0]; @@ -154,7 +234,7 @@ { // make modal var self = this; - this.modal = new mod_modal.GalaxyModal( + this.modal = new Modal.GalaxyModal( { title : 'Upload files from your local drive', body : this._template('upload-box', 'upload-info'), @@ -257,9 +337,6 @@ // update status it.set('state', 'running'); - - // update on screen counter - this.button_show.number(this.counter.announce); // get configuration var file_type = it.get('extension'); @@ -297,8 +374,12 @@ // progress _eventProgress : function(index, file, percentage) { + // set progress for row var it = this.collection.get(index); it.set('percentage', percentage); + + // update ui button + this.button_show.set('percentage', this._upload_percentage(percentage, file.size)); }, // success @@ -308,8 +389,14 @@ var it = this.collection.get(index); it.set('status', 'success'); - // update on screen counter - this.button_show.number(''); + // file size + var file_size = it.get('file_size'); + + // update ui button + this.button_show.set('percentage', this._upload_percentage(100, file_size)); + + // update completed + this.upload_completed += file_size * 100; // update counter this.counter.announce--; @@ -332,8 +419,12 @@ it.set('status', 'error'); it.set('info', message); - // update on screen counter - this.button_show.number(''); + // update ui button + this.button_show.set('percentage', this._upload_percentage(100, file.size)); + this.button_show.set('status', 'danger'); + + // update completed + this.upload_completed += file.size * 100; // update counter this.counter.announce--; @@ -373,14 +464,23 @@ if (this.counter.announce == 0 || this.counter.running > 0) { return; } - + + // reset current size + var self = this; + this.upload_size = 0; + this.upload_completed = 0; // switch icons for new uploads this.collection.each(function(item) { if(item.get('status') == 'init') { item.set('status', 'queued'); + self.upload_size += item.get('file_size'); } }); + // reset progress + this.button_show.set('progress', 0); + this.button_show.set('status', ''); + // backup current history this.current_history = Galaxy.currHistoryPanel.model.get('id'); @@ -398,7 +498,7 @@ if (this.counter.running == 0) { return; } - + // request pause this.uploadbox.stop(); @@ -488,6 +588,11 @@ $(this.el).find('table').hide(); }, + // calculate percentage of all queued uploads + _upload_percentage: function(percentage, size) { + return (this.upload_completed + (percentage * size)) / this.upload_size; + }, + // load html template _template: function(id, idInfo) { diff -r bb5ee4189ada638491879e082d7c226bba332575 -r 4a926eff735eef13634c76c258f8a82dd17e3ea4 static/scripts/packed/mvc/upload/upload-row.js --- a/static/scripts/packed/mvc/upload/upload-row.js +++ b/static/scripts/packed/mvc/upload/upload-row.js @@ -1,1 +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",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)});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("<strong>Failed: </strong>"+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"<strong>-</strong>"}}}}}return"<strong>"+(Math.round(b)/10)+"</strong> "+c},_template:function(d){var c=this;var b='<tr id="upload-item-'+d.id+'" class="upload-item"><td><div style="position: relative;"><div id="title" class="title"></div><div id="text" class="text"><div class="text-info">You may specify a list of URLs (one per line) or paste the contents of a file.</div><textarea id="text-content" class="text-content form-control"></textarea></div></div></td><td><div id="size" class="size"></div></td>';b+='<td><select id="extension" class="extension">';for(key in c.app.select_extension){b+='<option value="'+c.app.select_extension[key][1]+'">'+c.app.select_extension[key][0]+"</option>"}b+="</select></td>";b+='<td><select id="genome" class="genome">';for(key in c.app.select_genome){b+='<option value="'+c.app.select_genome[key][1]+'">'+c.app.select_genome[key][0]+"</option>"}b+="</select></td>";b+='<td><input id="space_to_tabs" type="checkbox"></input></td><td><div id="info" class="info"><div class="progress"><div class="progress-bar progress-bar-success"></div><div id="percentage" class="percentage">0%</div></div></div></td><td><div id="symbol" class="'+this.status_classes.init+'"></div></td></tr>';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",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("<strong>Failed: </strong>"+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"<strong>-</strong>"}}}}}return"<strong>"+(Math.round(b)/10)+"</strong> "+c},_template:function(d){var c=this;var b='<tr id="upload-item-'+d.id+'" class="upload-item"><td><div style="position: relative;"><div id="title" class="title"></div><div id="text" class="text"><div class="text-info">You may specify a list of URLs (one per line) or paste the contents of a file.</div><textarea id="text-content" class="text-content form-control"></textarea></div></div></td><td><div id="size" class="size"></div></td>';b+='<td><select id="extension" class="extension">';for(key in c.app.select_extension){b+='<option value="'+c.app.select_extension[key][1]+'">'+c.app.select_extension[key][0]+"</option>"}b+="</select></td>";b+='<td><select id="genome" class="genome">';for(key in c.app.select_genome){b+='<option value="'+c.app.select_genome[key][1]+'">'+c.app.select_genome[key][0]+"</option>"}b+="</select></td>";b+='<td><input id="space_to_tabs" type="checkbox"></input></td><td><div id="info" class="info"><div class="progress"><div class="progress-bar progress-bar-success"></div><div id="percentage" class="percentage">0%</div></div></div></td><td><div id="symbol" class="'+this.status_classes.init+'"></div></td></tr>';return b}})}); \ No newline at end of file diff -r bb5ee4189ada638491879e082d7c226bba332575 -r 4a926eff735eef13634c76c258f8a82dd17e3ea4 static/scripts/packed/mvc/upload/upload-view.js --- a/static/scripts/packed/mvc/upload/upload-view.js +++ b/static/scripts/packed/mvc/upload/upload-view.js @@ -1,1 +1,1 @@ -define(["galaxy.modal","galaxy.masthead","utils/utils","mvc/upload/upload-model","mvc/upload/upload-row","utils/uploadbox"],function(a,d,e,c,b){return Backbone.View.extend({modal:null,button_show:null,uploadbox:null,current_history:null,select_extension:[["Auto-detect","auto"]],select_genome:[["Unspecified (?)","?"]],collection:new c.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(g){var f=this;if(!Galaxy.currHistoryPanel){window.setTimeout(function(){f.initialize()},500);return}if(!Galaxy.currUser.get("id")){return}this.button_show=new d.GalaxyMastheadIcon({icon:"fa-arrow-circle-o-up",tooltip:"Upload Files",on_click:function(h){f._eventShow(h)},on_unload:function(){if(f.counter.running>0){return"Several uploads are still processing."}},with_number:true});Galaxy.masthead.prepend(this.button_show);var f=this;e.jsonFromUrl(galaxy_config.root+"api/datatypes",function(h){for(key in h){f.select_extension.push([h[key],h[key]])}});e.jsonFromUrl(galaxy_config.root+"api/genomes",function(h){var i=f.select_genome[0];f.select_genome=[];for(key in h){if(h[key].length>1){if(h[key][1]!==i[1]){f.select_genome.push(h[key])}}}f.select_genome.sort(function(k,j){return k[0]>j[0]?1:k[0]<j[0]?-1:0});f.select_genome.unshift(i)});if(g){this.options=_.defaults(g,this.options)}this.collection.on("remove",function(h){f._eventRemove(h)});this.collection.on("change:genome",function(i){var h=i.get("genome");f.collection.each(function(j){if(j.get("status")=="init"&&j.get("genome")=="?"){j.set("genome",h)}})})},_eventShow:function(g){g.preventDefault();if(!this.modal){var f=this;this.modal=new a.GalaxyModal({title:"Upload files from your local drive",body:this._template("upload-box","upload-info"),buttons:{Select:function(){f.uploadbox.select()},Create:function(){f._eventCreate()},Upload:function(){f._eventStart()},Pause:function(){f._eventStop()},Reset:function(){f._eventReset()},Close:function(){f.modal.hide()},},height:"400",width:"900"});this.setElement("#upload-box");var f=this;this.uploadbox=this.$el.uploadbox({announce:function(h,i,j){f._eventAnnounce(h,i,j)},initialize:function(h,i,j){return f._eventInitialize(h,i,j)},progress:function(h,i,j){f._eventProgress(h,i,j)},success:function(h,i,j){f._eventSuccess(h,i,j)},error:function(h,i,j){f._eventError(h,i,j)},complete:function(){f._eventComplete()}});this._updateScreen()}this.modal.show()},_eventRemove:function(g){var f=g.get("status");if(f=="success"){this.counter.success--}else{if(f=="error"){this.counter.error--}else{this.counter.announce--}}this._updateScreen();this.uploadbox.remove(g.id)},_eventAnnounce:function(f,g,i){this.counter.announce++;this._updateScreen();var h=new b(this,{id:f,file_name:g.name,file_size:g.size});this.collection.add(h.model);$(this.el).find("tbody:last").append(h.$el);h.render()},_eventInitialize:function(j,f,n){var h=this.collection.get(j);h.set("state","running");this.button_show.number(this.counter.announce);var g=h.get("extension");var k=h.get("file_name");var m=h.get("genome");var l=h.get("url_paste");var i=h.get("space_to_tabs");if(!l&&!(f.size>0)){return null}this.uploadbox.configure({url:this.options.nginx_upload_path,paramname:"files_0|file_data"});tool_input={};tool_input.dbkey=m;tool_input.file_type=g;tool_input["files_0|NAME"]=k;tool_input["files_0|type"]="upload_dataset";tool_input["files_0|url_paste"]=l;tool_input.space_to_tabs=i;data={};data.history_id=this.current_history;data.tool_id="upload1";data.inputs=JSON.stringify(tool_input);return data},_eventProgress:function(g,h,f){var i=this.collection.get(g);i.set("percentage",f)},_eventSuccess:function(f,g,i){var h=this.collection.get(f);h.set("status","success");this.button_show.number("");this.counter.announce--;this.counter.success++;this._updateScreen();Galaxy.currHistoryPanel.refreshHdas()},_eventError:function(f,g,i){var h=this.collection.get(f);h.set("status","error");h.set("info",i);this.button_show.number("");this.counter.announce--;this.counter.error++;this._updateScreen()},_eventComplete:function(){this.collection.each(function(f){if(f.get("status")=="queued"){f.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}this.collection.each(function(f){if(f.get("status")=="init"){f.set("status","queued")}});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.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()}},_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.<br>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()}},_template:function(g,f){return'<div id="'+g+'" class="upload-box"><table class="table table-striped" style="display: none;"><thead><tr><th>Name</th><th>Size</th><th>Type</th><th>Genome</th><th>Space→Tab</th><th>Status</th><th></th></tr></thead><tbody></tbody></table></div><h6 id="'+f+'" class="upload-info"></h6>'}})}); \ No newline at end of file +define(["galaxy.modal","galaxy.masthead","utils/utils","mvc/upload/upload-model","mvc/upload/upload-row","mvc/ui","utils/uploadbox"],function(c,g,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(i){var h=this;this.model=i;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(){h._percentage(h.model.get("percentage"))});this.model.on("change:status",function(){h._status(h.model.get("status"))})},_status:function(i){var h=this.$el.find(".progress-bar");if(i!=""){h.addClass("progress-bar-"+i)}else{h.removeClass();h.addClass("progress-bar")}},_percentage:function(h){this.$el.find(".progress-bar").css({width:h+"%"})},_template:function(h){return'<div style="position: absolute; width: 100px; right: 10px; top: 7px; cursor: pointer;"><div class="progress"><div class="progress-bar"></div></div><div id="label" class="label" style="position: absolute; top: 0px; width: inherit; text-align: center;"><div class="fa '+h.icon+'"></div> '+h.label+"</div></div>"}});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(i){var h=this;if(!Galaxy.currHistoryPanel){window.setTimeout(function(){h.initialize()},500);return}if(!Galaxy.currUser.get("id")){return}this.button_show=new b({icon:"fa-upload",tooltip:"Upload Files",label:"Upload",onclick:function(j){if(j){h._eventShow(j)}},onunload:function(){if(h.counter.running>0){return"Several uploads are still processing."}}});$("#left .unified-panel-header-inner").append((new a(this.button_show)).$el);var h=this;f.jsonFromUrl(galaxy_config.root+"api/datatypes",function(j){for(key in j){h.select_extension.push([j[key],j[key]])}});f.jsonFromUrl(galaxy_config.root+"api/genomes",function(j){var k=h.select_genome[0];h.select_genome=[];for(key in j){if(j[key].length>1){if(j[key][1]!==k[1]){h.select_genome.push(j[key])}}}h.select_genome.sort(function(m,l){return m[0]>l[0]?1:m[0]<l[0]?-1:0});h.select_genome.unshift(k)});if(i){this.options=_.defaults(i,this.options)}this.collection.on("remove",function(j){h._eventRemove(j)});this.collection.on("change:genome",function(k){var j=k.get("genome");h.collection.each(function(l){if(l.get("status")=="init"&&l.get("genome")=="?"){l.set("genome",j)}})})},_eventShow:function(i){i.preventDefault();if(!this.modal){var h=this;this.modal=new c.GalaxyModal({title:"Upload files from your local drive",body:this._template("upload-box","upload-info"),buttons:{Select:function(){h.uploadbox.select()},Create:function(){h._eventCreate()},Upload:function(){h._eventStart()},Pause:function(){h._eventStop()},Reset:function(){h._eventReset()},Close:function(){h.modal.hide()},},height:"400",width:"900"});this.setElement("#upload-box");var h=this;this.uploadbox=this.$el.uploadbox({announce:function(j,k,l){h._eventAnnounce(j,k,l)},initialize:function(j,k,l){return h._eventInitialize(j,k,l)},progress:function(j,k,l){h._eventProgress(j,k,l)},success:function(j,k,l){h._eventSuccess(j,k,l)},error:function(j,k,l){h._eventError(j,k,l)},complete:function(){h._eventComplete()}});this._updateScreen()}this.modal.show()},_eventRemove:function(i){var h=i.get("status");if(h=="success"){this.counter.success--}else{if(h=="error"){this.counter.error--}else{this.counter.announce--}}this._updateScreen();this.uploadbox.remove(i.id)},_eventAnnounce:function(h,i,k){this.counter.announce++;this._updateScreen();var j=new d(this,{id:h,file_name:i.name,file_size:i.size});this.collection.add(j.model);$(this.el).find("tbody:last").append(j.$el);j.render()},_eventInitialize:function(l,h,p){var j=this.collection.get(l);j.set("state","running");var i=j.get("extension");var m=j.get("file_name");var o=j.get("genome");var n=j.get("url_paste");var k=j.get("space_to_tabs");if(!n&&!(h.size>0)){return null}this.uploadbox.configure({url:this.options.nginx_upload_path,paramname:"files_0|file_data"});tool_input={};tool_input.dbkey=o;tool_input.file_type=i;tool_input["files_0|NAME"]=m;tool_input["files_0|type"]="upload_dataset";tool_input["files_0|url_paste"]=n;tool_input.space_to_tabs=k;data={};data.history_id=this.current_history;data.tool_id="upload1";data.inputs=JSON.stringify(tool_input);return data},_eventProgress:function(i,j,h){var k=this.collection.get(i);k.set("percentage",h);this.button_show.set("percentage",this._upload_percentage(h,j.size))},_eventSuccess:function(i,j,l){var k=this.collection.get(i);k.set("status","success");var h=k.get("file_size");this.button_show.set("percentage",this._upload_percentage(100,h));this.upload_completed+=h*100;this.counter.announce--;this.counter.success++;this._updateScreen();Galaxy.currHistoryPanel.refreshHdas()},_eventError:function(h,i,k){var j=this.collection.get(h);j.set("status","error");j.set("info",k);this.button_show.set("percentage",this._upload_percentage(100,i.size));this.button_show.set("status","danger");this.upload_completed+=i.size*100;this.counter.announce--;this.counter.error++;this._updateScreen()},_eventComplete:function(){this.collection.each(function(h){if(h.get("status")=="queued"){h.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 h=this;this.upload_size=0;this.upload_completed=0;this.collection.each(function(i){if(i.get("status")=="init"){i.set("status","queued");h.upload_size+=i.get("file_size")}});this.button_show.set("progress",0);this.button_show.set("status","");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.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()}},_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.<br>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(h,i){return(this.upload_completed+(h*i))/this.upload_size},_template:function(i,h){return'<div id="'+i+'" class="upload-box"><table class="table table-striped" style="display: none;"><thead><tr><th>Name</th><th>Size</th><th>Type</th><th>Genome</th><th>Space→Tab</th><th>Status</th><th></th></tr></thead><tbody></tbody></table></div><h6 id="'+h+'" class="upload-info"></h6>'}})}); \ No newline at end of file diff -r bb5ee4189ada638491879e082d7c226bba332575 -r 4a926eff735eef13634c76c258f8a82dd17e3ea4 static/scripts/packed/utils/utils.js --- a/static/scripts/packed/utils/utils.js +++ b/static/scripts/packed/utils/utils.js @@ -1,1 +1,1 @@ -define(["libs/underscore"],function(c){function d(g,f,e){var h=new XMLHttpRequest();h.open("GET",g,true);h.setRequestHeader("Accept","application/json");h.setRequestHeader("Cache-Control","no-cache");h.setRequestHeader("X-Requested-With","XMLHttpRequest");h.onloadend=function(){var i=h.status;if(i==200){try{response=jQuery.parseJSON(h.responseText)}catch(j){response=h.responseText}f&&f(response)}else{e&&e(i)}};h.send()}function b(h,e){var f=$('<div class="'+h+'"></div>');f.appendTo(":eq(0)");var g=f.css(e);f.remove();return g}function a(e){if(!$('link[href^="'+e+'"]').length){$('<link href="'+galaxy_config.root+e+'" rel="stylesheet">').appendTo("head")}}return{cssLoadFile:a,cssGetAttribute:b,jsonFromUrl:d}}); \ No newline at end of file +define(["libs/underscore"],function(c){function d(h,g,f){var i=new XMLHttpRequest();i.open("GET",h,true);i.setRequestHeader("Accept","application/json");i.setRequestHeader("Cache-Control","no-cache");i.setRequestHeader("X-Requested-With","XMLHttpRequest");i.onloadend=function(){var j=i.status;if(j==200){try{response=jQuery.parseJSON(i.responseText)}catch(k){response=i.responseText}g&&g(response)}else{f&&f(j)}};i.send()}function b(i,f){var g=$('<div class="'+i+'"></div>');g.appendTo(":eq(0)");var h=g.css(f);g.remove();return h}function a(f){if(!$('link[href^="'+f+'"]').length){$('<link href="'+galaxy_config.root+f+'" rel="stylesheet">').appendTo("head")}}function e(f,g){if(f){return c.defaults(f,g)}else{return g}}return{cssLoadFile:a,cssGetAttribute:b,jsonFromUrl:d,merge:e}}); \ No newline at end of file diff -r bb5ee4189ada638491879e082d7c226bba332575 -r 4a926eff735eef13634c76c258f8a82dd17e3ea4 static/scripts/packed/viz/trackster.js --- a/static/scripts/packed/viz/trackster.js +++ b/static/scripts/packed/viz/trackster.js @@ -1,1 +1,1 @@ -var ui=null;var view=null;var browser_router=null;require(["utils/galaxy.utils","libs/jquery/jstorage","libs/jquery/jquery.event.drag","libs/jquery/jquery.event.hover","libs/jquery/jquery.mousewheel","libs/jquery/jquery-ui","libs/jquery/select2","libs/farbtastic","libs/jquery/jquery.form","libs/jquery/jquery.rating","mvc/ui"],function(a){a.cssLoadFile("static/style/jquery.rating.css");a.cssLoadFile("static/style/autocomplete_tagging.css");a.cssLoadFile("static/style/jquery-ui/smoothness/jquery-ui.css");a.cssLoadFile("static/style/library.css");a.cssLoadFile("static/style/trackster.css")});define(["libs/backbone/backbone","viz/visualization","viz/trackster_ui"],function(c,a,b){var d=Backbone.View.extend({initialize:function(){ui=new b.TracksterUI(galaxy_config.root);ui.createButtonMenu();ui.buttonMenu.$el.attr("style","float: right");$("#center .unified-panel-header-inner").append(ui.buttonMenu.$el);$("#right .unified-panel-title").append("Bookmarks");$("#right .unified-panel-icons").append("<a id='add-bookmark-button' class='icon-button menu-button plus-button' href='javascript:void(0);' title='Add bookmark'></a>");$("#right-border").click(function(){view.resize_window()});force_right_panel("hide");if(galaxy_config.app.id){this.view_existing()}else{this.view_new()}},set_up_router:function(e){browser_router=new a.TrackBrowserRouter(e);Backbone.history.start()},view_existing:function(){var e=galaxy_config.app.viz_config;view=ui.create_visualization({container:$("#center .unified-panel-body"),name:e.title,vis_id:e.vis_id,dbkey:e.dbkey},e.viewport,e.tracks,e.bookmarks,true);this.init_editor()},view_new:function(){var e=this;$.ajax({url:galaxy_config.root+"api/genomes?chrom_info=True",data:{},error:function(){alert("Couldn't create new browser.")},success:function(f){Galaxy.modal.show({title:"New Visualization",body:e.template_view_new(f),buttons:{Cancel:function(){window.location=galaxy_config.root+"visualization/list"},Create:function(){e.create_browser($("#new-title").val(),$("#new-dbkey").val());Galaxy.modal.hide()}}});if(galaxy_config.app.default_dbkey){$("#new-dbkey").val(galaxy_config.app.default_dbkey)}$("#new-title").focus();$("select[name='dbkey']").select2();$("#overlay").css("overflow","auto")}})},template_view_new:function(e){var g='<form id="new-browser-form" action="javascript:void(0);" method="post" onsubmit="return false;"><div class="form-row"><label for="new-title">Browser name:</label><div class="form-row-input"><input type="text" name="title" id="new-title" value="Unnamed"></input></div><div style="clear: both;"></div></div><div class="form-row"><label for="new-dbkey">Reference genome build (dbkey): </label><div class="form-row-input"><select name="dbkey" id="new-dbkey">';for(var f=0;f<e.length;f++){g+='<option value="'+e[f][1]+'">'+e[f][0]+"</option>"}g+='</select></div><div style="clear: both;"></div></div><div class="form-row">Is the build not listed here? <a href="'+galaxy_config.root+'user/dbkeys?use_panels=True">Add a Custom Build</a></div></form>';return g},create_browser:function(f,e){$(document).trigger("convert_to_values");view=ui.create_visualization({container:$("#center .unified-panel-body"),name:f,dbkey:e},galaxy_config.app.gene_region);this.init_editor();view.editor=true},init_editor:function(){$("#center .unified-panel-title").text(view.prefs.name+" ("+view.dbkey+")");if(galaxy_config.app.add_dataset){$.ajax({url:galaxy_config.root+"api/datasets/"+galaxy_config.app.add_dataset,data:{hda_ldda:"hda",data_type:"track_config"},dataType:"json",success:function(e){view.add_drawable(b.object_from_template(e,view,view))}})}$("#add-bookmark-button").click(function(){var f=view.chrom+":"+view.low+"-"+view.high,e="Bookmark description";return ui.add_bookmark(f,e,true)});ui.init_keyboard_nav(view);this.set_up_router({view:view})}});return{GalaxyApp:d}}); \ No newline at end of file +var ui=null;var view=null;var browser_router=null;require(["utils/utils","libs/jquery/jstorage","libs/jquery/jquery.event.drag","libs/jquery/jquery.event.hover","libs/jquery/jquery.mousewheel","libs/jquery/jquery-ui","libs/jquery/select2","libs/farbtastic","libs/jquery/jquery.form","libs/jquery/jquery.rating","mvc/ui"],function(a){a.cssLoadFile("static/style/jquery.rating.css");a.cssLoadFile("static/style/autocomplete_tagging.css");a.cssLoadFile("static/style/jquery-ui/smoothness/jquery-ui.css");a.cssLoadFile("static/style/library.css");a.cssLoadFile("static/style/trackster.css")});define(["libs/backbone/backbone","viz/visualization","viz/trackster_ui"],function(c,a,b){var d=Backbone.View.extend({initialize:function(){ui=new b.TracksterUI(galaxy_config.root);ui.createButtonMenu();ui.buttonMenu.$el.attr("style","float: right");$("#center .unified-panel-header-inner").append(ui.buttonMenu.$el);$("#right .unified-panel-title").append("Bookmarks");$("#right .unified-panel-icons").append("<a id='add-bookmark-button' class='icon-button menu-button plus-button' href='javascript:void(0);' title='Add bookmark'></a>");$("#right-border").click(function(){view.resize_window()});force_right_panel("hide");if(galaxy_config.app.id){this.view_existing()}else{this.view_new()}},set_up_router:function(e){browser_router=new a.TrackBrowserRouter(e);Backbone.history.start()},view_existing:function(){var e=galaxy_config.app.viz_config;view=ui.create_visualization({container:$("#center .unified-panel-body"),name:e.title,vis_id:e.vis_id,dbkey:e.dbkey},e.viewport,e.tracks,e.bookmarks,true);this.init_editor()},view_new:function(){var e=this;$.ajax({url:galaxy_config.root+"api/genomes?chrom_info=True",data:{},error:function(){alert("Couldn't create new browser.")},success:function(f){Galaxy.modal.show({title:"New Visualization",body:e.template_view_new(f),buttons:{Cancel:function(){window.location=galaxy_config.root+"visualization/list"},Create:function(){e.create_browser($("#new-title").val(),$("#new-dbkey").val());Galaxy.modal.hide()}}});if(galaxy_config.app.default_dbkey){$("#new-dbkey").val(galaxy_config.app.default_dbkey)}$("#new-title").focus();$("select[name='dbkey']").select2();$("#overlay").css("overflow","auto")}})},template_view_new:function(e){var g='<form id="new-browser-form" action="javascript:void(0);" method="post" onsubmit="return false;"><div class="form-row"><label for="new-title">Browser name:</label><div class="form-row-input"><input type="text" name="title" id="new-title" value="Unnamed"></input></div><div style="clear: both;"></div></div><div class="form-row"><label for="new-dbkey">Reference genome build (dbkey): </label><div class="form-row-input"><select name="dbkey" id="new-dbkey">';for(var f=0;f<e.length;f++){g+='<option value="'+e[f][1]+'">'+e[f][0]+"</option>"}g+='</select></div><div style="clear: both;"></div></div><div class="form-row">Is the build not listed here? <a href="'+galaxy_config.root+'user/dbkeys?use_panels=True">Add a Custom Build</a></div></form>';return g},create_browser:function(f,e){$(document).trigger("convert_to_values");view=ui.create_visualization({container:$("#center .unified-panel-body"),name:f,dbkey:e},galaxy_config.app.gene_region);this.init_editor();view.editor=true},init_editor:function(){$("#center .unified-panel-title").text(view.prefs.name+" ("+view.dbkey+")");if(galaxy_config.app.add_dataset){$.ajax({url:galaxy_config.root+"api/datasets/"+galaxy_config.app.add_dataset,data:{hda_ldda:"hda",data_type:"track_config"},dataType:"json",success:function(e){view.add_drawable(b.object_from_template(e,view,view))}})}$("#add-bookmark-button").click(function(){var f=view.chrom+":"+view.low+"-"+view.high,e="Bookmark description";return ui.add_bookmark(f,e,true)});ui.init_keyboard_nav(view);this.set_up_router({view:view})}});return{GalaxyApp:d}}); \ No newline at end of file diff -r bb5ee4189ada638491879e082d7c226bba332575 -r 4a926eff735eef13634c76c258f8a82dd17e3ea4 static/scripts/utils/utils.js --- a/static/scripts/utils/utils.js +++ b/static/scripts/utils/utils.js @@ -63,11 +63,20 @@ $('<link href="' + galaxy_config.root + url + '" rel="stylesheet">').appendTo('head'); }; +// merge +function merge (options, optionsDefault) { + if (options) + return _.defaults(options, optionsDefault); + else + return optionsDefault; +}; + // return return { cssLoadFile : cssLoadFile, cssGetAttribute : cssGetAttribute, - jsonFromUrl : jsonFromUrl + jsonFromUrl : jsonFromUrl, + merge : merge }; }); diff -r bb5ee4189ada638491879e082d7c226bba332575 -r 4a926eff735eef13634c76c258f8a82dd17e3ea4 static/scripts/viz/trackster.js --- a/static/scripts/viz/trackster.js +++ b/static/scripts/viz/trackster.js @@ -7,7 +7,7 @@ require( [ // load js libraries - 'utils/galaxy.utils', + 'utils/utils', 'libs/jquery/jstorage', 'libs/jquery/jquery.event.drag', 'libs/jquery/jquery.event.hover', Repository URL: https://bitbucket.org/galaxy/galaxy-central/ -- This is a commit notification from bitbucket.org. You are receiving this because you have the service enabled, addressing the recipient of this email.
participants (1)
-
commits-noreply＠bitbucket.org