/**
 *  vWidget - vSocial widgets
 *
 *  
 */


 var vWidgetBaseUrl = "http://gogreenchallenge.vespausa.com/widgets";
var vWidget = function( obj )
{
	this.url = vWidgetBaseUrl + "/json.php";

	this.params = {
		widgetType: "video", // video, friends or communities
		type: 		"new",
		channel:    "",
		template:   "default",
		rows:       1,
		columns:    3,
		transition: "toast", // toast only (should add scroll and fade)
		reflection: true
	};
	
	for(key in obj) { this.params[key] = obj[key]; }

	this.params.currentPage = 0;
	this.params.countPerPage = this.params.rows * this.params.columns * 9;
	
	this.params.instanceId = vWidget.Instances.length;
	
	vWidget.Instances[ this.params.instanceId ] = this;
	
	this.items = new Array();

	this.loadContainer();
	this.loadMoreResults();

	document.write("<di"+"v id='vWidget_"+this.params.instanceId+"'></di"+"v>");
}

/**
 *  vWidget Instances
 *
 *  Array containing the instances of each vWidget
 *  allows multiple widgets to be used on a single
 *	page
 */
if ( typeof vWidget.Instances == "undefined" )
{
	vWidget.Instances = new Array();	
}

/**
 *	vWidget loadMoreResults
 *
 *	Loads results 
 */
vWidget.prototype.loadMoreResults = function()
{
	vWidget.Json.load( this.url + "?" + vWidget.Json.serialize( this.params ) );
}

/**
 *	vWidget handleData
 *
 *	Takes returned data from Json call and loads
 *	it into the appropriate variables
 */
vWidget.prototype.handleData = function( obj )
{
	if ( obj.response == "success" )
	{
		for(i in obj.items)
		{
			this.items.push(obj.items[i]);
		}

		this.doPreloading();

		this.showImages();
	}
	else
	{
		var widget = this.getWidget();
		var obj = widget.getElementsByTagName("div");
			
		for(i = 0; i < obj.length; i++)
		{
			if (obj[i].getAttribute("id") == "vwidget-loading")
				obj[i].innerHTML = "Error loading images... retrying...";
		}	
		
		
		setTimeout( new Function("vWidget.Instances["+this.params.instanceId+"].loadMoreResults();"), 5000 );
	}
}


vWidget.prototype.showImages = function( retries )
{

	if (typeof retries == "undefined") retries = 0;
	
	this.currentPosition = this.params.currentPage * this.params.columns;
	
	var maxImage = this.currentPosition + this.params.columns;
	
	if (maxImage > this.items.length) maxImage = this.items.length - 1;
	
	for( var i = this.currentPosition; i < maxImage; i++ )
	{
		if (typeof this.items[i].imageObj == "undefined") this.preloadImage(i);
		
		var loaded = this.items[i].imageObj.isLoaded();
		
		if ( !loaded )
		{
			if (retries > 10) {
				this.items[i].imageObj = undefined;
				
				this.preloadImage(i);
				retries = 0;
			}
			
			var widget = this.getWidget();
	
			var obj = widget.getElementsByTagName("div");
			
			for(i = 0; i < obj.length; i++)
			{
				if (obj[i].getAttribute("id") == "vwidget-loading")
				{
					obj[i].innerHTML = "Loading";
					
					for(x=0;x<retries;x++)obj[i].innerHTML+=".";
				}
			}
			
			
			setTimeout( new Function( "vWidget.Instances["+this.params.instanceId+"].showImages("+(retries+1)+");"), 500);
			return;
		}
	}
	
	this.removeAllImages();
	
	for( i = this.currentPosition; i < maxImage; i++ )
	{
		var image, li = document.createElement("li"), a = document.createElement("a"), titlea = document.createElement("a"), title = document.createElement("div");
		
		a.href = this.items[i].url;
		titlea.href = this.items[i].url;
		
		a.title = this.items[i].text;
		titlea.title = this.items[i].text;
		
		this.items[i].imageObj.object.name = "vwidget_thumbnail";
		
		image = this.items[i].imageObj.getObject();
		
		image.style.top = "0px";

		title.innerHTML = this.items[i].text;

		title.className = "vwidget-text";
		title.style.opacity = "0.00001";
		
		titlea.appendChild( title );
		a.appendChild( image );
		
		
		li.appendChild( a );
		li.appendChild( titlea );
		
		li.style.position = "relative";
		
		this.getWidget().getElementsByTagName("ul").item(0).appendChild(li);
	}
	
	this.Effect.slideUp( this.getWidget() );
	
	setTimeout(new Function("vWidget.Instances["+this.params.instanceId+"].isChanging = false;"), 1000);
	
	this.hideLoading();
}

