Skip to content
This repository has been archived by the owner on Jun 14, 2020. It is now read-only.

Commit

Permalink
Browse files Browse the repository at this point in the history
Modal overlay now darkens all tooltips except the one being shown
  • Loading branch information
Craga89 committed Apr 13, 2011
1 parent 402f199 commit 70b749f
Show file tree
Hide file tree
Showing 6 changed files with 81 additions and 75 deletions.
2 changes: 1 addition & 1 deletion dist/jquery.qtip.basic.js
Expand Up @@ -9,7 +9,7 @@
* http://en.wikipedia.org/wiki/MIT_License
* http://en.wikipedia.org/wiki/GNU_General_Public_License
*
* Date: Wed Apr 13 20:38:29 2011 +0100
* Date: Wed Apr 13 20:43:04 2011 +0100
*/

"use strict"; // Enable ECMAScript "strict" operation for this function. See more: http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/
Expand Down
2 changes: 1 addition & 1 deletion dist/jquery.qtip.css
Expand Up @@ -9,7 +9,7 @@
* http://en.wikipedia.org/wiki/MIT_License
* http://en.wikipedia.org/wiki/GNU_General_Public_License
*
* Date: Wed Apr 13 20:38:29 2011 +0100
* Date: Wed Apr 13 20:43:04 2011 +0100
*/

/* Fluid class for determining actual width in IE */
Expand Down
73 changes: 38 additions & 35 deletions dist/jquery.qtip.js
Expand Up @@ -9,7 +9,7 @@
* http://en.wikipedia.org/wiki/MIT_License
* http://en.wikipedia.org/wiki/GNU_General_Public_License
*
* Date: Wed Apr 13 20:38:29 2011 +0100
* Date: Wed Apr 13 20:43:04 2011 +0100
*/

"use strict"; // Enable ECMAScript "strict" operation for this function. See more: http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/
Expand Down Expand Up @@ -2585,10 +2585,9 @@ function Modal(api)
options = api.options.show.modal,
elems = api.elements,
tooltip = elems.tooltip,

selector = '#qtip-overlay',
namespace = '.qtipmodal',
events = 'tooltipshow'+namespace+' tooltiphide'+namespace;
overlay;

