git-backup: 備份你的Git工作狀態

為了個人需求而產生的這一小段ShellScript，針對開發到一半的git working directory，這些修改過或準備要新增的檔案還沒到可以commit的程度，而git-backup就用來備份這些檔案。

需求功能

  • 備份所有modified與untracked的檔案，但不包含被git repo忽略的檔案(ex: .gitignore設定要忽略的檔案)
  • 備份時會保留原始資料夾結構
  • 目標路徑資料夾不存在時會被自動生成
  • 執行時會列出備份明細

Source Code

IE6-8網頁開發測試工具

1. DebugBar

2. Companion.js

使用時需要安裝Microsoft Script Debugger Engine，避免JS錯誤時沒有除夠除錯資訊(如下圖)

2024-07-28T215354

其他已包含MS Script Debugger Engine的工具：

  • MS Office (Setup Group: Office Tools/HTML Source Editing/Web Scripting)
  • MS Visual Studio
  • Platform SDK
  • Remote Components Setup

注意事項：

  • IE進階選項中開啟指令碼除錯勿關閉
  • 啟用相關附加元件
  • Companion.js選單中的About可以驗證是否正常運作，看到綠色指示燈代表運作正常。

2024-07-28T215415
2024-07-28T215420

3. IE Developer Toolbar

利用FStream在Mac上收聽台灣網路廣播懶人包

取得FStream

至FStream網站下載

下載plist檔案直接匯入FStream

點此下載

2016.12.17更新：修改檔案下載位址

頻道列表

只選擇想要的頻道手動加入FStream

2014.10更新：Hichannel提供的網路廣播位置已經失效

頻道 位址
C9 Radio http://streaming.c9radio.eu/listen.m3u
ASIAFM衛星音樂台 mms://bcr.media.hinet.net/RA000004
Apple line 蘋果線上 mms://bcr.media.hinet.net/RA000001
BestRadio 台中好事903 mms://bcr.media.hinet.net/RA000010
BestRadio 台北好事989 mms://bcr.media.hinet.net/RA000013
BestRadio 花蓮好事935 mms://bcr.media.hinet.net/RA000011
BestRadio 高雄港都983 mms://bcr.media.hinet.net/RA000012
Flyradio飛揚調頻895 mms://bcr.media.hinet.net/RA000019
KISS RADIO 南投廣播 mms://bcr.media.hinet.net/RA000043
KISS RADIO 台南知音廣播 mms://bcr.media.hinet.net/RA000044
KISS RADIO 大苗栗廣播 mms://bcr.media.hinet.net/RA000041
KISS RADIO大眾廣播電台 mms://bcr.media.hinet.net/RA000040
KISSRadio 網路音樂台 mms://bcr.media.hinet.net/RA000042
POP Radio mms://bcr.media.hinet.net/RA000080
中廣古典網 mms://bcr.media.hinet.net/RA000005
中廣流行網 mms://bcr.media.hinet.net/RA000009
中廣音樂網i radio mms://bcr.media.hinet.net/RA000007
佳音CCM mms://bcr.media.hinet.net/RA000031
全國廣播音樂網 mms://bcr.media.hinet.net/RA000047
台北之音HitFM聯播網 台中 mms://bcr.media.hinet.net/RA000035
台北之音HitFM聯播網 台北 mms://bcr.media.hinet.net/RA000036
台北之音HitFM聯播網 高雄 mms://bcr.media.hinet.net/RA000034
台北之音經典音樂台 mms://bcr.media.hinet.net/RA000061
台北愛樂 mms://bcr.media.hinet.net/RA000018
台灣之音-音樂 mms://bcr.media.hinet.net/RA000061
太陽電台 mms://bcr.media.hinet.net/RA000064
奇美古典音樂網 mms://bcr.media.hinet.net/RA000014
寶島新聲廣播電台 mms://bcr.media.hinet.net/RA000066
ASIA FM92.3亞太電台 mms://bcr.media.hinet.net/RA000002
ASIA FM92.7亞州電台 mms://bcr.media.hinet.net/RA000003
GOLD FM-台中城市廣播 mms://bcr.media.hinet.net/RA000028
GOLD FM-台北健康電台 mms://bcr.media.hinet.net/RA000027
IC之音 mms://bcr.media.hinet.net/RA000037
佳音廣播電台 mms://bcr.media.hinet.net/RA000029
佳音電台2台 mms://bcr.media.hinet.net/RA000030
全國廣播 mms://bcr.media.hinet.net/RA000068
台中廣播 mms://bcr.media.hinet.net/RA000046
台北廣播電台- 都會資訊頻道 mms://bcr.media.hinet.net/RA000070
台北廣播電台喔海洋頻道 mms://bcr.media.hinet.net/RA000069
大千電台 mms://bcr.media.hinet.net/RA000067
大愛網路電台 mms://bcr.media.hinet.net/RA000017
宜蘭中山電台 mms://bcr.media.hinet.net/RA000065
環宇廣播 mms://bcr.media.hinet.net/RA000020
真心之音廣播電台 mms://bcr.media.hinet.net/RA000033
青春線上 mms://bcr.media.hinet.net/RA000079
警廣—長青網 mms://bcr.media.hinet.net/RA000051
飛碟電台 mms://bcr.media.hinet.net/RA000072
NEWS98新聞網 mms://bcr.media.hinet.net/RA000073
中廣新聞網 mms://bcr.media.hinet.net/RA000008
台灣之音-華語 mms://bcr.media.hinet.net/RA000063
復興廣播電台 短波網 mms://bcr.media.hinet.net/RA000026
復興廣播電台 第一網 mms://bcr.media.hinet.net/RA000024
復興廣播電台 第二網 mms://bcr.media.hinet.net/RA000025
正聲台北調幅台 mms://bcr.media.hinet.net/RA000015
正聲台北調頻台 mms://bcr.media.hinet.net/RA000016
漢聲光華網-中波 mms://bcr.media.hinet.net/RA000075
漢聲光華網-短波 mms://bcr.media.hinet.net/RA000077
漢聲廣播電台 mms://bcr.media.hinet.net/RA000074
漢聲廣播電台全國調頻網 mms://bcr.media.hinet.net/RA000076
綠色和平台灣文化廣播電台 mms://bcr.media.hinet.net/RA000032
ICRT mms://bcr.media.hinet.net/RA000038
台灣之音-FM mms://bcr.media.hinet.net/RA000060
台灣之音-亞洲 mms://bcr.media.hinet.net/RA000059
台灣之音-歐美及方言 mms://bcr.media.hinet.net/RA000062
中廣客家頻道 mms://bcr.media.hinet.net/RA000006
大漢之音 mms://bcr.media.hinet.net/RA000021
寶島客家 mms://bcr.media.hinet.net/RA000023
新客家廣播電台 mms://bcr.media.hinet.net/RA000048
高屏溪客家電台 mms://bcr.media.hinet.net/RA000045

