opensource/galaxy
3
0
Fork 0
mirror of https://github.com/galaxyproject/galaxy.git synced 2026-09-24 16:30:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

tooltips: Replace all uses of tipsy with bootstrap style (with the same modifications for placement we previously used for tipsy). This will allow us to start using popovers

Browse Source
This commit is contained in:
James Taylor
2012-07-20 16:28:23 -04:00
parent 96f6ea514b
commit 3118446f4e
21 changed files with 436 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/june_2007_style/blue/base.css
+11
View File
@@ -453,6 +453,17 @@ input[type="checkbox"],input[type="radio"]{margin-left:0.5ex;margin-right:0.5ex;
.nav-tabs{border-bottom:1px solid #999999;}
.nav-tabs>li>a:hover{border-color:#eeeeee #eeeeee #999999;}
.nav-tabs>.active>a,.nav-tabs>.active>a:hover{border:1px solid #999999;border-bottom-color:transparent;}
.bs-tooltip{position:absolute;z-index:1020;display:block;visibility:visible;padding:5px;font-size:11px;opacity:0;filter:alpha(opacity=0);}.bs-tooltip.in{opacity:0.8;filter:alpha(opacity=80);}
.bs-tooltip.top{margin-top:-2px;}
.bs-tooltip.right{margin-left:2px;}
.bs-tooltip.bottom{margin-top:2px;}
.bs-tooltip.left{margin-left:-2px;}
.bs-tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid #000000;}
.bs-tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:5px solid #000000;}
.bs-tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #000000;}
.bs-tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:5px solid #000000;}
.bs-tooltip .tooltip-inner{max-width:200px;padding:3px 8px;color:#ffffff;text-align:center;text-decoration:none;background-color:#000000;}
.bs-tooltip .tooltip-arrow{position:absolute;width:0;height:0;}
@font-face{font-family:'FontAwesome';src:url('../images/fonts/fontawesome-webfont.eot');src:url('../images/fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),url('../images/fonts/fontawesome-webfont.woff') format('woff'),url('../images/fonts/fontawesome-webfont.ttf') format('truetype'),url('../images/fonts/fontawesome-webfont.svgz#FontAwesomeRegular') format('svg'),url('../images/fonts/fontawesome-webfont.svg#FontAwesomeRegular') format('svg');font-weight:normal;font-style:normal;}.ficon,[class^="ficon"]:before,[class*=" ficon"]:before{font-family:FontAwesome;font-weight:normal;font-style:normal;display:inline-block;}
.ficon.large:before{font-size:1.3333333333333333em;}
.btn [class^="ficon"],.btn [class*=" ficon"]{line-height:.9em;}
static/june_2007_style/galaxy_bootstrap.less
+36 -1
View File
@@ -57,7 +57,7 @@
// Components: Popovers
@import "bootstrap/modals.less";
// @import "bootstrap/tooltip.less";
//@import "bootstrap/tooltip.less";
@import "bootstrap/popovers.less";
// Components: Misc
@@ -113,3 +113,38 @@ input[type="checkbox"],input[type="radio"] {
border: 1px solid @btnBorder;
border-bottom-color: transparent;
}
// Tooltips -- we use the class tooltip to indicate that an element has a tooltip, so we need to define these differently
.bs-tooltip {
position: absolute;
z-index: @zindexTooltip;
display: block;
visibility: visible;
padding: 5px;
font-size: 11px;
.opacity(0);
&.in { .opacity(80); }
&.top { margin-top: -2px; }
&.right { margin-left: 2px; }
&.bottom { margin-top: 2px; }
&.left { margin-left: -2px; }
&.top .tooltip-arrow { #popoverArrow > .top(); }
&.left .tooltip-arrow { #popoverArrow > .left(); }
&.bottom .tooltip-arrow { #popoverArrow > .bottom(); }
&.right .tooltip-arrow { #popoverArrow > .right(); }
.tooltip-inner {
max-width: 200px;
padding: 3px 8px;
color: @white;
text-align: center;
text-decoration: none;
background-color: @black;
//.border-radius(4px);
}
.tooltip-arrow {
position: absolute;
width: 0;
height: 0;
}
}
static/scripts/bootstrap.js
Vendored
+322
View File
@@ -132,4 +132,326 @@
})
})
}(window.jQuery);
/* ===========================================================
* bootstrap-tooltip.js v2.0.4
* http://twitter.github.com/bootstrap/javascript.html#tooltips
* Inspired by the original jQuery.tipsy by Jason Frame
* ===========================================================
* Copyright 2012 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ========================================================== */
!function ($) {
"use strict"; // jshint ;_;
/* TOOLTIP PUBLIC CLASS DEFINITION
* =============================== */
var Tooltip = function (element, options) {
this.init('tooltip', element, options)
}
Tooltip.prototype = {
constructor: Tooltip
, init: function (type, element, options) {
var eventIn
, eventOut
this.type = type
this.$element = $(element)
this.options = this.getOptions(options)
this.enabled = true
if (this.options.trigger != 'manual') {
eventIn = this.options.trigger == 'hover' ? 'mouseenter' : 'focus'
eventOut = this.options.trigger == 'hover' ? 'mouseleave' : 'blur'
this.$element.on(eventIn, this.options.selector, $.proxy(this.enter, this))
this.$element.on(eventOut, this.options.selector, $.proxy(this.leave, this))
}
this.options.selector ?
(this._options = $.extend({}, this.options, { trigger: 'manual', selector: '' })) :
this.fixTitle()
}
, getOptions: function (options) {
options = $.extend({}, $.fn[this.type].defaults, options, this.$element.data())
if (options.delay && typeof options.delay == 'number') {
options.delay = {
show: options.delay
, hide: options.delay
}
}
return options
}
, enter: function (e) {
var self = $(e.currentTarget)[this.type](this._options).data(this.type)
if (!self.options.delay || !self.options.delay.show) return self.show()
clearTimeout(this.timeout)
self.hoverState = 'in'
this.timeout = setTimeout(function() {
if (self.hoverState == 'in') self.show()
}, self.options.delay.show)
}
, leave: function (e) {
var self = $(e.currentTarget)[this.type](this._options).data(this.type)
if (this.timeout) clearTimeout(this.timeout)
if (!self.options.delay || !self.options.delay.hide) return self.hide()
self.hoverState = 'out'
this.timeout = setTimeout(function() {
if (self.hoverState == 'out') self.hide()
}, self.options.delay.hide)
}
, show: function () {
var $tip
, inside
, pos
, actualWidth
, actualHeight
, placement
, tp
if (this.hasContent() && this.enabled) {
$tip = this.tip()
this.setContent()
if (this.options.animation) {
$tip.addClass('fade')
}
placement = typeof this.options.placement == 'function' ?
this.options.placement.call(this, $tip[0], this.$element[0]) :
this.options.placement
inside = /in/.test(placement)
$tip
.remove()
.css({ top: 0, left: 0, display: 'block' })
.appendTo(inside ? this.$element : document.body)
pos = this.getPosition(inside)
actualWidth = $tip[0].offsetWidth
actualHeight = $tip[0].offsetHeight
switch (inside ? placement.split(' ')[1] : placement) {
case 'bottom':
tp = {top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2}
break
case 'top':
tp = {top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2}
break
case 'left':
tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth}
break
case 'right':
tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width}
break
}
// BEGIN GALAXY MODIFICATION
// Shift if off screen
var $w = $(window),
p = inside ? placement.split(' ')[1] : placement;
// If off the top of the screen, flip
if ( tp.top < $w.scrollTop() && placement == 'top' ) {
tp.top = pos.top + pos.height;
placement = inside ? 'inside bottom' : 'bottom';
}
// If off bottom, just shift for now
tp.top = Math.min( tp.top, $w.scrollTop() + $w.height() - $tip.outerHeight() );
// Shift left or right
var leftShift = 0;
if ( tp.left < $w.scrollLeft() ) {
leftShift = tp.left - $w.scrollLeft();
}
var t = $w.scrollLeft() + $w.width() - $tip.outerWidth();
if ( tp.left > t ) {
leftShift = tp.left - t;
}
tp.left -= leftShift;
// Shift background to center over element (not implemented for east/west)
switch (inside ? placement.split(' ')[1] : placement) {
case 'bottom':
$tip.find('.tooltip-arrow').css( 'left', ( $tip.outerWidth() / 2 ) + leftShift + "px" );
break;
case 'top':
$tip.find('.tooltip-arrow').css( 'left', ( $tip.outerWidth() / 2 ) + leftShift + "px" );
break;
case 'left':
break;
case 'right':
break;
}
// END GALAXY MODIFICATION
$tip
.css(tp)
.addClass(placement)
.addClass('in')
}
}
, isHTML: function(text) {
// html string detection logic adapted from jQuery
return typeof text != 'string'
|| ( text.charAt(0) === "<"
&& text.charAt( text.length - 1 ) === ">"
&& text.length >= 3
) || /^(?:[^<]*<[\w\W]+>[^>]*$)/.exec(text)
}
, setContent: function () {
var $tip = this.tip()
, title = this.getTitle()
$tip.find('.tooltip-inner')[this.isHTML(title) ? 'html' : 'text'](title)
$tip.removeClass('fade in top bottom left right')
}
, hide: function () {
var that = this
, $tip = this.tip()
$tip.removeClass('in')
function removeWithAnimation() {
var timeout = setTimeout(function () {
$tip.off($.support.transition.end).remove()
}, 500)
$tip.one($.support.transition.end, function () {
clearTimeout(timeout)
$tip.remove()
})
}
$.support.transition && this.$tip.hasClass('fade') ?
removeWithAnimation() :
$tip.remove()
}
, fixTitle: function () {
var $e = this.$element
if ($e.attr('title') || typeof($e.attr('data-original-title')) != 'string') {
$e.attr('data-original-title', $e.attr('title') || '').removeAttr('title')
}
}
, hasContent: function () {
return this.getTitle()
}
, getPosition: function (inside) {
return $.extend({}, (inside ? {top: 0, left: 0} : this.$element.offset()), {
width: this.$element[0].offsetWidth
, height: this.$element[0].offsetHeight
})
}
, getTitle: function () {
var title
, $e = this.$element
, o = this.options
title = $e.attr('data-original-title')
|| (typeof o.title == 'function' ? o.title.call($e[0]) : o.title)
return title
}
, tip: function () {
return this.$tip = this.$tip || $(this.options.template)
}
, validate: function () {
if (!this.$element[0].parentNode) {
this.hide()
this.$element = null
this.options = null
}
}
, enable: function () {
this.enabled = true
}
, disable: function () {
this.enabled = false
}
, toggleEnabled: function () {
this.enabled = !this.enabled
}
, toggle: function () {
this[this.tip().hasClass('in') ? 'hide' : 'show']()
}
}
/* TOOLTIP PLUGIN DEFINITION
* ========================= */
$.fn.tooltip = function ( option ) {
return this.each(function () {
var $this = $(this)
, data = $this.data('tooltip')
, options = typeof option == 'object' && option
if (!data) $this.data('tooltip', (data = new Tooltip(this, options)))
if (typeof option == 'string') data[option]()
})
}
$.fn.tooltip.Constructor = Tooltip
$.fn.tooltip.defaults = {
animation: false
, placement: 'top'
, selector: false
, template: '<div class="bs-tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
, trigger: 'hover'
, title: ''
, delay: 0
}
}(window.jQuery);
static/scripts/galaxy.base.js
+8 -5
View File
@@ -417,7 +417,7 @@ $.fn.make_text_editable = function(config_dict) {
// Add help text if there some.
if (help_text) {
container.attr("title", help_text).tipsy( { gravity: 's' } );
container.attr("title", help_text).tooltip();
}
return container;
@@ -704,10 +704,13 @@ $(document).ready( function() {
return confirm( $(this).attr("confirm") );
});
// Tooltips
if ( $.fn.tipsy ) {
// FIXME: tipsy gravity cannot be updated, so need classes that specify N/S gravity and
// initialize each separately.
$(".tooltip").tipsy( { gravity: 's' } );
// if ( $.fn.tipsy ) {
// // FIXME: tipsy gravity cannot be updated, so need classes that specify N/S gravity and
// // initialize each separately.
// $(".tooltip").tipsy( { gravity: 's' } );
// }
if ( $.fn.tooltip ) {
$(".tooltip").tooltip( { placement: 'top' } );
}
// Make popup menus.
make_popup_menus();
static/scripts/galaxy.workflow_editor.canvas.js
+1 -1
View File
@@ -346,7 +346,7 @@ $.extend( Node.prototype, {
workflow.has_changes = true;
canvas_manager.draw_overview();
})))
.tipsy({delayIn:500, fallback: "Flag this as a workflow output. All non-flagged outputs will be hidden." });
.tooltip({delay:500, title: "Flag this as a workflow output. All non-flagged outputs will be hidden." });
callout.css({
top: '50%',
margin:'-8px 0px 0px 0px',
static/scripts/mvc/ui.js
+3 -3
View File
@@ -43,7 +43,7 @@ var IconButton = Backbone.Model.extend({
title: "",
icon_class: "",
on_click: null,
tipsy_config: {}
tooltip_config: {}
}
});
@@ -73,8 +73,8 @@ var IconButtonMenuView = Backbone.View.extend({
.appendTo(self.$el)
.click(button.attributes.on_click);
if (button.attributes.tipsy_config) {
elt.tipsy(button.attributes.tipsy_config);
if (button.attributes.tooltip_config) {
elt.tooltip(button.attributes.tooltip_config);
}
});
return this;
static/scripts/packed/bootstrap.js
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
static/scripts/packed/galaxy.base.js
+1 -1
View File
File diff suppressed because one or more lines are too long
static/scripts/packed/galaxy.workflow_editor.canvas.js
+1 -1
View File
File diff suppressed because one or more lines are too long
static/scripts/packed/mvc/ui.js
+1 -1
View File
@@ -1 +1 @@
var create_icon_buttons_menu=function(b,a){if(!a){a={}}var c=new IconButtonCollection(_.map(b,function(d){return new IconButton(_.extend(d,a))}));return new IconButtonMenuView({collection:c})};var GalaxyPaths=Backbone.Model.extend({defaults:{root_path:"",image_path:""}});var IconButton=Backbone.Model.extend({defaults:{title:"",icon_class:"",on_click:null,tipsy_config:{}}});var IconButtonCollection=Backbone.Collection.extend({model:IconButton});var IconButtonMenuView=Backbone.View.extend({tagName:"div",initialize:function(){this.render()},render:function(){var a=this;this.collection.each(function(c){var b=$("<a/>").attr("href","javascript:void(0)").attr("title",c.attributes.title).addClass("icon-button menu-button").addClass(c.attributes.icon_class).appendTo(a.$el).click(c.attributes.on_click);if(c.attributes.tipsy_config){b.tipsy(c.attributes.tipsy_config)}});return this}});var Grid=Backbone.Collection.extend({});var GridView=Backbone.View.extend({});
var create_icon_buttons_menu=function(b,a){if(!a){a={}}var c=new IconButtonCollection(_.map(b,function(d){return new IconButton(_.extend(d,a))}));return new IconButtonMenuView({collection:c})};var GalaxyPaths=Backbone.Model.extend({defaults:{root_path:"",image_path:""}});var IconButton=Backbone.Model.extend({defaults:{title:"",icon_class:"",on_click:null,tooltip_config:{}}});var IconButtonCollection=Backbone.Collection.extend({model:IconButton});var IconButtonMenuView=Backbone.View.extend({tagName:"div",initialize:function(){this.render()},render:function(){var a=this;this.collection.each(function(c){var b=$("<a/>").attr("href","javascript:void(0)").attr("title",c.attributes.title).addClass("icon-button menu-button").addClass(c.attributes.icon_class).appendTo(a.$el).click(c.attributes.on_click);if(c.attributes.tooltip_config){b.tooltip(c.attributes.tooltip_config)}});return this}});var Grid=Backbone.Collection.extend({});var GridView=Backbone.View.extend({});
static/scripts/packed/viz/paramamonster.js
+1 -1
View File
File diff suppressed because one or more lines are too long
static/scripts/packed/viz/trackster.js
+1 -1
View File
File diff suppressed because one or more lines are too long
static/scripts/viz/paramamonster.js
+6 -8
View File
@@ -405,15 +405,14 @@ var ParamaMonsterTrackView = Backbone.View.extend({
icon_class: 'gear track-settings',
on_click: function() {
settings_div.toggle();
},
tipsy_config: { gravity: 's' }
}
},
{
title: 'Remove',
icon_class: 'cross-circle',
on_click: function() {
self.$el.remove();
$('.tipsy').remove();
$('.tooltip').remove();
// TODO: remove track from viz collection.
}
}
@@ -538,7 +537,7 @@ var ToolInputValOrSweepView = Backbone.View.extend({
}
],
{
tipsy_config: {gravity: 's'}
});
this.$el.prepend(menu.$el);
@@ -743,10 +742,9 @@ var ParamaMonsterVisualizationView = Backbone.View.extend({
title: 'Close',
icon_class: 'cross-circle',
on_click: function() {
$('.tipsy').remove();
$('.tooltip').remove();
help_div.remove();
},
tipsy_config: { gravity: 's' }
}
}
]);
@@ -797,7 +795,7 @@ var ParamaMonsterVisualizationView = Backbone.View.extend({
}
],
{
tipsy_config: {gravity: 'n'}
tooltip_config: {placement: 'bottom'}
});
// Create mode selection popup. Mode selection changes default mode and mode for all tracks.
static/scripts/viz/trackster.js
+26 -26
View File
@@ -166,7 +166,7 @@ var get_random_color = function(colors) {
*/
var create_action_icon = function(title, css_class, on_click_fn) {
return $("<a/>").attr("href", "javascript:void(0);").attr("title", title)
.addClass("icon-button").addClass(css_class).tipsy( {gravity: 's'} )
.addClass("icon-button").addClass(css_class).tooltip()
.click(on_click_fn);
};
@@ -485,7 +485,7 @@ Drawable.prototype.action_icons_def = [
css_class: "remove-icon",
on_click_fn: function(drawable) {
// Tipsy for remove icon must be deleted when drawable is deleted.
$(".tipsy").remove();
$(".bs-tooltip").remove();
drawable.remove();
}
}
@@ -555,7 +555,7 @@ extend(Drawable.prototype, {
add_action_icon: function(name, title, css_class, on_click_fn, prepend, hide) {
var drawable = this;
this.action_icons[name] = $("<a/>").attr("href", "javascript:void(0);").attr("title", title)
.addClass("icon-button").addClass(css_class).tipsy( {gravity: 's'} )
.addClass("icon-button").addClass(css_class).tooltip()
.click( function() { on_click_fn(drawable); } )
.appendTo(this.icons_div);
if (hide) {
@@ -760,7 +760,7 @@ extend(DrawableGroup.prototype, Drawable.prototype, DrawableCollection.prototype
title: "Show composite track",
css_class: "layers-stack",
on_click_fn: function(group) {
$(".tipsy").remove();
$(".bs-tooltip").remove();
group.show_composite_track();
}
},
@@ -855,7 +855,7 @@ extend(DrawableGroup.prototype, Drawable.prototype, DrawableCollection.prototype
}
else {
this.action_icons.composite_icon.hide();
$(".tipsy").remove();
$(".bs-tooltip").remove();
}
//
@@ -1083,7 +1083,7 @@ extend( View.prototype, DrawableCollection.prototype, {
}
};
this.nav_input = $("<input/>").addClass("nav-input").hide().bind("keyup focusout", submit_nav).appendTo(this.nav_controls);
this.location_span = $("<span/>").addClass("location").attr('original-title', 'Click to change location').tipsy( { gravity: 'n' } ).appendTo(this.nav_controls);
this.location_span = $("<span/>").addClass("location").attr('original-title', 'Click to change location').tooltip( { placement: 'bottom' } ).appendTo(this.nav_controls);
this.location_span.click(function() {
view.location_span.hide();
view.chrom_select.hide();
@@ -1096,9 +1096,9 @@ extend( View.prototype, DrawableCollection.prototype, {
this.hidden_input = $("<input/>").attr("type", "hidden").val(this.vis_id).appendTo(this.nav_controls);
}
this.zo_link = $("<a/>").attr("id", "zoom-out").attr("title", "Zoom out").tipsy( {gravity: 'n'} )
this.zo_link = $("<a/>").attr("id", "zoom-out").attr("title", "Zoom out").tooltip( {placement: 'bottom'} )
.click(function() { view.zoom_out(); view.request_redraw(); }).appendTo(this.nav_controls);
this.zi_link = $("<a/>").attr("id", "zoom-in").attr("title", "Zoom in").tipsy( {gravity: 'n'} )
this.zi_link = $("<a/>").attr("id", "zoom-in").attr("title", "Zoom in").tooltip( {placement: 'bottom'} )
.click(function() { view.zoom_in(); view.request_redraw(); }).appendTo(this.nav_controls);
// Get initial set of chroms.
@@ -1642,7 +1642,7 @@ extend( View.prototype, DrawableCollection.prototype, {
/** Close and reset overview. */
reset_overview: function() {
// Update UI.
$(".tipsy").remove();
$(".bs-tooltip").remove();
this.overview_viewport.find(".track-tile").remove();
this.overview_viewport.height(this.default_overview_height);
this.overview_box.height(this.default_overview_height);
@@ -2631,10 +2631,10 @@ extend(DrawableConfig.prototype, {
input = $('<input />').attr("id", id ).attr("name", id ).val( value ).css("float", "left")
.appendTo(container_div).click(function(e) {
// Hide other pickers.
$(".tipsy").hide();
$(".bs-tooltip").removeClass( "in" );
// Show input's color picker.
var tip = $(this).siblings(".tipsy");
var tip = $(this).siblings(".bs-tooltip").addClass( "in" );
tip.css( {
// left: $(this).position().left + ( $(input).width() / 2 ) - 60,
// top: $(this).position().top + $(this.height)
@@ -2660,13 +2660,13 @@ extend(DrawableConfig.prototype, {
}),
// Icon for setting a new random color; behavior set below.
new_color_icon = $("<a href='javascript:void(0)'/>").addClass("icon-button arrow-circle").appendTo(container_div)
.attr("title", "Set new random color").tipsy({ gravity: 's' }),
.attr("title", "Set new random color").tooltip(),
// Color picker in tool tip style.
tip = $( "<div class='tipsy tipsy-west' style='position: absolute;' />" ).appendTo(container_div).hide(),
tip = $( "<div class='bs-tooltip right' style='position: absolute;' />" ).appendTo(container_div).hide(),
// Inner div for padding purposes
tip_inner = $("<div style='background-color: black; padding: 10px;'></div>").appendTo(tip),
farb_container = $("<div/>").appendTo(tip_inner),
farb_obj = $.farbtastic(farb_container, { width: 100, height: 100, callback: input, color: value });
tip_inner = $("<div class='tooltip-inner' style='text-align: inherit'></div>").appendTo(tip),
tip_arrow = $("<div class='tooltip-arrow'></div>").appendTo(tip),
farb_obj = $.farbtastic(tip_inner, { width: 100, height: 100, callback: input, color: value });
// Clear floating.
container_div.append( $("<div/>").css("clear", "both"));
@@ -2777,17 +2777,17 @@ var FeatureTrackTile = function(track, region, resolution, canvas, data, w_scale
num_features = data.length,
more_down_icon = $("<a href='javascript:void(0);'/>").addClass("icon more-down")
.attr("title", "For speed, only the first " + num_features + " features in this region were obtained from server. Click to get more data including depth")
.tipsy( {gravity: 's'} ).appendTo(message_div),
.tooltip().appendTo(message_div),
more_across_icon = $("<a href='javascript:void(0);'/>").addClass("icon more-across")
.attr("title", "For speed, only the first " + num_features + " features in this region were obtained from server. Click to get more data excluding depth")
.tipsy( {gravity: 's'} ).appendTo(message_div);
.tooltip().appendTo(message_div);
// Set up actions for icons.
more_down_icon.click(function() {
// Mark tile as stale, request more data, and redraw track.
tile.stale = true;
track.data_manager.get_more_data(tile_region, track.mode, tile.resolution, {}, track.data_manager.DEEP_DATA_REQ);
$(".tipsy").hide();
$(".bs-tooltip").hide();
track.request_draw(true);
}).dblclick(function(e) {
// Do not propogate as this would normally zoom in.
@@ -2798,7 +2798,7 @@ var FeatureTrackTile = function(track, region, resolution, canvas, data, w_scale
// Mark tile as stale, request more data, and redraw track.
tile.stale = true;
track.data_manager.get_more_data(tile_region, track.mode, tile.resolution, {}, track.data_manager.BROAD_DATA_REQ);
$(".tipsy").hide();
$(".bs-tooltip").hide();
track.request_draw(true);
}).dblclick(function(e) {
// Do not propogate as this would normally zoom in.
@@ -3025,7 +3025,7 @@ extend(Track.prototype, Drawable.prototype, {
track.revert_name();
}
// HACK: name change modifies icon placement, which leaves tooltip incorrectly placed.
$(".tipsy").remove();
$(".bs-tooltip").remove();
}
},
// Go to parameter exploration visualization.
@@ -3371,7 +3371,7 @@ extend(TiledTrack.prototype, Drawable.prototype, Track.prototype, {
title: "To minimize track height, not all feature rows are displayed. Click to display more rows.",
css_class: "exclamation",
on_click_fn: function(track) {
$(".tipsy").remove();
$(".bs-tooltip").remove();
// HACKish: is it always reasonble to use view to get w_scale/current resolution?
track.slotters[ track.view.resolution_px_b ].max_rows *= 2;
track.request_draw(true);
@@ -3902,7 +3902,7 @@ extend(CompositeTrack.prototype, TiledTrack.prototype, {
title: "Show individual tracks",
css_class: "layers-stack",
on_click_fn: function(track) {
$(".tipsy").remove();
$(".bs-tooltip").remove();
track.show_group();
}
}
@@ -4300,7 +4300,7 @@ extend(LineTrack.prototype, Drawable.prototype, TiledTrack.prototype, {
min_label = $("<div/>").text(round(track.prefs.min_value, 3)).make_text_editable({
num_cols: 6,
on_finish: function(new_val) {
$(".tipsy").remove();
$(".bs-tooltip").remove();
var new_val = parseFloat(new_val);
if (!isNaN(new_val)) {
track.set_min_value(new_val);
@@ -4312,7 +4312,7 @@ extend(LineTrack.prototype, Drawable.prototype, TiledTrack.prototype, {
max_label = $("<div/>").text(round(track.prefs.max_value, 3)).make_text_editable({
num_cols: 6,
on_finish: function(new_val) {
$(".tipsy").remove();
$(".bs-tooltip").remove();
var new_val = parseFloat(new_val);
if (!isNaN(new_val)) {
track.set_max_value(new_val);
@@ -4581,7 +4581,7 @@ extend(FeatureTrack.prototype, Drawable.prototype, TiledTrack.prototype, {
max_label = $("<div/>").text(max_val).make_text_editable({
num_cols: 12,
on_finish: function(new_val) {
$(".tipsy").remove();
$(".bs-tooltip").remove();
var new_val = parseFloat(new_val);
track.prefs.histogram_max = (!isNaN(new_val) ? new_val : null);
track.tile_cache.clear();
templates/base_panels.mako
+2 -2
View File
@@ -48,7 +48,7 @@
<!--[if lt IE 7]>
${h.js( 'IE7', 'ie7-recalc' )}
<![endif]-->
${h.js( 'jquery', 'libs/underscore', 'libs/backbone', 'libs/backbone-relational', 'libs/handlebars.runtime', 'mvc/ui' )}
${h.js( 'jquery', 'bootstrap', 'libs/underscore', 'libs/backbone', 'libs/backbone-relational', 'libs/handlebars.runtime', 'mvc/ui' )}
<script type="text/javascript">
// Set up needed paths.
var galaxy_paths = new GalaxyPaths({
@@ -69,7 +69,7 @@
<%def name="late_javascripts()">
## Scripts can be loaded later since they progressively add features to
## the panels, but do not change layout
${h.js( 'jquery.event.drag', 'jquery.event.hover', 'jquery.form', 'jquery.rating', 'galaxy.base', 'galaxy.panels', 'jquery.tipsy' )}
${h.js( 'jquery.event.drag', 'jquery.event.hover', 'jquery.form', 'jquery.rating', 'galaxy.base', 'galaxy.panels' )}
<script type="text/javascript">
ensure_dd_helper();
templates/display_base.mako
+1 -1
View File
@@ -32,7 +32,7 @@
<%def name="javascripts()">
${parent.javascripts()}
${h.js( "jquery", "jquery.tipsy", "galaxy.base", "json2", "jstorage", "jquery.autocomplete", "jquery.rating",
${h.js( "jquery", "bootstrap", "galaxy.base", "json2", "jstorage", "jquery.autocomplete", "jquery.rating",
"autocomplete_tagging", "viz/trackster", "viz/trackster_ui", "jquery.event.drag", "jquery.mousewheel",
"jquery.autocomplete", "jquery.ui.sortable.slider", "farbtastic", "mvc/data", "viz/visualization" )}
templates/root/history.mako
+4 -4
View File
@@ -17,7 +17,7 @@
<meta http-equiv="Pragma" content="no-cache">
${h.css( "base", "history", "autocomplete_tagging" )}
${h.js( "jquery", "jquery.tipsy", "galaxy.base", "json2", "jstorage", "jquery.autocomplete", "autocomplete_tagging" )}
${h.js( "jquery", "bootstrap", "galaxy.base", "json2", "jstorage", "jquery.autocomplete", "autocomplete_tagging" )}
<script type="text/javascript">
@@ -45,7 +45,7 @@ function tag_handling(parent_elt) {
error: function() { alert( "Tagging failed" ) },
success: function(tag_elt_html) {
tag_elt.html(tag_elt_html);
tag_elt.find(".tooltip").tipsy( { gravity: 's' } );
tag_elt.find(".tooltip").tooltip();
tag_area.slideDown("fast");
}
});
@@ -86,7 +86,7 @@ function annotation_handling(parent_elt) {
annotation = "<em>Describe or add notes to dataset</em>";
}
annotation_elt.html(annotation);
annotation_area.find(".tooltip").tipsy( { gravity: 's' } );
annotation_area.find(".tooltip").tooltop();
async_save_text(
annotation_elt.attr("id"), annotation_elt.attr("id"),
"${h.url_for( controller='/dataset', action='annotate_async')}?" + href_parms,
@@ -138,7 +138,7 @@ $(function() {
}
});
%endif
$(".tipsy").remove();
$(".tooltip").remove();
} else {
render_message( "Dataset deletion failed", "error" );
}
templates/tracks/browser.mako
+2 -2
View File
@@ -21,7 +21,7 @@ ${parent.javascripts()}
<script type='text/javascript' src="${h.url_for('/static/scripts/excanvas.js')}"></script>
<![endif]-->
${h.js( "galaxy.base", "galaxy.panels", "json2", "jquery", "jstorage", "jquery.event.drag", "jquery.event.hover","jquery.mousewheel", "jquery.autocomplete", "mvc/data", "viz/visualization", "viz/trackster", "viz/trackster_ui", "jquery.ui.sortable.slider", "farbtastic" )}
${h.js( "galaxy.base", "galaxy.panels", "json2", "jquery", "bootstrap", "jstorage", "jquery.event.drag", "jquery.event.hover","jquery.mousewheel", "jquery.autocomplete", "mvc/data", "viz/visualization", "viz/trackster", "viz/trackster_ui", "jquery.ui.sortable.slider", "farbtastic" )}
<script type="text/javascript">
//
@@ -171,7 +171,7 @@ ${h.js( "galaxy.base", "galaxy.panels", "json2", "jquery", "jstorage", "jquery.e
} }
],
{
tipsy_config: {gravity: 'n'}
tooltip_config: { placement: 'bottom' }
});
menu.$el.attr("style", "float: right");
templates/visualization/circster.mako
+5 -3
View File
@@ -55,12 +55,14 @@
{ icon_class: 'cross-circle', title: 'Close', on_click: function() {
window.location = "${h.url_for( controller='visualization', action='list' )}";
} }
]);
], {
tooltip_config: { placement: 'bottom' }
});
menu.$el.attr("style", "float: right");
$("#center .unified-panel-header-inner").append(menu.$el);
// Manual tipsy config because default gravity is S and cannot be changed.
$(".menu-button").tipsy( {gravity: 'n'} );
// Manual tooltip config because default gravity is S and cannot be changed.
$(".menu-button").tooltip( { placement: 'bottom' } );
// -- Viz set up. --
templates/workflow/editor.mako
+1 -1
View File
@@ -26,7 +26,7 @@
<![endif]-->
${h.js( "jquery",
"jquery.tipsy",
"bootstrap",
"jquery.event.drag",
"jquery.event.drop",
"jquery.event.hover",
templates/workflow/run.mako
+2 -2
View File
@@ -2,7 +2,7 @@
<%def name="javascripts()">
${parent.javascripts()}
${h.js( "jquery.autocomplete", "jquery.tipsy" )}
${h.js( "jquery.autocomplete", "bootstrap" )}
<script type="text/javascript">
$( function() {
function show_tool_body(title){
@@ -84,7 +84,7 @@
}).attr('original-title',
'Enable/disable selection of multiple input ' +
'files. Each selected file will have an ' +
'instance of the workflow.').tipsy({gravity:'s'})
'instance of the workflow.').tooltip({placement: 'bottom'})
);
var filter = $('<input type="text" class="multiinput-filter" ' +
'placeholder="type to filter">');