Opera Twitter Widget 复活手记

我曾经想学着写 Opera Widget ，看了一堆资料，最后因为对 css 、 js 以及网页设计完全无能所以放弃了。想不到在试图让 Opera Twitter Widget 复活的时候还是用上了。

=====开始备料=====
首先是准备一个可以用的第三方 api ，可以直接使用 http://nest.onedd.net/api ，也可以按照 http://www.ifanr.com/2778 打造自己的twitter API proxy （from iFanr 爱范儿）这个教程自己在 Google App Enginge 搭一个。
另外需要一个显示在 Opera 主窗口中而不是 widget 内打开的页面，我用了 dabr 。因为 api 中有些返回的 css 是在 twitter.com 上被墙的，看起来很丑。官方的 dabr 地址是 http://dabr.co.uk/ ，如果有国外的空间依然可以自己弄一个，方法参见 http://www.appinn.com/twitter-dabr-setup-guide/ Dabr 安装 - Twitter 手机版网页程序安装教程（from 小众软件）。
=====备料结束=====

Opera 的 Widget 只是把后缀改成 wgt 的 zip 文件。下载一个官方的 Opera Twitter Widget ， wgt 文件在 profile\widgets 文件夹，改后缀解压缩之。
解压缩之后首先修改 config.xml ，在 <access> 和 </access> 之间增加如下内容

<host>nest.onedd.net</host>
<host>dabr.co.uk</host>

（如果你用的是自定义 api 或者其他的 dabr 程序，当然要改成对应的域名），保存。

script 文件夹下 twitter-api.js 第 57 行" // API methods "到第 248 行"// Twitter search API"之间的 http://twitter.com/ 或者 https://twitter.com/ 改成 http://nest.onedd.net/api/ 或者自己的 api 地址。之后的 twitter search api 我不知道应该怎么改，不过我从来没用到过。

script 文件夹下 twitter.js 查找"'<p class="profile">',"往下一行和查找"(type != "direct_message" ? ('<a href="往下一行，这两处 'http://twitter.com/' 改成 'http://nest.onedd.net/api/' 或者自己的 api 地址。查找"'<p class="text">',"往下一行改为

'<a class="name" href="http://dabr.co.uk/user/', username, '">',

，查找"'<span class="status-line">',"往下一行改为

(type != "direct_message" ? ('<a href="http://dabr.co.uk/status/' + id + '" class="time">' + new Date(created_at).toAge() + '</a> ') : new Date(created_at).toAge()),

保存。
这就改完了。

测试方法：把解压后的 config.xml 拖到 Opera 的窗口里。登陆~我胡汉三又回来啦~

测试 OK 之后，可以将 Opera 的"管理 Widget "和 profile\widgets 文件夹里因为测试多出来的 Twitter Widget 删除。将修改好的代码重新压缩为 zip 包，修改后缀为 wgt ，拖动到 Opera 窗口。这回是彻底搞定啦~




--