tag:blogger.com,1999:blog-69284803645422512232024-03-08T13:14:22.764+08:00闲耘™.博客在被抽打中不羁执着,在痛苦里继续发现快乐。<br>
信仰唯有围绕我心,才能实现不倒的自我。 --陀螺 (2004.2 闲耘)闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.comBlogger235125tag:blogger.com,1999:blog-6928480364542251223.post-4387084982085347202010-10-11T11:37:00.002+08:002010-10-19T11:46:14.974+08:00Vim 爱好者联系资料收集<p><br />希望通过一些形式让 Vim 爱好者联系更紧密,于是收集 Vim 爱好者的联系资料,并通过<br />较好的形式展现出来。<br /></p><br /><br /><p><br />目前是通过 <a href="http://hotoo.github.com/Vimmer/vimmer.html">面板形式</a> 展现,并有计划通过 Google 地图展现全国 Vim 爱好者的分布情况。<br /></p><br /><br /><p><br />资料收集方式:<br /></p><br /><ol><br /><li>Fork <a href="http://github.com/hotoo/Vimmer">Vimmer</a> 项目(最好是 gh-pages 分支),并加入自己的资料到 vimmer.json 中。<br /></li><br /><li>填写 <a href="https://spreadsheets.google.com/viewform?formkey=dHdHM3R6S25PZDVON05yRjhWWWw2MkE6MQ">Google Spread Sheets</a> <sup><small>GFW出没注意</small></sup>。<br /></li><br /><li>邮件发送到 hotoo.cn+vim[AT]gmail.com ,请将 <code>[AT]</code> 替换成 <code>@</code>,保留 <code>+vim</code><br /><pre><br />常用的网络ID *<br />必填,可以是中文或英文,例如我的:hotoo<br /><br />真实姓名<br />选填<br /><br />昵称<br />常用的网络昵称,例如我的:闲耘™。选填,默认与ID相同。<br /><br />电子邮箱 *<br />建议使用 Gmail 邮箱,请使用 [AT] 代替 @ 符合,例如:hotoo.cn[AT]gmail.com<br /><br />博客/个人主页<br />请输入完整的URL地址(以 http 或其他的协议开头),例如:http://hotoo.github.com<br /><br />Twitter ID<br />在 twitter.com 上的 ID,可以不带 @ 起始。例如我的 @hotoo<br /><br />Flickr ID<br />在 flickr.com 上注册的 ID,例如:hotoo<br /><br />Delicious ID<br />在 delicious.com 注册的 ID,例如 hotoo<br /><br />Github ID<br />在 github.com 注册的 ID。<br /><br />豆瓣(Douban) ID<br />在 douban.com 注册的 ID<br /><br />其他网站上注册的 ID<br />如果你其他网站上注册的 ID,并希望分享出来,请填写在这里。<br />网站和ID以冒号分隔,多个站的 ID 请以分号分隔。<br />例如 about.me:hotoo; blueidea.com:hotoo<br /><br />Gravatar ID<br />在 gravatar.com 注册并上传头像,根据邮箱地址计算MD5的值就是 Gravatar ID。<br />例如:2fdef0a77e4bf207e3ec30660e7896e8<br /><br />目前所在地<br />可以输入简要的地址,例如:杭州(Hangzhou);<br />也可以输入详细的联系地址,甚至卫星坐标,可以通过Google地图获得。<br /><br />其他<br />你希望留下的任何资料信息。<br /></pre><br /></li><br /></ol>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-36426067897280695742010-08-30T10:14:00.001+08:002010-08-30T10:14:59.072+08:00Diff 模式下,让光标直接跳转到被修改的文本处<p> Vim 的 Diff 功能非常优秀。有一个我非常喜欢的特性是:完全相同的地方, 会被折叠隐藏起来(上下文除外)。还可以很方便的在各个差异点之间做出修改合并和快速跳转。 </p> <p> 不过默认的 <code>[c</code> 和 <code>]c</code> 两种跳转方式,目前只能跳转到差异点的行首。对于只修改了 行内部分文本内容(一般底色是浅红色)时,我更希望直接跳转到有变化的文本(底色是 深红色的部分)上。 </p> <p> 感谢 tocer ,我初步实现了两个版本 <a href="http://gist.github.com/556810">gits:556810</a> </p> <ol><li> v1: 仅支持跳转到 DiffChange 的第一个 DiffText </li><li> v2: 支持 DiffChange 行多个 DiffText </li></ol> <h2 id="toc_1.1">参考</h2> <ol><li> <code>:h synIDattr</code> </li><li> <code>:h diff_hlID</code> </li><li> <a href="https://twitter.com/hotoo/status/22227282177">https://twitter.com/hotoo/status/22227282177</a> </li><li> <a href="http://groups.google.com/group/vim-cn/browse_thread/thread/8a0b5b7ed335782b">vimdiff 的跳转</a> </li><li> <a href="http://superuser.com/questions/145940/vimdiff-jump-to-next-difference-inside-line">vimdiff: Jump to next difference inside line?</a> </li></ol>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-49720724334140727092010-08-22T10:15:00.000+08:002010-08-30T10:16:16.935+08:00隐私权<p> 团购的时候我在邮件和 Google Docs 向所有参与团购的团友公布了各自的详细信息 (包括联系信息)。 </p> <p> 我的公布的理由有两个: </p> <ol><li> 方便自己统一管理,和团友随时审阅; </li><li> 方便同城团友可以合并快递单。 </li></ol> <p> 有团友很不高兴。于是我特地看了关于隐私权的一些资料。 </p> <p> 根据 <a href="http://zh.wikipedia.org/zh-cn/%E9%9A%90%E7%A7%81%E6%9D%83">维基百科全书:隐私权</a> 和一些其他相关资料上的描述,我似乎并没有侵犯任何隐私权。 我没有把大家的手机号写在电线杆子上,并附上“办证”之类的字样; 没有入侵并偷窥大家的电子邮件;也没有找到大家的收货地址后非法闯进去。。。<br /><strong>以上纯属玩笑话 :D</strong> </p> <p> 隐私权目前来说还是有一些模棱两可的地方,虽然我主观上是支持保护隐私权的。 我也有隐私,但只要不是把我和家人的资料公布在网上,或者提供给某些混蛋, 以至于我和家人会受到严重的骚扰和恐吓之外,还是没有什么的。 </p> <p> 朋友和一些相对比较可靠的人知道我的联系方式,是件好事吧。虽然我小时候曾经很傻的 想住到深山老林里去隐居。 </p> <p> 个人认为:有限区域范围内的个人或家庭联系方式,算不上是隐私。 你的邻居知道你家的门牌号码;公司、学校拥有你的详细资料; 商家索取买家发货地址;快递员直接打你的手机; 参加团购的成员知道你的联系资料。。。 </p> <blockquote> 好吧,虽然我可能没有犯罪,但是我错了。我只是想偷懒才使用群发邮件的方式的。 </blockquote> <p> 另外居然有蛋疼的律师控告电信说“来电显示”损害了其隐私权。 </p> <ol><li> 你没有号码怎么打电话给他人;你拿到他人的号码,是否就侵犯了其隐私? </li><li> 你打电话给他人,这他人没有知情权,无权知道是哪个混蛋在骚扰他? </li></ol> <p> 另外也有人控告移动、联通公司所谓的“恢复”收取来电显示的费用是单方面修改合同、 强制消费行为。想都不用想,最终败诉。 </p> <p> 现在好了,你可以关闭来电显示,每月省了 6 块还是几块钱。也就是说现在开通来电显示需要 每月多付几块钱,而这在以前是免费的。 </p> <p> 我有一个很不希望相信的“阴谋论”:这起官司是电信或移动公司幕后主使的案件。 </p> <p> 我对隐私权的概念还是有点不清晰,希望有人能写出清晰简洁的资讯出来,比如翻译关于隐私权 的论文和辩论过程之类,而不要像法律条文一样直接给我们模糊不清的强制性规定和结论。 </p> <p> p.s. 希望有生之年不要看见“非法持有他人隐私”的罪名或者大帽出现。 </p>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-28604610621787645742010-08-15T13:43:00.001+08:002010-08-30T10:17:58.372+08:00【已结束】 关于团购庆祝 Vim 7.3 正式发布的 Tee<p> 我在 Twitter 上随意说了句相关的 <a href="https://twitter.com/hotoo/status/21126325142">意向</a>, 便有不少回应表示也愿意加入,我本想最好由某个懂行或者牛人来发起活动,我参加就好了, 不过目前看来,我只能自己扛起这个重担。 </p> <h2 id="toc_1.1">关于 Tee</h2> <blockquote> 初步设想:<br /><strong>正面</strong> :印 Vim 的 Logo。 <a href="http://vote.sparklit.com/web_poll.spark?pollID=1119325">投票</a><br /><strong>背面</strong> :印 <code>:wq!</code> 或者 <code>:help!</code> 命令,下面还印上版本信息 <code>:version</code>。 <a href="http://vote.sparklit.com/web_poll.spark?pollID=1119327">投票</a><br /><strong>右手袖子</strong> :印 <code>:version</code> 信息。<br /><strong>颜色</strong> :商家唯一指定白色。<br />P.S. 还有网友提议将自己的 vimrc 打上去,创意不错,但这是一此集体活动。 不过大家还是可以提议一些非常具有 Vim 特色的代码。 </blockquote> <p> <a href="http://www.flickr.com/photos/hotoo/4893442809/"><img src="http://farm5.static.flickr.com/4141/4893442809_aedb31676a_b.jpg" /></a> </p> <p> 商家答应可以有 3 种不同的图案,但是考虑到实际操作太麻烦,包括下订单,印刷和发货都非常容易出错, 所以我们最好是尽量少的使用不同图案。如果有喜欢但是没有选择的图案,各位可以各取所需自行单独印刷。 </p> <p> 参考: </p> <ul><li> <a href="http://www.newsmth.net/bbsanc.php?path=%2Fgroups%2Fcomp.faq%2FVIM%2Ffriends%2Fhuodong%2F2005%2FM.1115718502.M0">滇狐很久之前提供的版本</a> (<a href="http://edyfox.codecarver.org/html/vim-logo-sim.png">简易版</a> <sup><small>[1]</small></sup> <a href="http://edyfox.codecarver.org/html/vim-logo-bas.png">普通版</a> <sup><small>[2]</small></sup> <a href="http://edyfox.codecarver.org/html/vim-logo-en.png">高级版</a> <sup><small>[3]</small></sup>) </li><li> <a href="http://www.zazzle.com/vim+tshirts">Vim T-shirts, Shirts and Custom Vim Clothing</a> </li><ul><li> <a href="http://www.zazzle.com/apaga_y_vamonos_tshirt-235860815670055282">http://www.zazzle.com/apaga_y_vamonos_tshirt-235860815670055282</a> </li><li> <a href="http://www.zazzle.com/vim_tshirt-235495517240839065">http://www.zazzle.com/vim_tshirt-235495517240839065</a> </li></ul><li> 另外感谢 <a href="http://f2e.us/">阿阳</a> 还提供了一份他找视觉设计师修改过,上次印 Tee 的 AI 文件。 </li></ul> <h2 id="toc_1.2">Tee 的质量</h2> <p> 商家是阿阳推荐的,他之前有在这家定制过,说是材料“比较厚,质量还不赖的”。<br />而商家说:“我们这只有一种220克的,是属于好的,差的么就是180 200克的。那二种我们没有在做的。” </p> <h2 id="toc_1.3">关于费用</h2> <p> 跟淘宝一个定制 Tee 的 <a href="http://1tshirt.taobao.com/">商家</a> 联系,50件以上的话 双面印刷最低能到 <del>28.00</del> <del>26.00</del> 25.00 元/件(<del>单面 25.00</del>),目前有 50 多人, 如果有更大的数量级,估计还可以更便宜,到时候我再商量,40 件估计需要一周才可以出货; Tee 可以直接发到每个人手中,考虑到运费,我提议同城的统一由一个人负责签收并发放, 这样顺便还可以线下认识几个朋友,同城运费最终 AA 制;自己愿意单独付运费的不在此列。 </p> <p> 如果看中这店家的其他 Tee,参加团购的朋友也同样可以以团购的价格购买,直接在 店家商品上拍即可,记得给商家说明情况,另外还要报上我的旺旺ID(请来邮件索取)。 </p> <p> 周六我会公布所有同城信息,到时候希望同城统一签收的可以联系我。<br />除非专门指定,默认情况下,均发或到个人签收。<br />学校老师或学生会稍晚发货,以确保各位能在学校签收。 </p> <p> 目前不支持快递到国外,如果有国内的地址,请使用国内地址。<br />到台湾的快递费是 35.00 元,3 天之内可以到。 </p> <p> 目前还没有确定最终购买人数和打折尺度,而且费用收取方式上也还没有确定,大家可以自由选择 预付定金,或者我先垫资金的方式,都没有关系的。下周末等情况确定后我会公布收款方式, 请大家静候佳音。 </p> <p> 费用收取方式主要采取支付宝收款,或者银行卡汇款。 </p> <p> 店家提供的快递运费对照表: </p><table> <tbody><tr> <th>运输方式</th> <th>1公斤内</th> <th>加重/公斤</th> <th>运送到</th> </tr> <tr> <td>快递</td> <td>8.00</td> <td>5.00</td> <td>安徽</td> </tr> <tr> <td>快递</td> <td>5.00</td> <td>2.00</td> <td>上海,江苏,浙江</td> </tr> <tr> <td>快递</td> <td>10.00</td> <td>8.00</td> <td>北京,天津,河北,山西,辽宁,吉林,黑龙江,福建,江西,山东,河南,湖北,湖南,广东,广西,海南,重庆,四川,贵州,云南,陕西,甘肃,青海,宁夏</td> </tr> <tr> <td>快递</td> <td>15.00</td> <td>?</td> <td>大陆其他地区</td> </tr> <tr> <td>速运</td> <td>35.00</td> <td>?</td> <td>台湾</td> </tr> </tbody></table> 默认使用圆通快递,台湾地区使用顺风速运,3天内可以到达。 <h2 id="toc_1.4">【已结束】 <del>关于报名</del></h2> <p> 为避免报名时间过短,或等待时间过长,初步计划报名截止到下周末,如果中途有事没有时间也没有关系, 只要确认购买,我可以预付费用的。 </p> <p> 一旦确定购买名单,我们就开始下订单订货。 </p> <p> 由于我第一次搞这样的活动,有经验的老师请一定多多指导。 </p> <blockquote> <strong>注意</strong> :如果确定要购买,请务必将你 <a href="http://www.flickr.com/photos/hotoo/4890597770/">需要的尺码</a>, <strong>邮件地址</strong> ,实际的 <strong>收货地址</strong> , <strong>邮编</strong> 和 <strong>收件人姓名</strong> 。<br />最好还有即时联系方式,比如手机,快递可能需要。<br />请确认这些信息能直接联系到你,收件人能收到货。 </blockquote> <p> 如果在截止时间之前没有给出详细联系地址导致无法发货的,一律认为不参加这次活动,请谅解。 </p> <p> 如果有些没所谓的小失误的话请多多包含,大失误我会尽力承担的。 </p> <h2 id="toc_1.5">活动结束语</h2> <p> 这次活动过程几经波折,把我、团友,和商家都折腾的够呛。主要是由于我经验不足造成,事先的准备工作 也不够,导致有数次变更,甚至有些不尽如人意。 </p> <p> 不管怎么样,报名活动总算是结束了,我这里不再接收任何报名,仍希望购买的朋友可以尝试 <a href="http://item.taobao.com/auction/item_detail.htm?item_num_id=7174622420">这个链接</a>,运气好的话还可以团购的 价格买到。 </p> <p> 最后:这样的人生经历一次就够了,谢谢大家。 </p>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-27448958215039313572010-08-13T14:35:00.000+08:002010-08-13T14:36:16.627+08:00SQL LIKE 查询的一个问题<p> 在做用户管理的时候,用户表(users) 有一个字段(dept)用来存储用户所在部门的信息, 字段的值一般是这样的,各级部门间使用横杠分隔: </p> <pre>XX宝-技术部<br />XX宝-技术部-数据仓库<br /></pre> <p> 我们的系统有一个根据用户所在部门进行过滤的功能,所以我们用了类似下面的查询语句: </p> <pre>SELECT * FROM users WHERE dept LIKE "XX宝-技术部%";<br /></pre> <p> 这样的性能还好,但是今天发现一个问题是,当有两个部门名称很相似,比如: </p> <pre>XX宝-CEO<br />XX宝-CEO办公室<br /></pre> <p> 这时在查询 <code>XX宝CEO</code> 的时候就会把 <code>XX宝-CEO办公室</code> 的用户也查询出来。 </p> <p> 于是想到正则表达式: </p> <pre>SELECT *<br />FROM users<br />WHERE REGEXP_LIKE(dept, "^XX宝-CEO$")<br />OR REGEXP_LIKE(dept, "^XX宝-CEO-[\w\-]+");<br /></pre> <p> 合并正则表达式的另一解: </p> <pre>SELECT *<br />FROM users<br />WHERE REGEXP_LIKE(dept, "^XX宝-CEO($|-[\w\-]+)");<br /></pre> <p> 杯具的性能问题。 </p> <p> 突然想到 </p> <pre>SELECT *<br />FROM users<br />WHERE dept="XX宝-CEO"<br />OR dept LIKE "XX宝-CEO-%";<br /></pre> <p> 于是简单有效的解决了这个问题。 </p>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-88103626859414511422010-08-01T21:38:00.002+08:002010-08-01T22:30:08.500+08:00用 gvim 比较 git diff<h2 id="toc_1.1">for Windows</h2> <p> 参考 <a href="http://gist.github.com/502217">gist:502217</a> </p> <p> 1. 在用户目录下的 .gitconfig 中加入: </p> <pre>[diff]<br />external = git_diff_wrapper.bat<br />[pager]<br />diff =<br /></pre> <p> 2. 创建 git_diff_wrapper.bat 文件放到 $PATH 目录下,内容为: 注意其中的 path\to\ 要改为 gvim.exe 所在目录。 </p> <pre>path\to\gvim.exe -d "%2" "%5"<br /></pre> <h2 id="toc_1.2">for Linux</h2> <p> 参考 <a href="http://technotales.wordpress.com/2009/05/17/git-diff-with-vimdiff/">Git Diff with Vimdiff</a> </p>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-59687820533366966222010-07-31T22:30:00.000+08:002010-08-01T22:31:16.524+08:00整合状态按钮和导向按钮<p> <a href="http://hotoo.github.com/labs/integrate-guide-button-and-status-button.html">Demo</a> </p> <p> 延伸阅读:<br /><a href="http://www.uesee.com/?p=143">状态按钮和导向按钮</a> </p>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-65886600052979465932010-07-29T22:28:00.000+08:002010-08-01T22:29:23.159+08:00遍历字符的性能<ol><li> <code>s.charAt(i)</code> </li><li> <code>s.split("")[i]</code> </li></ol> <p> <a href="http://hotoo.github.com/labs/preformance-for-each-chars.html">Test</a> </p> <p> 在 IE7, Firefox3.6.8, Chrome5.0, Safari5.0, Opera10 上测试, 除了 Firefox 之外,所有的浏览器均是第 2 种表达式更快速。 </p>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com2tag:blogger.com,1999:blog-6928480364542251223.post-2170332117536527422010-07-23T11:09:00.001+08:002010-07-23T11:12:25.387+08:00使用 calendar.vim<p> 最初看到明城 <a href="http://www.gracecode.com/archives/674/">推荐使用 Vim Calendar 插件</a>, 于是很小白的尝试了一下,然后就没有了然后。 </p> <p> 最初尝试的过程已经基本忘记,恍惚记得在 Calendar 的日期上回车,窗户貌似在右侧窗口 打开的(后来发现我记错了,这是 Vimwiki-diary的支持);至于明城推荐设置的 <code>ca</code> 快捷键,后来才知道是与 text-object 冲突的。 </p> <p> 再后来就用上了 Vimwiki,做个人 Wiki 之余,还用它的 diary 写日记。总体来说,Vimwiki 的 diary 是比较强大的,我甚至还提了几个被接受的建议。 </p> <p> 但是随着使用的深入,发现通常 Wiki 项目下是不需要 diary 的,而 diary 也基本不需要 Wiki,把这两种整合在一起也许就是个错误。我们真正需要的是一个更强的 Calendar diary, 而不是 Wiki 附加的 diary 支持。 </p> <p> 如果真的希望 Vimwiki 有 diary 的支持,我也希望这个 diary 和 Wiki 是相互独立的, Wiki 项目中无需 diary,diary 无需包含在每个 Wiki 项目里。 </p> <p> 另外基于 Wiki 的原因,所有的 diary-wiki 文件都放在同一个目录下,当 diary 日渐增多, 目录变得臃肿起来也不是什么好事。 </p> <p> 我需要的是一个更强的 Vim Calendar。基于这个想法,我便尝试着手增强 Calendar。 目前已经支持 <code>:CalendarSearch</code> 和更好的 diary 打开方式。更多的想法见 <a href="http://github.com/hotoo/calendar-vim/blob/master/TODO">这里</a>。 </p>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-61183824918075439142010-06-25T18:18:00.000+08:002010-06-29T20:30:26.311+08:00在 Vim 页签中打开文件<p> 这两天折腾让文件在 Vim 的新页签中打开(类似 Firefox 等浏览器)的特性, 发现让文件在页签中打开有非常多的优点: </p> <ol><li> 打开文件的速度更快(免去了启动 Vim 的时间) </li><li> 占用内存等资源更少(单个 Vim 窗口比多个窗口节省资源) </li><li> 任务栏更节省可用空间(不过 Windows 7 中还未支持任务栏多页签内容预览)。 </li><li> 编辑过程中文件间可以快速跳转,缓冲区也可以共享。 </li></ol> <p> 我参考前辈的方案,做了更 <a href="http://github.com/hotoo/Edit-with-Vim-tabs">自动化的处理 脚本</a>, 将其中的 edit.with.vim.tabs.reg 合并到注册表就可以了。如果想还原为用窗口打开的方式, 再将 edit.with.vim.window.reg 合并到注册表中。 </p> <p> 这个设置会让双击默认编辑器为 Vim 的文件,或者右键 -> Edit with Vim 都将文件在页签中 打开。开始用着确实挺爽,右键菜单中也没有了那些动态增加进来的已打开的文件的菜单项。 不过后来又发现不止如此,连“用 Vim 比较”(Diff with Vim)的项也没了。 </p> <p> 重装了好几次,终于搞清楚了一些东西。注册表的 </p> <pre>[HKEY_CLASSES_ROOT\*\shellex\ContextMenuHandlers\gvim]<br />@="{51EEE242-AD87-11d3-9C1E-0090278BBD99}"<br /></pre> <p> 是关键项,他根据 gvimext.dll 来附加右键菜单的动态项,包括 Diff with Vim。 如果你不想有默认的新窗口中打开文件的“用 Vim 编辑 (&V)”(Edit with Vim), 就需要把上面这项删除,不过这也会殃及 Diff with Vim。 </p> <p> 我实在没有特别好的办法,我在注册表中做了一个 "Diff with Vim" 的项,但是这个菜单命令 会针对选中的多个文件各自执行一次;而不是执行一次,并将多个选中的文件作为参数 一次传入。这个肯定也能做到的,参看 Vim 默认的行为,和 WinMerge 等就知道,只求高手来帮忙了。 </p> <p> 我目前不希望没有这个选中多个文件并 Diff 的功能(虽然它连快捷键都没有), 所以只好保留了这个注册表项,为了避免快捷键冲突,只好修改了在页签中打开文件的 注册表项的快捷键。 </p> <p> 或者用其他的文本比较工具,如 WinMerge,BeyondCompare。这样的话,直接删除上面的注册表项。 </p> <p> 如果你有好主意,快来快来告诉我 : ) </p> <h2 id="toc_1.1">其他</h2> <p> 另外给页签加上序号是非常有用的: </p> <pre>set guitablabel=%N.%t<br /></pre> <p> 尤其是在设置了这样的快捷键之后: </p> <pre>imap <c-tab> :tabnext<cr><br />nmap <c-tab> :tabnext<cr><br />imap <c-s-tab> :tabprevious<cr><br />nmap <c-s-tab> :tabprevious<cr><br />imap <m-1> <esc>:tabfirst<cr><br />nmap <m-1> :tabfirst<cr><br />imap <m-2> <esc>2gt<br />nmap <m-2> 2gt<br />imap <m-3> <esc>3gt<br />nmap <m-3> 3gt<br />imap <m-4> <esc>4gt<br />nmap <m-4> 4gt<br />imap <m-5> <esc>5gt<br />nmap <m-5> 5gt<br />imap <m-6> <esc>6gt<br />nmap <m-6> 6gt<br />imap <m-7> <esc>7gt<br />nmap <m-7> 7gt<br />imap <m-8> <esc>8gt<br />nmap <m-8> 8gt<br />imap <m-9> <esc>9gt<br />nmap <m-9> 9gt<br />imap <m-0> <esc>:tablast<cr><br />nmap <m-0> :tablast<cr><br /></cr></m-0></cr></esc></m-0></m-9></esc></m-9></m-8></esc></m-8></m-7></esc></m-7></m-6></esc></m-6></m-5></esc></m-5></m-4></esc></m-4></m-3></esc></m-3></m-2></esc></m-2></cr></m-1></cr></esc></m-1></cr></c-s-tab></cr></c-s-tab></cr></c-tab></cr></c-tab></pre> <p> 更多,但是不推荐(因为跟默认快捷键冲突)的快捷键设置: </p> <pre>" [CONFLICT] back tag history<br />imap <c-t> <esc>:tabnew<cr><br />nmap <c-t> :tabnew<cr><br />" [CONFLICT] window shortcut key.<br />imap <c-w> <esc>:tabclose<cr><br />nmap <c-w> :tableclose<cr><br />imap <c-s-w> <esc>:tabonly<cr><br />nmap <c-s-w> :tabonly<cr><br /></cr></c-s-w></cr></esc></c-s-w></cr></c-w></cr></esc></c-w></cr></c-t></cr></esc></c-t></pre> <h2 id="toc_1.2">更新 (2010/6/26)</h2> <p> 今天想折腾一下 gvimext.dll ,因为这个是问题的本源,只要将它里面的“用 Vim 编辑”(Edit with Vim)加上参数, 改成新页签中打开的方式就好了,而且选中多个文件进行比较,好像也必须使用动态连接库的方式实现, 于是找到了这个 <a href="http://www.vim.org/scripts/script.php?script_id=1720">gvimext.dll</a> 它让 Vim 7 支持新页签中打开。试用了一下,感觉有点啰嗦了,它让新窗口和新页签打开文件的方式共存,并且快捷键 仍然设置在新窗口打开的菜单项上。不过里面带有源码,我们可以改成自己喜欢的方式。 </p> <h2 id="toc_1.3">参考链接</h2> <ul><li> <a href="http://wiki.ubuntu.org.cn/index.php?title=Vimfaq&variant=zh-cn">Vimfaq - Ubuntu 中文</a> </li><li> <a href="http://easwy.com/blog/archives/vim-tips-windows-open-file-in-tab/">vi/vim 使用技巧: 在标签页中打开文件 (windows)</a> </li><li> <a href="http://support.microsoft.com/kb/310516/zh-cn">如何通过使用注册项 (.reg) 文件添加、修改或删除注册表子项和值</a> </li><li> <a href="http://davidvielmetter.com/?p=1094">Context menu issues with gVim in Windows 7 x64</a> </li><li> <a href="http://vim.wikia.com/wiki/Show_tab_number_in_your_tab_line">Show tab number in your tab line</a> </li></ul>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com1tag:blogger.com,1999:blog-6928480364542251223.post-9755845599330320212010-06-20T17:34:00.000+08:002010-07-19T17:36:49.082+08:00Vim 自动补全成对的括号和引号<p> 炫日分享了一个 <a href="http://aoyme.wordpress.com/2010/05/31/%E5%9C%A8vim%E4%B8%AD%E5%B0%86%E6%8B%AC%E5%8F%B7%E8%87%AA%E5%8A%A8%E8%A1%A5%E5%85%A8%EF%BC%9A/">自 动补全成对的括号</a> 的脚本,【注】:原文代码中引号被转义成了中文引号,下面是修正后的脚本。 </p> <pre>inoremap ( ()<esc>i<br />inoremap ) <c-r>=ClosePair(')')<cr><br />inoremap { {}<esc>i<br />inoremap } <c-r>=ClosePair('}')<cr><br />inoremap [ []<esc>i<br />inoremap ] <c-r>=ClosePair(']')<cr><br />inoremap < <><esc>i<br />inoremap > <c-r>=ClosePair('>')<cr><br /><br />function ClosePair(char)<br /> if getline('.')[col('.') - 1] == a:char<br /> return "\<right>"<br /> else<br /> return a:char<br /> endif<br />endf<br /></pre> <p> 经此启发我增加了对括号和引号更智能的补全支持, 不过中文全角的括号和引号目前无法通过映射来实现, 对于跨行、转义的符号对的支持也不佳,如果有好的实现也请告知 : ) </p> <ul><li> OpenPair: </li><ol><li> 如果当前行的括号已经成对匹配,则自动补全右括号 <code>(I)</code> </li><li> 如果左括号比右括号多,则自动补全 <code>I(()</code> <code>(I()</code> <code>((I)</code> <code>(()I</code> </li><li> 如果左括号比右括号少,<br /> <code>I())</code> 原样输出,不自动补全<br /> <code>(I))</code> 同上<br /> <code>()I)</code> 同上<br /> <code>())I</code> 自动补全:左括号较少,且光标之后字符串进行一次递归上面的条件 </li></ol><li> ClosePair: </li><ol><li> 如果光标之后是一个右括号,向右移动一列 <code>(I)</code> <code>((I)</code> <code>(I))</code> <code>()I)</code> </li><li> 否则原样输出。 </li></ol></ul> <p> 代码见 <a href="http://gist.github.com/449512">gist: 449512</a> </p> <p> 更新 (2010/6/24) 最后更新 (2010/7/9) </p> <h2 id="toc_1.1">相关脚本</h2> <ul><li> <a href="http://www.vim.org/scripts/script.php?script_id=2754">delimitMate.vim</a> (<a href="http://github.com/Raimondi/delimitMate">src</a>) </li><li> <a href="http://vim.wikia.com/wiki/Making_Parenthesis_And_Brackets_Handling_Easier">Making Parenthesis And Brackets Handling Easier</a> </li></ul>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-17077204631463281422010-06-16T17:38:00.000+08:002010-07-19T17:38:59.153+08:00在 Google Maps 的街景视图里看实况足球<p> 我承认我标题党了,这只是我的一个 idea 而已,并没有实际实现。 </p> <p> 前几天有新闻称日本要申办 2022 年的世界杯,承诺将以 3D 转播赛况,还以全息技术将赛况投影到足球场上, 任何一个足球场都可以模拟现场实况,并准备研发全息电视,把赛况以全息技术在家庭里播放。 而实际上,日本在某些音乐会已经使用全息技术的实际应用(X-Japan的 <a href="http://v.youku.com/v_show/id_XOTE2MDcxMTY=.html">Art of Life</a> 的 15:36 至 19:13 之间都是以全息技术 制作的演出,直接观看19:10,然后等几秒钟就会明白)。 </p> <p> 我的个神啊,这是一种怎样的未来。 </p> <p> 在看南非世界杯的几个球场街景视图时,我突然想到如果模拟实况足球游戏,根据比赛实况,将比赛情形在类似的视图中 展现出来,会爽到什么程度啊。 </p> <p> <a href="http://maps.google.com/maps?f=q&source=s_q&hl=zh-CN&geocode=&q=%E4%BC%8A%E4%B8%BD%E8%8E%8E%E7%99%BD%E6%B8%AF&sll=35.86166,104.195397&sspn=51.335062,89.033203&brcurrent=3,0x0:0x0,0%3B5,0,0&ie=UTF8&hq=&hnear=%E4%BC%8A%E4%B8%BD%E8%8E%8E%E7%99%BD%E6%B8%AF,+%E4%B8%9C%E5%BC%80%E6%99%AE,+%E5%8D%97%E9%9D%9E&ll=-33.937975,25.599529&spn=0.006533,0.014956&t=h&z=17&layer=c&cbll=-33.937919,25.59958&panoid=Q5GeWsE39Ki147z_1qBkAQ&cbp=12,8,,0,-0.94">伊 丽莎白港</a> </p> <p> <a href="http://maps.google.com/maps?f=q&source=s_q&hl=zh-CN&geocode=&q=%E5%86%85%E5%B0%94%E6%96%AF%E6%99%AE%E9%9B%B7%E7%89%B9&sll=35.86166,104.195397&sspn=52.945838,89.033203&ie=UTF8&hq=&hnear=%E5%86%85%E5%B0%94%E6%96%AF%E6%99%AE%E9%9B%B7%E7%89%B9,+%E6%99%AE%E9%A6%AC%E8%98%AD%E5%8A%A0%E7%9C%81,+%E5%8D%97%E9%9D%9E&ll=-25.461787,30.929775&spn=0.007343,0.014956&t=h&z=17&brcurrent=3,0x0:0x0,0%3B5,0,0&layer=c&cbll=-25.461933,30.929288&panoid=H1O5Rhjde8l9QhaO75Z6Vg&cbp=12,11.73,,0,2.74">内 尔斯普雷特</a> </p> <p> p.s. 现在的 Google Maps 街景视图,比 Google Earth 的 3D 模型要爽要逼真,不过街景视图无法以 3D 效果看鸟瞰图。 </p> <p> <strong>延伸阅读:</strong> </p> <ul><li> <a href="http://www.cnbeta.com/articles/111966.htm">日本申办2022世界杯 许诺提供3D比赛直播</a> </li><li> <a href="http://www.cnbeta.com/articles/113031.htm">日本研发全息电视:用激光投射飘浮图像</a> </li><li> <a href="http://www.google.org.cn/tag/google-trike">Google Trike</a> </li><li> <a href="http://zhaiyx.com/2010/03/miku-3d-concert/">初音未来3D全息演唱会 | 宅映像</a> </li><li> <a href="http://v.youku.com/v_show/id_XMTY3OTM2MDEy.html">初音未来全息演唱会</a> - 初音ミク </li></ul>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-12424701723685068942010-05-20T17:40:00.000+08:002010-07-19T17:41:32.703+08:00用 Google Code 管理与发布 Wiki<p> 由于 <a href="http://hotoo.googlecode.com/svn/blog/Dropbox-died-in-China.html">Dropbox 的墙掉</a>,https 协议访问 dl 或 dl-web 子域 的方法也随之失效,虽然可以通过修改 hosts 来继续同步文件,但是 Public 目录再也 不能输出文化了。 </p> <p> 我之前 <a href="http://hotoo.googlecode.com/svn/blog/use-vimwiki-for-blog.html">在 Dropbox Public 目录搭建的博客和 Wiki 系统</a> 也无法在线浏览了,为了能够继续 辅助文化局输出文化,我便利用万恶的资本主义国家 的 Google Code 来为我们服务了。 </p> <p> 由于可以继续使用 Dropbox 来自动同步私有文件,所以可以保持 .wiki 文件在 Dropbox 中,其他自动同步的软件也可以用来做类似的事情。 </p> <p> 将 Vimwiki 的 <code>path_html</code> 修改为 Google Code 的某个 svn 或 Hg 目录: </p> <pre>let g:vimwiki_list = [{...},<br /> \ {...},<br /> \ {...},<br /> \ {<br /> \ 'path' : 'D:\My Dropbox\blog',<br /> \ 'path_html' : 'D:\hotoo\blog',<br /> \ 'html_header' : 'D:\My Dropbox\blog\template\header.tpl',<br /> \ 'html_footer' : 'D:\My Dropbox\blog\template\footer.tpl'<br /> \ }<br /> \ ]<br /></pre> <p> 虽然 Vimwiki 目前的 toHTML 方法还不支持重新生成仅更新过的 wiki 文件,但是 svn 可以判断文件是否有真正被修改过。 </p> <p> 另外 <a href="http://hotoo.googlecode.com/svn/wiki">http://hotoo.googlecode.com/svn/wiki</a> 目录存放的是 Google Code 的 Wiki 文件, 这里面的 wiki 文件无需通过 Vimwiki 导出 HTML,Google Code 会自动完成这一工作, 并可以通过 <a href="http://code.google.com/p/hotoo/w/list">http://code.google.com/p/hotoo/w/list</a> 浏览。而 Vimwiki 是 Google Code Wiki 语法的一个子集,所以基本可以天衣无缝的配合使用。 </p> <p> 这也是不错的一个方案,除了需要 commit 之外,Google Code 比 Dropbox 的 Public 有过之而无不足,域名也是杠杠的。 </p> <p> 另外不小心发现还有其他的托管方案,让防火墙筑的更高些吧,当局者把自己当猪圈养起来 比较好,做个专职的脑子又笨,目光又短浅的墙脚之猪也可以提高幸福指数的。 </p>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-82255807337562568002010-05-13T17:42:00.000+08:002010-07-19T17:43:40.645+08:00让 Vim 支持 LOG 文件<p> 日志(.LOG)文件的基本上无章可循,各成风格。所以一般都是在纯文本模式下查看。 以普通文本的方式显示日志,基本没有清晰度和阅读舒适感。 </p> <p> 不过一般来说,日志中是会有日期时间(格式非常多样),错误产生的地址,行号, 列号,日志类型(错误(ERROR),信息(INFO),调试(DEBUG),警告(WARN)等) </p> <p> 据此,我为 .LOG 文件定义了一些语法着色的规则,将 <a href="http://hotoo.googlecode.com/svn/trunk/vim/vimfiles/syntax/log.vim">log.vim</a> 放至 <code>$VIM\vimfiles\syntax</code>(Windows) 目录,并在 <code>$VIM\vim72\filetype.vim</code> 中加入: </p> <pre>au BufNewFile,BufRead *.log setf log<br /></pre> <p> 现在就可以在 Vim 中较清晰的查看 .LOG 日志了。 </p> <p> <img src="http://farm5.static.flickr.com/4051/4623711702_81901313f9_o.jpg" /> </p> <p> 你也可以针对自己的实际情况,来自定义语法。 </p>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-50114326157403497162009-05-09T14:14:00.002+08:002009-05-09T14:15:44.734+08:00未知选项的表单设计<div class="entry">发现许多的注册表单设计中,性别部分的设计大都这样:使用单选按钮(radio)并默认选中一个(大都为男性,某些女性频道为主的可能为女性)。例如网页申请QQ帐号和注册网易通行证等<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SgUXbXDilSI/AAAAAAAAICg/iWEub23YPns/s1600-h/qq-reg-gender.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SgUXbXDilSI/AAAAAAAAICg/iWEub23YPns/s320/qq-reg-gender.jpg" /></a></div>网页申请QQ (<a href="http://www.qq.com/">qq.com</a>)帐号<br />
<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SgUXhW92jnI/AAAAAAAAICo/aPBUi5Ew-34/s1600-h/163-reg-gender.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SgUXhW92jnI/AAAAAAAAICo/aPBUi5Ew-34/s320/163-reg-gender.jpg" /></a></div>注册网易(<a href="http://www.163.com/">163.com</a>)通行证<br />
<br />
雅虎(<a href="http://www.yahoo.com/">yahoo.com</a>)的设计比较特立独行,使用选择框(select),并默认不选中任何一个。<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SgUYkKl3WQI/AAAAAAAAICw/-TCSOh0wpbA/s1600-h/yahoo.com-reg-gender.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SgUYkKl3WQI/AAAAAAAAICw/-TCSOh0wpbA/s320/yahoo.com-reg-gender.jpg" /></a></div><br />
而雅虎中国(<a href="http://www.yahoo.cn/">yahoo.cn</a>)的设计也是使用单选框(radio),但是不选中任何一个。<br />
<div class="separator"><a href="http://4.bp.blogspot.com/_POl6bUDELqY/SgUZRosOFDI/AAAAAAAAIC4/5QXSQhtQFH0/s1600-h/yahoo.cn-reg-gender.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://4.bp.blogspot.com/_POl6bUDELqY/SgUZRosOFDI/AAAAAAAAIC4/5QXSQhtQFH0/s320/yahoo.cn-reg-gender.jpg" /></a></div><br />
按常理来说,注册系统并不知道用户的性别是什么,默认选中任何一个都不合理。yummy有一篇文章《<a href="http://www.yummyux.com/?p=366">中文按1,For English, press 2</a>》提到“如果用户必须做出选择,那就先给他做好一个选择。”,这个道理在某些情况很不错,但是用在这里不合适。<br />
<br />
<b>如果不足够了解用户,就不要替用户做选择。</b></div>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-12695087240158577892009-05-08T21:36:00.001+08:002009-05-08T21:36:47.882+08:00状态模式<div class="entry">现有的IM软件都有状态设置功能,常见的默认状态有:在线,忙碌,离开,隐身,离线,但是这些状态对应的选项是不可设置的,例如TM/QQ,选择在线或者忙碌,对应的通知铃声,接收消息方式都是指定、不可改变的,虽然这些默认设置在某些情景下可能很合理,但不总是这样。<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SgQrIxd1QAI/AAAAAAAAIBg/Ky02D0-lldY/s1600-h/TM-status.JPG" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SgQrIxd1QAI/AAAAAAAAIBg/Ky02D0-lldY/s320/TM-status.JPG" /></a></div>TM/QQ 状态:可以使用默认状态作为模板附加消息来添加状态。<br />
<span id="more-368"></span><br />
<div class="separator"><a href="http://4.bp.blogspot.com/_POl6bUDELqY/SgQuUjBzaiI/AAAAAAAAIBo/1huCGCCenME/s1600-h/Gtalk-status.JPG" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://4.bp.blogspot.com/_POl6bUDELqY/SgQuUjBzaiI/AAAAAAAAIBo/1huCGCCenME/s320/Gtalk-status.JPG" /></a></div>Gtalk 状态:可以直接在状态写状态信息,但是只有在线,离开和离线三种状态。<br />
<div class="separator"><a href="http://4.bp.blogspot.com/_POl6bUDELqY/SgQuYt6H6OI/AAAAAAAAIBw/d9PHFq32QOc/s1600-h/Wangwang-status.JPG" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://4.bp.blogspot.com/_POl6bUDELqY/SgQuYt6H6OI/AAAAAAAAIBw/d9PHFq32QOc/s320/Wangwang-status.JPG" /></a></div>WangWang 状态:可以添加状态信息。<br />
可以看出,基本上IM软件的状态信息只能向好友展示文本消息,告诉好友你当前的状态,有时候并不能真正帮助我们在某些需要的时候过滤某些信息,例如老板告诉秘书,帮我回绝所有约会和电话。<br />
最近工作的时候发现,我希望工作的时候设置状态为在线,或者忙碌也可以,而且不想接收所有或某些群消息。例如上班工作的时候不想接受技术探讨群或娱 乐群的叽歪消息,但是要聆听部门或项目组的群消息,尤其要注意老板发来的消息,当然手工修改每个群的消息设置也可以做到,但是每次改都非常不方便,如果可 以保存为模式(如命名为“工作模式”,寂寞的时候想找人聊天可以设置一个“寂寞模式”),在模式之间切换就更实用了。<br />
智能手机(如我的Smartphone)在这方面就做的不错,值得学习。Smartphone上有各种“情景模式”,如普通,静音,会议,室外,自 动,耳机,车载和免提,每一种模式的铃声类型,音量,包括模式名称等多项设置都可以根据用户自身情况改变(当然默认的情景模式设置也已经很合理了,但我也 有在一些特殊的时候,做一些适当的修改)。<br />
<div class="separator"><a href="http://2.bp.blogspot.com/_POl6bUDELqY/SgQzKZVKoKI/AAAAAAAAIB4/dc_dJtAA3dU/s1600-h/dopod-577w.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://2.bp.blogspot.com/_POl6bUDELqY/SgQzKZVKoKI/AAAAAAAAIB4/dc_dJtAA3dU/s320/dopod-577w.jpg" /></a></div>下面使用Windows Mobile 2003的相关屏幕截屏<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SgQz0nQ2nVI/AAAAAAAAICA/VVtYVy6DAfQ/s1600-h/smartphone-1.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SgQz0nQ2nVI/AAAAAAAAICA/VVtYVy6DAfQ/s320/smartphone-1.jpg" /></a></div><div class="separator"><a href="http://4.bp.blogspot.com/_POl6bUDELqY/SgQz3xB2zUI/AAAAAAAAICI/1Vz4I9VzXAE/s1600-h/smartphone-2.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://4.bp.blogspot.com/_POl6bUDELqY/SgQz3xB2zUI/AAAAAAAAICI/1Vz4I9VzXAE/s320/smartphone-2.jpg" /></a></div><div class="separator"><a href="http://4.bp.blogspot.com/_POl6bUDELqY/SgQz6xCW68I/AAAAAAAAICQ/a7T_Sw4jD3I/s1600-h/smartphone-3.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://4.bp.blogspot.com/_POl6bUDELqY/SgQz6xCW68I/AAAAAAAAICQ/a7T_Sw4jD3I/s320/smartphone-3.jpg" /></a></div><div class="separator"><a href="http://4.bp.blogspot.com/_POl6bUDELqY/SgQz98t-tgI/AAAAAAAAICY/JT08w_36uRU/s1600-h/smartphone-4.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://4.bp.blogspot.com/_POl6bUDELqY/SgQz98t-tgI/AAAAAAAAICY/JT08w_36uRU/s320/smartphone-4.jpg" /></a></div></div>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-89396886973091619752009-05-02T12:58:00.001+08:002009-05-02T12:58:25.395+08:00标签模式目前的标签有以下几种模式(形式):<br />
<br />
1. 手动外联标签模式。<br />
这种模式将标签和内容分离,用户需要为指定文档/内容贴上不同的标签。例如Gmail和新版Wordpress的标签。<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SfvBJ3-KZQI/AAAAAAAAIAY/qS9Y53-xN4g/s1600-h/Gmail_labels.JPG" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SfvBJ3-KZQI/AAAAAAAAIAY/qS9Y53-xN4g/s320/Gmail_labels.JPG" /></a></div>优点:简单易用,可控性强。<br />
缺点:需要为每个内容设置标签。<br />
<span id="more-341"></span><br />
<br />
2. 手动内联标签模式。<br />
这种模式将标签和内容融合,用户同样需要为文档/内容贴上不同的标签,并且这种模式因为没有明确的标签输入区(标签输入区和内容输入区在一起),容易导致忘记贴标签,对于及时性和不可修改性的应用不太理想。如Twitter就有这方面的第三方应用,参考<a href="http://www.hashtags.org/">hashtags</a>。<br />
<div class="separator"><a href="http://2.bp.blogspot.com/_POl6bUDELqY/SfvCwh4OmRI/AAAAAAAAIAg/WM8rUQkDBl8/s1600-h/twitter_tags.JPG" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://2.bp.blogspot.com/_POl6bUDELqY/SfvCwh4OmRI/AAAAAAAAIAg/WM8rUQkDBl8/s400/twitter_tags.JPG" /></a></div>优点:内容被语义化;标签本身简单易用,可控性也很强。<br />
缺点:需要辅助标记,内容被干扰;容易忘记使用标签。<br />
<br />
3. 自动内联标签模式。<br />
这种模式需要用户手动设置标签集合,系统根据内容自动匹配标签。目前还没有发现这种模式的实际应用,比较接近的有<b>关键字替换</b>和<b>对局部文本进行评论</b>(忘记怎么称呼了,也没找到相关网址,请大家给提个醒)。关键字替换只是展示层的,用户可以根据内容发现(暂且称之为)标签,但无法通过标签找到匹配的内容(由此想到了搜索引擎)。<br />
<div class="separator"><a href="http://1.bp.blogspot.com/_POl6bUDELqY/SfvGbLpTtAI/AAAAAAAAIAo/7osZzg3lZPU/s1600-h/qq_news_replace_text.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://1.bp.blogspot.com/_POl6bUDELqY/SfvGbLpTtAI/AAAAAAAAIAo/7osZzg3lZPU/s400/qq_news_replace_text.jpg" /></a></div>优点:标签自动化,用户无需操心内容和标签之间的关系。<br />
缺点:要匹配到正确的标签并不容易,大概到真正的语义时代可以解决。<br />
<br />
由此扩展另一种:<br />
<br />
4. 内联标签兼容模式。<br />
系统根据用户设置的标签集合管理标签与内容之间的关系,另外用户也可以手动管理标签。<br />
优点:标签自动化;可控性强。<br />
缺点:简单问题变复杂,包括系统实现复杂度和用户使用复杂度。<br />
<br />
不过回头想想,标签本身很简单,有必要把它变复杂吗?自动化就是不想手动控制,如果需要手动控制还要自动化干嘛?闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-49235206941859963972009-04-19T12:41:00.001+08:002009-04-19T12:43:28.726+08:00关于面包屑导航<div class="entry">一直都很喜欢<a href="http://blog.rexsong.com/">千鸟志</a>的标题面包屑导航方式,我准备在自己的博客主题中使用这种导航。<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SeqhIZSlAVI/AAAAAAAAIAA/-baINqNNStg/s1600-h/nav0.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SeqhIZSlAVI/AAAAAAAAIAA/-baINqNNStg/s320/nav0.jpg" /></a></div>不过,千鸟志的导航部分和标题有重复(另外我比较倾向于使用标签而不是分类)。下面将导航和标题融合,去除标题部分。<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SeqiNLKKJTI/AAAAAAAAIAI/mjHbOS-0Q-g/s1600-h/nav1.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SeqiNLKKJTI/AAAAAAAAIAI/mjHbOS-0Q-g/s400/nav1.jpg" /></a></div>这里使用了语义化的标签,并且在字体和颜色上突出当前的状态,与标题融合的也算恰当。不过当标签较多时会将标题挤到很靠后。<br />
另外想到有一些Unix论坛使用的树形导航也不错,稍加改进如下:<br />
<div class="separator"><a href="http://4.bp.blogspot.com/_POl6bUDELqY/SeqjWus5-MI/AAAAAAAAIAQ/DyOoETHewq8/s1600-h/nav2.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://4.bp.blogspot.com/_POl6bUDELqY/SeqjWus5-MI/AAAAAAAAIAQ/DyOoETHewq8/s320/nav2.jpg" /></a></div>标签应用比上面稍合理,而且css裸奔情况下表现也略如人意(话说“差强人意”这个词的“差”是“甚,殊”的意思)。对于导航层级不太深的应用,还是不错的。</div>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com1tag:blogger.com,1999:blog-6928480364542251223.post-18859373590418316032009-04-17T00:06:00.001+08:002009-04-17T00:07:00.792+08:00改进的菜单按钮<div class="entry">一直想写关于菜单按钮的设计,但是太懒惰的原因,老是拖着不做。<br />
当然今天也没勤快到哪里去,下面第二个改进图是用<a href="http://www.evolus.vn/Pencil/">Pencil</a>画的,并没有用脚本实现,哎,懒啊。<br />
先看QQ/TM的设计,无论选项是什么,按钮上都没有体现出来。<br />
<div class="separator"><a href="http://4.bp.blogspot.com/_POl6bUDELqY/SedGvF26A7I/AAAAAAAAH_Y/-UB9My9RlP8/s1600-h/qq-send-button-orig.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://4.bp.blogspot.com/_POl6bUDELqY/SedGvF26A7I/AAAAAAAAH_Y/-UB9My9RlP8/s320/qq-send-button-orig.jpg" /></a></div>我觉得其实不论是文本,还是图标,都可以把当前选中状态体现在按钮上的,便于用户确认按钮当前的状态。下面是改进后的菜单按钮(以QQ/TM为例)。<br />
<div class="separator"><a href="http://1.bp.blogspot.com/_POl6bUDELqY/SedFixewtuI/AAAAAAAAH_Q/fFRR8KiM4OE/s1600-h/qq-send-button.jpg" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://1.bp.blogspot.com/_POl6bUDELqY/SedFixewtuI/AAAAAAAAH_Q/fFRR8KiM4OE/s320/qq-send-button.jpg" /></a></div>一般来说,菜单按钮都应该做用户“最后一次”使用选择的动作。<br />
例如早期QQ的视频、语音菜单按钮,MSN的菜单按钮,还有旺旺的菜单按钮,都应该如此。<br />
<div class="separator"><a href="http://2.bp.blogspot.com/_POl6bUDELqY/SedKDnXmfOI/AAAAAAAAH_g/rGTWQwL8MSE/s1600-h/wangwang-trans-file.JPG" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://2.bp.blogspot.com/_POl6bUDELqY/SedKDnXmfOI/AAAAAAAAH_g/rGTWQwL8MSE/s320/wangwang-trans-file.JPG" /></a></div></div>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-88893052439372639372009-04-14T13:09:00.003+08:002009-04-14T15:26:49.284+08:00如何削铅笔<div class="entry">看了<a href="http://www.junchenwu.com/">JunChen</a>翻译的<a href="http://www.junchenwu.com/2009/04/our_favorite_tools_for_sketching.html">Adaptive Path:我们最爱的草图工具</a>,我很受启发。之前也有让公司买彩色铅笔用,但现在已经离开用不着了。而且一直都很想买个<acronym title="Getting Things Done">GTD</acronym>记事本以及其他文具,今天抽空就把装备给差不多备齐了。<br />
回来削铅笔的时候,想起自己以前的经历:小时候用过转笔刀和小刀,都会把笔尖削的很尖锐,跟书本上的引导、同学的同化、以及思维定势都有关,而且也 基本适合那时候的使用场景。后来高考使用2B铅笔,也受一些美术专业朋友的影响,学会了把笔尖削得平板愚钝一点(有点返璞归真,大智若愚的感觉),这种削 法也一直 使用到现在。<br />
这里要讲的就是这种削法。<br />
削表面木头时,先不要削炭芯,倾斜度建议平滑一点,大概15°,也就是圆锥体切面角度大概为30°。大概完成的时候,被削的表皮为2cm长,露出的笔芯部分0.5cm。<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SeQYzaIDvHI/AAAAAAAAH-w/BMxhZ7QLgz4/s1600-h/pencil_0.GIF" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SeQYzaIDvHI/AAAAAAAAH-w/BMxhZ7QLgz4/s320/pencil_0.GIF" /></a></div>然后是削笔芯,先在圆柱体的两边削出平行(渐进微斜)的两个平面,尖端厚度大概为0.15cm (1.5mm)。<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SeQZa_o1x9I/AAAAAAAAH-4/JWnbaXCX2QE/s1600-h/pencil_1.GIF" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SeQZa_o1x9I/AAAAAAAAH-4/JWnbaXCX2QE/s320/pencil_1.GIF" /></a></div>再把笔尖顶端的一侧削(刮)出一点弧度,以便于书写和素描。<br />
<div class="separator"><a href="http://4.bp.blogspot.com/_POl6bUDELqY/SeQZ23fOCMI/AAAAAAAAH_A/L5qqNshtEEs/s1600-h/pencil_2.GIF" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://4.bp.blogspot.com/_POl6bUDELqY/SeQZ23fOCMI/AAAAAAAAH_A/L5qqNshtEEs/s320/pencil_2.GIF" /></a></div>最后在稿纸上试笔,顺便打磨一下笔尖两侧,使之更便于使用就可以了。笔尖平时一般不用削,用的时候就可以把笔尖磨成舒适的形状,直到笔尖变短。<br />
<div class="separator"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SeQ6eRCn8aI/AAAAAAAAH_I/P1GGYKmZR4Y/s1600-h/90414-151043.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SeQ6eRCn8aI/AAAAAAAAH_I/P1GGYKmZR4Y/s400/90414-151043.jpg" /></a></div><br />
p.s. 1. 不知道白色笔芯的铅笔用来华什么,一般都用白纸,而且她也不能遮盖掉其他颜色,不然用做橡皮功能也不错。<br />
p.s. 2. 文具店的阿姨也在讲求用户体验呢,正准备装修外面的广告招牌,对店里放笔的盒子的设计细节也有研究。</div>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-38736908626526642302009-04-08T20:33:00.001+08:002009-04-08T20:34:31.913+08:00Facebook 国家代码:86 年中国RT(如题,如图):<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SdyZYQOjIqI/AAAAAAAAH-o/38buiIYHdb8/s1600-h/facebook-funny.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SdyZYQOjIqI/AAAAAAAAH-o/38buiIYHdb8/s400/facebook-funny.jpg" /></a></div>闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-73159404176279658092009-04-08T13:09:00.001+08:002009-04-08T13:09:58.797+08:00电梯按钮设计<ol><li>外面选择“上”或“下”的按钮换成“开门”,这样外面也可以中断自动关闭的电梯门,并增加选择楼层按钮。这样电梯系统可以预知各个起始楼层和目标情况,可以结合历史数据合理调整运转过程,对用户来说,也不必都挤在电梯里忙着(或忘记)选择目标层;</li>
<li> 选择“上”、“下”以及楼层的按钮可以取消选中。建议如下:当前被选中,则按一下取消选中,否则选中。目前有一些稍人性化的电梯可以取消操作,但是要按N下,而一般用户又不知道N等于几?其实按一下就够了,不过避免误操作,连续按两、三下取消也可以,并在旁边给出提示;</li>
<li>里面保留选择上、下和楼层按钮(用户可以中途改变目标),但是选择楼层的按钮应该放到开、关门按钮的下面,方便儿童和残障人士使用(开、关门是自动的,影响不大)。</li>
</ol><br />
这个改造成本不知道算不算大,每一层都需要增加选择楼层的按钮,不过这对用户和系统都是有利的,为电梯系统设计的合理也做了准备。我觉得这是未来电梯的最低配置。闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-90997625355617484502009-04-04T23:45:00.002+08:002009-04-04T23:47:01.102+08:00Google Page-Rank 更新了从Twitter上看到有人推才知道Google Page Rank更新的消息。<br />
<br />
很多人都说他们的PR值下降了,或者只是持平,但是我的每个有效域的PR值都涨了,这跟我原来的PR值本身就不高有关,下面简单描述一下最近做的“SEO”工作和各子域PR值升值的情况。<br />
<br />
<a href="http://www.xianyun.org/"><b>www</b></a> : 只有2个页面(一张门面和一张简历),前段时间改了下,较符合web标准,PR值从0升到了1;<br />
<br />
<a href="http://glog.xianyun.org/"><b>glog</b></a> : 用的Blogger.com,之前没有对搜索引擎开放,也从0升到了1。其实我一般是先在Blogger发日志,然后粘贴到blog域的,不过我评论时都留的blog域,“人气”稍好一点;<br />
<br />
<a href="http://blog.xianyun.org/"><b>blog</b></a> : 最近升级到了wp2.7,简单做了个毛坯主题,服务器从新加坡换到了美国,PR值也从1升到了2。<br />
<br />
因为平时访问的人也不多,我也不是特在乎,这个值也合乎情理,我满足了。闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-54793072179370301022009-03-31T00:30:00.002+08:002009-03-31T00:39:23.721+08:00Firefox 上的超级 iconFirefox浏览器,页签上的icon,有时候会出现红色的叉和黄色的感叹号,不知道代表的什么意思,有什么功能。很可能是跟Tab Mix Plus有关。<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://1.bp.blogspot.com/_POl6bUDELqY/SdDzPLZO6II/AAAAAAAAH-A/XzKteiKZclU/s1600-h/ff_icon.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://1.bp.blogspot.com/_POl6bUDELqY/SdDzPLZO6II/AAAAAAAAH-A/XzKteiKZclU/s320/ff_icon.jpg" /></a></div>关闭Firefox是提醒:<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/SdD01-uhcQI/AAAAAAAAH-I/0pK2zq7DJjY/s1600-h/ff_icon2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/SdD01-uhcQI/AAAAAAAAH-I/0pK2zq7DJjY/s400/ff_icon2.jpg" /></a></div>右键标签发现有“保护标签页”和“锁定标签页”的选项菜单,原来是这两个家伙,不知道是不小心做了什么导致保护或锁定的(没有使用右键菜单)。闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com0tag:blogger.com,1999:blog-6928480364542251223.post-47129513790148462042009-03-26T00:05:00.003+08:002009-03-26T01:02:12.484+08:00笔试后双方最好能当面讨论题解最近有好几次进阿里集团的笔试经验,有一个小体会:笔试后招聘方和应聘方最好能一起交流讨论题解(记得学校考试的时候,对题目有疑问时可以举手提问,老师也有出错题的时候,但是考场上发现后会立即处理。不过由于笔试时间短,出现意外再改的话时间会很仓促,所以建议在笔试后讨论,题可以先按照“常理”解答)。<br />
<br />
前两次分别在<a href="http://ued.taobao.com/">淘宝UED</a>和<a href="http://www.alimama.com">阿里妈妈</a>的笔试题里,有一道很相似的题:给数值对象(Number)扩展一个原型方法,将数值格式化为指定长度的字符串(另外还有一个条件,淘宝UED给的是“能指定格式最好”,阿里妈妈则是“能指定进制最好”)。<br />
<br />
淘宝UED:<br />
想到数值可能是小数,但题目没有知道小数保留长度等条件,这里只考虑整数位。<br />
<pre class="code">Number.prototype.format = function(len, format){
var a=this.toString().split("."), l=a[0].length;
if(l>=len) return a.join(".");
return new Array(len-l+1).join("0")+a[0] + (a[1]?"."+a[1]:"");
};
</pre><br />
阿里妈妈:<br />
同样有小数问题,而且小数转进制的话也有特殊的地方,这里忽略小数。<br />
<pre class="code">Number.prototype.format = function(len, dem){
var s = this.toString(dem), l=s.length;
if(l>=len) return s;
return new Array(l-len+1).join("0") + s;
};
</pre><br />
好在两个部门笔试后都有相关讨论,对这一问题做了及时的初步探讨。<br />
<br />
今天又去参加了<a href="http://china.alibaba.com/">阿里巴巴</a>的笔试,这次的题没有重复的,但是也有一个问题压轴题。<br />
<br />
大意是用CSS控制3个DIV,布局如下图(图是随手画的,不计较大小比例):<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://3.bp.blogspot.com/_POl6bUDELqY/ScpP_IbKQOI/AAAAAAAAH94/2CpARReFJww/s1600-h/Alibaba-CSS.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/_POl6bUDELqY/ScpP_IbKQOI/AAAAAAAAH94/2CpARReFJww/s320/Alibaba-CSS.jpg" /></a></div>当时解答的时候,在我看来,似乎是只给3个兄弟关系的div,没有辅助标记,让写css控制布局。<br />
<br />
css虽不是我所最擅长,但是这个布局还是可以做出来的,但是难点只在于不使用辅助标记,哪怕是div。<br />
当时我的解法如下(这里是调试后正确的代码,当时思想相同,但代码没有写完整,也没有经过调试验证):<br />
<pre class="code">#box0{border:1px solid #f00;width:200px;height:400px;margin-bottom:10px;}
#box1{border:1px solid #0f0;width:200px;height:250px;}
#box2{border:1px solid #00f;width:600px;height:650px;position:relative;top:-664px;left:210px;}
</pre><br />
<pre class="code"><div id="box0"></div>
<div id="box1"></div>
<div id="box2"></div>
</pre><br />
虽然效果基本相同,而且没有使用辅助标签,但总觉得有点ugly,因为这里的区域尺寸都是固定像素的,所以较好控制,当遇到未知高度时,#box2的top就不知道要设置为多少了,还是加一个辅助标签简单灵活。<br />
<br />
如果可以使用辅助标记,我的题解如下:<br />
<pre class="code">#box{float:left;width:200px;border:0px solid #000;}
#space0{width:200px;height:400px;border:1px solid #f00;margin-bottom:10px;}
#space1{width:200px;height:250px;border:1px solid #0f0;}
#space2{width:600px;height:650px;float:left;border:1px solid #00f;margin-left:10px;}
</pre><pre class="code"><div id="box">
<div id="space0"></div>
<div id="space1"></div>
</div>
<div id="space2"></div>
</pre><br />
还有一个问题是,因为有边框和间隔的关系,左右两个区域是无法上下对齐的。另外实际应用中还要考虑到清除浮动,父级元素等情况。<br />
<br />
当时有想过打破(可能是自己臆想的)规则,用辅助div实现,但是由于尝试在规则之中实现,结果用了过多的时间,还答的一塌糊涂。 <br />
<br />
由于这次有多人一同笔试,而且时间很晚(预约18:30分),无法安排讨论,我对这道题也耿耿于怀,回来请教我那<a href="http://www.hxblog.net/">牛逼的朋友</a>,第一选择也是使用辅助div。不知道阿里巴巴这道题的作者是怎么想的,难道是故意的?闲耘™http://www.blogger.com/profile/13097463672593238668noreply@blogger.com1