2010-02-13

祝大家新春快乐

祝大家新春快乐

redraiment, 2010-02-13


昨天和前天我参加了小学、初中、高中同学会。自毕业以来,小学和初中同学还是第一次相聚,大家都很开心。我也是头一回喝这么多酒,晚上沿着S型曲线回家。

今早起来为自己泡了一杯蜂蜜解酒,并习惯性地打开Google Reader看看订阅的新闻。博客更新的也不少,同学们都发表日志畅谈新年感言。在这弱冠之年不免多愁善感,一些同学抱怨现在春节没有节日气氛、感叹对过年不再有小时候的期盼,还有同学说过年要被逼吃很多垃圾食品、说一些言不由衷的话……

我觉得大家不必如此,节日对我们来说并不是一条法律规定的几月几号。只要快乐,任何一天都是我们的节日。同一天对于每个人来说都有不同的意义,大家都有自己的节日:比如生日、结婚纪念日等。以前对于小朋友来说,穿新衣服就是最快乐的事情,所以过年无疑是最有吸引力的;在谈成一笔大生意或考上重点大学时,我们也都会相邀庆祝;一些人过生日很讲究,但也有像Leonard(生活大爆炸)一样觉得自己从产道被排除并不是一向重大成就,因此不需要纪念……

在忙碌一年后和家人团聚吃年夜饭,是大部分人都觉得开心的事情,所以春节自古就是大家共同的节日。如果哪天大家都觉得千里迢迢挤春运回来吃顿饭不快乐,那这一天也不再是全民庆祝了。同样的,随着年龄的增长、阅历变得丰富,我们不同时期追求亦不相同,小时候喜欢新衣服现在可能喜欢新房新车。有些同学感叹说变得现实、没有童真了,我倒是觉得这样也无可厚非,有些人只喜欢看鲜花绽放的瞬间(比如火影里的迪达拉),也有人喜欢恒久远永流传(像火影里的蝎),也有类似陶渊明的“园日涉以成趣”欣赏春来冬去、花开花谢的全过程……

另一方面,每个人对如何庆祝节日的观点也不一样。有些人喜欢锣鼓喧天、鞭炮齐鸣、红旗招展、人山人海,也有一些朋友喜欢待在“蝉噪林愈静鸟鸣山更幽”的自在生活。前些时候好多朋友都和我说这个寒假时最后一个假期了,建议我出去旅游,我说这一年我东奔西跑,没多少时间待家里,如果我喜欢旅游还回家干嘛?对我来说,在家好好休息就是最好的庆祝方式。

我希望大家都能用自己喜欢的方式庆祝节日,但也要能包容其他人^_^。在此祝福大家新春快乐、身体健康、万事如意!


2010-02-08

过滤分享的Chrome扩展开发详解

过滤分享的Chrome扩展开发详解

redraiment, 2010-02-08

