一直是仿造Remember the milk来做LazyBook的。这主要基于几点
- 在线记账和在线备忘录,核心功能都很简单
- 使用必须非常简单,只能占用很少的时间,从而促进使用者长期坚持使用
- 都要求界面简单,入手快速
- 都要求随时随地可以记录,所以需要最开始的手机应用
那RTM是怎么解决这些问题的呢。
- 界面非常简单,但却有复杂全面的帮助信息系统
- 只需要最简输入,然后Enter一下,就可以完成一个Task记录
- 使用了大量的Ajax功能,简化用户的操作
- 提供手机的应用程序
所以,学习RTM的界面,是实现我们的口号“随时随地,快速记账”的一个最快捷径。
不过困难也是显然的。因为用了自己的Ajax的js,我只能使用Firefox Firebug来实时地获得动态做成的HTML程序。即使如此有些功能还是需要变通的。
1)在输入框里面输入 #这些符号的时候,会在光标后现实一个选择的下拉框。这个如果按照最原始的方法,截获keypress事件,然后现实一个div,同时支持上下选择等。是相当费事的。所以我选在了Jquery UI的Auto compleate功能,把#后面要显示的选项设为 #aaa #bbb等等。这样子用户输入了#就可以有个 #aaa,#bbb的下拉框了。不过相比下来,还有不足,一个是下拉框每次都和text box平齐,而不是和光标平齐。还有一个就是下拉框里面显示的是#aaa而不是aaa。另外目前还遇到一个很严重的冲突。我希望截获textbox的enter事件,但是firefox的auto compleate的下拉框的Enter选择,也会激活textbox的enter key。不过IE中是好的。现在还在考虑中,实在不行,就只能回到传统,加入一个确认按钮。
2)RTM里面有一个很实用的功能,就是修改task具体信息的时候,只要按那个信息或者后面的小图标,就会从Label变成一个textbox,而且输入了项目之后,不用按按钮,只有enter,或者是鼠标按到其他位置,就可以自动提交。为了防止按错,会出现一个消息框,里面包括一个取消Link。不过我实际做起来确实很烦人,每个项目都要截获click事件,还有自动替换html的tag,最后还有在多个触发点激活更新。现在索性回到原点,用户选择一个项目后,详细信息就是输入框,直接修改就可以了。
3)不过仿造的过程中,也学习了不少jquery的方法和jquery的插件效果
比如选择日期期间的 Date Range Picker
动态浮动层 scrollfollow
计算器选择 jQuery Calculator
信息提示 jQuery UI Notify