jQuery投票插件RaterStar顺利毕业

2009-05-29_130143.gif

RaterStar是一年多前,在做三宝殿项目时开发的一个基于jQuery的投票插件,之后也得到了很多网友的关注和建议,让这个插件在一年多的时间内得以不断完善。

实验室上线后,一直就考虑要将ReterStar加入到其中,但因为当初在写这个插件时,对jQuery并不是很熟悉,部分代码写得并不是很好,所以打算将其重写后再发布。

目前RaterStar已从Demo转移到Labs。新版的RaterStar在实现原版功能的基础上,更增加了一些实用的方法和参数,目前已经实现的功能如下:

  • 自定义默认值
  • 可设置是否可以更改默认值
  • 自定义星星个数
  • 自定义星星图片 NEW!
  • 自定义起止值,递增步长
  • 支持AJAX
  • 自定义事件(目前支持点击后、AJAX请求之前,AJAX请求成功三种情况的事件触发)NEW!
  • 自定义AJAX请求方式(POST/GET) NEW!
  • 自定义鼠标悬停Title NEW!

更多的功能将在以后逐步完善,也欢迎大家给建议。

在线演示

LinkageSelect新增AJAX方式调用数据

原有的两种数据调用方式都是一次性全部载入所有数据,虽然在点击菜单时切换速度快,但不适合数据量很大的情况,因此新增了第三种数据调用方式。

1
2
3
4
5
6
7
var options = {
   ajax : './data_builder/ajax.php'
}
var loc = new LinkageSelect(options);
loc.bind('#demo6 .level_1');
loc.bind('#demo6 .level_2');
loc.bind('#demo6 .level_3');

在ajax模式下,只有在用户选择后,才会触发事件去调用下一层数据,并有缓存,也就是说不会重复下载已经调用过的菜单项。

演示Demo6 AJAX调用数据

关注天气:免费的短信天气预报

天气预报系统提供ical输出已经一年多了,当初是应网友要求做的数据源。因为Google日历中可以导入外部的ical数据,更重要的是,它还提供对导入日历中的数据给用户发送短信提醒,而这一切都是免费的。

已经有不少网站和博客介绍了如何利用本站的天气预报数据实现免费的短信提醒,但基本都是针对的老版系统,在更新了自定义数据格式的工具后,我觉得有必要详细解释一下如何使用这个工具,以及实现免费短信提醒的步骤。

首先,请确认你满足以下条件

  1. 一个属于你自己的GMail账号。
  2. 一部支持中文短信功能的手机,移动或联通均可,小灵通不支持。
  3. 将手机号码与Google日历帐号绑定。

在确定了满足以上条件后,就可以开始下一步:选择数据源

  1. 访问天气预报系统http://weather.raychou.com
  2. 在搜索框中输入关注的城市名称,拼音或汉字均可,例如,北京beijing。页面会自动跳转到天气详情页面,如果搜索到的结果不正确(有部分城市的拼音相同),还可通过搜索框下面的城市列表选择。
  3. 滚动到页面最下面的数据自定义工具,点击模板”Google日历的短信提醒”,最下面的URL就是我们想要的自定义数据源的网址。

至此,数据源我们已经得到,接下来就是将其添加到Google日历中,并设置短信提醒:

首先,登陆Google日历后,点击页面左下角的”添加”,在弹出菜单中选择”通过URL添加”

2009-05-11_195358.jpg

再添加页面中,将之前得到的数据源URL复制粘贴到文本框中,点击”添加”。若提示无法获取网址或其他错误,删除数据源再重复添加即可。

在得到页面提示添加成功后,点击右下角的”设置”,再点击刚才添加的日历后的”通知”链接,转入日历通知设置。

2009-05-11_195923.jpg

在通知设置中,选择通知的接受方式和通知方式,如图所示。注意,提前的时间是相对于预报日期的0点而言,例如提前4小时,就会在每天的20点收到次日的天气预报。

2009-05-11_200044.jpg

点击”保存”,就大功告成了。

最后show一下我的Treo680收到天气预报短信的界面

treo-680-weather-sms.jpg

天气预报系统更新:支持自定义数据格式

天气预报系统一直都有很多网友在使用和关注,我也一直没有放弃更新。但一直因为原来的代码部署方式过于麻烦而一直没有做大的改进。在部署了新的开发方式后,一方面正好可以测试这套方案的健壮性,另一方面也把以前网友们提出的建议实现。

这次更新最大的改进是支持自定义数据格式,用户可以根据自己的需要选择数据格式,输出的条数,以及是否只显示雨雪天气预报。

  1. 数据格式:目前提供了html,rss,ical三种格式输出,计划中还要提供json,以及方便手机用户浏览的wap格式。
  2. 显示条数:可自定义显示1-7条数据,例如用在Google日历中的短信提醒,就可以只输出一条,这样每天就能只收到第二天的天气预报。
  3. 雨雪预报:这应该是一个相当实用的更新,相信大部分用户并不太关心天晴情况,除非第二天可能有雨,当选中这个设置后,若第二天是非雨雪天气,则不会有数据输出,如果用在Google日历的提醒中,就不会每天都收到短信了。

