dishy.js

google的search的api 以及其demo 使用ajax的 dwr+prototype技术实现

/**
 * dishy工作步骤：
 * 1.使用提供的参数访问使用del.icio.us JSON REST API的URL
 * 2.执行返回的字符串
 * 3.将执行后的数据进行封装、调用callback方法
 **/
dishy ={
	//JSON回应格式
	//[{"u":"http://blog.matrix.org.cn//cleverpig/entry/20061214","d":"如何定制Roller blog","t":["定制","自定义","主题","Roller","blog","feed","美味书签","flickr","badge"]},{"u":"http://blog.matrix.org.cn//cleverpig/entry/%E8%B0%81%E5%81%B7%E8%B5%B0%E4%BA%86%E6%88%91%E4%BB%AC%E7%9A%84%E5%B9%B8%E7%A6%8F%E6%84%9F","d":"谁偷走了我们的幸福感？！","t":["AJAX","广告","adsense","ad"]},{"u":"http://blog.matrix.org.cn//cleverpig/entry/matrix_club_flickr%E6%88%90%E7%AB%8B","d":"Matrix Club@Flickr成立","t":["Matrix","Club","Flickr","成立"]},{"u":"http://blog.matrix.org.cn//cleverpig/entry/%E4%BA%89%E8%AE%BA_ajax%E6%8A%80%E6%9C%AF%E6%98%AF%E5%90%A6%E5%8D%B3%E5%B0%86%E6%B2%A1%E8%90%BD","d":"争论：Ajax技术是否即将没落？","t":["Ajax","技术","没落","微软","Expression","孟岩","Ruby"]},{"u":"http://blog.matrix.org.cn//cleverpig/entry/%E4%B8%BAaop%E6%B3%A8%E5%85%A5%E5%9B%A2%E9%98%9F%E6%B4%BB%E5%8A%9B","d":"为AOP注入团队活力","t":["AOP","编程","模式","OT/J","模块化编程","ObjectTeams","Java"]},{"u":"http://blog.matrix.org.cn//cleverpig/entry/linux%E4%B8%8B%E7%9A%84vnc%E8%AE%BE%E7%BD%AE","d":"Linux下的VNC设置","t":["Linux","VNC","远程登录","桌面环境"]},{"u":"http://blog.matrix.org.cn//cleverpig/entry/20061213","d":"去pikipimp给自己化妆","t":["pikipimp","化妆","网站"]},{"u":"http://blog.matrix.org.cn//cleverpig/entry/200612131","d":"to fajaven：关于Roller ReadMore插件的使用","t":["Roller","ReadMore","插件","使用"]},{"u":"http://www.matrix.org.cn/resource/article/2006-12-08/ab918451-8669-11db-b1d1-19025991d682.html#","d":"2007年web开发技术预言 - [Matrix - 与 Java 共舞]","t":["2007年","web开发","技术","预言"]},{"u":"http://www.flickr.com/groups/matrixclub/","n":"Matrix与java共舞\r\n全球Matrixer的photo汇聚、Matrixer个人show俱乐部","d":"Flickr: Matrix Club","t":["Matrix","java","Matrix与java共舞","personal","show","photo"]}]
	//del.icoi.us的ID
	owner:'cleverpig',
	//tagcloud的文字最小size
	fontMin:13,
	//tagcloud的文字最大size
	fontMax:30,
	//用来获取tagcloud的tag数量
	amountOfTags:20,
	//boolean值，表示每个tag是否括号中显示连接数量
	showAmount:true,
	//回调方法
	callback:null,
	//用于过滤tag的description字符串
	descriptionFilter:'',
	//使用xFolk microformat组装在一起的内嵌链接列表
	tagHTML:[],
	//最新的链接作为成员的对象数组
	tagFeed:[],
	//用于tagcloud，包含tag和使用它们的链接数量的对象
	tags:[],
	//用于google Search的tags的字符串形式：以空格分隔
	tagStr:'',
	//用来处理浏览器兼容性的XMLHTTPRequest
	http_request:false,
	/**
	 * 接收最新的tag链接，并在处理后调用回调方法
	 */
	getLatest:function(){
		var url = 'http://del.icio.us/feeds/json/'+dishy.owner+'?raw&callback=dishy.feedLatest';
		dishy.engage(url);
	},
	/**
	 * 处理最新的tag链接，调用回调方法
	 * @param 调用del.icio.us JSON REST API返回的字符串
	 */
	feedLatest:function(o){
		dishy.latest=o;
		var out = dishy.xFolkify(o);
		dishy.latestHTML=out;
		if(dishy.callback !== null){
			eval(dishy.callback+'()');
			dishy.callback = null;
		}
	},
	/**
	 * 根据des参数过滤接收tag链接，并在处理后调用回调方法
	 */
	getTagsByDesFilter:function(){
		var url = 'http://del.icio.us/feeds/json/'+dishy.owner+'?raw&callback=dishy.getFeedTagsByDesFilter';
		dishy.engage(url);
	},
	/**
	 * 处理tag链接，调用回调方法
	 * @param 调用del.icio.us JSON REST API返回的字符串
	 */
	getFeedTagsByDesFilter:function(o){
		dishy.latest=o;
		dishy.tags = dishy.findTagsByJSONResponse(o);
		if(dishy.callback !== null){
			eval(dishy.callback)(dishy.tags);
			dishy.callback = null;
		}
	},
	/**
	 * 使用descriptionFilter对del.icio.us JSON REST API返回的字符串进行过滤，取出d为descriptionFilter的tag数组
	 * @param 调用del.icio.us JSON REST API返回的字符串
	 * @return d为descriptionFilter的tag数组
	 */
	findTagsByJSONResponse:function(o){
		for (var k in o) {
			if (o[k].d==dishy.descriptionFilter){
				return o[k].t;
			}
		}
		return null;
	},
	/**
	 * 接收与某个指定的tag相关的链接，并在处理后调用回调方法
	 */
	getByTag:function(tag){
		var url = 'http://del.icio.us/feeds/json/'+dishy.owner+'/'+tag+'?raw&callback=dishy.feedByTag';
		dishy.currentTag=tag;
		dishy.engage(url);
	},
	/**
	 * 处理与某个指定的tag相关的tag链接，调用回调方法
	 * @param 调用del.icio.us JSON REST API返回的字符串
	 */	
	feedByTag:function(o){
		dishy.tagFeed[dishy.currentTag]=o;
		var out = dishy.xFolkify(o);
		dishy.tagHTML[dishy.currentTag] = out;
		if(dishy.callback !== null){
			eval(dishy.callback+'()');
			dishy.callback = null;
		}
	},
	/**
	 * 接收所有的tag链接，并在处理后调用回调方法
	 */
	getTags:function(){
		var url = 'http://del.icio.us/feeds/json/tags/'+dishy.owner+'?raw';
		if(dishy.amountOfTags!==null){url+='&count='+dishy.amountOfTags;}
		url+='&sort=alpha&callback=dishy.feedTags';
		dishy.engage(url);
	},
	/**
	 * 处理所有的的tag链接，调用回调方法
	 * @param 调用del.icio.us JSON REST API返回的字符串
	 */	
	feedTags:function(o){
		dishy.tags=o;
		var out = [];
		for (var k in o) {
			if(o[k]<dishy.fontMin){
				var size = dishy.fontMin;
			} 
			if(o[k]>dishy.fontMin){
				var size = dishy.fontMax;
			} 
			if(o[k]>dishy.fontMin && o[k]<dishy.fontMax){
				var size = o[k];
			} 
			var tag = '<a rel="tag" style="font-size:'+size+'px" href="http://del.icio.us/'+dishy.owner+'/'+k+'">'+k;
			tag+= dishy.showAmount===true?'('+o[k]+')':'';
			tag+='</a> ';
			out.push(tag);
		}
		out = out.join('');
		dishy.tagsHTML=out;
		if(dishy.callback !== null){
			eval(dishy.callback+'()');
			dishy.callback = null;
		}
	},
	/**
	 * 组合方法：访问url，并执行其返回内容
	 * @param url
	 */
	engage:function(url){
		if (window.navigator.appName.indexOf('Microsoft')>=0){
			dishy.engageForIE(url);
		}
		else if (window.navigator.appName.indexOf('Netscape')>=0){
			dishy.engageForMozzila(url);
		}
		else{
			alert('can\'t get browser version:'+window.navigator.appName);
		}
	},
	//不兼容IE
	engageForMozzila:function(url){
		var s = document.createElement('script');
		s.setAttribute('src', url);
		s.setAttribute('type','text/javascript');
		document.getElementsByTagName('head')[0].appendChild(s);
	},
	//不兼容FireFox,因为FireFox的XMLHTTPRequest在open时，对跨域访问抛出“权限不足的错误”
	//这里使用prototype.js的AjaxRequest没有回应
	engageForIE:function(url){
		var parameters='';
		dishy.http_request = false;
      	if (window.XMLHttpRequest) { // Mozilla, Safari,...
        	dishy.http_request = new XMLHttpRequest();
			if (dishy.http_request.overrideMimeType) {
            	dishy.http_request.overrideMimeType('text/html');
			}
		}
		else if (window.ActiveXObject) { // IE
			try {
            	dishy.http_request = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e) {
				alert(e.description);
            	try {
               		dishy.http_request = new ActiveXObject("Microsoft.XMLHTTP");
	            } catch (e) {
					alert(e.description);
				}
         	}
      	}
      	if (!dishy.http_request) {
         	alert('Cannot create XMLHTTP instance');
         	return false;
      	}
      	dishy.http_request.onreadystatechange = dishy.requestCallback;
		try{
	      	dishy.http_request.open('GET', url + parameters, true);
     	 	dishy.http_request.send(null);
		} catch (e) {
			alert(e+":"+e.description);
		}
		
   },
   //engageForIE中使用的http_request的回调方法
   requestCallback:function () {
	   if (dishy.http_request.readyState == 4) {
		   if (dishy.http_request.status == 200) {
			   //alert(http_request.responseText);
			   eval(dishy.http_request.responseText);
		   }
		   else {
			   alert('There was a problem with the request.');
			}
      	}
	},
	/**
	 * 根据del.icio.us JSON REST API返回的字符串，构造ul+li的层次结构html代码
	 * @param 调用del.icio.us JSON REST API返回的字符串
	 * @return ul+li的层次结构html代码
	 */
	xFolkify:function(o){
		var out = [];
		for (var k in o) {
			var entry ='<li class="xfolkentry"><a class="taggedlink" href="'+o[k].u+'">'+o[k].d+'</a>';
			if(o[k].n!==undefined){
				entry+= '<p class="description">'+o[k].n+'</p>';
			}
			entry+='<ul class="meta">';
			for(var i=0;i<o[k].t.length;i++){
				entry+='<li><a rel="tag" href="http://del.icio.us/'+dishy.owner+'/'+o[k].t[i]+'">'+o[k].t[i]+'</a></li>'
			}
			entry+='</ul></li>';
			out.push(entry);
		}
		out = out.join('');
		return out;
	}
}