明确需求





  扩展的功能在前文《眼不见为净——过滤人人网分享的chrome扩展》中已做了介绍:把人人网中一些带有“不分享就如何如何”等诅咒信息的标题给屏蔽掉,眼不见为净!描述得更详细些就是:
  1. 过滤功能只在人人网域名(http://*.renren.com/*)下启用;
  2. 只有访问人人网时,扩展的图标才显示;
  3. 好友的分享信息会出现在很多地方(如好友主页、新鲜事、分享主页等),这些都要过滤;
  4. 我只是不想看到那些讨厌的标题,但分享的视频、图片等还是想看的。
  其中(4)是核心功能,(2)可有可无。

Chrome扩展简介

  Chrome扩展的主页是:http://code.google.com/chrome/extensions/index.html。在此我只简单地介绍一下和本扩展相关的内容,更详细的信息请访问其主页。在本扩展中一共只有六个文件,其中三个是图片文件(用于图标),其他三个文件大小都不到1KB,所以无需“多事”把所谓的源码上传,直接把那几行代码贴到文章中即可。下面逐一介绍六个文件:

图标文件

  图标文件有三个尺寸,都是由同一张图片修改而成。我没什么艺术细胞,原始图片的作者并不是我,只是觉得蛮符合这个扩展的主题,呵呵。如果您知道它的作者请给我留言,或者有志同道合的朋友帮忙贡献一张新图标,在此谢过!
  1. icon19.png:大小为19x19,用于地址栏中显示;
  2. icon48.png:大小为48x48,在Chrome的扩展管理页面(chrome://extensions)中显示;
  3. icon128.png:大小为128x128,安装此扩展时显示。
  原始图片:

manifest.json

  这个Chrome扩展的配置文件,用JSON(JavaScript)来描述与扩展相关的信息,完整介绍请访问:http://code.google.com/chrome/extensions/manifest.html。本扩展的配置信息如下:
{
  "name": "FRRS",
  "version": "0.2.3",
  "description": "FRRS",
  "icons": {
    "48": "icon48.png",
    "128": "icon128.png"
  },
  "background_page": "background.html",
  "page_action": {
    "default_icon": "icon19.png",
    "default_title": "FRRS"
  },
  "content_scripts": [
  {
    "matches": ["http://*.renren.com/*"],
    "js": ["filter.js"],
    "run_at": "document_end"
  }
  ]
}
  前面五项比较简单,顾名思义,分别是扩展的“名称”、“版本号”、“描述”、“图标”以及“背景页面”。在本扩展中“背景页面”用于实现功能(2),详细内容会在下文介绍。
  “page_action”是声明页面信息(本例中包含标题和图标),与之对应的是“browser_action”(本例中没有使用)。当你的扩展与页面无关时用“browser_action”,此时图标会一直显示在工具栏中;而像本例中,扩展只是针对某些特点的页面(人人网)则使用“page_action”,此时图标显示在地址栏中,并且默认是不显示的(功能2)。
  至于这个扩展具体作用于哪些页面,则需要在“content_scripts”里指定,其中元素“matches”用于匹配URL(详细内容参见http://code.google.com/chrome/extensions/match_patterns.html)、“js”用于指定具体的动作、“run_at”用于指定脚步运行的时间。本例中指定了,当前页面的URL与“http://*.renren.com/*”匹配时(功能1),并且在页面加载完成后,执行“filter.js”里的脚步。

filter.js

// show icon
chrome.extension.sendRequest();

// pattern
var reg = new RegExp('[^>]*不分享[^<]*', 'g');
var msg = 'redraiment提醒您:此信息中可能含有另您不愉快的内容,眼不见心不烦。';

// filter span
var spans = document.getElementsByTagName('span');
for (var s = 0; s < spans.length; s++) {
  var context = spans[s].innerHTML.replace(/<[^>]+>/g, '');
  if (reg.test(context)) {
    spans[s].innerHTML = msg;
  }
}

// filter heads
// ...

// filter href
// ...
  这部分是核心功能,我使用的模式(reg)非常简单:检查是否包含“不分享”三个字。大家可以照葫芦画瓢添加其他模式。
  人人网中分享标题分别使用“span”标签(新鲜事中)、“h4”等标题标签(分享主页)以及“a”超链接标签(好友主页)。我们需要通过DOM逐一获取,此处以“span”标签为例:获取页面中所有的“span”元素,删除它们的子标签,用模式“reg”测试,如果成功就用文本“msg”替换。其他标签依此类推。
  另外一个需要注意的地方:字符编码。人人网页面采用UTF-8编码,这对匹配中文会有影响,因此在保存filter.js这个文件时,需要将字符编码设为UTF-8(默认ANSI),否则将匹配失败。
  剩下的第一行特别引人注目,这不是一个标准的JavaScript方法,而是Chrome提供的API。它向扩展发送了一个请求,此请求可被“background.html”中的脚步捕捉。Chrome扩展就是通过发送和捕捉请求来通信的。

background.html

<html>
<head>
<script>
  chrome.extension.onRequest.addListener(
    function(request, sender, sendResponse) {
      chrome.pageAction.show(sender.tab.id);
    }
  );
</script>
</head>
</html>
  脚步中添加了一个监听器,当捕捉到“filter.js”发送的消息时就显示图标。
  我想大家肯定会问,为什么不直接在“filter.js”里执行“chrome.pageAction.show()”来显示图标,干嘛这么多事要发送一个请求?这是Chrome扩展的限制,Chrome的所以API请参看:http://code.google.com/chrome/extensions/api_index.html,但“content_script”里指定的脚步只能使用部分API(显示图标这个API就不在其中),而“background_page”里可以调用所以API,因此只能通过这种方式来实现。

其他

  扩展开发好了,至于如何发布使用,请参见Chrome扩展开发的“Hello World”:http://code.google.com/chrome/extensions/getstarted.html