2009-05-11_001716.jpg

在经历了数次更新后,这个系统也日趋完善,预计不久后就会将其加入实验室,开放源码供大家下载。

注:如何利用Google日历和本系统的数据源实现免费的天气预报提醒,请移步《天气预报V2隆重上线测试》一文中的网友介绍或自行搜索。

让虚拟主机也用上SVN:适用于个人的开发部署方式

注:本文仅针对没有条件在主机上安装SVN服务器的情况,例如使用虚拟主机的开发人员。如果满足以下几个情况,本文可能非常适合你:

  • 开发人员只有一个人
  • 服务器是虚拟主机只有ftp没有svn,并且也无法自己安装程序
  • 厌烦了每次部署修改都要整理更新文件列表并逐个提交

前言:我为什么要做这样的一个东西?近一个月来,在Raychou.com上花了不少时间,新开了实验室小技巧两个栏目,尤其是实验室,以后可能会经常要更新代码,而以往每次更新代码都是先在Eclipse里写好,然后打开FtpRush,切换到要更新的文件夹,将整个目录提交到服务器,繁琐又费时。更是因为这个原因,weather也有段时间没有更新了,我是懒人,但仅仅是懒于做繁琐而机械的工作,我需要改变这个现状,于是有了下面的内容。

相信很多开发人员和我一样,在工作之余还会管理个人网站,和网友们分享自己的经验和代码。应该大部分人都是租用的虚拟主机,这样平时在公司那一套使用SVN提交代码的方式就不管用了,每次更新程序,都要先整理一份修改记录,然后依次用FTP上传,麻烦耗时不说,还会经常遗漏文件,造成不必要的麻烦。

想要让线上代码和本地开发环境保持同步,方法也很多,最简单的可以利用CuteFtp,WinScp的文件夹监视功能,当被监视的文件夹内有修改动作,就会自动触发程序提交代码到服务器。但这样也有个弊端,在本地调试的修改也会带上线,虽然是方便了,但可能造成更大的问题。

之前我写过《利用SVN Hooks实现快速方便的代码管理/发布方式》一文,是利用SVN Hooks实现在提交代码到SVN时,自动部署更新的文件到测试服务器。同样的,利用Hooks,我们也可以把代码同步到FTP服务器,不同的是,这次的SVN服务器是架设在开发环境中,也就是说,不需要额外的服务器,任何人都可以通过SVN实现开发环境与线上的代码同步。

php-svn-hooks.gif

如图所示,当开发人员在本地开发并调试后,提交代码到本机SVN服务器,触发post-commit钩子,调用post-commit.bat,(由于对bat的语法不熟悉,在这个架构中,我用php代替bat,post-commit.bat仅做了在命令行下调用post-commit.php并传参),然后然后进行文件的同步处理。

大致流程如下:

  1. 开发人员提交代码到SVN服务器
  2. 提交完成后,自动调用post-commit钩子
  3. 钩子调用php脚本并传递三个参数:代码仓库路径,当前版本号,配置文件名
  4. php脚本通过传递过来的参数取得并分析当前版本的更新日志
  5. 根据不同的情况(新增、修改、删除、重名民)来同步文件

post-commit.bat代码如下:

1
2
set PATH=D:\Program Files\WebServer\PHP5.2.6;%PATH%
php "F:\wwwroot\site\raychou\labs\php-svn-hooks\post-commit.php" "%1" %2 "config/raychou.php" 1>&2

除post-commit默认的%1和%2两个参数外,这里我还传了第三个参数”config/raychou.php”,这个参数是传递给PHP脚本,让其去读取指定的配置文件,这个配置文件是在同步过程中需要用到的一些设置,例如SVN工作目录,FTP帐号等设置。

php在接收到hooks传递过来的参数后,读取配置文件,连接本地SVN版本库,取得并分析本地更新日志,连接FTP服务器,开始同步文件。

关于SVN Hooks以及post-commit的参数传递,请参考这里http://www.subversion.org.cn/svnbook/1.4/svnbook.html#svn.ref.reposhooks

代码下载,代码部署结构请参考http://www.raychou.com/labs/

php-svn-hooks php-ftp-client php-svn-client

LinkageSelect 基于jQuery的联动下拉菜单

在Web开发中联动下拉菜单的应用非常广泛,拿我们最常见的地区选择来说,相信几乎所有的网友都填过下面这样的表单:

2009-04-25_141108.jpg

当选择省份后,之后的下拉菜单中会自动给出前一个菜单中所选省份内的城市,以此类推,当选择城市后,再后面一个菜单会自动给出区或县城让用户选择,简单说就是每一次的选择都会影响下一个菜单的可选项,我们称之为联动菜单。