// Setup option set checks
api.checks.modal = {
Expand All @@ -2604,33 +2603,42 @@ function Modal(api)
$.extend(self, {
init: function()
{
if(options.on) {
// Apply our modal events (unbind the mfirst so we don't duplicate)
tooltip.unbind(namespace).bind(events, function(event, api, duration) {
var type = event.type.replace('tooltip', '');

if($.isFunction(options[type])) {
options[type].call(elems.overlay, duration, api);
}
else {
self[type](duration);
}
});
// If modal is disabled... return
if(!options.on) { return self; }

// Remove previous bound events in namespace
tooltip.unbind(namespace).unbind(namespace+api.id)

// Create the overlay if needed
self.create();
// Apply our show/hide/focus modal events
.bind('tooltipshow'+namespace+' tooltiphide'+namespace, function(event, api, duration) {
var type = event.type.replace('tooltip', '');

// Hide tooltip on overlay click if enabled and toggle cursor style
if(options.blur === TRUE) {
elems.overlay.unbind(namespace+api.id).bind('click'+namespace+api.id, function(){ api.hide.call(api); });
if($.isFunction(options[type])) {
options[type].call(elems.overlay, duration, api);
}
elems.overlay.css('cursor', options.blur ? 'pointer' : '');
else {
self[type](duration);
}
})
.bind('tooltipfocus', function(event, api, zIndex) {
overlay.css('z-index', zIndex - 1); // Adjust modal z-index on tooltip focus
});

// Create the overlay if needed
self.create();

// Hide tooltip on overlay click if enabled and toggle cursor style
elems.overlay.css('cursor', options.blur ? 'pointer' : '');
if(options.blur === TRUE) {
elems.overlay.bind('click'+namespace+api.id, function(){ api.hide.call(api); });
}

return self;
},

create: function()
{
var elem = $(selector), overlay;
var elem = $(selector);

// Return if overlay is already rendered
if(elem.length) { elems.overlay = elem; return elem; }
Expand Down Expand Up @@ -2662,8 +2670,7 @@ function Modal(api)

toggle: function(state)
{
var overlay = elems.overlay,
effect = api.options.show.modal.effect,
var effect = api.options.show.modal.effect,
type = state ? 'show': 'hide',
zindex;

Expand All @@ -2676,12 +2683,6 @@ function Modal(api)
// Setop all animations
overlay.stop(TRUE, FALSE);

// Set z-indx if we're showing it
if(state) {
zindex = parseInt( $.css(tooltip[0], 'z-index'), 10);
overlay.css('z-index', (zindex || QTIP.zindex) - 1);
}

// Use custom function if provided
if($.isFunction(effect)) {
effect.call(overlay, state);
Expand All @@ -2698,16 +2699,18 @@ function Modal(api)
if(!state) { $(this).hide(); }
});
}

return self;
},

show: function() { self.toggle(TRUE); },
hide: function() { self.toggle(FALSE); },
show: function() { return self.toggle(TRUE); },
hide: function() { return self.toggle(FALSE); },

destroy: function()
{
var delBlanket = elems.overlay;
var delBlanket = overlay.length;

if(delBlanket) {
if(overlay.length) {
// Check if any other modal tooltips are present
$(selector).each(function() {
var api = $(this).data('qtip');
Expand All @@ -2729,7 +2732,7 @@ function Modal(api)
}

// Remove bound events
tooltip.unbind(events);
return tooltip.unbind(namespace);
}
});

Expand Down
4 changes: 2 additions & 2 deletions dist/jquery.qtip.min.js

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions dist/jquery.qtip.pack.js

Large diffs are not rendered by default.

71 changes: 37 additions & 34 deletions src/modal.js
Expand Up @@ -4,10 +4,9 @@ function Modal(api)
options = api.options.show.modal,
elems = api.elements,
tooltip = elems.tooltip,

selector = '#qtip-overlay',
namespace = '.qtipmodal',
events = 'tooltipshow'+namespace+' tooltiphide'+namespace;
overlay;

// Setup option set checks
api.checks.modal = {
Expand All @@ -23,33 +22,42 @@ function Modal(api)
$.extend(self, {
init: function()
{
if(options.on) {
// Apply our modal events (unbind the mfirst so we don't duplicate)
tooltip.unbind(namespace).bind(events, function(event, api, duration) {
var type = event.type.replace('tooltip', '');

if($.isFunction(options[type])) {
options[type].call(elems.overlay, duration, api);
}
else {
self[type](duration);
}
});
// If modal is disabled... return
if(!options.on) { return self; }

// Remove previous bound events in namespace
tooltip.unbind(namespace).unbind(namespace+api.id)

// Create the overlay if needed
self.create();
// Apply our show/hide/focus modal events
.bind('tooltipshow'+namespace+' tooltiphide'+namespace, function(event, api, duration) {
var type = event.type.replace('tooltip', '');

// Hide tooltip on overlay click if enabled and toggle cursor style
if(options.blur === TRUE) {
elems.overlay.unbind(namespace+api.id).bind('click'+namespace+api.id, function(){ api.hide.call(api); });
if($.isFunction(options[type])) {
options[type].call(elems.overlay, duration, api);
}
else {
self[type](duration);
}
elems.overlay.css('cursor', options.blur ? 'pointer' : '');
})
.bind('tooltipfocus', function(event, api, zIndex) {
overlay.css('z-index', zIndex - 1); // Adjust modal z-index on tooltip focus
});

// Create the overlay if needed
self.create();

// Hide tooltip on overlay click if enabled and toggle cursor style
elems.overlay.css('cursor', options.blur ? 'pointer' : '');
if(options.blur === TRUE) {
elems.overlay.bind('click'+namespace+api.id, function(){ api.hide.call(api); });
}

return self;
},

create: function()
{
var elem = $(selector), overlay;
var elem = $(selector);

// Return if overlay is already rendered
if(elem.length) { elems.overlay = elem; return elem; }
Expand Down Expand Up @@ -81,8 +89,7 @@ function Modal(api)

toggle: function(state)
{
var overlay = elems.overlay,
effect = api.options.show.modal.effect,
var effect = api.options.show.modal.effect,
type = state ? 'show': 'hide',
zindex;

Expand All @@ -95,12 +102,6 @@ function Modal(api)
// Setop all animations
overlay.stop(TRUE, FALSE);

// Set z-indx if we're showing it
if(state) {
zindex = parseInt( $.css(tooltip[0], 'z-index'), 10);
overlay.css('z-index', (zindex || QTIP.zindex) - 1);
}

// Use custom function if provided
if($.isFunction(effect)) {
effect.call(overlay, state);
Expand All @@ -117,16 +118,18 @@ function Modal(api)
if(!state) { $(this).hide(); }
});
}

return self;
},

show: function() { self.toggle(TRUE); },
hide: function() { self.toggle(FALSE); },
show: function() { return self.toggle(TRUE); },
hide: function() { return self.toggle(FALSE); },

destroy: function()
{
var delBlanket = elems.overlay;
var delBlanket = overlay.length;

if(delBlanket) {
if(overlay.length) {
// Check if any other modal tooltips are present
$(selector).each(function() {
var api = $(this).data('qtip');
Expand All @@ -148,7 +151,7 @@ function Modal(api)
}

// Remove bound events
tooltip.unbind(events);
return tooltip.unbind(namespace);
}
});

Expand Down

0 comments on commit 70b749f

Please sign in to comment.