大高雄Linux使用者協會

Web CSS Programer 在撰寫 Responsive CSS Style 時，手邊一定會有一堆 Device，來測試當畫面小於 480 px 或大於 768 px 時，呈現的版面是否有亂掉，公司也花費許多成本來測試，現在不需要這樣了，我們可以透過線上 Tool 或者是 Plugin 來測試 Responsive Web Page，首先來介紹 Viewport resizer，此工具用法很簡單，進入官網後，將官網 Javascript 連結加入到我的最愛或 bookmarks，之後打開您的測試網站，再點選該 bookmark，你會發現網站上面多了一條 tool bar，可以自訂或調整 view size，預設也給了平板手機等多種畫面調整，讓您測試 Media Queries 是否有錯誤。

另外一套 Tool 比較強大，那就是 Google Extension: Responsive Inspector (beta) released!，不過就是限制在 Google Chrome 瀏覽器才可以安裝，此擴充工具，還可以直接對應到 CSS Media Queries 位置，以及將自訂大小畫面存成圖檔並且上傳到 Server。底下是介紹影片

最近把一個簡易的 Web 丟到 Google App Engine 測試，但是發現每天都會因為 Frontend Instance Hours 不夠用，而造成網站被關閉 (Quota 爆漿)，上網找一下解決方法，發現了這篇: Frontend Instance Hours 的問題，只要透過底下方式就可以暫時解決這問題，如果是網站流量很大的話，那可能要考慮開啟付費機制。

解決方式

先進入 App engine 後台，點選您的 Application 之後可以看到左邊選單 Application Settings，進入後找到 Max Idle Instances 還有 Min Pending Latency 這兩項設定，我們必須將 Max Idle Instances 設定為1，以及 Min Pending Latency 設定為 15s，但是 Max Idle Instances 預設是不給修改，而是跑 default value “Automatic”，這時候，我們必須把 inbound_services 設定為 warmup 才可以動態調整 Max Idle Instances。

設定 inbound_services

請打開網站根目錄底下的 app.yaml，在上面加入

之後將設定上傳後，回到剛剛 Application Settings 將兩個數值調整為上面描述的設定，這樣就可以不用被 Google 收費了，想省錢的朋友們，可以儘快設定。

Related View

• Google Chrome 支援超過 40,000 Extensions! with Greasemonkey (1)
• Google Chrome 推出 4.0 穩定版 & Mozilla 推出 FireFox 3.6 (0)
• How to install Google Web Toolkit with Eclipse (2)
• [Gmail] 最近發布的功能：進階搜尋，預覽收件夾，郵件內容語言轉換 (0)
• New in Labs:Gmail search autocomplete 快速找尋使用者 email 跟附件檔案 (2)
• [PHP] Zend 使用 Google Calendar API – 瀏覽事件 (3)
• [PHP] Zend 使用 Google Calendar API – 環境建立架設 (3)
• Google App Engine SDK：python 基本教學安裝 (0)
• [Wordpress] post 文章不能使用 javascript 語法 (1)
• [Google]Gmail 支援選擇多重檔案上傳跟進度狀況狀態 multi-select and progress bars (2)

原由

由於 bbs 的盛行，從最早的 0rz.tw 短網址出現，陸陸續續出來很多更好用的網址: tinyurl.com, bit.ly，後來 Google 也推出 goo.gl 服務，讓大家可以使用，提供了 Google URL Shortener API 讓程式開發者可以順利使用此 API，當然在使用 API 之前一定要跟 Google 申請一組 API Key，先到 Google API Console 申請，Shortener API 的規定每天可以存取 1,000,000 次(100萬)，我想這樣也足夠個人或者是公司使用了，除非真的比這個大量，可以跟 Google 再提出額外申請。

系統需求

• CodeIgniter Reactor 版本
• PHP 5.2 版本支援 Curl

下載檔案

我已經將檔案都放在 github 上面，為了保持程式最新版本，請大家到底下連結進行下載

CodeIgniter-Google-URL-Shortener-API

系統文件

安裝

此安裝檔案共有三個:

• application/config/google_url_api.php
• application/controllers/google_url.php
• application/libraries/Google_url_api.php

請將檔案放入到相對應的 application 目錄即可

設定

