技術文章 - essoduke's blog

Archive for 技術文章

我的常用 js 函式庫

Posted by essoduke - 2010 年 02 月 26 日 12:11:16 - 44 User Views

※ 2010-03-02 補充：

Object prototype 改寫會導致 jQuery 出現異常，所以必須將 Object.prototype.isArray 註解或刪掉。
請參考：Prototyping Object in Javascript breaks jQuery? – StackOverflow

整理了一支我常用於網站開發的 js 函式庫，也包含了對字串、日期、陣列物件的 Prototype 增強函數，採 MIT 授權釋出，歡迎任意使用。

源碼：lib.common.js（16 KB）
壓縮：lib.common-min.js（9 KB）

Prototype: String

var url = 'http://essoduke.org/?s=測試';
var x = 'Test 測試';
var y = '<strong>HTML</strong>';
var z = '&;lt;strong&;gt;HTML</strong>';
/* trim: 移除字串前後空白 */
x.trim(); // result: Test
/* bytes: 取得字串 bytes 長度 */
x.bytes(); // result: 9
/* empty: 是否為空 */
x.empty(); // result: false
/* left: 取字串左側 n 個字元 */
x.left(4); // result: Test
/* right: 取字串右側 n 個字元 */
x.right(4); //result: t 測試
/* HTMLEncode: 編碼 HTML 標籤 */
y.HTMLEncode(); // result: &lt;strong&gt;HTML&lt;/strong&gt;
/* HTMLDecode: 還原被編碼的 HTML 字串 */
z.HTMLDecode(); // result: <strong>HTML</strong>
/* URLEncode: 進行 URL 編碼 */
url.URLEncode(); // result: http%3A%2F%2Fessoduke.org%2F%3Fs%3D%E6%B8%AC%E8%A9%A6

Prototype: Array

var arr = [1, 2, 2, 3, 4, 4, 5];
/* unique: 刪除重複的元素 */
arr.unique(); // result: 1, 2, 3, 4, 5
/* remove: 刪除第 n+1 個元素 */
arr.remove(3); // result: 1, 2, 2, 4, 4, 5
/* find: 尋找符合內容元素的鍵值 */
arr.find(2); // result: 1, 2

Prototype: Date

var x = new Date();
/*
* DateDiff: 計算傳入日期的差異
* @param string cDate : 要比較的日期
* @param string mode: 計算類型 y=年, m=月, w=周, d=日
*/
x.DateDiff('2010-01-01', 'd'); // result 56
/* DateAdd: 加上或減去指定的日期時間間隔
* @param string interval : 時間間隔單位 y, m, d, w, h, n, s, l
* @param integer numer: 時間間隔單位次數，可為正數或負數
* @param string pattern: 回傳的時間格式（非必要，預設 'yyyy-MM-dd hh:mm:ss'）
*/
x.DateAdd('d', 100); // result '2010-06-06 11:21:47'
/*
* format: 格式化日期
* @param string interval : 引數可參考 http://php.net/manual/en/function.date.php
*/
x.format('Y m j'); // result '2010-02-26'

Prototype: Object

/* isArray : 判斷是否為陣列 */
var x = [1, 2, 3];
x.isArray() // result 'true'
var x = 'Test';
x.isArray() // result 'false'

Functions

var web = new COMMON();
/* regexp: 驗證常用欄位 account, password, email, url, ip, date, time, number, twid 台灣身份證 */
web.regexp('i.am@god.com', 'email'); // 驗證電子郵件
web.regexp('http://test.com', 'url'); // 驗證網址
web.regexp('10.10.10.10', 'ip'); // 驗證 IP
/* timestamp2time: 將 timestamp 轉為時間日期格式 */
web.timestamp2time(1267155821); // result 'Fri Feb 26 2010 11:46:30 GMT+0800 (Taipei Standard Time)'
/* timestamp: 取得 timestamp */
web.timestamp();
/* leftPad: 字串左邊補零 */
web.leftPad('100', 6); // result '000100'
/* ie: 檢查是否為 IE */
web.ie();
/*
* benchmark: 效能測試
*/
web.benchmark.start(); // 開始計算
[.....]
web.benchmark.stop(); // 結束計算並返回執行秒數
/*
* cookie: cookie 操作
*/
web.cookie.get('index'); // 取得 cookie[index] 內容
web.cookie.set('index', '100'); //設置 cookie[index] 為 100
web.cookie.remove('index'); // 移除 cookie[index]
/*
* debug: inline 方式顯示傳入變數內容或列舉子物件
* ※此方法需使用 <a href="http://jquery.com/">jQuery Library</a>，建議 1.3.2 以上版本
*/
var x = 'String';
web.debug(jQuery); // 列舉 jQuery 所有內容
web.debug(x); //顯示 x 變數內容

二月 26, 2010 | 技術文章, 資訊科技, 軟體分享 | 0 個回覆

解決 TeamSpeak 3 中文化後字體過小的問題

Posted by essoduke - 2010 年 01 月 14 日 21:14:49 - 292 User Views

如果在安裝 TeamSpeak 客戶端中文化後發生字體變成「標楷體」以及過小的問題，可以下載這個檔案解決：

default.qss（1KB 右鍵另存）

或是將下列文字加入「X:\Teamspeak Client\style\default.qss」，若熟悉 CSS 語法也可以自行更改。

QAbstractScrollArea, QCheckBox, QComboBox, QDockWidget, QFrame,
QGroupBox, QHeaderView, QLineEdit, QListView, QMainWindow, QMenu,
QMenuBar, QProgressBar, QPushButton, QRadioButton, QScrollBar,
QSizeGrip, QSlider, QSpinBox, QSplitter, QStatusBar, QTabWidget,
QTabBar, QTableView, QToolBar, QToolBox, QToolButton, QToolTip, QTreeView {
font:normal 12px PMingLiu;
}

