var PT_DOMAIN = 'http://www.pearltrees.com/';
var PT_SERVICE_URL = PT_DOMAIN+'s/embed/';
var PT_SOURCE_URL = PT_DOMAIN+'embed/';

var PT_TIME_TO_FADE_IN = 300.0;
var PT_TIME_TO_FADE_OUT = 300.0;
var PT_TITLE_LINE_LENGTH = 16;
var PT_TITLE_MAX_LINES = 2;
var PT_DISPLAY_LABEL = 1;
var PT_MIN_PEARL_HEIGHT = 43;
var PT_LINE_HEIGHT = 12;

function ptLoadCss() {
	var headID = document.getElementsByTagName("head")[0];       
	
	var cssNode = document.createElement('link');
	cssNode.type = 'text/css';
	cssNode.rel = 'stylesheet';
	cssNode.href = PT_SOURCE_URL +'pt-embed.css';
	cssNode.media = 'all';
	headID.appendChild(cssNode);
	
	if(BrowserDetect.browser == 'Explorer') {
		var cssNode = document.createElement('link');
		cssNode.type = 'text/css';
		cssNode.rel = 'stylesheet';
		cssNode.href = PT_SOURCE_URL +'pt-embed-ie.css';
		cssNode.media = 'all';
		headID.appendChild(cssNode);
	}
}
function ptInitPearl(pearlLinkId,pearlDB,pearlID,displayLabel) {
	var pearlLink = document.getElementById(pearlLinkId);	
	var pearlTitle = ptGetPearlTitle(pearlLink);
	
	if(displayLabel != PT_DISPLAY_LABEL) pearlTitle = null;
	
	var divContainer = document.createElement('div');
	divContainer.className = 'pt-pearlContent';
	ptSetElementStyleAsString(divContainer, 'height:'+ptGetPearlHeight(pearlTitle)+'px !important');
	var containerHTML = 
		'<p>' +
		'   <img src="'+ PT_SOURCE_URL +'pearl-background.png" width="38" height="38" class="pt-background" />' +
		'   <img src="'+ PT_SERVICE_URL +'logo?pearlDB=' + pearlDB + '&pearlID=' + pearlID + '" width="16" height="16" class="pt-logo" />' +
		'   <img src="'+ PT_SOURCE_URL +'maskPearl.png" width="38" height="38" class="pt-background" name="mask" />';
	if(displayLabel == PT_DISPLAY_LABEL) containerHTML += ptGetLabelCode(pearlLink);
	containerHTML += '</p>';
	
	divContainer.innerHTML = containerHTML;	
		
    pearlLink.innerHTML='';
	pearlLink.appendChild(divContainer);	
	pearlLink.className = 'pt-pearlLink';
	// On IE. Open pearltrees in current window.
	if(BrowserDetect.browser == 'Explorer') {
		pearlLink.onclick = ptOnClickPearl;
		pearlLink.setAttribute('target','_top');
	}
	pearlLink.onmouseover = ptOnMouseOverPearl;
	pearlLink.onmouseout = ptOnMouseOutPearl;
}
function ptInitTree(pearlLinkId,userDB,userID,treeDB,treeID,displayLabel) {
	var pearlLink = document.getElementById(pearlLinkId);
	var pearlTitle = ptGetPearlTitle(pearlLink);
	
	if(displayLabel != PT_DISPLAY_LABEL) pearlTitle = null;
	
	var divContainer = document.createElement('div');
	divContainer.className = 'pt-pearlContent';
	ptSetElementStyleAsString(divContainer, 'height:'+ptGetPearlHeight(pearlTitle)+'px !important');
	var containerHTML = 
		'<p>' +
		'   <img src="'+ PT_SOURCE_URL +'pearl-background.png" width="38" height="38" class="pt-background" />' +
		'   <img src="'+ PT_SERVICE_URL +'avatar?userDB=' + userDB + '&userID=' + userID + '" width="36" height="36" class="pt-avatar" />' +
		'   <img src="'+ PT_SOURCE_URL +'maskTree.png" width="38" height="38" class="pt-mask" name="mask" />' +		
		'   <img src="'+ PT_SOURCE_URL +'border.png" width="38" height="38" class="pt-background" />' +
		'   <img src="'+ PT_SOURCE_URL +'treeArrow.png" width="14" height="15" class="pt-arrow" name="arrow" />';
	if(displayLabel == PT_DISPLAY_LABEL) containerHTML += ptGetLabelCode(pearlLink);
	containerHTML += '</p>';
	
	divContainer.innerHTML = containerHTML;
		
    pearlLink.innerHTML='';
	pearlLink.appendChild(divContainer);	
	pearlLink.className = 'pt-pearlLink';
	// On IE. Open pearltrees in current window.
	if(BrowserDetect.browser == 'Explorer') {
		pearlLink.onclick = ptOnClickPearl;
		pearlLink.setAttribute('target','_top');
	}
	pearlLink.onmouseover = ptOnMouseOverTree;
	pearlLink.onmouseout = ptOnMouseOutTree;
}
function ptGetPearlHeight(pearlTitle) {
	var height = PT_MIN_PEARL_HEIGHT;
	if(!pearlTitle || pearlTitle == '') return height;
	var numLines = ptGetPearlTitleLines(pearlTitle).length;
	if(numLines > PT_TITLE_MAX_LINES) numLines = PT_TITLE_MAX_LINES;
	height += numLines * PT_LINE_HEIGHT;
	return height;
}
function ptGetLabelCode(pearlLink) {
	var pearlTitle = ptGetPearlTitle(pearlLink);
	
	var lines = ptGetPearlTitleLines(pearlTitle);
	var numLines = lines.length;
	if(numLines > PT_TITLE_MAX_LINES) numLines = PT_TITLE_MAX_LINES;
	var pearlTitleCode = "";
	
	for(var i=0; i < numLines; i++) {
		pearlTitleCode += lines[i];
		if(i+1 < numLines) pearlTitleCode += "<br />";
	}
	if(lines.length > PT_TITLE_MAX_LINES) {
		pearlTitleCode += '<span class="pt-more">..</span>';
	}
	
	var labelCode =
		'   <p style="' + ptGetElementStyleAsString(pearlLink) + '" class="pt-title">' +
		'   ' + pearlTitleCode +
		'   </p>';
	return labelCode;
}
function ptGetPearlTitleLines(pearlTitle) {
	var lines = [];
	var titleToSplit = pearlTitle;
	
	for(var i=0; titleToSplit.length > 0; i++) {
		
		if(titleToSplit.length > PT_TITLE_LINE_LENGTH) {
			var splitPos = PT_TITLE_LINE_LENGTH;
			var currentLine = titleToSplit.substr(0,splitPos);
			var spacePos = currentLine.lastIndexOf(' ');
			if(spacePos > 1) {
				splitPos = spacePos;
			}
			currentLine = titleToSplit.substr(0, splitPos);
			lines[i] = currentLine;
			titleToSplit = titleToSplit.substring(splitPos, titleToSplit.length);
		}
		else{
			lines[i] = titleToSplit;
			titleToSplit = "";
		}	
	}
	return lines;
}
function ptGetPearlTitle(pearlLink) {
	var pearlTitle = null;
	var defaultImage = pearlLink.getElementsByTagName('img')[0];	
	if(defaultImage) {
		pearlTitle = defaultImage.getAttribute('alt');
	}else{
		pearlTitle = pearlLink.innerHTML;
	}
	return pearlTitle;
}

