var strDirBackground = 'http://www.closeup.com.br/2009/site/arquivos/artmash/';
var strDirAvatar = 'http://www.closeup.com.br/2009/site/arquivos/avatar_participantes/';

var artMash = {
	intIndexAnterior: undefined,
	intIndexAtivo: undefined,
	intIdAtivo: undefined,

	_load: function(limite, funcAcao) {
		new Ajax.Request('http://www.closeup.com.br/2009/site/scripts/json/artmash.php?limite=' + limite, {
			onComplete: (function(transport) {
				this.arrDados = transport.responseText.evalJSON();

				if (Object.isFunction(funcAcao))
					funcAcao.bind(this)();

			}).bind(this)
		});
	},

	loadArtMash: function() {
		this._load(null, function() {

			var objDado = this.arrDados[0];

			var strBackgroundImage = strDirBackground + objDado.idArtMash + '.jpg';
			var strAvatarImage = strDirAvatar + objDado.thumb_part;
			var strAvatarTitulo = '<p>Fundo criado por ' + objDado.nomeArtista + '</p><a target="_blank" href="http://' + objDado.urlSite + '">' + objDado.urlSite + '</a>';

			var objPreloadBackground = new Element('img');
			objPreloadBackground.onload = function() {
				$('fundo-participante').src = this.src;
				$('fundo-participante').setStyle({visibility: 'visible'});
			}
			objPreloadBackground.src = strBackgroundImage;

			var objPreloadAvatar = new Element('img');
			objPreloadAvatar.onload = function() {
				$('avatar-participante').src = this.src;
				$('avatar-participante').setStyle({visibility: 'visible'});
				$('avatar-participante').onclick = function() {
					artMash.changeArtMash(0);
				};
				$('avatar-participante').title = 'Fundo criado por '+objDado.nomeArtista;
			}
			objPreloadAvatar.src = strAvatarImage;

			$('info-fundo-participante').update(strAvatarTitulo);
			var tbody = new Element('tbody');

			this.arrDados.each((function(objDado, intIndex) {
				//Verifica se e o item 0 do 
				//objeto e para de executar
				/*if (intIndex == 0)
					return true;*/
				
				var row = new Element('tr');

				var strAvatarImage = strDirAvatar + objDado.thumb_part;
				var strAvatarTitulo = '<strong>' + objDado.nomeArtista + '</strong><p><a target="_blank" href="http://' + objDado.urlSite + '">' + objDado.urlSite + '</a></p>';
				var strAvatarLink = '<a href="javascript:;" onclick="artMash.changeArtMash(' + intIndex + ');"><img src="http://www.closeup.com.br/2009/site/media/images/artmash-ver.gif" /></a>';

				if (intIndex == 1) {
					var objPreloadAvatar = new Element('img');
					objPreloadAvatar.onload = function() {
						$('avatar-participante-top').src = this.src;
						$('avatar-participante-top').setStyle({visibility: 'visible'});
						$('avatar-participante-top').onclick = function() {
							artMash.changeArtMash(1);
						};
						$('avatar-participante-top').title = 'Fundo criado por ' + objDado.nomeArtista;
					}
					objPreloadAvatar.src = strAvatarImage;
				}

				if (intIndex % 2 == 0) {
					row.className = "variacao";
					var lineAvatar = new Element('td', {className: 'avatar'});
					var lineAvatarVariacao = new Element('td', {className: 'avatar'}).update('<a href="javascript:;" onclick="artMash.changeArtMash(' + intIndex + ');"><img src="'+strAvatarImage+'" title="Fundo criado por '+objDado.nomeArtista+'" /></a>');
					var lineDescricao = new Element('td', {className: 'descricao'}).update(strAvatarTitulo);
					var lineVer = new Element('td', {className: 'btn-ver'}).update(strAvatarLink);
					row.insert({ bottom: lineAvatar });
					row.insert({ bottom: lineAvatarVariacao });
					row.insert({ bottom: lineDescricao });
					row.insert({ bottom: lineVer });
				}
				else {
					var lineAvatar = new Element('td', {className: 'avatar'}).update('<a href="javascript:;" onclick="artMash.changeArtMash('+intIndex+');"><img src="'+strAvatarImage+'" title="Fundo criado por '+objDado.nomeArtista+'" /></a>');
					var lineDescricao = new Element('td', {className: 'descricao', colSpan: '2'}).update(strAvatarTitulo);
					var lineVer = new Element('td', {className: 'btn-ver'}).update(strAvatarLink);
					row.insert({ bottom: lineAvatar });
					row.insert({ bottom: lineDescricao });
					row.insert({ bottom: lineVer });
				}

				tbody.insert(row);

			}).bind(this));
			$('table-participantes').insert(tbody);
		});
	},

	loadHome: function() {
		this._load(10, function() {
			var intParticipante = 1;

			this.arrDados.each((function(objDado, intIndex) {
				//Vefifica se e o usuario é ativo e nao escreve ele novamente
				if (this.intIdAtivo == objDado.idArtMash) {
					this.intIndexAtivo = intIndex;

					return true;
				}

				$('outros-participantes-' + intParticipante).setStyle({visibility: 'visible'});

				var strAvatarImage = strDirAvatar + objDado.thumb_part;
				var strAvatarTitulo = 'Fundo criado por ' + objDado.nomeArtista;

				var objPreload = new Element('img');
				objPreload.onload = function() {
					var _intPart = (this.intParticipante || intParticipante);
					var _avatarPart = (this.strAvatarTitulo || strAvatarTitulo);

					var objParticipante = $('outros-participantes-' + _intPart);

					objParticipante.src = this.src;
					objParticipante.removeClassName('opacity');
					objParticipante.title = _avatarPart;

					objParticipante.onmousedown = function() {
						this.className += ' opacity';
					}

					objParticipante.onmouseout = function() {
						$(this).removeClassName('opacity');
					}

					objParticipante.onclick = function() {
						artMash.changeHome(this, intIndex);
					};
				};

				objPreload.src = strAvatarImage;
				objPreload.intParticipante = intParticipante;
				objPreload.strAvatarTitulo = strAvatarTitulo;

				intParticipante++;
			}).bind(this));
		});
	},

	_change: function (intIndexAtivar, after) {
		this.intIndexAnterior = this.intIndexAtivo;
		this.intIndexAtivo = intIndexAtivar;

		var objDado = this.arrDados[this.intIndexAtivo];
		var strBackgroundImage = strDirBackground + objDado.idArtMash + '.jpg';

		GA.track('/site/artmash/fundo/' + objDado.nomeArtista.replace(/\s/g, '_'));

		var objPreload = new Element('img');
		objPreload.onload = function() {
			$("background").setStyle({backgroundImage: 'url('+this.src+')', backgroundColor: '#'+objDado.bgcolor});
		};
		objPreload.src = strBackgroundImage;

		new Ajax.Request('http://www.closeup.com.br/2009/site/artmash_background.php?idArtMash=' + objDado.idArtMash);

		if (Object.isFunction(after)) {
			after.bind(this)();
		}
	},
	
	changeHome: function(objAnterior, intIndexAtivar) {
		this._change(intIndexAtivar, function() {
			var strAvatarImage;

			var objDadoAtivo = this.arrDados[this.intIndexAtivo];
			var strAvatarTexto = 'Fundo criado por '+objDadoAtivo.nomeArtista+'<br /><a href="http://'+objDadoAtivo.urlSite+'" target="_blank">'+objDadoAtivo.urlSite+'</a>';
			strAvatarImage = strDirAvatar + objDadoAtivo.thumb_part;

			var objPreloadAtivo = new Element('img');
			objPreloadAtivo.onload = function() {
				$('participante-autor-imagem').src = this.src;
				$('participante-autor-imagem').title = 'Fundo criado por '+objDadoAtivo.nomeArtista;
				$('participante-autor-texto').update(strAvatarTexto);
			};
			objPreloadAtivo.src = strAvatarImage;

			var objDadoAnterior = this.arrDados[this.intIndexAnterior];
			var intIndex = this.intIndexAnterior;
			var strAvatarTitulo = 'Fundo criador por ' + objDadoAnterior.nomeArtista;
			strAvatarImage = strDirAvatar + objDadoAnterior.thumb_part;

			var objPreloadAnterior = new Element('img');
			objPreloadAnterior.onload = function() {
				objAnterior.src = this.src;
				objAnterior.title = strAvatarTitulo;
				objAnterior.removeClassName('opacity');
				objAnterior.onclick = function() {
					artMash.changeHome(this, intIndex);
				};
			};
			objPreloadAnterior.src = strAvatarImage;
		});
	},

	changeArtMash: function(intIndexAtivar) {
		this._change(intIndexAtivar);
	}
};