jquery-poshytip/src/jquery.poshytip.min.js

poshy tip - jquery plugin for stylish tooltips

/*
 * Poshy Tip jQuery plugin v1.2.0
 * http://vadikom.com/tools/poshy-tip-jquery-plugin-for-stylish-tooltips/
 * Copyright 2010-2013, Vasil Dinkov, http://vadikom.com/
 */

(function(f){var b=[],d=/^url\(["']?([^"'\)]*)["']?\);?$/i,c=/\.png$/i,h=!!window.createPopup,a=h&&typeof document.documentElement.currentStyle.minWidth=="undefined",e=h&&!document.defaultView;function g(){f.each(b,function(){this.refresh(true)})}f(window).resize(g);f.Poshytip=function(k,i){this.$elm=f(k);this.opts=f.extend({},f.fn.poshytip.defaults,i);var j=((""!=this.opts.idName)?("id="+this.opts.idName):"");this.$tip=f(["<div ",j,' class="',this.opts.className,'">','<div class="tip-inner tip-bg-image"></div>','<div class="tip-arrow tip-arrow-top tip-arrow-right tip-arrow-bottom tip-arrow-left"></div>',"</div>"].join("")).appendTo(document.body);this.$arrow=this.$tip.find("div.tip-arrow");this.$inner=this.$tip.find("div.tip-inner");this.disabled=false;this.content=null;this.init()};f.Poshytip.hideAll=function(){f.each(b,function(){this.hide()})};f.Poshytip.prototype={init:function(){b.push(this);var i=this.$elm.attr("title");this.$elm.data("title.poshytip",i!==undefined?i:null).data("poshytip",this);if(this.opts.showOn!="none"){this.$elm.bind({"mouseenter.poshytip":f.proxy(this.mouseenter,this),"mouseleave.poshytip":f.proxy(this.mouseleave,this)});switch(this.opts.showOn){case"hover":if(this.opts.alignTo=="cursor"){this.$elm.bind("mousemove.poshytip",f.proxy(this.mousemove,this))}if(this.opts.allowTipHover){this.$tip.hover(f.proxy(this.clearTimeouts,this),f.proxy(this.mouseleave,this))}break;case"focus":this.$elm.bind({"focus.poshytip":f.proxy(this.showDelayed,this),"blur.poshytip":f.proxy(this.hideDelayed,this)});break}}},mouseenter:function(i){if(this.disabled){return true}this.updateCursorPos(i);this.$elm.attr("title","");if(this.opts.showOn=="focus"){return true}this.showDelayed()},mouseleave:function(i){if(this.disabled||this.asyncAnimating&&(this.$tip[0]===i.relatedTarget||jQuery.contains(this.$tip[0],i.relatedTarget))){return true}if(!this.$tip.data("active")){var j=this.$elm.data("title.poshytip");if(j!==null){this.$elm.attr("title",j)}}if(this.opts.showOn=="focus"){return true}this.hideDelayed()},mousemove:function(i){if(this.disabled){return true}this.updateCursorPos(i);if(this.opts.followCursor&&this.$tip.data("active")){this.calcPos();this.$tip.css({left:this.pos.l,top:this.pos.t});if(this.pos.arrow){this.$arrow[0].className="tip-arrow tip-arrow-"+this.pos.arrow}}},show:function(){if(this.disabled||this.$tip.data("active")){return}this.reset();this.update();if(!this.content){return}this.display();if(this.opts.timeOnScreen){this.hideDelayed(this.opts.timeOnScreen)}},showDelayed:function(i){this.clearTimeouts();this.showTimeout=setTimeout(f.proxy(this.show,this),typeof i=="number"?i:this.opts.showTimeout)},hide:function(){if(this.disabled||!this.$tip.data("active")){return}this.display(true)},hideDelayed:function(i){this.clearTimeouts();this.hideTimeout=setTimeout(f.proxy(this.hide,this),typeof i=="number"?i:this.opts.hideTimeout)},reset:function(){this.$tip.queue([]).detach().css("visibility","hidden").data("active",false);this.$inner.find("*").poshytip("hide");if(this.opts.fade){this.$tip.css("opacity",this.opacity)}this.$arrow[0].className="tip-arrow tip-arrow-top tip-arrow-right tip-arrow-bottom tip-arrow-left";this.asyncAnimating=false},update:function(l,m){if(this.disabled){return}var k=l!==undefined;if(k){if(!m){this.opts.content=l}if(!this.$tip.data("active")){return}}else{l=this.opts.content}var j=this,i=typeof l=="function"?l.call(this.$elm[0],function(n){j.update(n)}):l=="[title]"?this.$elm.data("title.poshytip"):l;if(this.content!==i){this.$inner.empty().append(i);this.content=i}this.refresh(k)},refresh:function(j){if(this.disabled){return}if(j){if(!this.$tip.data("active")){return}var m={left:this.$tip.css("left"),top:this.$tip.css("top")}}this.$tip.css({left:0,top:0}).appendTo(document.body);if(this.opacity===undefined){this.opacity=this.$tip.css("opacity")}var n=this.$tip.css("background-image").match(d),o=this.$arrow.css("background-image").match(d);if(n){var k=c.test(n[1]);if(a&&k){this.$tip.css("background-image","none");this.$inner.css({margin:0,border:0,padding:0});n=k=false}else{this.$tip.prepend('<table class="tip-table" border="0" cellpadding="0" cellspacing="0"><tr><td class="tip-top tip-bg-image" colspan="2"><span></span></td><td class="tip-right tip-bg-image" rowspan="2"><span></span></td></tr><tr><td class="tip-left tip-bg-image" rowspan="2"><span></span></td><td></td></tr><tr><td class="tip-bottom tip-bg-image" colspan="2"><span></span></td></tr></table>').css({border:0,padding:0,"background-image":"none","background-color":"transparent"}).find(".tip-bg-image").css("background-image",'url("'+n[1]+'")').end().find("td").eq(3).append(this.$inner)}if(k&&e){this.opts.fade=false}}if(o&&e){if(a&&c.test(o[1])){o=false;this.$arrow.css("background-image","none")}this.opts.fade=false}var q=this.$tip.find("> table.tip-table");if(a){this.$tip[0].style.width="";q.width("auto").find("td").eq(3).width("auto");var p=this.$tip.width(),l=parseInt(this.$tip.css("min-width")),i=parseInt(this.$tip.css("max-width"));if(!isNaN(l)&&p<l){p=l}else{if(!isNaN(i)&&p>i){p=i}}this.$tip.add(q).width(p).eq(0).find("td").eq(3).width("100%")}else{if(q[0]){q.width("auto").find("td").eq(3).width("auto").end().end().width(document.defaultView&&document.defaultView.getComputedStyle&&parseFloat(document.defaultView.getComputedStyle(this.$tip[0],null).width)||this.$tip.width()).find("td").eq(3).width("100%")}}this.tipOuterW=this.$tip.outerWidth();this.tipOuterH=this.$tip.outerHeight();this.calcPos();if(o&&this.pos.arrow){this.$arrow[0].className="tip-arrow tip-arrow-"+this.pos.arrow;this.$arrow.css("visibility","inherit")}if(j&&this.opts.refreshAniDuration){this.asyncAnimating=true;var r=this;this.$tip.css(m).animate({left:this.pos.l,top:this.pos.t},this.opts.refreshAniDuration,function(){r.asyncAnimating=false})}else{this.$tip.css({left:this.pos.l,top:this.pos.t})}},display:function(j){var k=this.$tip.data("active");if(k&&!j||!k&&j){return}this.$tip.stop();if((this.opts.slide&&this.pos.arrow||this.opts.fade)&&(j&&this.opts.hideAniDuration||!j&&this.opts.showAniDuration)){var p={},o={};if(this.opts.slide&&this.pos.arrow){var n,i;if(this.pos.arrow=="bottom"||this.pos.arrow=="top"){n="top";i="bottom"}else{n="left";i="right"}var m=parseInt(this.$tip.css(n));p[n]=m+(j?0:(this.pos.arrow==i?-this.opts.slideOffset:this.opts.slideOffset));o[n]=m+(j?(this.pos.arrow==i?this.opts.slideOffset:-this.opts.slideOffset):0)+"px"}if(this.opts.fade){p.opacity=j?this.$tip.css("opacity"):0;o.opacity=j?0:this.opacity}this.$tip.css(p).animate(o,this.opts[j?"hideAniDuration":"showAniDuration"])}j?this.$tip.queue(f.proxy(this.reset,this)):this.$tip.css("visibility","inherit");if(k){var l=this.$elm.data("title.poshytip");if(l!==null){this.$elm.attr("title",l)}}this.$tip.data("active",!k)},disable:function(){this.reset();this.disabled=true},enable:function(){this.disabled=false},destroy:function(){this.reset();this.$tip.remove();delete this.$tip;this.content=null;this.$elm.unbind(".poshytip").removeData("title.poshytip").removeData("poshytip");b.splice(f.inArray(this,b),1)},clearTimeouts:function(){if(this.showTimeout){clearTimeout(this.showTimeout);this.showTimeout=0}if(this.hideTimeout){clearTimeout(this.hideTimeout);this.hideTimeout=0}},updateCursorPos:function(i){this.eventX=i.pageX;this.eventY=i.pageY},calcPos:function(){var p={l:0,t:0,arrow:""},j=f(window),m={l:j.scrollLeft(),t:j.scrollTop(),w:j.width(),h:j.height()},r,l,o,k,s,i;if(this.opts.alignTo=="cursor"){r=l=o=this.eventX;k=s=i=this.eventY}else{var q=this.$elm.offset(),n={l:q.left,t:q.top,w:this.$elm.outerWidth(),h:this.$elm.outerHeight()};r=n.l+(this.opts.alignX!="inner-right"?0:n.w);l=r+Math.floor(n.w/2);o=r+(this.opts.alignX!="inner-left"?n.w:0);k=n.t+(this.opts.alignY!="inner-bottom"?0:n.h);s=k+Math.floor(n.h/2);i=k+(this.opts.alignY!="inner-top"?n.h:0)}switch(this.opts.alignX){case"right":case"inner-left":p.l=o+this.opts.offsetX;if(this.opts.keepInViewport&&p.l+this.tipOuterW>m.l+m.w){p.l=m.l+m.w-this.tipOuterW}if(this.opts.alignX=="right"||this.opts.alignY=="center"){p.arrow="left"}break;case"center":p.l=l-Math.floor(this.tipOuterW/2);if(this.opts.keepInViewport){if(p.l+this.tipOuterW>m.l+m.w){p.l=m.l+m.w-this.tipOuterW}else{if(p.l<m.l){p.l=m.l}}}break;default:p.l=r-this.tipOuterW-this.opts.offsetX;if(this.opts.keepInViewport&&p.l<m.l){p.l=m.l}if(this.opts.alignX=="left"||this.opts.alignY=="center"){p.arrow="right"}}switch(this.opts.alignY){case"bottom":case"inner-top":p.t=i+this.opts.offsetY;if(!p.arrow||this.opts.alignTo=="cursor"){p.arrow="top"}if(this.opts.keepInViewport&&p.t+this.tipOuterH>m.t+m.h){p.t=k-this.tipOuterH-this.opts.offsetY;if(p.arrow=="top"){p.arrow="bottom"}}break;case"center":p.t=s-Math.floor(this.tipOuterH/2);if(this.opts.keepInViewport){if(p.t+this.tipOuterH>m.t+m.h){p.t=m.t+m.h-this.tipOuterH}else{if(p.t<m.t){p.t=m.t}}}break;default:p.t=k-this.tipOuterH-this.opts.offsetY;if(!p.arrow||this.opts.alignTo=="cursor"){p.arrow="bottom"}if(this.opts.keepInViewport&&p.t<m.t){p.t=i+this.opts.offsetY;if(p.arrow=="bottom"){p.arrow="top"}}}this.pos=p}};f.fn.poshytip=function(j){if(typeof j=="string"){var i=arguments,n=j;Array.prototype.shift.call(i);if(n=="destroy"){this.die?this.die("mouseenter.poshytip").die("focus.poshytip"):f(document).undelegate(this.selector,"mouseenter.poshytip").undelegate(this.selector,"focus.poshytip")}return this.each(function(){var o=f(this).data("poshytip");if(o&&o[n]){o[n].apply(o,i)}})}var l=f.extend({},f.fn.poshytip.defaults,j);if(!f("#poshytip-css-"+l.className)[0]){f(['<style id="poshytip-css-',l.className,'" type="text/css">',"div.",l.className,"{visibility:hidden;position:absolute;top:0;left:0;}","div.",l.className," table.tip-table, div.",l.className," table.tip-table td{margin:0;font-family:inherit;font-size:inherit;font-weight:inherit;font-style:inherit;font-variant:inherit;vertical-align:middle;}","div.",l.className," td.tip-bg-image span{display:block;font:1px/1px sans-serif;height:",l.bgImageFrameSize,"px;width:",l.bgImageFrameSize,"px;overflow:hidden;}","div.",l.className," td.tip-right{background-position:100% 0;}","div.",l.className," td.tip-bottom{background-position:100% 100%;}","div.",l.className," td.tip-left{background-position:0 100%;}","div.",l.className," div.tip-inner{background-position:-",l.bgImageFrameSize,"px -",l.bgImageFrameSize,"px;}","div.",l.className," div.tip-arrow{visibility:hidden;position:absolute;overflow:hidden;font:1px/1px sans-serif;}","</style>"].join("")).appendTo("head")}if(l.liveEvents&&l.showOn!="none"){var k,m=f.extend({},l,{liveEvents:false});switch(l.showOn){case"hover":k=function(){var o=f(this);if(!o.data("poshytip")){o.poshytip(m).poshytip("mouseenter")}};this.live?this.live("mouseenter.poshytip",k):f(document).delegate(this.selector,"mouseenter.poshytip",k);break;case"focus":k=function(){var o=f(this);if(!o.data("poshytip")){o.poshytip(m).poshytip("showDelayed")}};this.live?this.live("focus.poshytip",k):f(document).delegate(this.selector,"focus.poshytip",k);break}return this}return this.each(function(){new f.Poshytip(this,l)})};f.fn.poshytip.defaults={content:"[title]",className:"tip-yellow",idName:"",bgImageFrameSize:10,showTimeout:500,hideTimeout:100,timeOnScreen:0,showOn:"hover",liveEvents:false,alignTo:"cursor",alignX:"right",alignY:"top",offsetX:-22,offsetY:18,keepInViewport:true,allowTipHover:true,followCursor:false,fade:true,slide:true,slideOffset:8,showAniDuration:300,hideAniDuration:300,refreshAniDuration:200}})(jQuery);