function ptOnMouseOverPearl() {
	ptHideMask(this);
}
function ptOnMouseOutPearl() {
	ptShowMask(this);
}
function ptOnMouseOverTree() {
	ptHideMask(this);
	ptShowArrow(this);
}
function ptOnMouseOutTree() {
	ptShowMask(this);
	ptHideArrow(this);
}
function ptOnClickPearl() {
	document.location = this.href;
}
function ptGetElementStyleAsString(element) {
	if(!element) return '';
	var styleValue = element.getAttribute('style');
	if (styleValue && typeof styleValue == 'object') {
		return styleValue.cssText;
	}
	else {
		return styleValue;
	}
}
function ptSetElementStyleAsString(element,style) {
	if(!element) return;
	var styleValue = element.getAttribute('style');
	if(styleValue && BrowserDetect.browser == 'Explorer') {
		styleValue.cssText = style;
	}else{
		element.setAttribute('style',style);
	}		
}
function ptOnClick(pearlLinkId){
	var pearlLink = document.getElementById(pearlLinkId);
	document.location=pearlLink.href;
}

function ptShowMask(pearlLink) {

	var mask = ptGetMask(pearlLink);
	
	if(BrowserDetect.browser == 'Explorer') {
		mask.style.visibility = 'visible';
		return;
	}

   fade(mask.id);
}
function ptHideMask(pearlLink) {
	
	var mask = ptGetMask(pearlLink);
	
	if(BrowserDetect.browser == 'Explorer') {
		mask.style.visibility = 'hidden';
		return;
	}

   fade(mask.id);
}
function ptShowArrow(pearlLink) {
	var arrow = ptGetArrow(pearlLink);
	arrow.style.visibility = 'visible';
}
function ptHideArrow(pearlLink) {
	var arrow = ptGetArrow(pearlLink);
	arrow.style.visibility = 'hidden';
}

