1 new commit in galaxy-central: https://bitbucket.org/galaxy/galaxy-central/commits/5d5729d40b4f/ Changeset: 5d5729d40b4f User: guerler Date: 2013-10-08 18:12:48 Summary: Update modal and upload Affected #: 2 files diff -r 125a7cafb851d9b70195466389acf08dd9b98fd6 -r 5d5729d40b4f394dc6884d22daa39e3696842b80 static/scripts/galaxy.modal.js --- a/static/scripts/galaxy.modal.js +++ b/static/scripts/galaxy.modal.js @@ -12,9 +12,10 @@ elMain: '#everything', // defaults inputs - optionsDefaults: { - title : "galaxy-modal", - body : "No content available." + optionsDefault: { + title : "galaxy-modal", + body : "", + backdrop : true }, // initialize @@ -30,8 +31,16 @@ this.initialize(options); // fix height - var body = (this.$el).find('.modal-body'); - body.css('max-height', $(document).height() / 2); + this.$body.css('max-height', $(document).height() / 2); + + // set max-height so that modal does not exceed window size and is in middle of page. + /*/ TODO: this could perhaps be handled better using CSS. + this.$body.css( "max-height", + $(window).height() - + this.$footer.outerHeight() - + this.$header.outerHeight() - + parseInt( this.$dialog.css( "padding-top" ), 10 ) - + parseInt( this.$dialog.css( "padding-bottom" ), 10 ));*/ // show if (this.visible) @@ -39,7 +48,7 @@ else this.$el.fadeIn('fast'); - // set visibility flag + // set flag this.visible = true; }, @@ -47,8 +56,8 @@ hide: function(){ // fade out this.$el.fadeOut('fast'); - - // set visibility flag + + // set flag this.visible = false; }, @@ -56,11 +65,11 @@ create: function(options) { // configure options options = _.defaults(options, this.optionsDefault); - + // check for progress bar request if (options.body == 'progress') - options.body = '<div class="progress progress-striped active"><div class="progress-bar progress-bar-info" style="width:100%"></div></div>'; - + options.body = $('<div class="progress progress-striped active"><div class="progress-bar progress-bar-info" style="width:100%"></div></div>'); + // remove former element if (this.$el) this.$el.remove(); @@ -69,45 +78,54 @@ this.setElement(this.template(options.title)); // link elements - var body = (this.$el).find('.modal-body'); - var footer = (this.$el).find('.modal-footer'); - var buttons = (this.$el).find('.buttons'); + this.$body = (this.$el).find('.modal-body'); + this.$footer = (this.$el).find('.modal-footer'); + this.$buttons = (this.$el).find('.buttons'); + this.$backdrop = (this.$el).find('.modal-backdrop'); // append body - body.append($(options.body)); - + this.$body.html(options.body); + // fix height if available if (options.height) - body.css('height', options.height); + this.$body.css('height', options.height); + // fix min-width so that modal cannot shrink considerably if new content is loaded. + this.$body.css('min-width', this.$body.width()); + + // configure background + if (!options.backdrop) + this.$backdrop.removeClass('in'); + // append buttons if (options.buttons) { // link functions + var self = this; $.each(options.buttons, function(name, value) { - buttons.append($('<button id="' + String(name).toLowerCase() + '"></button>').text(name).click(value)).append(" "); + self.$buttons.append($('<button id="' + String(name).toLowerCase() + '"></button>').text(name).click(value)).append(" "); }); } else // hide footer - footer.hide(); + this.$footer.hide(); // append to main element $(this.elMain).append($(this.el)); }, // enable buttons - enable: function(name) { - $(this.el).find('#' + String(name).toLowerCase()).prop('disabled', false); + enableButton: function(name) { + this.$buttons.find('#' + String(name).toLowerCase()).prop('disabled', false); }, // disable buttons - disable: function(name) { - $(this.el).find('#' + String(name).toLowerCase()).prop('disabled', true); + disableButton: function(name) { + this.$buttons.find('#' + String(name).toLowerCase()).prop('disabled', true); }, // returns scroll top for body element scrollTop: function() { - return $(this.el).find('.modal-body').scrollTop(); + return this.$body.scrollTop(); }, /* @@ -116,12 +134,13 @@ // fill regular modal template template: function(title) { - return '<div class="modal in">' + - '<div class="modal-backdrop in" style="z-index: -1;"></div>' + + return '<div class="modal">' + + '<div class="modal-backdrop fade in" style="z-index: -1;"></div>' + '<div class="modal-dialog">' + '<div class="modal-content">' + '<div class="modal-header">' + - '<span><h3 class="title">' + title + '</h3></span>' + + '<button type="button" class="close" style="display: none;">×</button>' + + '<h4 class="title">' + title + '</h4>' + '</div>' + '<div class="modal-body"></div>' + '<div class="modal-footer">' + diff -r 125a7cafb851d9b70195466389acf08dd9b98fd6 -r 5d5729d40b4f394dc6884d22daa39e3696842b80 static/scripts/galaxy.upload.js --- a/static/scripts/galaxy.upload.js +++ b/static/scripts/galaxy.upload.js @@ -426,21 +426,21 @@ // update reset button if (this.counter.running == 0 && this.counter.announce + this.counter.success + this.counter.error > 0) - this.modal.enable('Reset'); + this.modal.enableButton('Reset'); else - this.modal.disable('Reset'); + this.modal.disableButton('Reset'); // update upload button if (this.counter.running == 0 && this.counter.announce > 0) - this.modal.enable('Upload'); + this.modal.enableButton('Upload'); else - this.modal.disable('Upload'); + this.modal.disableButton('Upload'); // select upload button if (this.counter.running == 0) - this.modal.enable('Select'); + this.modal.enableButton('Select'); else - this.modal.disable('Select'); + this.modal.disableButton('Select'); }, // load html template 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.