Emotion Icons For Blogger

上禮拜在找有無快速插入表情圖示到 Blogger 的方式，於是就找到了 Bill Conan 寫的一個小程式：Blogger 歡樂表情插件。

這個程式是利用 Bookmarklet 的形式將遠端的 JavaScript 程式插入網頁中來運行，程式插入後會在 Blogger 編輯視窗的右方空白處開啟一個小區塊，裡頭有許多的表情圖示，只要點擊你想插入的表情圖示，就可以插入到文章中（但只限於 Edit HTML 編輯原始碼的模式）。

由於原作者提供的表情圖示有許多不是我想要的，再加上也不支援在 Blogger草稿 中使用，所以我就動手給它修改了一下，變成我自己的 EmotionIcons4Blogger 囉！


要使用 EmotionIcons4Blogger 的方式很簡單，只要把 EmotionIcons4Blogger 拖拉到『我的最愛列』或是從右鍵選單加入『我的最愛』就可以了；當要使用時，點擊 EmotionIcons4Blogger 就可以開啟 EmotionIcons4Blogger Panel 了。

其中還多了一些判斷：

• 判斷是不是在 Blogger（標準版或是 draft 草稿版），不是的話就提示使用者，然後不插入 JavaScript。
• 判斷 EmotionIcons4Blogger 是不是已經載入了，已載入就不再重複載入。
• 右上角與右下角多了個 [x] 可以把 EmotionIcons4Blogger Panel 關掉，然後插入的 JavaScript 也會移除。
  

目前測試過且使用正常的瀏覽器有：

• Microsoft Internet Explorer 8.0
• Mozilla Firefox 3.5 Beta 4
• Opera 10.00 Beta Build 1551

畫面呈現如下：

 

目前我只保留 tuzki 兔斯基 的圖示，這隻兔子的動作真的是太搞笑了。


之後可能還會多新增老吳的尪仔標：米滷蛋，這也是我超愛的一個系列！

到時候如果有多其他系列，可能要改成當選到這個系列才載入這個系列的圖片，不然如果表情圖片一多，載入可是會花很多時間的哩，就像原作者那樣。

另外我發現，第一次載入程式時，會因為程式放置的主機的回應速度（Seednet 提供給用戶的免費網頁空間好像不是很好用，回應速度有時候鈍鈍的）讓我以為程式沒有作用，其實只是因為還在跟主機溝通中，才會以為 Panel 沒開出來，我考慮以類似 AJAX Loading 那樣的呈現方式來讓使用者知道程式正在載入中。

以上就是我土砲修改原作者的程式的心得，但是我自己用起來還是有點怪怪的，像是有時候 Panel 會自己消失之類的。
總之～一些 bug 跟後續的想法有空在付諸實行囉！

20090605 updated

昨天放到 Seednet HomePage 的程式並沒有辦法在 draft.blogger.com 使用，今天稍微修改了一下判斷，讓使用者無論是在 http://www.bogger.com 下或是 http://draft.blogger.com 下都可以正常的將表情圖示插入 textarea 當中。

另外，我也在 Google Code 上起了一個專案：EmotionIcons4Blogger，然後把程式跟表情圖檔都放上去，這樣載入速度應該會比較快吧

20090605 2nd updated

剛剛把這隻 JavaScript commit 進了 Version Control 玩看看，然後自己開了一個 Enhancement Issue，原本的程式只能把表情圖示塞到文章最底下，我把它改成夠塞到目前游標所在處。

程式是從 Google 上搜尋到的，是由 alexking 這邊看到的 Inserting at the cursor using JavaScript，alexking 好像也只是把這個 function 從 phpMyAdmin 中的程式獨立出來的，說了甚麼 GPL 授權，所以 WordPress 也可以用之類的，不過這麼複雜的授權種類我實在是搞不太懂，我這樣用應該沒違反授權原則吧？
可不要讓我被抓去關呢...