path: root/bubble.js

/*
    WebSnapr - Preview Bubble Javascript
    Written by Juan Xavier Larrea 
    http://www.websnapr.com - xavier@websnapr.com   
    
*/

// Point this variable to the correct location of the bg.png file
var bubbleImageUp = 'resources/bubble_up.png';
var bubbleImageDown = 'resources/bubble_down.png';

if(typeof Array.prototype.push!="function"){
   Array.prototype.push=ArrayPush;

   function ArrayPush(_1){
      this[this.length]=_1;
   }
}

function WSR_getElementsByClassName(oElm, strTagName, oClassNames){
   var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
   var arrReturnElements = new Array();
   var arrRegExpClassNames = new Array();
   if(typeof oClassNames == "object"){
      for(var i=0; i<oClassNames.length; i++){
         arrRegExpClassNames.push(new RegExp("(^|\s)" + oClassNames[i].replace(/-/g, "\-") + "(\s|$)"));
      }
   }
   else{
      arrRegExpClassNames.push(new RegExp("(^|\s)" + oClassNames.replace(/-/g, "\-") + "(\s|$)"));
   }
   var oElement;
   var bMatchesAll;
   for(var j=0; j<arrElements.length; j++){
      oElement = arrElements[j];
      bMatchesAll = true;
      for(var k=0; k<arrRegExpClassNames.length; k++){
         if(!arrRegExpClassNames[k].test(oElement.className)){
            bMatchesAll = false;
            break;
         }
      }
      if(bMatchesAll){
         arrReturnElements.push(oElement);
      }
   }
   return (arrReturnElements)
}
/*function WSR_getElementsByClassName(_2,_3,_4){

   var _5=(_3=="*"&&_2.all)?_2.all:_2.getElementsByTagName(_3);
         window.alert(_5[0]);
   var _6=new Array();
   _4=_4.replace(/\-/g,"\\-");
   var _7=new RegExp("(^|\\s)"+_4+"(\\s|$)");
   var _8;
   for(var i=0;i<_5.length;i++){
      _8=_5[i];
      if(_7.test(_8.className)){
         _6.push(_8);
      }
   }
   return (_6);
}*/

function bindBubbles(e){
   lbActions=WSR_getElementsByClassName(document,"img","thumb");
   for(i=0;i<lbActions.length;i++){
      if(window.addEventListener){ // Mozilla, Firefox
         lbActions[i].addEventListener("mouseover",attachBubble,false);
         lbActions[i].addEventListener("mouseout",detachBubble,false);
         lbActions[i].addEventListener("click",detachBubble,false);
      }else if (window.attachEvent) { // IE
         lbActions[i].attachEvent("onmouseover",attachBubble);
         lbActions[i].attachEvent("onmouseout",detachBubble);
         lbActions[i].attachEvent("onclick",detachBubble);
      } else {
         // it seems this browser doesn't support any eventhandling
      }  
   }
}

function attachBubble(_b){
   var _c;
   if(_b["srcElement"]){ // IE
      _c=_b["srcElement"];
   }else{ // Mozilla, Firefox
      _c=_b["target"];
   }
   if (_c.href == undefined){
      _c=_c.parentNode;
   }

   var _d=_c.href;

   var _10=document.createElement("div");
   document.getElementsByTagName("body")[0].appendChild(_10);
   _10.className="bubble";

   if(BrowserDetect.browser != 'Explorer') {

      var _e=findPos(_c)[0]+5;
      var cur_height = findPos(_c)[1]-get_scroll_position() + 283;

      // should the bubble be displayed above or below the object
      if(cur_height >= get_page_height()) {
         var _f=findPos(_c)[1]-363;
         bubbleImage = bubbleImageUp;
      }
      else {
         var _f=findPos(_c)[1]+17;
         bubbleImage = bubbleImageDown;
      }
   }
   else {
         var _e=findPos(_c)[0]+5;
         var _f=findPos(_c)[1]+129;
         bubbleImage = bubbleImageDown;
   }
   if (BrowserDetect.browser == 'Explorer') {
      _10.style.width="275px";
      _10.style.height="275px";
      _10.style.position="absolute";
      _10.style.top=_f;
      _10.style.zIndex=99999;
      _10.style.left=_e;
      _10.style.textAlign="left";
      _10.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + bubbleImage + "',sizingMethod='image')";
   } else if (BrowserDetect.browser == 'Safari' || BrowserDetect.browser == 'Konqueror' ) {
      _10.setAttribute("style","text-align: center; z-index: 99999; position: absolute; top: "+ _f +"px ; left: "+ _e +"px ; background: url("+ bubbleImage +") no-repeat; width: 275px; height: 275px; padding: 0; margin: 0;");
   } else {
      _10.setAttribute("style","text-align: center; z-index: 99999; position: absolute; top: "+_f+"px ; left: "+ _e +"px ; background: url("+ bubbleImage +") no-repeat; width: 275px; height: 275px; padding: 0; margin: 0;");
   }

   if(cur_height >= get_page_height()) 
      showBubbleDetails(_10, _c.id, 'up');
   else
      showBubbleDetails(_10, _c.id, 'down');

}

