/*
** (c) mika porspakka 

	# lisää samaa - 29.7.2009
	- sivun ajax updaten jälkeen elementin sijainti tulee väärin?
	
	# lisää fiksailua - 22.7.2008
	- artisokka v2.0 alkaa olla valmis, jos tämänkin sais.

	# puukottelua - 14.6.2007
	- jos sais ton näkyy vaan kerran ja feidaa sisään

	# jatkettu - 26.10.2006
	- toimaa ie/opera/firefox \o/

	# aloitettu - 25.10.2006
	- alkujaan sekä irccigallerian peepbox sekä joku ilmainen tooltippi classi joka
	vaati elementin ja tekstin sisäänsä manuaaliseksi.
	 puukotettu prototypelle classiks.
	
*/
var userView = Class.create();

userView.prototype = {

  initialize: function() {

	var options = Object.extend({
      default_css: false,
      margin: "0px",
	  padding: "5px",
	  backgroundColor: "#d6d6fc",
	  delta_x: 10,
	  delta_y: 10,
      zindex: 1000
    }, arguments[1] || {});
    this.options = options;

	this.userviewdiv = false;
	this.userviewshowing = false;
	this.userviewlastclosed = 0;
	this.userviewON = true;
	this.urltodisplay = 'http://localhost/artisokka2/profiles/popup/'; // REMEMBER TO CHANGE
	//this.urltodisplay = 'http://www.artisokka.org/profiles/popup/'; // PRODUCTION
	this.userAtags = new Array();
	this.eventMouseOver = this.display.bindAsEventListener(this);
	this.eventMouseOut = this.hide.bindAsEventListener(this);

	this.styleMatch = /nick/;	// match links with style 'nick'
	this.urlMatch = /\/profiles\/view\/([0-9]{0,4}?)*$/;	// match links that point to profile view

	if (!this.userviewON) return;

	// etsi käsiin kaikki a tagit jotka linkittää user.php tms filuun
	var links = document.getElementsByTagName("a");
	var i = 0;
	for (var n = 0; n < links.length; n++) {
		var link = links[n];
		var href = link.getAttribute("href");
		var styleClass = link.getAttribute("class");
		if (!href) continue;

		var mmatch1 = this.urlMatch.exec(href);
		var mmatch2 = this.styleMatch.exec(styleClass);

		if (mmatch1 && mmatch2) {
			this.userAtags[i] = link;
			i++;
		}
	}
	this.registerEvents();

	this.userviewdiv = document.createElement("div");
	this.userviewdiv.id = "userview_box";
	this.userviewdiv.style.position = "absolute";
	this.userviewdiv.style.zIndex = 10000;
	this.userviewdiv.innerHTML = '';
	document.getElementsByTagName("body")[0].appendChild(this.userviewdiv);
	this.userviewdiv.hide();

	},
 
	//
	// FUNCTIONS
	//

	registerEvents: function() {
		//alert(this.userAtags.length);
		for (var n = 0; n < this.userAtags.length; n++) {
			//alert(n);
			Event.observe(this.userAtags[n], "mouseover", this.eventMouseOver);
			Event.observe(this.userAtags[n], "mouseout", this.eventMouseOut);
		}
	},	


	errFunc: function(t) {
			alert('Error ' + t.status + ' -- ' + t.statusText);
	},

	
	hide: function(event) {
		//this.userviewdiv.style.display = 'none';
		//this.userviewdiv.hide();
		new Effect.Fade(this.userviewdiv, {duration: 0.2} );
		//Element.innerHTML.delay(0.3, '',this.userviewdiv);

		if (this.userviewshowing) {
			this.userviewshowing = false;
		}
		this.userviewlastclosed = new Date(); 
	},

	// set content and display the element
	set_content: function (response) {
		if ( this.userviewshowing )
		{
			this.userviewshowing = true;
			var el = $('userview_box');
			//new Effect.Fade(el, {duration: 0.2} );
			el.update(response.responseText);
			//new Effect.Appear.delay(0.4, el, {duration: 0.2} );
			new Effect.Appear(el, {duration: 0.2} );
		} else {
			this.userviewshowing = true;
			var el = $('userview_box');
			el.update(response.responseText);
			new Effect.Appear(el, {duration: 0.2} );
		}
	},

	
	display: function(event){
		Event.stop(event);

		var elem;
		var mmatch;
		var argument;

		elem = Event.element(event);
		if (!elem)
			return;

		href = elem.getAttribute("href");
		if (!href)
			return;

		if (href.search(/%/)) href = unescape(href);

		// get match and find the user id from the href parameter in the link
		mmatch = this.urlMatch.exec(href);
		if (mmatch) {
			argument = mmatch[0].split('/');
			argument.reverse();
		}

		var request = new Ajax.Request(this.urltodisplay + argument[0], { method: 'get', onComplete: this.set_content });
		
		    //var mouse_x = Event.pointerX(event);
			//var mouse_y = Event.pointerY(event);
			var elempos = Element.cumulativeOffset(elem);
			//alert(elempos);
		    var mouse_x = elempos[0];
			var mouse_y = elempos[1];

			// decide if we need to switch sides for the tooltip
			var dimensions = this.userviewdiv.getDimensions();
			var windowsize = document.viewport.getDimensions();
			var element_width = dimensions.width ;
			var element_height = dimensions.height ;
	
			// on which side of the pointer the tool tip should be on
			// this.getWindowWidth() 
			if ( (element_width + mouse_x) >= ( windowsize[0] - this.options.delta_x) ){ // too big for X
				mouse_x = mouse_x - element_width - this.options.delta_x;
			} else {
				mouse_x = mouse_x + this.options.delta_x;
			}
			// this.getWindowHeight()
			if ( (element_height + mouse_y) >= ( windowsize[1] - this.options.delta_y) ){ // too big for Y
				mouse_y = mouse_y - element_height - this.options.delta_y;
			} else {
				mouse_y = mouse_y + this.options.delta_y;
			} 

			this.setStyles(mouse_x, mouse_y);

	},

	// set style to the userview_box
  setStyles: function(x, y){
    // set the right styles to position the tool tip
	Element.setStyle(this.userviewdiv, { position:'absolute',
	 								  top:y + "px",
	 								  left:x + "px",
									  zindex:this.options.zindex
	 								});
  }
  
} // end of class definition

// initialize userview for page onload
initUserView = function() { myUserView = new userView(); }
//function initUserView() { myUserView = new userView(); }
Event.observe(window, 'load', initUserView, false);