打開 application/config/google_url_api.php 檔案，將申請好的 API Key 填入即可

第一次執行

請在網址列打入 http://your_host/index.php/google_url/ 即可，如果有任何問題，可以在 Controller 部份將 debug mode 打開

English Version

Requirements

• CodeIgniter Reactor Version
• PHP 5.2 Curl

Download

In order to keep the latest and greatest version of this library online, I’ve now migrated my code to github.

You can download the latest version of the library on the github project page:

CodeIgniter-Google-URL-Shortener-API

Documentation

Installation

The package comes with 3 main files:

• application/config/google_url_api.php
• application/controllers/google_url.php
• application/libraries/Google_url_api.php

Move the files to their corresponding places within your codeigniter application directory

Configure

Open application/config/google_url_api.php file and enter your Google API Key. You can register you api key from Google API Console Register Page

First Run

Visit: http://your_host/google_url/ as you would a normal controller (using your correct URL of course).
If you’re having problems, then enable debugging in your controller code:

Related View

• CodeIgniter 2.0.1 Release 發佈了 (0)
• [新聞] CodeIgniter 發佈 2.0.0 版 Release (2)
• [CodeIgniter] 簡單擷取 html 原始碼(PHP Simple HTML DOM Parser) (0)
• ICOS 2010 Introduction to CodeIgniter PHP MVC Framework (4)
• 2.2.15, PHP -> 5.3.2, and MySQL downgrade to 5.1.9"> 2.2.15, PHP -> 5.3.2, and MySQL downgrade to 5.1.9">[FreeBSD] update apache -> 2.2.15, PHP -> 5.3.2, and MySQL downgrade to 5.1.9 (0)
• [PHP] 好用 Debug PHP 工具 FirePHP for FireFox on CodeIgniter (0)
• [PHP Framework] How to implement Plurk API in CodeIgniter (0)
• [CodeIgniter] 解決 CI 下載函數 force_download 在 IE 底下檔案標題亂碼 (1)
• [新聞] CodeIgniter v1.7.2 Released (4)
• [CodeIgniter] 分享中文官方網站範例程式碼 (0)

看到 Google Chrome Blog 發表的Google Chrome 支援超過 40,000 Extensions!，當 Google Chrome 瀏覽器剛出來的時候，造成 Web Developer 一些震撼，因為 Chrome 強調的是擁有快速的 Javascript 引擎，以及快速的啟動，Fast start-up、Fast loading、Fast search，也因此讓很多設計網站的工程師必須把 Chrome 的支援性考慮進去，但是由於剛推出的瀏覽器，沒有任何外掛功能，我本身用 FireFox 瀏覽器很多年了，FireFox 的附加元件讓許多程式設計師投入開發，也製造出很多方便的附加元件來讓大家使用，例如：FireBug、Gmail Manager、Greasemonkey…，然而 FireFox 最方便的就是 Greasemonkey 此附加元件，使用者可以撰寫簡單 Javascript 語言來跟指定網站進行元件控制，現在 Google 工程師聽到我們的聲音了，Google Chrome 4 加入 Greasemonkey user scripts 功能，大家可以到 userscripts.org 下載超過 40,000 script 安裝到 Chrome 瀏覽器。您可以在 blogger 使用 emoticons，大家可以去參考看看。

由於 Chrome 支援了 Greasemonkey，所以趕快把 FireFox 所安裝的 script，也安裝到 Chrome，可是我發現之前 DarkKiller 大神寫的 Wretch Album Expander 已經不能用了，所以我將它實做到 Chrome，可以從這裡下載安裝：Wretch Album Expander for Google Chrome or FireFox，平時自己偶而會看看無名小站，所以也是方便自己觀看照片，此 script 也可以安裝在 FireFox 喔。這樣大家就不用再看圖片還要一張一張慢慢點，只要負責按換頁就可以了 ^^。

來測試看看，隨便找一本無名相簿：馬甲‧小葵 ，畫面：點我觀看

Related View

