Handlebars常見問題

如何用{{if ..}} 去判斷兩運算元相不相等( == )
http://stackoverflow.com/questions/15088215/handlebars-js-if-block-helper

Handlebars.registerHelper('if_eq', function(a, b, opts) {
    if(a == b) // Or === depending on your needs
        return opts.fn(this);
    else
        return opts.inverse(this);
});

{{#if_eq this "some message"}}
    ...
{{else}}
    ...
{{/if_eq}}

編輯器常見問題

在vim中要移動到最靠近的大括號( brace(大括號), brackets, parenthesis )"{"
http://stackoverflow.com/questions/289342/eclipse-jump-to-closing-brace
Don't forget [{ and ]} to find the closest enclosing open or close brace. 
eclipse似乎沒有這個功能 => 用sublime的ctrl+m或ctrl+shift+m取代

vim列模式自動增加數字
安裝vim套件 VisIncr
http://vim.sourceforge.net/scripts/script.php?script_id=670
1. （vim 7.1以後版本可略）安裝 vimball
2. 下載 visincr.vba.gz
3. 安裝：(只安裝到該使用者的~/.vim 資料夾下)
$ vim visincr.vba.gz
:so %
:q
(在github上直接載源碼後解壓縮到家目錄.vim資料夾下應該有一樣效果(未試))
使用：
用ctrl+v進入列模式選取，然後:I （完成）， 用:help visinrc.txt 看教學
或使用純vim的功能替換
http://wjason.iteye.com/blog/341328
1. 写一行:INSERT INTO ME.SCHEDULE(..., DATETIME, ...) VALUES(..., '2009-01-01 01:00:00.0', ...)
2. Y
3. 58p
4. gg ctrl+v G
5. :'<,'>s/2009-01-01 01:\zs\d\d\ze:/\=line(".") - line("'<") + 1
下面是这条命令中每个元素的含义：

'<,'>        我们所选中的区域 (:help '<，:help '> )
s            在选中的区域中进行替换 (:help :s )
\zs          指明匹配由此开始 (:help /\zs )
\d*          查找任意位数的数字 (:help /\d )
\ze          指明匹配到此为止 (:help /\ze )
\=           指明后面是一个表达式 (:help :s\= )
line(".")    当前光标所在行的行号 (:help line() )
line("'<")   我们所选区域中第一行的行号 (:help line() ) 

eclipse中使用
With Ctrl + Shift + L you can open the "key assist", where you can find all the shortcuts.
eclipse 打開上一個關閉的分頁
http://stackoverflow.com/questions/2243561/undo-closed-tab-in-eclipse
Try Alt + ← that will go backward in history - if tab is closed it will reopen it.


看vim移動相關指令
:help motion.txt


使用notepad++內建的NppFTP(可走sftp)遠端編輯
點"外掛模組"->NppFTP-> Show NppFTPWindow
點面板右上角設定圖示->Profile settings-> 新增伺服器，填入帳號、密碼-> 即可點連線圖示

notepad++書籤
http://portable.easylife.tw/205
書籤
用戶可用滑鼠點擊書籤邊行(書籤邊行位於列數邊行右方)或使用鍵盤捷徑Ctrl+F2來標明或移除書籤。使用鍵盤捷徑F2到下一個書籤或Shift+F2到上一個書籤。如欲清除所有書籤，使用選單 尋找->清除所有書籤 。

notepad++列模式自動增加數字(內建就有)
選取列 => 編輯 => 列模式編輯(熱鍵 alt+c) => 輸入要的設定


sublime 自動縮排
http://blog.lackneets.tw/2013/11/Sublime-Reindent.html
Edit > Line > Reindent
sublime設定縮排空白或tab
https://plus.google.com/108388957557258766656/posts/1HdQRLRbUUj
1. Preferences -> Settings - Default  -> ( 設定為兩個空白縮排 )
{
...
  "translate_tabs_to_spaces": true,
  "tab_size": 2,
  "detect_indentation": false, // 加了後，新檔案才不會受複製貼上的程式碼影響縮排
...
}
如果要將檔案裡的所有 tab 字元轉成 space，或是所有 space 轉為 tab 字元，可以點一下右下角的「Tab Size: X」或「Spaces: X」，然後如圖選擇需要的選項動作。( ex. C語言為兩空白縮排，在這邊設成tab縮排 )

sublime列模式自動增加數字
解法：安裝套件Text-Pastry ( 用Package Control 直接搜尋安裝 )
使用方法：
先用列模式選取你要的範圍，ctrl+alt+n後sublime下面會出現界面，輸入2 1 (2空隔1)即可 => 由2開始每次增加1
ps. Package Control 安裝方法
1. 使用ctrl+` 進入sublime的console模式
2. 貼上下列文字 ( sublime text 3適用 )

import urllib.request,os,hashlib; h = '7183a2d3e96f11eeadd761d777e62404' + 'e330c659d4bb41d3bdf022e94cab3cd0'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

調整aptana 的php文件縮排距離
Preferences > Studio > Editors > PHP > Indentation. （設定Use Tabs和Tab size:4）

aptana自訂Snippet(代碼片段) => 如同Eclipse PDT 的PHP templates
Commands -> PHP -> Edit this bundle
aptana自動下載完後會在workspace的Project Explorer開專案 ex. PHP [master]
點選bundle.rb 編輯 ( https://wiki.appcelerator.org/display/tis/Creating+a+new+snippet )

snippet "Echo pre print_r" do |snip|
  snip.trigger = "epc"
  snip.expansion = "echo \"
\";\necho print_r(${1:method_name});\necho \"
\";"
end

snippet "echo one line" do |s|
  s.trigger = "epl"
  s.expansion = "echo \"
${1:method_name}:\".${2:method_name};"
end

缺點：在html裡面也能使用...

aptana 的jquery自動完成
https://wiki.appcelerator.org/display/tis/JavaScript+Library+Support

1. Commands > Install Bundle > jQuery
2. Right click on a project, select Properties > Project Build Path and select the checkbox for jQuery 1.6.2.

因為github上jquery自動完成只支援到jquery1.6.2 ( https://github.com/aptana/javascript-jquery.ruble )

改用eclipse(PDT 3.8) 的jquery自動完成
https://code.google.com/a/eclipselabs.org/p/jsdt-jquery/wiki/Installation
1. 安裝jsdt-jquery  - Use the following update site URL http://svn.codespot.com/a/eclipselabs.org/jsdt-jquery/updatesite
2. 在你的PHP Explore的Project上點右鍵-> Configure -> Add jQuery
3. Add a JavaScript Library Project → Properties → JavaScript → Include Path → Libraries → Add JavaScript Library...( 我選1.9才有$.on()的提示。選1.10似乎會吃到1.1，提示的不完整 )

Eclipse Standard 4.3.2（灌PDT）使用jquery自動完成
https://code.google.com/a/eclipselabs.org/p/jsdt-jquery/wiki/Installation
直接用網址 http://svn.codespot.com/a/eclipselabs.org/jsdt-jquery/updatesite 當update site更新會遇到錯誤
解法：
必須先安裝"JavaScript Development Tools"
Comment by edward.m...@gmail.com, Feb 23, 2014
1. Complete the following steps in Eclipse to get plugins for JavaScript? files:

-.Go to "Help" -> "Install New Software" -.Select the repository for your version of Eclipse. Kepler - http://download.eclipse.org/releases/kepler -.Go to "Programming Languages" -> Check the box next to "JavaScript Development Tools" -.Click "Next" -> "Next" -> Accept the Terms of the License Agreement -> "Finish" -.Wait for the software to install, then restart Eclipse -.Once Eclipse has restarted, open "Window" -> "Preferences" -> "General" -> "Editors" -> "File Associations" -> Add ".js" to the "File types:" list, if it is not already there -.In the same "File Associations" dialog, click "Add" in the "Associated editors:" section -.Select "Internal editors" -.Select "JavaScript Viewer". Click "OK" -> "OK"

2. folow steps in this page.

Now my eclipse with JSDT works perfectly. Thanks
翻譯：
1. 先用update site: http://download.eclipse.org/releases/kepler 安裝"JavaScript Development Tools"
2. 然後在"Window" -> "Preferences" -> "General" -> "Editors" -> "File Associations" 要把.js加到"File types"裡面（這步我沒做，因為打開已經設好了）
3. 在.js下方的"Associated editors:"對話框裡面新增"Internal editors"的"JavaScript Viewer" (估計是安裝 "JavaScript Development Tools" 後才有的 )
(以下照原文步驟做)
4. Use the following update site URL http://svn.codespot.com/a/eclipselabs.org/jsdt-jquery/updatesite
5. Convert you project to a JavaScript project if it is not already one Project → Configure → Convert to JavaScript Project..
6. Add a JavaScript Library Project → Properties → JavaScript → Include Path → Libraries → Add JavaScript Library... (中間jquery勾選 No conflict後，$()好像就不會運作，只有jQuery()才會運作)
7. 完成，在js, html, php檔都能正常提示（比PDT3.8安裝的強大）


ubuntu執行eclipse 4.3.2(kepler) 出現錯誤
jvm terminated exit code 13 usr bin java ...
解法：
$ uname -a #查linux版號是64位元
上網下載64-bit的eclipse

備份eclipse 3.8 PDT 的設定到 eclipse kepler 4.3.2 ( +PDT )
http://stackoverflow.com/questions/481073/eclipse-keybindings-settings => 熱鍵和各檔案的關聯(ex. ctp用php view開)都會備份到
export all your Eclipse prefs to a file.
File->Export->General->Preferences
Import has an option to import only key settings from this file.
File->Import->General->Preferences
直接在Window->Preferences->General->Keys裡面Export出來的CSV找不到地方可以Import

sublime 英文小寫轉大寫
http://sublime-text-unofficial-documentation.readthedocs.org/en/latest/reference/keyboard_shortcuts_win.html
1. 選取你要的文字範圍
2.
Ctrl + KU => 轉大寫
Ctrl + KL =>轉小寫

sublime安裝gosublime後出現錯誤
MarGo: Missing required environment variables: GOPATH
https://github.com/DisposaBoy/GoSublime/issues/310
解法：
Preferences -> Package Settings -> GoSublimge -> Settings – User add {"env": {"GOPATH": "$HOME/go"}}
重開sublime就不會出現錯誤提示了


eclipse mars(4.5.0) 安裝 SVN team 套件
Help -> Eclipse Marketplace -> 搜尋svn -> 直接安裝
注意：
如果svn server版本是1.8，而eclipse安裝1.7的svn套件，拉下來後無法在命令行查log(svn log)
需在 Help-> Installation Details 裡面移除重裝svn 套件

css常見問題

line-height: 1的意思
http://stackoverflow.com/questions/1000398/what-is-line-height1
number:
Sets a number that will be multiplied with the current font-size to set the distance between the lines
FFN-Rei: 因為上一層有 line-height: 16px;
FFN-Rei: 繼承下來 1 = 16px
老天尊: 1是inherit?
FFN-Rei: 是 1em
FFN-Rei: 如果你寫1.5em 就會是 16px * 1.5 = 24px


IE7- div有position: absolute;且裡面元素有float: left(right); ，該div寬度會為100%
http://stackoverflow.com/questions/2799334/ie-div-with-absolute-positioning-width-goes-to-100-of-screen-when-it-has-a-floa
解法：對IE7設固定寬度。
You absolutely have to set the width of an absolutely positioned element if it contains an element floated right to get it to behave properly.

查IE屬性支援程度
http://msdn.microsoft.com/en-us/library/cc351024%28VS.85%29.aspx#positioning

content和:after(:before)屬性 =>IE7 不支援
http://www.w3school.com.cn/css/pr_gen_content.asp
http://www.w3school.com.cn/cssref/selector_after.asp
.clearfix:after { content:'';clear:both;display:block; }
請改使用
.clear { clear: both; }
<div class="clear" ></div>
，而非在外框div下clearfix屬性

display屬性=> IE7不支援table-cell方法
IE6 IE7 只有預設是 display : inline 的元素才可以設定為 display : inline-block 。 => div不行
http://www.w3school.com.cn/css/pr_class_display.asp
所以，上下置中請用position+margin做

:last-of-type =>IE9+
http://www.w3school.com.cn/cssref/selector_last-of-type.asp

IE9圓角+漸層bug (ex. http://jsfiddle.net/jancbeck/CJPPW/31/ )
http://stackoverflow.com/questions/4692686/ie9-border-radius-and-background-gradient-bleeding
解法：

HTML:

<div class="mask roundedCorners">
    <div class="roundedCorners gradient">
        Content
    </div>
</div>

CSS:

.mask
{
    overflow: hidden;
}

.roundedCorners
{
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.gradient
{
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0065a4', endColorstr='#a0cf67',GradientType=0 ); /* IE6-9 */
}

在IE(7.8.9)中 top不吃%數=> 因為被display: table-cell影響到了
老天尊: 你上次說ie的table裡面不吃postion:absolute 是嗎?
Rei: 會吃 但是位置對不準

老天尊: ie7 img後面接div，中間會空白一點點... 看起來像img造成的高度
老天尊: 怎麼消除他
Rei: display: block
老天尊: 無效 = =
Rei: 在img 上面加
老天尊: 是的
Rei: 把中間的空白都拿掉
Rei: tag之間不要換行


IE9(未升10)對加载CSS数量及大小有限制
http://hi.baidu.com/teachmyself/item/832bddf597d032da521c2615
( 上限是32個 )
http://dancewithnet.com/2008/04/22/a-solution-of-limit-of-style-tags-in-ie/ (使用js去解)
雖然js解看起來可以，但實務上是不行的。當頁面一複雜的時候，仍會產生跑版問題。
解法二：整合各模板裡面的css。因為各模板獨立性高，整合後其他地方亦可能出現問題。而且此方法治標不治本，後面的人再創一個css 最後那個又沒效了。

結論：無解

表格格行換色
Alternate table row color using CSS?
http://stackoverflow.com/questions/3084261/alternate-table-row-color-using-css
CSS:
tr:nth-child(even) {
    background-color: #000000;
}
Note: No support in IE, even IE 8. =>使用jquery做

將float:left的 div置中(因為要自動設定div的寬度至最小寬度)
http://stackoverflow.com/questions/5523632/aligning-a-floatleft-div-to-center
使用 display:inline-block; 而不是float
(外層容器要設 text-align: center; )

調整FB Like box的寬度
http://fundesigner.net/fb-fluid-likebox/

.fb-comments, .fb-comments iframe[style] {width: 100% !important;}
.fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget span iframe[style] {
    width: 100% !important;
}

移除IE 11 input自帶的"X"按鈕
http://stackoverflow.com/questions/14007655/remove-ie10s-clear-field-x-button-on-certain-inputs
那是個偽元素，在firefug中是觀察不到的
.someinput::-ms-clear {
    display: none;
}

cygwin使用心得

http://www.cygwin.com/
1. 下載安裝檔setup-x86_64.exe ( 我電腦是64bit )
2. 執行 Install from internet (要重裝package也是選這個)
路徑：C:\cygwin64
Local Package Directory： C:\cygwin64\Downloads
Direct Connection
選一個台灣的server。ex. ftp://ftp.ntu.edu.tw
出現Cygwin Setup，類似linux的yum 可以安裝要的package，ex. vim, screen, openssh, git

去C槽:
cd C:
檔案拉到視窗後會直接出現路徑

安裝完vim後:
$ vim .vimrc
set bg=dark
syntax on

git diff無高亮
No git color schemes under rxvt/cygwin
http://stackoverflow.com/questions/4185918/no-git-color-schemes-under-rxvt-cygwin
$ vim ~/.gitconfig
[color]
    ui = always
    status = always
    branch = always
    diff = always
    interactive = always

cygwin 的git svn dcommit出現錯誤：
Can't locate Memoize.pm ...
解法：
執行setup-x86_64.exe後更新perl，即可重新提交

安裝apt-cyg (類似apt-get)
https://github.com/transcode-open/apt-cyg
打開cygwin後輸入
$ lynx -source rawgit.com/transcode-open/apt-cyg/master/apt-cyg > apt-cyg install apt-cyg /bin
如果遇到權限不足
$ apt-cyg
-bash: /usr/bin/apt-cyg: Permission denied
則
$ chmod 777 /usr/bin/apt-cyg
使用：
$ apt-cyg install php-ctype (同使用setup-x86_64.exe GUI安裝php-ctype，cygwin如果只裝php沒裝php-ctype呼叫ctype_alnum() 會報錯 fatal error call to undefined function ctype_alnum()... )

cygwin安裝mtr
https://github.com/traviscross/mtr/issues/55#issuecomment-49270618
大意：
因為mtr使用raw sockets產生奇怪的網路封包，然而作業系統不允許一般使用者打開raw sockets(除非你是root)，在windows下提昇單一程式的權限rewolff表示他不知道，或許以administrator執行是一個選項。因setup-x86_64.exe的GUI裡面沒有mtr可以選，所以也無法安裝。
Windows要使用MTR還是另外用桌面程式測 http://winmtr.net/download-winmtr/ ，不要用cygwin測

移除cygwin 
因為git-svn出現Permission denied的問題無法修復，為了重新完整的安裝
http://problemsolv.in/how-to-remove-cygwin-permission-denied-problem/
打開cmd.exe
1. 讓cygwin資料夾及子資料夾的所有權不產生詢問
> takeown /r /d y /f cygwin
cygwin資料夾給予Everyone有Full Access
> icacls cygwin /t /grant Everyone:F
移除cygwin資料夾下所有東西
> rmdir /s /q cygwin

PHP cli連本機MySQL失敗
$ php connect_mysql.php
PHP Warning:  mysqli::connect(): (HY000/2002): No such file or directory in ...

在MySQL 連線設定時，主機不要寫 localhost，用 127.0.0.1
http://stackoverflow.com/questions/1676688/php-mysql-connection-not-working-2002-no-such-file-or-directory  PHP - MySQL connection not working: 2002 No such file or directory

screen下bash_completion不作用
沒開screen之前可以，
檢查.bashrc
[[ -f /etc/bash_completion ]] && . /etc/bash_completion
但是其實沒 /etc/bash_completion 這檔案
$ ls /etc/bash_completion
ls: cannot access '/etc/bash_completion': No such file or directory
其實在這裡
$ ls /etc/profile.d/bash_completion.sh
/etc/profile.d/bash_completion.sh
修改.bashrc
[[ -f /etc/profile.d/bash_completion.sh ]] && . /etc/profile.d/bash_completion.sh
解決


安裝完vim81後報錯
$ vim /etc/vimrc
Error detected while processing /etc/vimrc:
line   50:
E484: Can't open file /usr/share/vim/vim80/syntax/syntax.vim
Press ENTER or type command to continue
原因：找不到路徑
/usr/share/vim] $ ls
vim81
解法：
$ cp -r vim81 vim80

handlebar常見問題

http://stackoverflow.com/questions/10540176/how-to-implement-not-with-if-statement-in-ember-handlebar
how to implement not with if statement in ember handlebar?
解法：
{{#unless isValid}}
{{/unless}}

查DOM被哪js些事件綁定

http://stackoverflow.com/questions/446892/how-to-find-event-listeners-on-a-dom-node
使用chrome DOM右邊的的Event Listeners面板觀察
用jQuery榜定的事件無法觀察，用下面這方法的可以：
function abc(){ alert(1); };$j('body')[0].addEventListener('click', abc);

點click下面新增的事件裡面有：
listenerBody: "function abc(){ alert(1); }"