shashi · April 21, 2009 14:15
diff --git a/tickr.html b/tickr.html
 <html>
 <head>

 <title>Identi.ca &raquo Real-Timeline</title>

 <!--jQuery-->
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> 

 <!--Main Script-->
 <script>
 $(document).ready( function() {
 	jQuery.getJSON("http://identi.ca/api/statuses/public_timeline.json?callback=?" ,
 	function(timel) {
 		var last=timel[0].id;
 		timel.reverse();
 		$(timel).each(function (ntc,da){loadlis(da);});
 		updayt(last);
 	});
 });

 function updayt(lst) {
 	jQuery.getJSON("http://identi.ca/api/statuses/public_timeline.json?since_id="+lst+"&callback=?",
 	function(timl) {
 		if(timl!=""){
 			lst=timl[0].id;
 			timl.reverse();
 			$(timl).each(function (ntc,da) {loadlis(da);});
 		}
 	setTimeout(function () {updayt(lst);},1000);
 	});
 }

 function loadlis(da) {
 	var txt='';
 	var link='';
 	var tends=[' ',':',',','!','(',')','.','?'];
 	var protocols = [['http://','http://',[' ']],
 			['https://','https://',[' ']],
 			['@','http://identi.ca/',tends],
 			['#','http://identi.ca/tag/',tends],
 			['!', 'http://identi.ca/group/',tends]];
 	var links = [];
 	for (var i=0;i<protocols.length;i++) { 
 		var p=0; 
 		while (da.text.indexOf(protocols[i][0],p)>=0) {
 			var s=da.text.indexOf(protocols[i][0],p);
 			var ends=protocols[i][2];
 			var e,f;
 			for(var j=0;j<ends.length;j++) { 
 				f=da.text.indexOf(ends[j],s+1); 
 				if (j==0) e=da.text.length; 
 				if (f > -1 && f < e) e=f;
 			}
 			if (e<0) e=da.text.length;
 			if(s+1<e) {
 				link=da.text.substring(s,e); 
 				links.push([link,'<a href="'+link.replace(protocols[i][0],protocols[i][1]) +'">'+link+'</a>']);
 			}
 			p=e;
 		} //while
 	} //for
 	for (var i=0;i<links.length;i++) da.text=da.text.replace(links[i][0],links[i][1]);
 	var e=$("<li><div class='meta'><img class='ppl' src='http://identi.ca/"+da.user.screen_name+"/avatar/24'/><br/>"+"<a href='http://identi.ca/"+da.user.screen_name+"'>"+da.user.screen_name+"</a><small><br/>at "+da.created_at.split(" ")[3] +"</small></div> <span class='txt'>" +
 		da.text+"</span><p class='clr'></p></li>");
 	e.prependTo(".timeline").hide().slideDown(1000);
 	$(".timeline li:eq(15)").remove();
 	$(".timeline li:eq(14)").css({border:"none"});
 }

 function pst(){
 }
 </script> 
 <style> 
 .clr{
 clear:both;
 }
 .ppl {
 height:24px;
 width:24px;
 border:solid 1px #999;
 }
 .meta{
 width:96px;
 margin-right:20px;
 float:left;
 color:#777;
 text-align:right;
 }
 body {
 font-family:'Trebuchet MS';
 background-color:black;
 }
 .timeline, textarea, input, .foot{
 -moz-border-radius:5px;
 -webkit-border-radius:5px;
 -khtml-border-radius:5px;
 border-radius:5px;
 }
 .timeline li:hover{
 background:#f9f9f9;
 }
 .timeline{
 background-color:white;
 margin:40px;
 padding:40px;
 }
 .input{
 text-align:right;
 margin:0px 20px -80px 0px;
 }
 .txt {
 display:block;
 }
 li {
 list-style:none;
 margin:0px auto;
 padding:8px;
 padding-right: 20%;
 border-bottom:1px dashed #ccc;
 }
 .send {
 margin:-10px 10px;
 padding-top:8px;
 }
 a{
 color:#999;
 }
 .foot {
 margin:-20px 40px 10px 40px;
 padding:5px;
 font-size:11px;
 background: #333;
 color:#aaa;
 }
 .tickr{
 margin:29px 50px;
 font-size:40px;
 position:absolute;
 color:white;
 }
 .desc{
 font-size:13px;
 font-style:italic;
 }
 </style>
 </head>
 <body>
 <div class='tickr'>tickr <span class='desc'>&raquo; the real identi.ca</span></div>

 <div class="input">
 <form id="form_notice" action="http://identi.ca/notice/new" method="post">
 <textarea id="txt" id="notice_data-text" name="status_textarea" rows="5" cols="22"></textarea><br/>
 <a class='lnk' href="http://identi.ca/main/login" target="_blank">login</a><input type="button" value="Post" class="send" onClick=''></input></form></div>
 <ul class="timeline"></ul>

 <div class="foot">&copy; <a href="http://identi.ca/g0">@g0</a> &amp; <a href="http://identi.ca/manco">@manco</a> ;) <a href="http://creativecommons.org/licenses/by/3.0/">CCA 3.0</a> | <a href="http://gist.github.com/99165">source</a></div>

 </body>
 </html>
	<html>
	<head>

	<title>Identi.ca &raquo Real-Timeline</title>

	<!--jQuery-->
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>

	<!--Main Script-->
	<script>
	$(document).ready( function() {
	jQuery.getJSON("http://identi.ca/api/statuses/public_timeline.json?callback=?" ,
	function(timel) {
	var last=timel[0].id;
	timel.reverse();
	$(timel).each(function (ntc,da){loadlis(da);});
	updayt(last);
	});
	});

	function updayt(lst) {
	jQuery.getJSON("http://identi.ca/api/statuses/public_timeline.json?since_id="+lst+"&callback=?",
	function(timl) {
	if(timl!=""){
	lst=timl[0].id;
	timl.reverse();
	$(timl).each(function (ntc,da) {loadlis(da);});
	}
	setTimeout(function () {updayt(lst);},1000);
	});
	}

	function loadlis(da) {
	var txt='';
	var link='';
	var tends=[' ',':',',','!','(',')','.','?'];
	var protocols = [['http://','http://',[' ']],
	['https://','https://',[' ']],
	['@','http://identi.ca/',tends],
	['#','http://identi.ca/tag/',tends],
	['!', 'http://identi.ca/group/',tends]];
	var links = [];
	for (var i=0;i<protocols.length;i++) {
	var p=0;
	while (da.text.indexOf(protocols[i][0],p)>=0) {
	var s=da.text.indexOf(protocols[i][0],p);
	var ends=protocols[i][2];
	var e,f;
	for(var j=0;j<ends.length;j++) {
	f=da.text.indexOf(ends[j],s+1);
	if (j==0) e=da.text.length;
	if (f > -1 && f < e) e=f;
	}
	if (e<0) e=da.text.length;
	if(s+1<e) {
	link=da.text.substring(s,e);
	links.push([link,'<a href="'+link.replace(protocols[i][0],protocols[i][1]) +'">'+link+'</a>']);
	}
	p=e;
	} //while
	} //for
	for (var i=0;i<links.length;i++) da.text=da.text.replace(links[i][0],links[i][1]);
	var e=$("<li><div class='meta'><img class='ppl' src='http://identi.ca/"+da.user.screen_name+"/avatar/24'/><br/>"+"<a href='http://identi.ca/"+da.user.screen_name+"'>"+da.user.screen_name+"</a><small><br/>at "+da.created_at.split(" ")[3] +"</small></div> <span class='txt'>" +
	da.text+"</span><p class='clr'></p></li>");
	e.prependTo(".timeline").hide().slideDown(1000);
	$(".timeline li:eq(15)").remove();
	$(".timeline li:eq(14)").css({border:"none"});
	}

	function pst(){
	}
	</script>
	<style>
	.clr{
	clear:both;
	}
	.ppl {
	height:24px;
	width:24px;
	border:solid 1px #999;
	}
	.meta{
	width:96px;
	margin-right:20px;
	float:left;
	color:#777;
	text-align:right;
	}
	body {
	font-family:'Trebuchet MS';
	background-color:black;
	}
	.timeline, textarea, input, .foot{
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius:5px;
	}
	.timeline li:hover{
	background:#f9f9f9;
	}
	.timeline{
	background-color:white;
	margin:40px;
	padding:40px;
	}
	.input{
	text-align:right;
	margin:0px 20px -80px 0px;
	}
	.txt {
	display:block;
	}
	li {
	list-style:none;
	margin:0px auto;
	padding:8px;
	padding-right: 20%;
	border-bottom:1px dashed #ccc;
	}
	.send {
	margin:-10px 10px;
	padding-top:8px;
	}
	a{
	color:#999;
	}
	.foot {
	margin:-20px 40px 10px 40px;
	padding:5px;
	font-size:11px;
	background: #333;
	color:#aaa;
	}
	.tickr{
	margin:29px 50px;
	font-size:40px;
	position:absolute;
	color:white;
	}
	.desc{
	font-size:13px;
	font-style:italic;
	}
	</style>
	</head>
	<body>
	<div class='tickr'>tickr <span class='desc'>» the real identi.ca</span></div>

	<div class="input">
	<form id="form_notice" action="http://identi.ca/notice/new" method="post">
	<textarea id="txt" id="notice_data-text" name="status_textarea" rows="5" cols="22"></textarea><br/>
	<a class='lnk' href="http://identi.ca/main/login" target="_blank">login</a><input type="button" value="Post" class="send" onClick=''></input></form></div>
	<ul class="timeline"></ul>

	<div class="foot">© <a href="http://identi.ca/g0">@g0</a> & <a href="http://identi.ca/manco">@manco</a> ;) <a href="http://creativecommons.org/licenses/by/3.0/">CCA 3.0</a> \| <a href="http://gist.github.com/99165">source</a></div>

	</body>
	</html>