webqq.js

JavaScript ext2样式,ok!

/**
 * @author Darkness
 * 
 * 使用Ext2.0构造一个 WebQQ面板
 */
WebQQWin = function() {
	var win;

	// This just creates a window to wrap the login form.
	// The login object is passed to the items collection.
	var buildWin = function() {
		// 构建一个窗口面板容器
		win = new Ext.Window({
			el : 'qq-win',// 把该面板绑定于win这个DIV对象上
			id : 'qq-win',
			title : '--WebQQ',
			collapsible : true,
			width : 250,
			height : 400,
			iconCls : 'qq',
			shim : false,
			style : "margin-top:5px;margin-left:5px;float: right;",
			animCollapse : false,
			constrainHeader : true,
			tbar : [{
				text : '',
				tooltip : {
					title : '',
					text : ''
				},
				iconCls : 'connect'
			}, '-', {
				text : '添加',
				tooltip : '添加一个好友',
				iconCls : 'user-add'
			}, '-', {
				text : '删除',
				tooltip : '删除选中的好友',
				iconCls : 'user-delete'
			}],

			layout : 'accordion',
			border : false,
			layoutConfig : {
				animate : false
			},

			items : [new Ext.tree.TreePanel({
				id : 'im-tree',
				title : 'QQ好友',enableDD: true,
				loader : new Ext.tree.TreeLoader({dataUrl: '/AsyncTreeNode/tree.jsp'}),
//				rootVisible : false,
				lines : false,
				autoScroll : true,
				tools : [{
					id : 'refresh',
					on : {
						click : function() {
							var tree = Ext.getCmp('im-tree');
							tree.body.mask('Loading', 'x-mask-loading');
							tree.root.reload();
							tree.root.collapse(true, false);
							setTimeout(function() { // mimic a server call
										tree.body.unmask();
										tree.root.expand(true, true);
									}, 1000);
						}
					}
				}],
				root : new Ext.tree.AsyncTreeNode({
					id: "Darkness",
			        text:"暗之幻影",
			        qtip:'管理员',
			        icon: 'images/user_suit.gif'
				})
			}), {
				title : '通讯录',
				html : '<p>//ToDo</p>',
				autoScroll : true
			}, {
				title : '交流群',
				html : '<p>//ToDo</p>'
			}, {
				title : '我的设置',
				html : '<p>//ToDo</p>'
			}]
		});
	};
	return {
		init : function() {
			Ext.BLANK_IMAGE_URL = 'plugins/extjs/ext-2.0/resources/images/default/s.gif';
			Ext.QuickTips.init();//初始化鼠标停留时的显示框
			Ext.form.Field.prototype.msgTarget = 'side';
			buildWin();
			// 最后把窗口面板显示出来
			win.show();
		}
	}
}();


// 当当前页面DOM加载完毕后,在WebQQWin作用域内执行WebQQWin.init.
Ext.onReady(WebQQWin.init, WebQQWin);