去年下半年開始進入例行的專案忙碌期，同時又忙著裝潢和準備結婚，拍婚紗、買家俱、自然沒什麼時間發文了… 婚紗照看過的都說不錯，半年來減肥的辛苦果然沒有白廢：

忙忙碌碌到了年底，小弟在12/27日完成了終生大事，現在已經升級為老公了 :p 至於升級到老爸就還要再等等，目前沒有時間表 XD 婚禮當天的照片在此：

新婚生活跟之前最大的不同，大概就是什麼都要自己張羅吧。還好我最近的案子上下班時間很正常，回到家還有時間自己做飯吃，不過也因為天天回家吃晚餐，很快就胖了５、６公斤…orz 又要開始減肥了 XD

就先寫到這邊吧。希望下一篇不會又是一年後 XD

首先連線到 https://opensvn.csie.org/MirrorScripts/userscripts/, FF3會出現如下提示畫面. 這時請點選”新增例外網站”:

接著在FF跳出的”新增安全例外”視窗中點選”取得憑證:

取得憑證之後勾選左下角的”永久儲存此例外”, 再點選下方的”確認安全例外”.

接下來再到 VIL Config 點選 Check Now, 應該就可以順利更新.

附帶一提, 如果 filter 有更新成功, 請重新整理頁面. 要確定filter是否有正確執行可以按 config, 進入設定畫面, 在 URL Pattern 下拉選單中應該會有新的 URL 才對.

首先要感謝這些愛用者的支持. 老實說, 這個問題在 3.0b1 時我就已經知道了, 看起來是 Firefox 在 3.0 中對 XPCOM 元件的安全性修正而造成的問題. 到目前為止, 我還找不到對應的解法, 所以得先請各位忍耐一下. 真的非 PicLens 不可的話可以考慮使用 Portable Firefox(在頁面下半的Legacy Versions中可找到2.0.0.14版的下載連結)。

事實上, VIL 在處理 PicLens / Download 功能時採用的方法不算是很正統的處理方式, 而要完全解決這個問題, 只有自己開發 extension 了. 目前我正在著手進行 VIL+ 的開發, 但是最近頗忙, 所以目前還處於停滯狀態 :p anyway, 先放個 screen shot 給大家看看:

VIL Viewer with local directory index. Auto Fit, Thumbs and Info panel are enabled.

總之, 請大家再多耐心等等吧!

這怎麼可能? 這幾個檔加起來也才不到200K吧? 怎麼會off limit? 後來去查了一下 googlepages 的 help, 也沒明確寫出 bandwidth/page view limit 是多少, 只好自立救濟一下囉! 首先把 jquery 指到 Google AJAX Libraries API, 再把其它幾個獨立的 static file(js/css/images, gadgets 程式(xml)本身會被 www.google.com/ig parse 後 cache 起來, 所以不用處理), 移到自己的 hosting, 再加上 gzip & expires header, 以減少 http access 次數.

目前 gadgets 程式檔已經更新, 應該等 igoogle cache 更新後就會生效. 如果有哪位朋友還是遇到 gadget 不正常的話請再通知我囉!

本季目前為止有在看的有18部左右 驚, 如果要我從中選前三名, 大概會是

1. 料理仙姬
2. CHANGE
3. LAST FRIENDS

以下是無責任評鑑(依首集播出日排序) :p

1. 篤姬: 大河劇, 質感還是有一定水準…有空就會繼續看下去. 推薦指數4
2. ケータイ捜査官7 – 手機搜察官7: 就..當作特攝片來看吧. 推薦指數2
3. パンドラ – 潘朵拉: 看妖精三上博史那麼正經的表情好不習慣啊 XD. 推薦指數3
4. 無理な恋愛 – 無理的戀愛: 意外的還滿有趣的, 推薦指數3.5
5. ラスト・フレンズ – LAST FRIENDS: 劇情錯綜複雜又黑暗, 不過我喜歡 心 缺點是看到上野樹里就想到Nodame XD 推薦指數4.5
6. Around 40: 天海還是比較適合演女王…. , 推薦指數3
7. キミ犯人じゃないよね? – 你不會是犯人吧?: 被要潤愛上的一定是犯人 XD. 貫地谷 しほり怎麼跟小山內美步時代差那麼多 orz… 推薦指數2.5
8. 7人の女弁護士2 – 七人女律師2: 第一話有電車+溫泉+殺人事件..好老派的感覺 ._. 推薦指數2
9. 絶対彼氏 – 絕對達令: 帥哥美女賞心悅目啊~ 不過…我想要絕對女友對我說 “H shiyo~” 羞 推薦指數4.5
10. ホカベン – 熱血律師: 雖然劇情有點沉重, 在日本收視率也不高, 不過我個人滿喜歡的.(絕對不是女主角上戶彩的原因) 推薦指數4
11. ROOKIES～ルーキーズ～ – ROOKIES: 感覺演高中生的演員們都超齡很多吧 @_@. 不過熱血的感覺很好啊!! 推薦指數4
12. 模範女秘書: err…圏外. 推薦指數1
13. パズル – 謎: 感覺跟 Trick 好像. 是故意的嗎? 推薦指數3.5
14. ごくせん3 – 極道鮮師3: 老梗….不過在日本收視率怎麼這麼高 !_! 另外..星野亞希++ XD 推薦指數3.5
15. 猟奇的な彼女 – 我的野蠻女友: 微妙…..總是覺得有哪個地方不對勁 o_O. 推薦指數3
16. おせん – 料理仙姬: おせん好口愛啊~~~大心, 缺點是那些食物都看得到吃不到 orz….推薦指數5!!
17. ハチワンダイバー – 81 Diver: 設定還滿有趣的…巨乳女僕 + 將棋, 推薦指數3
18. CHANGE: 木村拓哉就算演阿宅還是木村拓哉, 好久不見深津繪里一開場的網球裝真吸引人 大心, 阿部寬的角色讓我想到龍櫻裡的老師 XD 不過因為目前只出了第一集, 所以推薦指數先給4.5 :p