vWidget.prototype.showSource = function()
{
	var obj = document.createElement("div");
	
	var p = document.createElement("p");
	
	p.appendChild(document.createTextNode("To use the Javascript widget.  Paste the code below into your webpage wherever you want it to be shown.  That's it."));
	
	obj.appendChild(p);
	
	var code = document.createElement("input");
	code.style.width = "400px";
	code.onclick = function() { this.select(); }
	code.value = "<scr"+"ipt type='text/javascript' src='"+this.createSourceLink()+"'></scr"+"ipt>";
	
	obj.appendChild(code);

	Lightbox.show({content: obj});
}

vWidget.prototype.createSourceLink = function()
{
	return "http://gogreenchallenge.vespausa.com//widgets/?w="+this.params.widgetType+"&type="+this.params.type+"&tmpl="+this.params.template+"";
}

vWidget.prototype.removeAllImages = function()
{
	var widget = this.getWidget();

	var LIs = widget.getElementsByTagName("ul")[0];
	
	while( LIs.firstChild )
	{
		LIs.removeChild( LIs.firstChild );	
	}
}

/**
 *	vWidget doPreloading
 *
 *	starts the preloading process for every
 *	item in the items array
 */
vWidget.prototype.doPreloading = function()
{
	var currentItem = this.params.currentPage * ( this.params.columns * this.params.rows );
	
	for ( i = currentItem; i < currentItem + (this.params.columns*this.params.rows); i++ )
	{
		this.preloadImage( i );
	}
}

vWidget.prototype.preloadImage = function ( i )
{
	try
	{
		//if (typeof this.items[i] == "undefined") return;
				
		//if (typeof this.items[i].imageObj == "undefined")
		//{
			
			var title = this.items[i].text.split("<br />")[0];
			
			this.items[i].imageObj = new vWidget.Image( 
				{ 
					reflection: this.params.reflection, 
					src: this.items[i].image_url,
					title: title,
					url: this.items[i].url,
					initialState: "hidden",
					height: 100,
					width: 100
				} 
			);
		//}	
	} catch(e){}
}

vWidget.prototype.getWidget = function()
{
	return document.getElementById( "vWidget_" + this.params.instanceId );
}



vWidget.Json = {
	load: function( url, noajax )
	{
		if (typeof noajax == "undefined") noajax = false;
		
		if (typeof Ajax == "undefined") noajax = true;

		if ("http://gogreenchallenge.vespausa.com/" == "http://gogreenchallenge.vespausa.com/" && noajax == false)
		{
			vWidget.Json.loadAjax(url);
		} else {
			vWidget.Json.loadScript(url);
		}
	},
	loadAjax: function(url)
	{
		try{ new Ajax.Request( url, { onSuccess: function(transport) { eval(transport.responseText); } } ); }
		catch(e) { vWidget.Json.loadScript(url); }
	},

	loadScript: function(url)
	{
		var head = document.getElementsByTagName("head");
		
		if ( head[0] )
		{
			var scriptTag = document.createElement( "script" );
			scriptTag.setAttribute( "src", url );
			scriptTag.setAttribute( "type", "text/javascript" );
			
			head[0].appendChild( scriptTag );
		}
		else
		{
			document.write( "<sc"+"ript src='"+url+"' type='"+"text/javascript'></script>" );
		}
	},
	
	handle: function( obj )
	{
		//if (typeof obj.instanceId == undefined) obj.instanceId = 0;	
		if (obj["method"] == "container") {
			vWidget.Instances[obj.instanceId].showContainer(obj);
		}
		else
		{
			vWidget.Instances[obj.instanceId].handleData(obj);
		}
	},
	
	serialize: function( obj )
	{
		var string = "";
		
		for ( key in obj )
		{
			string += key + "=" + obj[key] + "&";
		}
		
		return string;
	}
};

