[WIP] Adjust styles

client/galaxy/scripts/mvc/ui/ui-misc.js

@@ -25,7 +25,7 @@ var Image = Backbone.View.extend({
     initialize : function(options) {
         // get options
         this.options = Utils.merge(options, this.optionsDefault);
-            
+
         // create new element
         this.setElement(this._template(this.options));
     },

client/galaxy/scripts/mvc/ui/ui-modal.js

@@ -35,12 +35,12 @@ var View = Backbone.View.extend({
         if (this.options.height){
             this.$body.css('height', this.options.height);
             this.$body.css('overflow', 'hidden');
-        } else{
+        } else {
             this.$body.css('max-height', $(window).height() / 2);
         }
 
         // fix width
-        if (this.options.width){
+        if (this.options.width) {
             this.$dialog.css('width', this.options.width);
         }
 
@@ -180,7 +180,7 @@ var View = Backbone.View.extend({
                             '<div class="modal-header">' +
                                 '<button type="button" class="close" style="display: none;">&times;</button>' +
                                 '<h4 class="title">' + title + '</h4>' +
-                                '</div>' +
+                            '</div>' +
                             '<div class="modal-body" style="position: static;"></div>' +
                             '<div class="modal-footer">' +
                                 '<div class="buttons" style="float: right;"></div>' +

client/galaxy/scripts/mvc/upload/upload-view-default.js

@@ -75,7 +75,7 @@ return Backbone.View.extend({
         this.btnClose    = new Ui.Button({ title: 'Close',               onclick: function() { self.app.modal.hide(); } });
 
         // append buttons to dom
-        var buttons = [this.btnLocal, this.btnFtp, this.btnCreate, this.btnStart, this.btnStop, this.btnReset, this.btnClose];
+        var buttons = [ this.btnLocal, this.btnFtp, this.btnCreate, this.btnStart, this.btnStop, this.btnReset, this.btnClose ];
         for (var i in buttons) {
             this.$('#upload-buttons').prepend(buttons[i].$el);
         }
@@ -83,8 +83,8 @@ return Backbone.View.extend({
         // file upload
         var self = this;
         this.uploadbox = this.$('#upload-box').uploadbox({
-            announce        : function(index, file, message) { self._eventAnnounce(index, file, message) },
             initialize      : function(index, file, message) { return self._eventInitialize(index, file, message) },
+            announce        : function(index, file, message) { self._eventAnnounce(index, file, message) },
             progress        : function(index, file, message) { self._eventProgress(index, file, message) },
             success         : function(index, file, message) { self._eventSuccess(index, file, message) },
             error           : function(index, file, message) { self._eventError(index, file, message) },
@@ -109,7 +109,7 @@ return Backbone.View.extend({
         });
 
         // handle extension info popover
-        self.$('#footer-extension-info').on('click' , function(e) {
+        self.$('#footer-extension-info').on('click', function(e) {
             self.showExtensionInfo({
                 $el         : $(e.target),
                 title       : self.select_extension.text(),

client/galaxy/scripts/mvc/upload/upload-view.js

@@ -16,7 +16,7 @@ return Backbone.View.extend({
         ftp_upload_site     : 'n/a',
         default_genome      : '?',
         default_extension   : 'auto',
-        height              : 400,
+        height              : 480,
         width               : 900,
         auto                : {
             id          : 'auto',

client/galaxy/style/less/upload.less

@@ -54,7 +54,7 @@
 
 .upload-box {
     width           : 100%;
-    height          : 90%;
+    height          : 300px;
     text-align      : center;
     overflow        : scroll;
     font-size       : @font-size-base;
@@ -228,6 +228,13 @@
     }
 }
 
+.upload-buttons {
+    padding-top: 20px;
+    button {
+        margin-left: 5px;
+    }
+}
+
 .upload-footer {
     height:5%;
     text-align:left;

static/scripts/mvc/upload/upload-view.js

@@ -1,2 +1,2 @@
-define(["utils/utils","mvc/ui/ui-modal","mvc/ui/ui-tabs","mvc/upload/upload-button","mvc/upload/upload-view-default"],function(a,b,c,d,e){return Backbone.View.extend({options:{nginx_upload_path:"",ftp_upload_site:"n/a",default_genome:"?",default_extension:"auto",height:400,width:900,auto:{id:"auto",text:"Auto-detect",description:"This system will try to detect the file type automatically. If your file is not detected properly as one of the known formats, it most likely means that it has some format problems (e.g., different number of columns on different rows). You can still coerce the system to set your data to the format you think it should be.  You can also upload compressed files, which will automatically be decompressed."}},modal:null,ui_button:null,current_history:null,list_extensions:[],list_genomes:[],initialize:function(b){var c=this;this.options=a.merge(b,this.options),this.ui_button=new d.Model,this.ui_button_view=new d.View({model:this.ui_button,onclick:function(a){a.preventDefault(),c.show()},onunload:function(){}}),$(".with-upload-button").append(this.ui_button_view.$el);var c=this;a.get({url:galaxy_config.root+"api/datatypes?extension_only=False",success:function(a){for(key in a)c.list_extensions.push({id:a[key].extension,text:a[key].extension,description:a[key].description,description_url:a[key].description_url});c.list_extensions.sort(function(a,b){return a.text>b.text?1:a.text<b.text?-1:0}),c.options.datatypes_disable_auto||c.list_extensions.unshift(c.options.auto)}}),a.get({url:galaxy_config.root+"api/genomes",success:function(a){for(key in a)c.list_genomes.push({id:a[key][1],text:a[key][0]});c.list_genomes.sort(function(a,b){return a.id==c.options.default_genome?-1:b.id==c.options.default_genome?1:a.text>b.text?1:a.text<b.text?-1:0})}})},show:function(){var a=this;return Galaxy.currHistoryPanel&&Galaxy.currHistoryPanel.model?(this.refresh(),this.modal||(this.tabs=new c.View,this.default_view=new e(this),this.tabs.add({id:"default",title:"Default",$el:this.default_view.$el}),this.modal=new b.View({title:"Download data directly from web or upload files from your disk",body:this.tabs.$el,height:this.options.height,width:this.options.width,closing_events:!0})),void this.modal.show()):void window.setTimeout(function(){a.show()},500)},refresh:function(){this.current_user=Galaxy.currUser.get("id"),this.current_history=null,this.current_user&&(this.current_history=Galaxy.currHistoryPanel.model.get("id"))}})});
+define(["utils/utils","mvc/ui/ui-modal","mvc/ui/ui-tabs","mvc/upload/upload-button","mvc/upload/upload-view-default"],function(a,b,c,d,e){return Backbone.View.extend({options:{nginx_upload_path:"",ftp_upload_site:"n/a",default_genome:"?",default_extension:"auto",height:480,width:900,auto:{id:"auto",text:"Auto-detect",description:"This system will try to detect the file type automatically. If your file is not detected properly as one of the known formats, it most likely means that it has some format problems (e.g., different number of columns on different rows). You can still coerce the system to set your data to the format you think it should be.  You can also upload compressed files, which will automatically be decompressed."}},modal:null,ui_button:null,current_history:null,list_extensions:[],list_genomes:[],initialize:function(b){var c=this;this.options=a.merge(b,this.options),this.ui_button=new d.Model,this.ui_button_view=new d.View({model:this.ui_button,onclick:function(a){a.preventDefault(),c.show()},onunload:function(){}}),$(".with-upload-button").append(this.ui_button_view.$el);var c=this;a.get({url:galaxy_config.root+"api/datatypes?extension_only=False",success:function(a){for(key in a)c.list_extensions.push({id:a[key].extension,text:a[key].extension,description:a[key].description,description_url:a[key].description_url});c.list_extensions.sort(function(a,b){return a.text>b.text?1:a.text<b.text?-1:0}),c.options.datatypes_disable_auto||c.list_extensions.unshift(c.options.auto)}}),a.get({url:galaxy_config.root+"api/genomes",success:function(a){for(key in a)c.list_genomes.push({id:a[key][1],text:a[key][0]});c.list_genomes.sort(function(a,b){return a.id==c.options.default_genome?-1:b.id==c.options.default_genome?1:a.text>b.text?1:a.text<b.text?-1:0})}})},show:function(){var a=this;return Galaxy.currHistoryPanel&&Galaxy.currHistoryPanel.model?(this.refresh(),this.modal||(this.tabs=new c.View,this.default_view=new e(this),this.tabs.add({id:"default",title:"Default",$el:this.default_view.$el}),this.modal=new b.View({title:"Download data directly from web or upload files from your disk",body:this.tabs.$el,height:this.options.height,width:this.options.width,closing_events:!0})),void this.modal.show()):void window.setTimeout(function(){a.show()},500)},refresh:function(){this.current_user=Galaxy.currUser.get("id"),this.current_history=null,this.current_user&&(this.current_history=Galaxy.currHistoryPanel.model.get("id"))}})});
 //# sourceMappingURL=../../../maps/mvc/upload/upload-view.js.map

static/style/blue/base.css

@@ -1384,7 +1384,7 @@ html[dir="rtl"] .select2-container-multi .select2-search-choice-close{left:auto;
 .upload-button .label{position:absolute;top:2px;width:inherit;text-align:center;line-height:19px;font-size:1.2em}
 .upload-icon{font-size:1.2em;width:1.2em}
 .upload-icon-button{font-size:1.2em;width:1.2em;cursor:pointer}
-.upload-box{width:100%;height:90%;text-align:center;overflow:scroll;font-size:12px;line-height:1.33;-moz-border-radius:5px;border-radius:5px;border:1px dashed #bfbfbf;padding:10px;overflow-x:hidden;-ms-overflow-style:none}.upload-box .table{width:100%}
+.upload-box{width:100%;height:300px;text-align:center;overflow:scroll;font-size:12px;line-height:1.33;-moz-border-radius:5px;border-radius:5px;border:1px dashed #bfbfbf;padding:10px;overflow-x:hidden;-ms-overflow-style:none}.upload-box .table{width:100%}
 .upload-box .table th{text-align:center;white-space:nowrap}
 .upload-box .table td{margin:0px}
 .upload-box .upload-item .select2-arrow b{background-position:0 -3px}
@@ -1406,6 +1406,7 @@ html[dir="rtl"] .select2-container-multi .select2-search-choice-close{left:auto;
 .upload-ftp .upload-ftp-row{cursor:pointer}.upload-ftp .upload-ftp-row .label{width:240px}.upload-ftp .upload-ftp-row .label p{width:inherit;word-wrap:break-word}
 .upload-ftp .upload-ftp-row .nonlabel{white-space:nowrap}
 .upload-settings .upload-settings-cover{position:absolute;width:100%;height:100%;top:0px;left:0px;background:#fff;opacity:0.4;cursor:no-drop}
+.upload-buttons{padding-top:20px}.upload-buttons button{margin-left:5px}
 .upload-footer{height:5%;text-align:left;max-height:20px;line-height:18px;margin-top:10px}.upload-footer .footer-title{font-weight:bold;padding-left:60px;padding-right:20px}
 .upload-footer .footer-selection{width:200px;min-width:200px;font-size:11px;padding-right:10px}
 .upload-footer .select2-choice{max-height:20px;line-height:18px;background:transparent;text-align:center;font-weight:normal}.upload-footer .select2-choice .select2-arrow b{background-position:0 -3px}