大概是這樣吧 :p

P.S. 寫完才在想…我有看那麼多部嗎…….. XD

1. 找出相簿裡所有的小圖URL
2. 利用小圖URL找出大圖URL
3. 回傳所有的大圖URL資訊.

再來介紹一下 filter function 回傳的結果定義. VIL 支援的回傳結果種類如下:

1. String array, 每個 Element 就是圖片的URL.
2. Object array, 每個 Element 是一個包含圖片相關資訊的 Object. 這個 Object 可包含以下 property:

• src: 圖片的 URL, required.
• desc: 圖片的說明文字, optional
• thumb: 縮圖的 URL, optional.
• link: 圖片在相簿中的連結, optional.

以上這些 properties 只有 src 是必要的, 其它的 property 如果不存在, 則會自動代換成 src.

接下來我們以無名相簿為例來說明怎麼樣寫 Filter Function. 先隨便打開一本無名的熱門相簿來參考. 在網頁上要秀圖片, 最常用的方法就是用 <img> tag. 所以我們可以用以下方法抓出頁面上所有的小圖:

function(){
  var images = document.getElementsByTagName("img");
}

這樣 images 陣列中就是頁面上所有的 <img> 了. 因此, 用以下迴圈就可以找出所有的小圖URL了.

function(){
  var images = document.getElementsByTagName("img");
  for(var i = 0; i < images.length; i++){
     var imgurl = images[i].src;
  }
}

接下來進行第二步, 來看看大圖和小圖片URL有沒有什麼關聯性. 如果你有 Firebug 可以直接用它來觀察:

不然, 用 DOM Inspector也不錯:

再不然直接 "檢視原始碼" 也可以 :

接下來就是找出大圖的URL:

比對一下:

小圖: http://f4.wretch.yimg.com/bunny1010/9/thumbs/t1344171903.jpg
大圖: http://f4.wretch.yimg.com/bunny1010/9/1344171903.jpg

這樣很明顯了吧? 所以我們再把圖片URL處理一下:

function(){
   var images = document.getElementsByTagName("img");
   for(var i = 0; i < images.length; i++){
       var imgurl = images[i].src.replace(/thumb\/t/,'');
   }
}

這樣就是所有的大圖URL了. 再來把所有大圖路徑存入 Array 之後回傳即可.

function(){
  var images = document.getElementsByTagName("img");
  var myurls = new Array();
  for(var i = 0; i < images.length; i++){
     var imgurl = images[i].src.replace(/thumb\/t/,'');
     myurls.push(imgurl);
  }
  return myurls;
}

如此就完成最基本的 filter 了. 當然功能是很陽春的, 不過已經足夠讓 VIL 顯示圖片了. 對進階功能有興趣的朋友可以參考 VIL wiki 上完整版的 filter for wretch. 如果有了什麼成果, 也歡迎跟我聯絡分享喔!

上圖是在日本東京Metro裡的宣導圖片, 內容是指”請不要獨佔座位, 圖上的行為請留在家裡”. 真是讓我想轉寄給台鐵工作人員, 建議他們也在車上掛上類似的東西…

雖然應該有不少朋友知道, 不過還是再提一下, 我是個火車通勤族, 每天靠火車往返台北上下班.

其實坐火車通勤比大多數人想像的要方便又快速多了, 平均從我出門到進公司, 大約可以控制在50~70分鐘內, 而實際上在火車上的時間則大約是40分鐘上下, 這樣跟一些住在淡水、新店..等台北近郊的同事相比, 也沒有多花太多時間, 而且通勤費用跟搬到台北可能增加的生活費用相比, 真的是太便宜了, 也因此我從畢業後到現在, 都一直維持著這樣的通勤生活.

