Ver Mensaje Individual
  #1 (permalink)  
Antiguo 21/03/2013, 10:51
Samou
 
Fecha de Ingreso: junio-2009
Mensajes: 115
Antigüedad: 14 años, 10 meses
Puntos: 0
Slider como twitter

Hola a todos, estoy reciclando un codigo que me encontre por la red para generar un slider de twits parecido al de twitter con la diferencia de que no me interesa que este slider vaya aumentando de forma infinita sino que limitar el numero de entradas a 4. Una vez alcancazado ese numero de entradas quisiera que se vayan reemplazando esas 4 posiciones ya ocupadas por los nuevos twits. Actualmente tengo lo siguiente:
Código:
<div id="spinner"><img src="/_imgs/loading.gif" width="32" height="32" alt="loading"></div>
<div id="twitholder"></div>
	
function getTwits() {
	if(boolIdle) {
		boolIdle = false;
		new Ajax.Request('../getTwits.php', {
				method: 'post',
				parameters: {last: numLast, op: strOp, id: numObject},
				onSuccess: function(transport) {
					if(transport.responseText != -69) {
						var arrResultados = transport.responseText.evalJSON(), numResultados = arrResultados.length, elFather = $('twitholder'), elBloque, arrTwit, i, boolMore = false; 
						if(numResultados) {
							elBloque = new Element('div').hide();
							if(numLast > 0) {				
								for(i = numResultados - 1; i >= 0; i--) {
									arrTwit = arrResultados[i];	
									if(i === numResultados - 1) {
										numLast = arrTwit.ID;
									}
									addTwit(elBloque, arrTwit);						
								}
							} else {
								$('spinner').remove();
								for(i = 0; i < numResultados; i++) {
									arrTwit = arrResultados[i];	
									if(i === 0) {
										numLast = arrTwit.ID;
									}
									addTwit(elBloque, arrTwit);
								}
								numFirst = arrTwit.ID;
								boolMore = true;
							}
							elFather.insertBefore(elBloque, elFather.firstChild);
							Effect.BlindDown(elBloque, {duration: 0.7, afterFinish: function() {
																 if(boolMore && numResultados == 15) {
									addMore();
								}
															  }
								  }); 
						}
						boolIdle = true;
					} else {
						alert('Ha ocurrido un error al leer los mensajes.');
					}
				}
			}
		);
	}
}

function addTwit(elBloque, arrTwit) {
	var elDiv = new Element('div', {'class': 'twit'}), elContent, elControls, elBanda;
	elDiv.appendChild(new Element('div', {'class': 'avatar', 'autor': arrTwit.SCREEN_NAME}).update('<img src="' + (arrTwit.AVATAR !== '' ? arrTwit.AVATAR : 'http://www.markettwits.es/avatar')  + '">'));
	elContent = new Element('div', {'class': 'tcontent'});
		elContent.appendChild(new Element('div', {'class': 'autor', 'autor': arrTwit.SCREEN_NAME}).update('<a href="/friend/' + arrTwit.SCREEN_NAME + '" class="screen_name">' + arrTwit.SCREEN_NAME + '</a> <span class="name">' + arrTwit.AUTOR + '</span>'));
		elContent.appendChild(new Element('div', {'class': 'texto'}).update(arrTwit.TEXTO));
		elBanda = new Element('div', {'class': 'bar'});
			elBanda.appendChild(new Element('div', {'class': 'origen' + arrTwit.ORIGEN}));
			elBanda.appendChild(new Element('div', {'class': 'cuando'}).update(arrTwit.CUANDO));
		elControls = new Element('span', {'twit': arrTwit.ID}).addClassName('acciones');
			elControls.appendChild(new Element('a', {href: '#'}).addClassName('rt').update('<i></i><b>' + (arrTwit.ORIGEN === 't' ? 'retweet' : 'tweet') + '</b>')).observe('click', (arrTwit.ORIGEN === 't' ? retweet : tweet));
			elControls.appendChild(new Element('a', {href: '#', 'autor' : arrTwit.SCREEN_NAME}).addClassName('rp').update('<i></i><b>reply</b>').observe('click', reply));
			elControls.hide();
		elBanda.appendChild(elControls);
		elContent.appendChild(elBanda);
	elDiv.appendChild(elContent);
	elDiv.appendChild(new Element('div', {'class': 'break'}));
	elBanda.observe('mouseenter', controlShow);
	elBanda.observe('mouseleave', controlHide);
	elDiv.observe('mouseleave', controlHide);
	elBloque.appendChild(elDiv);
}


function controlShow(evt) {
	evt.element().descendants().each(function(node) {
			if(node.hasClassName('acciones')) {
				node.show();
				evt.stop();
				return;
			}
		}
	);
}

function controlHide(evt) {	
	evt.element().descendants().each(function(node) {
			if(node.hasClassName('acciones')) {
				node.hide();
				evt.stop();
				return;
			}
		}
	);
}
Pero actualmente tan solo logro que los twits se vayan acumulando no se me ocurre ninguna forma para q hagan lo que pretendo.
Muchas gracias por adelantado por vuestros comentarios, sugerencias...