• [Wordpress] post 文章不能使用 javascript 語法 (0)
• [FireFox] 安裝 google toolbar 使用 chrome Start page (0)
• [教學]網頁簡體繁體轉換程式(Google AJAX Language API) (0)
• Google Chrome 推出 4.0 穩定版 & Mozilla 推出 FireFox 3.6 (0)
• How to install Google Web Toolkit with Eclipse (2)
• Using firebug for firefox 除錯 javascript (1)
• [Javascript] 在函數裡設定參數預設值 (0)
• [jQuery] ThickBox 3.1 無限期停止支援維護 (0)
• [jQuery] 驗證表單實作筆記 API/1.3/Selectors (0)
• [網站] 好站連結 (三) (0)

Mozilla 在上禮拜 (2010.01.22) 推出了 FireFox 3.6，大家可以下載測試效能如何，也可以 follow 狐耳摩莎的 Plurk 來收到 MozTW 的最新資訊，這篇重點不是在 FireFox，而是 Google 正式推出 Windows 版本 new Chrome 4.0 stable release，4.0 版本已經可以正式使用 Google Extensions，之前在3.0版本，只能安裝 Chrome Beta 版本才可以使用 extension，現在只要將 Windows Google Chrome 升級成 Stable 版本，就可以全面使用 Extensions，可以使用手動升級，或者是在下禮拜就會自動 update 到最新版本。

最後可以參考 ericsk 大大所寫的從開發者角度看 Chrome 4 的推出

Reference:
Extensibility + new HTML and JavaScript APIs for Google Chrome
More Resources for Developers

Related View

• Google Chrome 支援超過 40,000 Extensions! with Greasemonkey (1)
• How to install Google Web Toolkit with Eclipse (2)
• [Gmail] 最近發布的功能：進階搜尋，預覽收件夾，郵件內容語言轉換 (0)
• New in Labs:Gmail search autocomplete 快速找尋使用者 email 跟附件檔案 (2)
• [PHP] Zend 使用 Google Calendar API – 瀏覽事件 (3)
• [PHP] Zend 使用 Google Calendar API – 環境建立架設 (3)
• Google App Engine SDK：python 基本教學安裝 (0)
• [Wordpress] post 文章不能使用 javascript 語法 (0)
• [Google]Gmail 支援選擇多重檔案上傳跟進度狀況狀態 multi-select and progress bars (2)
• [google] Gmail Multiple Inboxes 支援多重資料夾 (0)

Google Web Toolkit (簡稱：GWT)是先以 Java 語言編寫 AJAX 應用程式網頁，然後在編譯成最佳化 Javascript，不但幫助了剛入門 Javascrit，然後又需要撰寫 AJAX 應用程式的工程師很大的幫助，不僅如此，Google App Engine 也提供了 Java 跟 Python 環境，整合了 GWT，讓您可以上傳到 GAE 的空間進行測試，GWT 目的是產生具有高效能性的 Web 應用程式，您不需要是 Javascript 專家也可以做到，GWT 用在 Google 相當多的服務，例如 Google Wave, 新版的 Google AdWords 可以參考這裡更多實際範例。它是開放姓原始碼(open source)，完全免費，您也可以參與 GWT 的開發。

Google Plugin for Eclipse 支援 Google Web Toolkit 跟 Google App Engine 開發，我們可以直接安裝此 Plugin 就可以開始上手 GWT，當製作完成之後，就可以上傳到 GAE，直接打開提供的網址就可以看到成果了。

首先安裝 Google Plugin for Eclipse，先去下載 Eclipse 3.5 (Galileo) 最新版，打開 Eclipse

1. 選擇 Help -> Install New Software

2. 在 Work With: 填入 http://dl.google.com/eclipse/plugin/3.5

3. 將 Plugin 跟 SDKS 全部選取，接下來按下一步就可以完成

Related View

• Google Chrome 支援超過 40,000 Extensions! with Greasemonkey (1)
• Google Chrome 推出 4.0 穩定版 & Mozilla 推出 FireFox 3.6 (0)
• [Gmail] 最近發布的功能：進階搜尋，預覽收件夾，郵件內容語言轉換 (0)
• New in Labs:Gmail search autocomplete 快速找尋使用者 email 跟附件檔案 (2)
• [PHP] Zend 使用 Google Calendar API – 瀏覽事件 (3)
• [PHP] Zend 使用 Google Calendar API – 環境建立架設 (3)
• Google App Engine SDK：python 基本教學安裝 (0)
• [Wordpress] post 文章不能使用 javascript 語法 (0)
• [Google]Gmail 支援選擇多重檔案上傳跟進度狀況狀態 multi-select and progress bars (2)
• [google] Gmail Multiple Inboxes 支援多重資料夾 (0)