在車上的時候, 如果幸運的有座位, 那我就會拿出Notebook看看影片或著趕工寫程式什麼的, 沒座位的話通常是看書或是玩手機, 所以坐車對我來說不但不辛苦, 反而是我的一個放鬆時間. 但是通勤這麼多年下來, 難免會遇到一些奇奇怪怪的事情, . 以下是我列出覺得比較困擾的部分…

• 講手機, 而且很大聲, 困擾指數1: 這種情況比較常發生在年紀稍長, 有點耳背的長輩們身上. 他們因為自己聽不清楚, 自然就以為對方也聽不清楚, 所以越講越大聲. 這種情形其實也是在所難免, 畢竟想在台灣推行像日本那樣上電車就用Manner mode是很困難的(大家都習慣了…) 上班時間倒還無所謂, 要是下班的車上, 你正想閉眼休息的時候, 同車廂內有人大聲講手機, 難免就會有想過去把他手機砸掉的衝動.
• 聊天嘻鬧, 旁若無人, 困擾指數2: 這種情況比較常看在假日的通勤電車上出現. 通常都是一群一起出遊的學生們, 佔據了一大排座位, 聊天打鬧, 甚至和坐在對面一排的同學大聲對話. 年青人有活力是還滿正常的, 但是如果當時有人站在附近, 或被夾在你們兩排中間, 對他們來說還滿痛苦的. 另外就是, 通常一群人一起出去, 看到有需要的乘客就比較不會起來讓座. 大概是要假裝沒看到比較容易吧.
• 任意佔用座位或空間, 困擾指數3: 通常車廂內人少的時候比較容易發生. 很多人手上大包小包上車, 就隨手放在身旁的座位上. 可是在上行的火車上, 一般來說在到台北之前, 乘客數都是只增不減的. 每當有人上車, 看著這些放著東西的位子, 又不好意思請對方開口. 如果東西的主人自動把包包拿起來就算了, 但總是會有人完全(或著假裝)沒有意識到其它人的視線, 完全不為所動, 拜託, 不讓座就算了, 請不要拿行李佔用座位好嗎? 另外, 我在某次車廂很擠的狀況下, 聽到鄰座的小姐很嬌傲的跟她朋友說: “妳看, 我每次人很多的時候都會把腳翹起來, 這樣就不會很人站在我前面了, 我不喜歡有人站我前面, 壓力很大…”,這位小姐, 我是不知道您以前有什麼陰影啦, 但人家站著已經很辛苦了, 不用這樣吧? 不然妳站起來讓個座, 妳就不會有壓力了, 這方法不錯吧?
• 把屁股以外的東西放在座位上, 困擾指數4: 用東西佔位子就算了, 比較可怕的是有人會把鞋子脫了, 腳拿到椅子上. 或是有人整個躺平在電聯車的座位. 拜託, 這些座位下個乘客還要坐好嗎? 我看過最誇張的是我下班坐到一班人很少的莒光號, 兩個高中生把前排座位轉了180度, 然後把腳跨在這兩個位子上…我正想過去指正他們, 還好列車長出現主持正義了, 不然我大概會因此上報吧…XD
• 在車上製造氣味, 困擾指數5: 氣味種類其實還滿多的…你永遠不知道下一班會聞到什麼味道. 最常見的是食物的味道. 大部分食物的味導還不會太令人反感, 只要不是臭豆腐或泡菜等有強烈氣味的東西, 應該都還可以接受, 只是對我這個在減肥中的人, 在車上聞到雞排香味時, 還真的滿痛苦的. 但為什麼我給的困擾指數是5呢? 因為曾經遇過一位媽媽(還滿年輕的, 但看起來是外籍人士), 在電聯車上幫他的小孩換尿布(是車廂中, 不是廁所!)….那種味道真是讓人想跳車逃生……..

以上是我個人的感覺啦, 我是覺得要求大家上了車安靜無聲也滿無理的, 而要像日本人哪樣推行車廂中不講手機應該也有困難, 但是, 這些會造成其它乘客很大困擾的行為, 請你 “Do it at home!”吧!

1. 如何比較遠端版本和已安裝的版本?
2. 如何下載並更新本機的Userscript?

首先來看第一個問題. 在 greasemonkey userscript 中, 要取得遠端網站上的資訊可以透過 GM_xmlhttpRequest 來進行, 因此只要遠端的 server 可以提供版本資訊, 或者 Last-Modified, 我們便可以拿來做為判斷依據. 不過以 Last-Modified 來判斷, 比較容易產生誤差. 所幸 VIL 目前是放在 Opensvn上, 而 SVN 會在 HTTP Response Header 的 ETag 中包含 SVN revision number:

---response begin---
HTTP/1.1 200 OK
Date: Sat, 19 Apr 2008 06:24:47 GMT
Server: Apache
Last-Modified: Sat, 19 Apr 2008 05:38:26 GMT
ETag: "55//userscripts/view.image.links.user.js"
Accept-Ranges: bytes
Content-Length: 44055
Connection: close
Content-Type: text/plain
X-Pad: avoid browser bug

所以我們可以比較這個值即可. 但是另一個問題是, 要如何取得已安裝程式的版本呢? 我原本有想過利用 SVN Keyword 的方式, 自動 replace 程式中的 $Revision$ keyword, 不過後來發現 SVN 是由 client 來進行 Keyword replace, 所以使用 HTTP 方式取得的內容Keyword並不會被代換掉, 因此只好用 GM_getValue/GM_setValue 來處理了. 以下便是 check update 的程式碼片斷:

    if('200' != rspDtls.status){
        GM_log('check failed, response HTTP status: '+rspDtls.status);
        return;
    }else{
        var myrev = parseInt(GM_getValue(revtag,'0'));
        var remoterev = parseInt(rspDtls.responseHeaders.match(/Etag:\s+"([0-9]+).*"/)[1]);
        GM_log('remote rev is ' + remoterev + ', current rev is ' + myrev);
        if(myrev < remoterev){
            return updateFunction(rspDtls, remoterev);
        }else{
            if(showOptMessage){
                alert('remote rev is ' + remoterev + ', my rev is ' + myrev + ', no need to update.');
            }
            return true;
        }
    }

至於第二點, "如何下載及更新本機Userscript", 我一開始的想法是直接 window.open() 到 userscript 的 URL, Greasemonkey 便會自動出現安裝提示. 但後來發現, 這樣的安裝方法會清掉現有的 Include/Exclude page 設定, 所以便改用直接覆蓋已安裝檔案的方法. 而問題又來了: 要如何取得現有的安裝路徑及檔名呢? 這時候就要直接去挖 greasemonkey extension 的 source 了. 在 greasemonkey 的 util.js 中可以看到這一段:

function getScriptDir() {
  var dir = getNewScriptDir();

  if (dir.exists()) {
    return dir;
  } else {
    var oldDir = getOldScriptDir();
    if (oldDir.exists()) {
      return oldDir;
    } else {
      // if we called this function, we want a script dir.
      // but, at this branch, neither the old nor new exists, so create one
      return GM_createScriptsDir(dir);
    }
  }
}
function getNewScriptDir() {
  var file = Components.classes["@mozilla.org/file/directory_service;1"]
                       .getService(Components.interfaces.nsIProperties)
                       .get("ProfD", Components.interfaces.nsILocalFile);
  file.append("gm_scripts");
  return file;
}

function getOldScriptDir() {
  var file = getContentDir();
  file.append("scripts");
  return file;
}

直接 copy paste 到 VIL 中就 ok 了. 取得 script install dir, 再用 DOMParser 取得安裝後的檔名(修改自 greasemonkey 的 config.js):

function getInstalledFileName(){
    var installedFilename = '';
    var configContents = getContents(getScriptFileURI("config.xml"));
    var domParser = new DOMParser();
    var doc = domParser.parseFromString(configContents, "text/xml");
    var nodes = doc.evaluate("/UserScriptConfig/Script", doc, null, 0, null);
  for (var node = null; (node = nodes.iterateNext()); ) {
        var fname = node.getAttribute("filename");
    var name = node.getAttribute("name");
    var namespace = node.getAttribute("namespace");
        if(name == MY_NAME && namespace == MY_NAMESPACE){
            installedFilename = fname;
            break;
        }
  }
  return installedFilename;
}

之後就直接 overwite 掉現有的 userscript, 再 alert 提示使用者重新整理頁面即可.

解決這兩個問題之後, userscript 便可以享有 auto-update 的功能了. 有在寫 userscript 的朋友可以參考看看.

完成後:

用 AutoUpdate 有什麼好處呢?

1. 不用重設 include/exclude page (如果直接用 greasemonkey 重新安裝就要重設)
2. 除了自動 update userscript, 還會自動更新 filter config!

設定頁面如下:

趕快安裝後試用看看吧!

PS. 如此你現在已經有另外設定過 include/exclude page, 那麼可以參考以下做法避免重設 include/exclude page:

• 打開 Greasemonkey 管理頁面:

• 先於左側點選 “View Image Links”, 然後再點選下方的 “編輯”:

如此一來, Firefox 會用 text editor 開啟已安裝的 userscript file, 此時自行把最新的 source code 貼上後存檔即可!