这样的JS代码在网上很多,我曾经也写过一个全国省市区三级联动下拉菜单,在项目中也得到了应用,但在实际项目中,需要使用类似这样联动菜单的地方很多,比如类别的选择等等,这样我就需要为每一个需求去写一份代码,而其中90%以上的代码都是重复或相似的,不但浪费了时间,用户在浏览网页时更需要下载大量重复的代码,增加不必要的开销。

因此我也一直有想法,将联动功能与联动数据分离开来,让一份JS代码能够适应不同的联动菜单需求,于是便有了LinkageSelect,基于jQuery的联动选择菜单。目前已经实现但不局限于以下功能:

  • 数据与代码分离,对应不同的菜单只需要准备不同的数据
  • 支持变量数据或AJAX调用外部数据
  • 支持自定义菜单根节点
  • 支持自定义菜单默认选中值
  • 可动态改变调用的菜单数据

在当前发布的版本中,还包括一个DataBuilder,支持手工创建用于LinkageSelect的JSON动态数据源。计划中就不再提供其他数据装换工具,有需要的朋友可以研究DataBuilder数据库格式,自行导入,再通过json.php输出所需数据源。

在线演示

让运行(WIN+R)无所不能

在Windows系统中,运行(快捷键WIN+R)是很常用的功能,它能在不打开资源管理器的情况下,直接运行任意文件,若这个文件在C:\WINDOWSC:\WINDOWS\SYSTEM32目录下,更是不需要输入完整的文件路径,仅仅输入文件名即可。

例如我们最常用的命令提示符,输入cmd后回车即可。

2009-04-20_001808.jpg

既然运行这么方便,那我用它直接运行QQ可不可以呢?

当然是可以的。假设QQ程序(以QQ2008为例)安装在C:\Program Files\QQ2008\文件夹下,那么输入C:\Program Files\QQ2008\QQ.exe即可立即运行QQ。

这下或许你要问了:这么麻烦,还不如直接点快捷方式呢!是的,这样是相当的麻烦,但我现在只是告诉你,通过运行是可以运行任何文件夹下的程序。

前面我说过,如果文件在C:\WINDOWSC:\WINDOWS\SYSTEM32目录下,仅需要输入文件名即可直接运行程序,那如果我把C:\Program Files\QQ2008\也加入到这个查找列表下,是否就可以只输入QQ两个字母就可以运行QQ了呢?

正是如此!而这个路径的设置也相当的简单。使用快捷键WIN+Break打开”系统属性”对话框,选择”高级”标签页,再点击”环境变量”按钮,这时候打开了”环境变量”设置对话框,在下面的”系统变量”列表中找到”Path”一行,是不是看到了如上面所说的两个目录C:\WINDOWSC:\WINDOWS\SYSTEM32

2009-04-20_002855.jpg

双击Path或选中Path行后点击下面的”编辑”按钮后进入Path变量编辑状态,在其最后加上”C:\Program Files\QQ2008\“(注意:每个目录之间需要用半角分号[;]分隔),保存后重启计算机(注销并重新登陆系统也可生效),再在运行中输入”QQ”,是不是就能打开QQ了!

恭喜你!到这里,你已经掌握了这个小技巧的第一步:使用环境变量

QQ是能通过运行来打开了,但每加一个软件都需要改环境变量然后重启电脑么?

当然不用这么麻烦!既然你已经知道了怎么使用环境变量来快速打开文件,那么我们为什么不让所有我们想要快速运行的程序都放在某个文件夹下呢?对!使用快捷方式!

跟我来,一步步打造万能的运行!

首先,我们要新建一个放置快捷方式的文件夹D:\QuickRun,如上面的操作方法,将D:\QuickRun加入到Path变量中。重启电脑。再将QQ的快捷方式放入D:\QuickRun,这时候再在运行中输入QQ是不是也能打开?举一反三,其他程序也可以这么做。

或许到这里你又会有疑问:为什么要用运行来打开QQ呢?直接点快捷方式不是更方便?

是的,在这里只是以QQ为例介绍如何让运行支持更多程序。

在日常使用中,可以设定一些文件夹的快捷方式:例如建立一个名为works的快捷方式,运行works,直接打开工作文档目录,这样是不是很高效?

小技巧开篇语

从94年开始接触计算机起到现在,也已经有十多个年头了,各类计算机、数码、软硬件捣腾得也不少。在捣腾的过程中,也摸索出了一条属于自己的”道”,如何让科技更加方便地为己所用的”道”。

但是,我的”道”是否是适合你的”道”?我不知道,但希望我的”道”,能为大家更快的找到属于自己的”道”,提供一条捷径。

今后在”小技巧”这个栏目中,我会不定期的介绍一些我在IT产品(包括但不限于计算机,数码,软件,硬件等)方面的经验和技巧,与大家分享。

小i入手