vWidget.prototype.next = function()
{
	if (this.isChanging) return;
	
	this.isChanging = true;
	if ( (this.params.columns * this.params.rows) * this.params.currentPage + (this.params.columns * this.params.rows) >= this.items.length )
	{
		return;
	}
	
	this.Effect.slideDown( this.getWidget() );
	
	this.params.currentPage += 1;
	
	setTimeout( new Function("vWidget.Instances["+this.params.instanceId+"].showImages();"), 1200);
}

vWidget.prototype.prev = function()
{
	if (this.isChanging) return;
	
	this.isChanging = true;
	
	this.Effect.slideDown( this.getWidget() );

	this.params.currentPage -= 1;

	if (this.params.currentPage < 0) this.params.currentPage = 0;
	
	setTimeout( new Function("vWidget.Instances["+this.params.instanceId+"].showImages();") , 1200);
}

vWidget.prototype.showLoading = function()
{
	var obj = this.getWidget();
	
	obj = obj.getElementsByTagName("vwidget-loading");
	
	obj.style.display = "block";
}

vWidget.prototype.hideLoading = function()
{
	var widget = this.getWidget();
	
	var obj = widget.getElementsByTagName("div");
	
	for(i = 0; i < obj.length; i++)
	{
		if (obj[i].getAttribute("id") == "vwidget-loading")
			obj[i].style.display = "none";
	}
}

vWidget.prototype.loadContainer = function()
{
	vWidget.Json.load( this.url + "?" + vWidget.Json.serialize( this.params ) + "container=true" );
};

vWidget.prototype.showContainer = function( obj )
{
	var widget = this.getWidget();

	widget.innerHTML = obj.template;
};

vWidget.prototype.Effect = new Object();

vWidget.prototype.Effect.slideDown = function( widget )
{
	var imgs = widget.getElementsByTagName("div");
	
	for(i = 0; i < imgs.length; i++)
	{
		if (imgs[i].className == "vwidget-text")
			new Effect.Fade(imgs[i]);
	}

	var imgs = widget.getElementsByTagName("canvas");
	
	for(i = 0; i < imgs.length; i++)
	{
		new Effect.Move(imgs[i], { y: -50, mode: 'absolute' });
	}

	var imgs = widget.getElementsByTagName("img");
	
	for(i = 0; i < imgs.length; i++)
	{
		if (imgs[i].getAttribute("name") == "vwidget_thumbnail")
			new Effect.Move(imgs[i], { y: 100, mode: 'absolute' });
			
		if (imgs[i].getAttribute("name") == "vwidget_reflection")
			new Effect.Move(imgs[i], { y: -50, mode: 'absolute' });
	}
}

vWidget.prototype.Effect.slideUp = function( widget )
{
	var imgs = widget.getElementsByTagName("div");
	
	for(i = 0; i < imgs.length; i++)
	{
		if (imgs[i].className == "vwidget-text")
			new Effect.Appear(imgs[i]);
	}

	var imgs = widget.getElementsByTagName("canvas");
	
	for(i = 0; i < imgs.length; i++)
	{
		new Effect.Move(imgs[i], { y: 0, mode: 'absolute' });
	}

	var imgs = widget.getElementsByTagName("img");
	
	for(i = 0; i < imgs.length; i++)
	{
		if (imgs[i].getAttribute("name") == "vwidget_thumbnail")
			new Effect.Move(imgs[i], { y: 0, mode: 'absolute' });
			
		if (imgs[i].getAttribute("name") == "vwidget_reflection")
			new Effect.Move(imgs[i], { y: 0, mode: 'absolute' });
	}
}

	
	if (typeof Prorotype == undefined)
		vWidget.Json.load( vWidgetBaseUrl + "/v2/prototype.js", true );
	
	if (typeof Scriptaculous == undefined)
		vWidget.Json.load( vWidgetBaseUrl + "/v2/scriptaculous.js", true );
	
	vWidget.Json.load( vWidgetBaseUrl + "/v2/vWidget/Image.js", true );
	vWidget.Json.load( vWidgetBaseUrl + "/v2/effects.js", true );