[Hax4] Rainbow

測試頁面:在這、專案資訊:在這

這幾天因為心血來潮,想說來練習一下pure javascript,所以就都不用jQuery來做事情(雖然最後還是有用,不過我只用來做特效而已XD)。這個Idea其實是源於我以前做的一個很爛的liu-translator,它只能單方面做字根對字的轉換,所以就想說利用Ajax的概念來實作一個線上的IME,因此我就去找了之前Luke的網蝦米來研究他的UI介面。

研究了一下後就開始著手動工整個JS的架構,邊看深入淺出Ajax邊試著實作他說的一些思惟,像是要怎麼寫的很MVC,所以就開始學著把程式切成粗略的「資料」、「模組」、「樣式」三類,雖然之間還是有些耦合性,但是比較以前的我,這次的實作算是很成功的分離了。

之後又想到行易公司的練習嘸蝦米的打字程式一直沒有跨平台,只支援該死的M$,所以為何不幫他們設計一個Cross Platform的Web Application?反正只要解決Cross Browser的問題就可以了,雖然我在Cross Browser這條路上只是一個剛入門的新手,但總比Cross Platform好多了吧…因此就把分離完的架構再修改,改成有點像是遊戲的小程式。

原本已經接近完工的狀態了,但是Bu因為是「大新倉頡」的愛好者,所以就給個建議要我加入的其字根對應表,去擴充可支援的輸入法,就又經過了一場編碼和正規表達式的戰爭後,終於把切換輸入法的功能也加上了,這完全要歸因於先前的MVC架構,讓我能夠在很短的時間完成這個動作。

最後一個也是最重要的啦,為了提高遊戲性,我設計了一段可以自動去抓使用者給定URL的頁面回來,把該頁面上所有符合UTF-8繁體中文的字全部抓下來當成題目,這又比起以前行易公司設計的那些題目多了一些趣味。多了這個設計,你還可以邊看Yahoo!奇摩新聞邊練打字咧!!

附上程式截圖:




§2010/05/13 補上程式的Demo連結,原來我都沒有放出來= = ,舊的在這,新的在這
§2011/02/05 更新連結、圖片、介紹。