This is how we roll

about 1 year ago - David Crean

var TickerManager = {
	ticker: null,
	elements: null,
	curElement: null,
	curElementIndex: 0,
	leftPosition: null,
	init: function() {
		this.ticker = $('ticker');
		this.elements = this.ticker.getElementsByTagName('li');
		this.leftPosition = YAHOO.util.Dom.getX(this.elements[this.curElementIndex]);
		this.addTriggers();
		this.animateTicker();
		setInterval('TickerManager.animateTicker()', 10000);
	},
	reorderElements: function(order) {
	
	},
	animateTicker: function() {
		if(this.curElement) {
			//move current element out of the way
			var scrollAnim = new YAHOO.util.Motion(this.curElement,{ points: { to: [this.leftPosition,250] } },1, YAHOO.util.Easing.easeOut);
			scrollAnim.animate();
			var opacityAnim = new YAHOO.util.Anim(this.curElement,{ opacity: { to: 0, from: 1 } },1, YAHOO.util.Easing.easeOut);
			opacityAnim.animate();
			this.curElementIndex = this.curElementIndex+1
		}
		this.curElement = this.elements[this.curElementIndex];
		this.curElement.style.top = '-40px';
		
		var scrollAnim = new YAHOO.util.Motion(this.curElement,{ points: { to: [this.leftPosition,200] } },1, YAHOO.util.Easing.easeOut);
		scrollAnim.animate();
		var opacityAnim = new YAHOO.util.Anim(this.curElement,{ opacity: { to: 1, from: 0 } },1, YAHOO.util.Easing.easeOut);
		opacityAnim.animate();
	},
	addTriggers: function() {
		var upArrow = $('ticker-up');
		var downArrow = $('ticker-down');
		
		YAHOO.util.Event.addListener(upArrow, 'click', TickerManager.reorderElements, 'up');
		YAHOO.util.Event.addListener(upArrow, 'click', TickerManager.reorderElements, 'down');
	}
}

These things just make sense to me sometimes.

Tags: javascript web design ticker UI

Moving threads...

about 1 year ago - David Crean

For a personal project of mine I'm attempting to do a live update thing. It should be fairly simple, I go and retrieve the most recently updated threads in order that they were updated and inject them to the top of the list... removing the duplicate from the list of threads. Basically, it's a quick way for people to see threads as they come in. It will be handle on those rare occasions that people are all posting at once. I can have it run every 20-30 secs and update the list for people.

For some reason, my splice code is not working. It's not really the friendliest of codes, but it should be working... it's quiet perplexing.

for(i = 0; i < topicLim; i++) {
                        topic_id = getTag(topics[i],"id");
                        topic_list[i] = topic_id
                        for(j = 0; j < cur_topic_list.length; j++) {
                                if(cur_topic_list[j] == topic_id) {
                                        cur_topic_list = cur_topic_list.splice(j,1);
                                        topic_table.deleteRow(j+row_count);
                                }
                        }
                        ThreadManager.addTopic(topics[i],row_count);
                        row_count++;
                        if(document.title.match(/^\(\*\)/) != '(*)') {
                                document.title = '(*) '+ document.title;
                        }
                }

Tags: web design javascript programming ooboos