前端 - Kele's Home

如何用js获取服务器时间做倒计时

作者：发布时间：September 8, 2010 分类：前端

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>untitled</title>
<script type="text/javascript">
	get=function (id){return document.getElementById(id)}
	if(document.all){
	    window.XMLHttpRequest=function(){
	        var get=['Microsoft.XMLHTTP','Msxml2.XMLHTTP'];
			for(var i=0;i<get.length;i++){try{return new ActiveXObject(get[i])}catch(e){}};
	    };
	}
	webDate=function(fn){
		var Htime=new XMLHttpRequest();
		Htime.onreadystatechange=function(){Htime.readyState==4&&(fn(new Date(Htime.getResponseHeader('Date'))))};
		Htime.open('HEAD', '/?_='+(-new Date));
		Htime.send(null);
	}
	window.time=new Date();
	targetTime=new Date();
	time2String=function (t){
			with(t)return [getFullYear(),'年'
				,('0'+(getMonth()+1)).slice(-2),'月'
				,('0'+getDate()).slice(-2),'日 '
				,('0'+getHours()).slice(-2),': '
				,('0'+getMinutes()).slice(-2),': '
				,('0'+getSeconds()).slice(-2)].join('')
	}
	int2time=function (m){
		m-=(D=parseInt(m/86400000))*86400000;
		m-=(H=parseInt(m/3600000))*3600000;
		S=parseInt((m-=(M=parseInt(m/60000))*60000)/1000);
		return D+'天'+H+'小时'+M+'分'+S+'秒'
	}
	setInterval(function (){
		webDate(function (webTime){
			get('web').innerHTML=time2String(time=webTime);
		})
		get('locale').innerHTML=time2String(new Date);
		get('time').innerHTML=int2time(targetTime-time);
		if ((targetTime-time)<0) {
			get('time').innerHTML = 'Game Over';
		}
	},1000)
 </script>	
</head>
<body>
设定时间：2012年12月31日0时0分0秒<br>
服务器时间:<span id='web'>loading...</span><br>
本地时间:<span id="locale">loading...</span><br>
倒计时时间:<span id="time">loading...</span>
<script type="text/javascript" charset="utf-8">
	targetTime=new Date(2012,12,31,00,00,00);
</script>
</body>
</html>

今天运营的一个需求~一开始本来是用getTime的方式写的,后来经洗漏的提醒,改为用服务器时间.代码如上~
至于时间到达之后执行什么,自己在后面继续写下就可以了~

textmate的前端扩展之yui compressor

作者：发布时间：June 30, 2010 分类：前端

首先要下载2个东西，来完成安装
一、对应的bundle
下载地址：http://www.experienceinternet.co.uk/download.php?addon=yui-compressor-textmate-bundle
二、yui compressor 的java执行端（其实上一个包已经包含了整个jar，但是还是用最新的好咯）
下载地址： http://yuilibrary.com/downloads/yuicompressor/yuicompressor-2.4.2.zip

解压缩2个包。
将yuicompressor-2.4.2.zip中的build/yuicompressor-2.4.2.jar的名字改为yuicompressor.jar，放入一个方便查找的位置。
运行YUI Compressor.tmbundle。
那么在你的bundle editor内会出现下图

选择Preferences… 更改右侧内容中的路径

设置完成。

接下来我们可以找个js试试看效果

好，大功告成～

在mac下，用了各种各样的编辑器，基本出名的都用过了～textmate>BBedit>coda>espresso>textmate用了一圈又转回来了。
不喜欢BBedit的配色，也没有仔细用过
不喜欢espresso在输入CSS的时候，自动分行
coda没有什么不喜欢，但是打开多个文件的时候会卡，有点闹心～
最后还是回到了textmate下。虽然中文支持很差，但是还好现在作的东西基本全部都是E文，不存在这个可怜的尴尬～

终端中使用textmate打开文件
Textmate安装时有选项：是否建立命令行的连接。如果当时没有选的话，可以执行如下命令：
sudo ln -s /Applications/TextMate.app/Contents/Resources/mate /usr/bin
这样，平时在终端里，也可以用”mate your_file”来打开textmate编辑文件了。

强大的Bundles
这个东东有点类似插件吧。相当非常无比之强大～
你可以选择Bundles → Bundle Editor → Show Bundle Editor来找到他，也可以用control+option+command+B来调出他。
可以通过SVN来更新最新的bundles，SVN地址为http://svn.textmate.org/trunk/
当然zen coding这个无比强大的插件也要推荐咯，textmate版本的下载地址为http://code.google.com/p/zen-coding/downloads/list
另外推荐一个我用的非常顺手的html和css的bundle http://minimaldesign.net/downloads/tools

各种配色
官方提供了一些配色，可以去这个网址看 http://wiki.macromates.com/Themes/UserSubmittedThemes
我还是习惯用Blackboard这个配色～

各种插件
下载地址 http://wiki.macromates.com/Main/Plugins

TextMate中文字体。
TextMate中文字体下载：http://www.rayfile.com/files/cba167ee-f918-11dd-85c3-0019d11a795f/

慢慢补充，暂时就这些吧～