說明：這個檔案為預設佈景主題的樣式檔，改寫各個元素所使用的字型及大小為 12px 新細明體。

另外補上目前最完整的正體中文化（戰地秘境版已停止更新）：
下載：Teamspeak 3 Client 正體中文語系（ZIP 98KB 右鍵另存）

一月 14, 2010 | 技術文章, 資訊科技, 軟體分享 | 0 個回覆

Tesseract Win32 VC++ Rebuild Tutorial

Posted by essoduke - 2009 年 12 月 12 日 00:00:18 - 142 User Views

Tesseract OCR 原本是 HP 實驗室所發展的 OCR 引擎，2006 年釋出為開放原始碼專案，目前由 Google 維護發展。

這兩天因為有某專案需要使用文字辨識功能，原本打算使用 PHP 進行，不過效率不彰，所以投奔到 Tesseract 的懷抱，但是原始檔案中缺少 libtiff 的支援，這時候就需要自己動手編譯了。

所需軟體

步驟

下載 Tiff for Windows Complete package, except sources 並安裝。

開啟 tesseract.sln 專案

點選「工具 » 選項 » 專案和方案 » VC++ 目錄」右側的顯示目錄分別新增 Include 及程式庫檔並個別指向 Tiff for Windows 的 Include 及 Lib 資料夾。

在左側「方案總管」中，針對每個專案點選右鍵選擇「屬性 » 組態屬性 » C/C++ » 前置處理器」，右側的「前置處理器定義」加上 HAVE_LIBTIFF。

接著在「屬性 » 組態屬性 » 連接器 » 輸入」，右側的「其他相依性」加上 libtiff.lib。

設置完成後即可進行建置編譯。

這裡也有我編譯好的版本下載：Tesseract 2.04 Win32 Rebuild（2.40 MB）
SHA256: 02ade58c75542b5a69b13c9932ae8d921656bfb86fd839ec806a2022d48c24e0
內含：bbTesseract 可編輯學習檔、tessdata English、tessconfig

問題

Q: 執行 tesseract.exe 會提示「找不到 jpeg62.dll」
A: 將 C:\Program Files\GNUWin32\bin\jpeg62.dll 複製到 tesseract 目錄

Q: 執行 tesseract.exe 會提示「找不到 zlib1.dll」
A: 將 C:\Program Files\GNUWin32\bin\zlib1.dll 複製到 tesseract 目錄

tinyMap – 自訂個人 Google Map 的 jQuery 擴充套件

Posted by essoduke - 2009 年 10 月 29 日 20:53:04 - 436 User Views

這個擴充套件可以輕鬆建立自訂的 Google Map，舉凡尺寸、地圖類型和縮放控制、縮放等級，更能加入設定好的標記地點並填上說明。

下載位址

Origin: jquery.tinymap-1.0.js (4.10 KB)
Packed: jquery.tinymap-1.0.min.js (2.76 KB)

安裝

<script type="text/javascript" src="http://maps.google.com/maps?file=api&v=2&sensor=false&key=<em>YOUR_API_KEY"></script>
<script type="text/javascript" src="jquery.tinymap-1.0.js"></script>

參數說明

width: 地圖寬度 (Number) /* 預設：640px */
height: 地圖高度 (Number) /* 預設：480px */
latlng: 地圖置中的座標或地址，若為座標請使用 [x, y]，地址則直接輸入。
control: 顯示地圖類型選單 (Boolean) /* 預設：true */
zoom: 顯示地圖縮放選單 (Boolean) /* 預設：true */
zoomLevel: 預設地圖縮放等級 (Number) /* 預設：13 */
mapType: 預設地圖類型 (String) /* 選項：default, hybrid（混合）, satellite（衛星）預設：default */
marker: 標記群組 (JSON)：
[{addr:'標記地址或座標', text:'標記說明', icon:[圖示寬度, 圖示高度, 圖示位址]}]

範例：顯示高雄市政府地圖

$(function(){
var set1 = {
width: 639,
height: 359,
latlng: '高雄市苓雅區四維三路2號',
zoomLevel: 1˙
};
$('#map1').tinymap( set1 );
});

範例：以衛星地圖及自訂圖示標示多個地點

$(function(){
var set1 = {
width: 639,
height: 359,
latlng: [22.638610116646756, 120.30184864997864],
mapType: 'satellite',
zoomLevel: 12,
marker: [
{addr:'高雄市鼓山區萬壽路350號', text:'<strong>壽山動物園</strong><br />高雄市鼓山區萬壽路 350 號', icon:[24, 24, '2.png']},
{addr:'高雄市左營區翠華路1435號', text:'<strong>蓮池潭</strong><br />高雄市左營區翠華路 1435 號', icon:[24, 24, '3.png']},
{addr:'高雄市苓雅區自強三路5號', text:'<strong>東帝士 85 大樓</strong><br />高雄市苓雅區自強三路 5 號', icon:[24, 24, '4.png']},
{addr:'高雄市左營區高鐵路105號', text:'<strong>台灣高鐵左營站</strong><br />高雄市左營區高鐵路 105 號', icon:[24, 24, '5.png']},
{addr:'高雄市三民區建國二路318號', text:'<strong>台鐵高雄車站</strong><br />高雄市三民區建國二路 318 號<br /><a href="http://service.tra.gov.tw/Kaohsiung/StationTimeTable/index.aspx">台鐵高雄車站</a>', icon:[24, 24, '6.png']}
]
};
$('#map1').tinymap( set1 );
});