/**
* @author: http://www.switchonthecode.com/tutorials/javascript-tutorial-simple-fade-animation
*/
function ptGetMask(pearlLink){
	var children = pearlLink.getElementsByTagName('img');
	var i=0;
	var mask;
	while(children[i]) {
		if(children[i].name == 'mask'){
			mask = children[i];
			mask.id = pearlLink.id+'mask';
			break;
		}
		i++;
	}
	return mask;
}
function ptGetArrow(pearlLink){
	var children = pearlLink.getElementsByTagName('img');
	var i=0;
	var arrow;
	while(children[i]) {
		if(children[i].name == 'arrow'){
			arrow = children[i];
			arrow.id = pearlLink.id+'arrow';
			break;
		}
		i++;
	}
	return arrow;
}

/**
* @author: http://www.switchonthecode.com/tutorials/javascript-tutorial-simple-fade-animation
*/
function fade(elementId)
{
  var element = document.getElementById(elementId);
  if(element == null)
	return;
   
  if(element.FadeState == null)
  {
	if(element.style.opacity == null
		|| element.style.opacity == ''
		|| element.style.opacity == '1')
	{
	  element.FadeState = 2;
	}
	else
	{
	  element.FadeState = -2;
	}
  }
   
  if(element.FadeState == 1 || element.FadeState == -1)
  {
	element.FadeState = element.FadeState == 1 ? -1 : 1;
	element.FadeTimeLeft = PT_TIME_TO_FADE_OUT - element.FadeTimeLeft;
  }
  else
  {
	element.FadeState = element.FadeState == 2 ? -1 : 1;
	element.FadeTimeLeft = PT_TIME_TO_FADE_IN;
	setTimeout("animateFade(" + new Date().getTime() + ",'" + elementId + "')", 33);
  }  
}
function animateFade(lastTick, elementId)
{  
  var element = document.getElementById(elementId);
  
  var curTick = new Date().getTime();
  var elapsedTicks = curTick - lastTick;
 
  if(element.FadeTimeLeft <= elapsedTicks)
  {
	element.style.opacity = element.FadeState == 1 ? '1' : '0';
	element.style.filter = 'alpha(opacity = '
		+ (element.FadeState == 1 ? '100' : '0') + ')';
	element.FadeState = element.FadeState == 1 ? 2 : -2;
	return;
  }
 
  element.FadeTimeLeft -= elapsedTicks;
  var newOpVal = element.FadeTimeLeft/PT_TIME_TO_FADE_IN;
  if(element.FadeState == 1)
	newOpVal = 1 - newOpVal;

  element.style.opacity = newOpVal;
  element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';
 
  setTimeout("animateFade(" + curTick + ",'" + elementId + "')", 33);
}

/**
* @author: http://www.quirksmode.org/js/detect.html
*/
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: "Chrome",
         identity: "Chrome"
      },
      {  string: navigator.userAgent,
         subString: "OmniWeb",
         versionSearch: "OmniWeb/",
         identity: "OmniWeb"
      },
      {
         string: navigator.vendor,
         subString: "Apple",
         identity: "Safari",
         versionSearch: "Version"
      },
      {
         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"
      }
   ]

};
BrowserDetect.init();
ptLoadCss();