在Using Drupal(O’Reilly页面Amazon页面)这本书的配套站点(usingdrupal.com)中,作者(均来自Lullabot团队)在感谢Ivan Zugec同学为他们提供站点和域名之余,又推荐了他制作的Drupal tutorials and screencasts

虽然不是头一次见到Screencast,但毕竟也算个新词儿——类似的新词儿还有Webcast(网络视频、网络直播、网上节目)、Podcast(Ipod+broadcasting,播客?行动数位广播?)。有人把这个“术语”翻译为“截屏视频”或“抓屏视频”。意思没有什么问题;可似乎还欠缺那么一点点味道,比如说发音上难以对应。抱着这种求全的心理,开始搜索。结果,不期而遇了一个在线制作Screencast的站点——ScreenToaster(Screencast吐司机?)

这个站点好。可以在线录制屏幕操作,制作Screencast。而且,录制完毕后,可以直接上传到这个站点共享,也可以上传到YouTube;还可以直接点击相应图标,把视频发送到一大堆社区网络服务去共享(前提是必须拥有这些服务的账户;可以即时登录),有TwitterFacebookMySpaceFriendFeedGoogle BookmarksYahoo! BuzzStumbleUponDiggDelicious。还可以另存为.mov或flash格式,然后下载。

说到这,这篇文章的主题就已经发散了(由讨论Screencast的译法变成了讨论ScreenToaster)。既然如此,就把发散进行到底吧!

“五·一”节期间,抽空仿照译言的批眉功能做了一个小页面。由于一直比较忙,就做了个开头(前端部分),但还有待于完善;而且,后端还没着手做。看到ScreenToaster之后,忽然想到用它来制作一个“使用教程”,倒是蛮爽啊(以前用的都是Windows应用程序)。Action一番,得到如下视频:

下面简单分析一下:

译言使用MooTools框架实现交互,利用CSS定位“图钉”,通过Ajax与后端通信。这种解决方案思路虽然比较清晰,但过于简单,也缺乏灵活性。

比如,为了通过CSS定位正确反映眉批位置,页面布局必须“写死”,页面版式只能居中,两栏的宽度也不能再改了;一改,“图钉”的绝对位置就跟正文对不上号了。另外,被批注的文字在常规状态下也没有通过颜色变化来突出显示,只有在鼠标悬停于“图钉”上时,才知道批注的是哪句话;不够直观。

我在考虑另一种方案:把为了保存眉批内容而动态创建的图像和DOM元素,直接作为正文的内容写到数据库中。记得我翻译的《JavaScript DOM高级程序设计》中有个DOM生成器的案例,是把HTML转换为DOM结构;现在的问题恰好相反,即把DOM结构转换成HTML,然再通过Ajax传给后台。 有时间再考虑一下,眼下看来似乎还是可行的。

不知天下高手还有没有更好的解决方案;当然,最好的解决方案应该参考Google Docs,不过其JS好像是加了密的(可一点儿也不甜噢!:))。