function detachBubble(_12){
   lbActions=WSR_getElementsByClassName(document,"div","bubble");
   for(i=0;i<lbActions.length;i++){
      lbActions[i].parentNode.removeChild(lbActions[i]);
   }
}

function findPos(obj){
   var _14=curtop=0;
   if(obj.offsetParent){
      _14=obj.offsetLeft;
      curtop=obj.offsetTop;
      while(obj=obj.offsetParent){
         _14+=obj.offsetLeft;
         curtop+=obj.offsetTop;
      }
   }
   return [_14,curtop];
}

var BrowserDetect = {
	init: function () {
		this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
		this.version = this.searchVersion(navigator.userAgent)
			|| this.searchVersion(navigator.appVersion)
			|| "an unknown version";
		this.OS = this.searchString(this.dataOS) || "an unknown OS";
	},
	searchString: function (data) {
		for (var i=0;i<data.length;i++)	{
			var dataString = data[i].string;
			var dataProp = data[i].prop;
			this.versionSearchString = data[i].versionSearch || data[i].identity;
			if (dataString) {
				if (dataString.indexOf(data[i].subString) != -1)
					return data[i].identity;
			}
			else if (dataProp)
				return data[i].identity;
		}
	},
	searchVersion: function (dataString) {
		var index = dataString.indexOf(this.versionSearchString);
		if (index == -1) return;
		return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
	},
	dataBrowser: [
		{ 	string: navigator.userAgent,
			subString: "OmniWeb",
			versionSearch: "OmniWeb/",
			identity: "OmniWeb"
		},
		{
			string: navigator.vendor,
			subString: "Apple",
			identity: "Safari"
		},
		{
			prop: window.opera,
			identity: "Opera"
		},
		{
			string: navigator.vendor,
			subString: "iCab",
			identity: "iCab"
		},
		{
			string: navigator.vendor,
			subString: "KDE",
			identity: "Konqueror"
		},
		{
			string: navigator.userAgent,
			subString: "Firefox",
			identity: "Firefox"
		},
		{
			string: navigator.vendor,
			subString: "Camino",
			identity: "Camino"
		},
		{		// for newer Netscapes (6+)
			string: navigator.userAgent,
			subString: "Netscape",
			identity: "Netscape"
		},
		{
			string: navigator.userAgent,
			subString: "MSIE",
			identity: "Explorer",
			versionSearch: "MSIE"
		},
		{
			string: navigator.userAgent,
			subString: "Gecko",
			identity: "Mozilla",
			versionSearch: "rv"
		},
		{ 		// for older Netscapes (4-)
			string: navigator.userAgent,
			subString: "Mozilla",
			identity: "Netscape",
			versionSearch: "Mozilla"
		}
	],
	dataOS : [
		{
			string: navigator.platform,
			subString: "Win",
			identity: "Windows"
		},
		{
			string: navigator.platform,
			subString: "Mac",
			identity: "Mac"
		},
		{
			string: navigator.platform,
			subString: "Linux",
			identity: "Linux"
		}
	]

};

function var_dump(arr,level) {
   var dumped_text = "";
   if(!level) level = 0;
   
   //The padding given at the beginning of the line.
   var level_padding = "";
   for(var j=0;j<level+1;j++) level_padding += "    ";
   
   if(typeof(arr) == 'object') { //Array/Hashes/Objects 
      for(var item in arr) {
         var value = arr[item];
         
         if(typeof(value) == 'object') { //If it is an array,
            dumped_text += level_padding + "'" + item + "' ...\n";
            dumped_text += dump(value,level+1);
         } else {
            dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n";
         }
      }
   } else { //Stings/Chars/Numbers etc.
      dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
   }
   return dumped_text;

}//end function var_dump

function get_page_height()
{
   var myHeight = 0;
   if( typeof( window.innerHeight ) == 'number' ) {
      //Non-IE
      myHeight = window.innerHeight;
   } else if( document.documentElement && document.documentElement.clientHeight  ) {
      //IE 6+ in 'standards compliant mode'
      myHeight = document.documentElement.clientHeight;
   } else if( document.body &&  document.body.clientHeight ) {
      //IE 4 compatible
      myHeight = document.body.clientHeight;
   }

   return myHeight;
}

function get_scroll_position()
{
   if (typeof window.pageYOffset != 'undefined') {
      return window.pageYOffset;
   }
   else {
      if (typeof document.compatMode != 'undefined' &&
         document.compatMode != 'BackCompat' &&
         typeof window.scrollTop != 'undefined')
         return window.scrollTop;
      else {
         if(typeof document.documentElement.scrollTop != 'undefined')
            return document.documentElement.scrollTop;
         else {
            if (typeof document.body.scrollTop != 'undefined')
               return document.body.scrollTop;
         }
      }
   }

   return 0;

}

BrowserDetect.init();