3 ways to preload CSS background image

Solution1: CSS Sprite

PROS：

  • Supports each browser with each version
  • Reduces http requests

CONS:

  • Should be able to use SASS + Compass to generate CSS sprite or it will be difficult to maintain your sprites.

Solution2: JsPreload

PROS:

  • Supports each browser with each version

CONS:

  • Based on Javascript
  • Have to make sure there’s no redundant background image in target folder to avoid useless requests

Solution3: convert to DataURI

PROS:

  • CSS styles and images are merged in to one file. Don’t need to upload images when deploying/
  • Reduces http request.

CONS:

  • Do not support IE6-7(need MHTML as workaround). IE8 has 32K limitation for one image file.
  • May increase image size.
  • Should be able to use SASS + Compass to convert image to DataURI

Reference:

An scss mixin that convert background images from original URL path to DataURI

Introduction

This mixin will only replace value of property background-image fro original URL path to DataURI.

  • Based on compass/css3/images

  • Support 1-10 background image(s) as arguments of background-image in compass.

    datauri-bg($image-1, [$image-2],…, [$image-10]);

  • Use class lt-ie9 in <html> tag as html5-boilerplate to determine if current browser is IE6-8 or not.

  • Image created by linear-gradient will be skipped.

Example

1
2
3
4
5
6
@import "datauri-bg";

div {
  @include datauri-bg("sample.png"); // single background
  @include datauri-bg("sample1.png", "sample2.png", "sample3.png"); // multiple backgrounds
}

Read More

How to create patch between two tags by git

C reate patch between tag1 and tag2

1
git diff --binary tag1 tag2 -- > /the/path/of/patch/release.patch

Apply git patch

1. List file list of this patch to preview files to update

1
git apply --stat /the/path/of/patch/release.patch

2. Do patch!

1
git apply /the/path/of/patch/release.patch

Add --whitespace=nowarn option to ignore whitespace warning

How to run PHP coding standards fixer in Sublime Text 2

Step1: install package phpcs by package control

Step2: Configure phpcs.

Open setting file by Preference > Package Settings > PHP Code Sniffer > Settings - User.
Paste codes as below then replace value of phpcs_php_prefix_path and php_cs_fixer_executable_path according to your environment.

1
2
3
4
5
6
7
8
9
10
{
    "phpcs_php_prefix_path": "c:/php/php.exe",
    "phpcs_commands_to_php_prefix": ["Fixer"],
    "php_cs_fixer_on_save": true,
    "php_cs_fixer_show_quick_panel": true,
    "php_cs_fixer_executable_path": "c:/php/php-cs-fixer.phar",
    "php_cs_fixer_additional_args": {
        "--level": "all"
    }
}

###Step3: Restart sublime text and open a php file
PHP Coding Standards will run on file save.

免接USB，直接透過wi-fi在PC上對Android上的Chrome做遠端偵錯(root only)

Android端:

  1. 請先確認裝置已經root
  2. 確認系統設定 > 開發人員選項 > USB偵錯 已經開啟
  3. 安裝adb over wifi widget
  4. 在桌面上新增adb over wifi widget
  5. 啟動adb over wifi，widget上會顯示ip與port(ex: 192.168.1.1:8000)
  6. 開啟Chrome並連接到目標網址
  7. 確認設定中的啟用USB網頁偵錯功能有開啟

PC端(Mac OS為例)：

  1. 下載Android Developer Tools Bundle，並解壓縮
  2. 開啟Terminal
  3. 進入剛剛解開的ADT Bundle目錄
  4. 進入sdk/platform-tools
  5. 連線到Android端(參考adb over wifi顯示的位址) 
    1
    ./adb connect 192.168.1.1:8000
  6. 將chrome devtools連接到PC上的9222 port 
    1
    ./adb forward tcp:9222 localabstract:chrome_devtools_remote
  7. 開啟Chrome並連到網址 http://localhost:9222 即可看到debug畫面了!