最近在 Gmail Lab 看到發布了許多新功能，都蠻好用的，加速搜尋郵件內容，收件者，寄件者，郵件內容語言轉換，匯入其他郵件的通訊名單…等，進階搜尋是這之前就開發好得功能，可以在 search operators 這篇裡面找到相關的用法，簡單來說底下有個例子：

• “to:me is:starred” 搜尋寄信給您所標記的郵件
• “is:chat from:heather” 搜尋與heather使用者對話的內容
• “is:starred -in:inbox” 搜尋所有信件夾內未標記郵件
• “from:elliot filename:pdf” 搜尋 elliot 寄來信件附件檔帶有 pdf 檔案

上面例子看了很複雜吧，因為你還要記的很多相關的語法，才可以正確搜尋到，所以 google 很貼心的設計了 Search Autocomplete，之前我有寫一篇：New in Labs:Gmail search autocomplete 快速找尋使用者 email 跟附件檔案，造福了使用 Gmail 的大眾。

預覽收件夾這功能可以參考：New in Labs: Inbox preview，這功能用在當開啟 gmail 網頁時，會有 loading 的畫面，那針對速度慢得使用者，可以預先看到新的郵件標題，而不需要整個載入之後才看的到，目前還沒有遇到這種狀況，不過大家可以試試看。

郵件內容語言轉換(New in Labs: Automatic message translation)，這功能相當不錯，可以利用 google translate tool 進行轉換您所想要的語言，如下圖：

蠻多好玩的功能，都可以去 Gmail Lab 去開起來喔，大家試試看吧

Related View

• New in Labs:Gmail search autocomplete 快速找尋使用者 email 跟附件檔案 (2)
• [Google]Gmail 支援選擇多重檔案上傳跟進度狀況狀態 multi-select and progress bars (2)
• [google] Gmail Multiple Inboxes 支援多重資料夾 (0)
• [Google]Offline Gmail 新功能 (0)
• [PHP] Zend 使用 Google Calendar API - 瀏覽事件 (3)
• [PHP] Zend 使用 Google Calendar API - 環境建立架設 (2)
• Gmail Lab：新功能 取消寄信 Undo Send mail (0)
• Gmail Lab:快速瀏覽 YouTube videos, Picasa and Flickr links in Gmail (0)
• Google App Engine SDK：python 基本教學安裝 (0)
• [Wordpress] post 文章不能使用 javascript 語法 (0)

Gmail 又推出一個 Lab 功能了，這個功能我想是大家所期待許久的，可以直接對於搜尋使用者跟附件有相當大的幫助，可以針對附件，郵件裡面的 vedio，圖片副檔名 .jpg、.png、.doc 下去做搜尋的動作，很方便的，也可以針對郵件的 email 或者是姓名搜尋，提供了 autocomplete 的作用，您只需要打入兩個關鍵字，就會出現相關的使用者姓名或者是 email 喔，方便的，可以參考：New in Labs: Gmail search made easier (and lazier)。

使用方法只要去 Settings -> Labs 把功能打開即可


在 search 欄位輸入 at 兩個字，就會出現搜尋附件檔案的動作：

也可以輸入中文姓名，就會幫忙找到相關的部份了：

Related View

• [Google]Gmail 支援選擇多重檔案上傳跟進度狀況狀態 multi-select and progress bars (2)
• [google] Gmail Multiple Inboxes 支援多重資料夾 (0)
• [Google]Offline Gmail 新功能 (0)
• [PHP] Zend 使用 Google Calendar API - 瀏覽事件 (3)
• [PHP] Zend 使用 Google Calendar API - 環境建立架設 (2)
• Gmail Lab：新功能 取消寄信 Undo Send mail (0)
• Gmail Lab:快速瀏覽 YouTube videos, Picasa and Flickr links in Gmail (0)
• Google App Engine SDK：python 基本教學安裝 (0)
• [Wordpress] post 文章不能使用 javascript 語法 (0)
• [FireFox] 安裝 google toolbar 使用 chrome Start page (0)