Setup Babel for ES2017

只測試過async await是可以用的，新的東西不知道會有什麼雷，請自己先想過三次是否要換語言

安裝:
> npm install --save-dev babel-cli babel-preset-es2017
> echo '{ "presets": ["es2017"] }' > .babelrc

測試程式(a.js)如下:

1:  async function Insert(data) {  
2:    return new Promise(resolve => {  
3:      console.log('insert data '+data);  
4:      resolve();  
5:    });  
6:  }  
7:  async function Hello(data_from_client) {  
8:    await Insert(data_from_client);  
9:    await Insert(data_from_client+1);  
10:    await Insert(data_from_client+2);  
11:    console.log('transaction finished');  
12:  };  
13:  Hello(1);  

直接執行:
> babel-node a.js

從ES2017轉舊版js(b.js)
> babel a.js --presets es2017 > b.js

Ubuntu安裝:
需要多安裝一個env套件才有es2015支援
> npm install babel-preset-env --save-dev
> echo '{ "presets": ["env", "es2017"] }' > .babelrc

參考來源:
https://babeljs.io/docs/plugins/preset-es2017/#usage-via-babelrc-recommended

float left轉inline-block地雷

今天下班前de不出來的一個bug，
試問以下兩個code出來的結果有何不同:

old.html

<div style="width: 1000px;height: 500px;">
  <div style="float: left;width:70%;height:100%;background: #145"></div>
  <div style="float: left;width:30%;height:100%;background: #222"></div>
</div>

bug.html

<div style="width: 1000px;height: 500px;">
  <div style="display: inline-block; width:70%;height:100%;background: #145"></div>
  <div style="display: inline-block; width:30%;height:100%;background: #222"></div>
</div>

你會發現bug.html怎麼樣都沒辦法把底下兩個div正確地塞進上層的div裡，

 bug.html底下兩個div中間會多出一條莫名其妙的空白線，但你用chrome/firefox inspector怎麼看兩個div的padding/border/margin 都找不到那條空白線到底是哪裡來的。

==========無用防雷線=============

解答:

 inline-block對外層來說兩個div排列是inline所以那個白線來自html排版中的空白text node，你需要把兩個div間的空白完全拿掉才能成功排列：

<div style="width: 1000px;height: 500px;">
  <div style="display: inline-block; width:70%;height:100%;background: #145"></div><div style="display: inline-block; width:30%;height:100%;background: #222"></div>
</div>

IIS NOTE

一個LAMP派使用者轉到IIS的心得

IIS是很nice的，這其中一定有什麼誤會，IIS是一個什麼東西都可以GUI設定的web server，不過前提是你要找的到就是了顆顆，我都是先找到文字檔怎麼設定最後才發現原來GUI可以找到對應選項。不過如果你找不到還是可以直接編輯網站對應的web.config(相當於apache的.htaccess)。

Troubleshooting

Q: 上傳檔案傳完後response 404 not found
A: 除了檢查PHP.ini裡upload_max_filesize欄位外，IIS本身有限制request的maxAllowedContentLength。IIS設定方式 在左側樹狀圖中點選站點>右側功能檢視中點選"要求篩選">最右側動作點選"編輯功能設定">彈出視窗中的"允許的內容長度上限"欄位輸入新的限制數值。官方文件說預設只有28MB左右超過就會噴404(對debug一點幫助都沒有的response)。

Python list tail friendly

用python整理演算法資料結構的時候順便簡單驗證了一下cpython對list splice的實作，
以下兩段code從執行效率上可以看出list對尾巴方向的操作的確會比較快

# slow.py
import cProfile

def xf(num):
    x = range(num)
    while x:
        x[:10] = [] # main test snippet

cProfile.runctx("xf(100000)", globals(), locals())

# fast.py
import cProfile

def xf(num):
    x = range(num)
    while x:
        x[-10:] = [] # main test snippet

cProfile.runctx("xf(100000)", globals(), locals())

追求UX良好的VIM編輯器之道(II)

Paste to command mode
實用技巧, UX待改良(?)
http://stackoverflow.com/questions/3997078/how-to-paste-text-into-vim-command-line

Why people are selfish?

小時候成績單評語被老師打了"熱心助人" 在長大之後這樣的評語還是有辦法在周遭的人間保持?

Possibly it's just the fxcking nature of humankind.

追求UX良好的VIM編輯器之道

用了幾個月VsVim之邪門歪道後突然頓悟的實用技巧

背景介紹
====

Vim使用者可能常常會有一個很大的困擾，
對一般的editor來說刪除跟剪下(Cut)是兩個不同的概念，
但在Vim裡所有的刪除(dd, df, x系列) default都會被視為剪下，
也就是你只要想刪掉的東西都會被存到Vim default的剪貼簿(clipboard)裡。

Vim的剪貼簿又叫作register (see :help registers<CR>)
但實際上Vim有不只一個剪貼簿(register)，
每個剪貼簿用一個a-z, 1-9還有一堆特殊符號的字母表示，
如果想要存取這些剪貼簿就可以用"符號加上剪貼簿名稱去存取。
e.g.
   複製一行到a剪貼簿:            "ayy
   讀取a剪貼簿並貼上:            "ap

如果不指定剪貼簿名稱，那就是使用某個特殊字元為名的default剪貼簿。


技巧篇
=====
所以刪除跟貼上撞在一起的解法很簡單:
就是當你要刪除東西就讓東西被送到defualt register裡。
如果你要剪下東西，那就使用windows中<C-x>的快捷鍵。
讓<C-x> map到刪除東西到除了default register以外的register (a-z 1-9任君挑選)
然後在用y貼上的時候也map掉原本的貼上，
而改指定從<C-x>時用的register貼上。


詳細腳本
====
待補....

Lock v.s. Singleton & lazy initialization(evaluation)

雖然在看到MSDN的reference前有想過可能要這樣寫，但我一度以為編譯器最佳化會幫你作掉......
錯誤寫法:

public sealed class Singleton
{
   private static volatile Singleton instance;
   private static object syncRoot = new Object();

   private Singleton() {}

   public static Singleton Instance
   {
      get 
      {
         lock (syncRoot) 
         {
            if (instance == null) 
               instance = new Singleton();
         }

         return instance;
      }
   }
}

正確寫法:

public sealed class Singleton
{
   private static volatile Singleton instance;
   private static object syncRoot = new Object();

   private Singleton() {}

   public static Singleton Instance
   {
      get 
      {
         if (instance == null) 
         {
            lock (syncRoot) 
            {
               if (instance == null) 
                  instance = new Singleton();
            }
         }

         return instance;
      }
   }
}

Comment:
其實兩個寫法應該都是正確的，只是會有速度上的差別。
Reference:
https://msdn.microsoft.com/en-us/library/ff650316.aspx

Some Ubuntu troubleshoot

How to install/confige nvidia driver?

==========================

  Solution A. install driver from nvidia homepage directly (highly not recommended!!!)

    1. download elf from nvidia homepage

    2. possiblely need to shutdown  "lightdm/kdm/gdm"

      > sudo service lightdm stop

    3. press Ctrl-Alt-F1 to attach to tty1

    4. If you explode, try fix with blacklist of modules(drivers) under /etc/modprobe.d

  Solution B.

    1. get driver

       i. from "Additional drivers"

       ii. from "sudo apt-get install nvidia-current-update"

    2. config your "lightdm/kdm/gdm"

      > sudo nvidia-xconfig

   http://askubuntu.com/questions/306090/12-04-failed-to-load-module-nvidia-module-does-not-exist-0

Much better: http://www.dedoimedo.com/computers/ubuntu-quetzal-nvidia.html

Login with ssh public key
===================
Scenario: your local ssh want to login into remote ssh server as user "inker"
1. push your local public key to remote inker's home directory
2. make file "~/.ssh/authorized_keys" on server as user "inker" if the file not exist
3. cat "your local public key" >> ~/.ssh/authorized_keys

iterator_traits

reference from STL源碼剖析 -- 從老闆辦公室書櫃幹來的

一圖蔽之請看下圖:

文字說明: 

Container必須要遵守對應iterator的型態，例如array的容器可以支援random access但link list只能支援forward iterator.對不同程度的iterator的支援將影響該容器是否可以跟相映演算法相接合。

例如有支援random access的容器才能支援binary search。 取max的演算法只要支援forward iterator可以traverse整個容器一次即可。

所以iterator對演算法來說是一種抽象化資料結構的介面。

不過如果說iterator是類似指標的存在，那當演算法撰寫時必須要取得指標(iterator)內所儲存的形態時該如何處理呢? 舉例像下列交換兩個iterator內容物的演算法:

template<typename I>

void swap(I i, I i2)

{

    iterator內存形態 tmp = *i;

    *i = *i2;

    *i2 = tmp;

}

此例中需要宣告一個暫存變數其型態是iterator內存的instance的型態。

其實原本iterator就需要遵守某種可以取得原形態、及相關形態的規範，即利用iterator範圍內對應的5個typedef。其中一個value_type就是上例中所需要的內存instance型態。

其在iterator內宣告長得像:

template<class T>

struct MyIterator

{

    typedef T value_type;

};

存取時寫法有點像是:

typename I::value_type;

但為支援原生型別的指標(e.g. int*, char*)

STL設計上多作了一層iterator_traits的class template來做萃取特性的動作。
如此一來就可以用C++的partial template specialization(樣板特化)的功能，針對原生指標寫一個特化版的trait來處理相關動作。
一般iterator_traits寫法如下:
template<typename I>
struct iterator_traits
{
    typedef typename I::value_type value_type;
};
特化版的iterator如下:
template<typename T>
struct iterator_traits<T*>
{
    typedef T value_type;
};

vim補完原理

trace Youcompleteme的隨手筆記

vim有提供各式不同的補完e.g. omnifunc、completefunc，按鍵上都是<c-x>加另一個<c-...>的驅動方式。背後的原理簡單來說其實omnifunc跟completefunc都是vim的一個option，值都是一個vim的function。當驅動補完時，就會觸發option設置對應的function，至於function要的定義長怎樣要怎麼寫可以參考: help complete-function的說明。

名言佳句集

你需要更努力才能看起來毫不費力.

用一個很高階的想法去實作出來.
時間有限，欲望無窮
看得懂一首詩的意境與創造詩本身，在本質上都是一種絕美的創作

力學T&M Ch1 純量、向量、座標轉換、少量向量分析

力學deadline突然改到明天12點，剖爽~~

第一章雖然蠻基本的，不過有些Notation真的不是普通的好用，可能可以用一輩子之類的，趕緊趁還有記憶的時候記下來以免向隅。我採用的順序可能跟課本不太一樣，不過個人覺得邏輯上比較有連貫性就是了。

定義一些Notation......

定義矩陣Notation

矩陣乘法則可寫成

矩陣轉置(transpose):

接下來講一下超有用的愛因斯坦Notation，在這個表示法下所有的向量都可以被簡寫成:

A這個向量是由i=1,2,3這三個分量組成的，A₁,A₂,A₃分別為代表A的三個分量的變數。
這樣所有的向量都可以被以單純的純量(每個分量都是純量)的形式來表示!!!!這是這種表示法最大的好處。
有了這個符號後再來定義內積(dot product)跟外積(cross product)的形式。

一般因為很懶的關係比較常直接寫足碼一樣的分量相乘的形式A_iB_i、而右邊那個多出一個足碼j和δ的表示法其實蠻無聊的其中定義:

因為δ的關係強制一定要在i = j的時候乘起來才會有值，故右邊的寫法跟A_iB_i是差不多的不過由於後面會用到δ所以還是先定義一下會比較好。

其中epsilon直定義為:

不難看出epsilon有cyclic才有值的性質，倒過來則是取負號<-這點也蠻重要的。
若是在多個向量連續Cross時會出現好多個eplison、則可利用以下式子化簡:

座標轉換

定義兩個向量AB的directional cosine

且一個向量跟坐標軸的directional cosine會有一些關係。

如此一來的話座標轉換的矩陣剛好就是:

不過這裡的轉換僅限座標旋轉就是了。根據跟舊座標的Directional cosine夾角下新座標必須兩兩垂直便可列出6條限制公式，假設轉換矩陣為λ_ij:

兩式結合簡寫為:

仔細觀察若是偷偷的把右邊的λ作轉置的話就可以得到類似乘法的形式:

而δ_ik仔細看一下裡面的內容好像就是我們常見的單位矩陣I，移項過後就可以得到著名的座標轉換矩陣"若且為若"關係式:

即一個矩陣為座標轉換矩陣若且為若上式成立!!!!!!

抱著核熔爐睡覺，比抱著老婆睡覺還安全!?

今天突然想起上學期修近物教授講的一個冷笑話，其實還蠻好笑得不過後來變成我們的期末考題= =" 就輻射線的面來講，人體主要輻射線來源來自自然界的食物攝取，其中輻射劑量較為龐大的就是K-40衰變成K-39的過程，然後K-40自然界在同位素中所占的比例又不低，所以可以估算出人體每秒放射總量是多少毫西佛，在加上網路上google到核溶爐的輻射劑量就可以對兩者作一個簡單的比較，不過還沒估算距離根吸收程度的問題所以實務上可能還是有一點差距，詳細數字計算等有空再補吧...........他考前都洩題了，近物還被當根本人品QQ

aaa

bbb

ccc

ddd

Test CSS3 rotation

Test CSS3 Translation

力學T&M 書目Overview

書名: Classical Dynamics od particles and systems
作者: Thornton & Marion
想當初對力學是抱持著有點不削的心情選課選下去的，想說既然是高中一直在學的東西大學的內容應該也就差不多就是畫力圖，只是把當初解方程式改成解微分方程罷了。
不過那天去圖書館翻了翻書目，讓我二話不說的就跑去印了一本~囧
除了當初物理之美教授有稍微提到T&M對力學有另一套用"最小作用量"的全新看法外、
第四章非線性系統&混沌系統 據說是目前物理界仍然很夯的一個研究大方向@@
第十四章還特別過度到狹義相對論下的運動學
翻了一下的確是有很多吸引人的地方。

不過教力學的林留教授教法真的讓人不太能苟同.........好像把力學仍然當成是微積分、普物基礎課程一樣，重頭開始慢慢定義推倒。 還號稱力學其實很簡單，只要用電腦跌代就可以慢慢的把所有東西都帶出來了，作業重點整個就是叫我們去自學LaTex還有程式繪圖= =" 他到底是教物理還教電腦有點小意義不明倒是真的。
總之上課果然還是不能完全靠老師在講，自己看原文書果然還是最實際的學習途徑啊

應用數學111009+111011Notes

作業文........每個禮拜四deadline根本杯具.
2.2 彈簧系統
A. Undamped system(Ideal spring)
形式: y'' = ay. (F = ky)

B.Damping system
外加一個神奇的Damp，我也不知是什麼鬼，不過Damp所造成的力和目前震盪速度成正比
F_Damp = v = y'
F_total = F_Damp + ky = v + ky
形式: y'' + ay' + by = 0 (Constant coefficient 2nd order linear homogeneous ODE)

Solution of Constant coefficient 2nd order linear homogeneous ODE......方程式的名字也太長= =
Case 1. distinct root (y =  C₁ e^λ₁x + C₂ e^λ₂x )
物裡現象: OverDamping
->觀察數學形式裡沒有周期函數，表示有彈簧但沒有在震盪????
其實是Damping加得太大了，導致彈簧一直來不及完成一次震盪。
連一次震盪都沒辦法完成，理所當然就不會是周期函數。

Case2. double root (y = e^-ax/2(C₁x + C₂) )
物理現象: Critical Damping
->Damp施加的力量剛好介於Underdamping和Overdamping中間的臨界情況
講義寫得不清不楚所以我也不太了是怎麼一回事= =
數學形事長得像一個指數遞減的函數乘上一個線性函數，
圖型上看起來很像是一開始會往上升但又往下掉，
快完成一次震盪了但又沒完成，猜測應該是在t = ∞時才剛好完成一次震盪吧

Case3.Complex conjugate ( y = e^-ax/2(C₁cos(ωx)+ C₂(ωx)) )
物理現像: UnderDamping
->可以震盪但是振幅指數遞減，應該是能量都被 Damp吸收走了所致，
不過個人覺得比較神奇的是他的數學形式，解一解解出複數還可以用泰勒展成實數，
然後最後出來的數學形式還剛好可以切合物理現像，
讓人不禁懷疑現實物理世界說不定真的存在著一個相對應的虛數空間，
運行法則雖然可能不太一樣但卻是與現實一一成對應的。

2.7 Nohomogeneous 2nd order Linear ODE
形式: y'' + p(x)y' + q(x)y = r(x)
唐毓慧中在這裡穿插了1st order處理Nonehomo的解答回顧，y = y_h + y_p
2nd基本上也是一樣先把r(x)去掉求一個homo的解 y_h再加上
把解把r(x)打開以後的任意一個解y_p，
Q:為什麼y_p加上y_h後仍會是原方程式的解? Hint: 證明很簡單、單純手爆

由於非常係數好像會很複雜(不過y_p似乎還是可以用猜的@@)
這裡只討論常係數方程，
形式: y'' + ay' + by = r(x)
y_p解法課本方式分為以下兩種:

(1)Undetermined Coefficient
聽起來很高級的解法，不過其實就是看r(x)然後用猜的。
形式都讓你猜出來的話，那就剩實際帶進去然後決定未定常數的大小了。
不過課本上是會附根據r(x)看出可能解答的表，
個人覺得若是對特殊函數微積分夠熟的話倒是沒什麼去被的必要性。

(2)Variation of Parameter
由於不是這次作業的重點就先下回分曉吧

2.8 Forced Oscillation -> Resonance
Resonance用來解釋再彈簧系統中r(x)得來源，
就是外加一個只隨時間變化函數的力，

黑蘋果教學(not yet constructed)

今天來福大大工讀分享的東西，感覺是一個大坑，據大大說法還要炸一堆硬體，有空再來跳好了@@

Blackbody Radiation心得總結

What's 黑體?

說黑體是黑色什麼的一定是用來唬爛沒準備就去考研究所考生的考題.

黑體正確來說是不會反射的物體(所以是很好的實驗對象)，不過正常來說不會反射陽光的確就應該是黑色的才對沒錯。

但事實上從高中對於黑體輻射的知識就可以了解所有有溫度的物體都會因為熱擾動(電磁震盪)的關係產生電磁波，若是溫度夠高震盪夠激烈就可能發出可見光波段的波長。

然而科學家對黑體輻射真正感興趣的地方是發現了黑體輻射出來 強度Intensity對 波長Wavelength的作圖曲線和物體材質完全無關，只和溫度有關。e.g舉一個很爛的例子今天林志玲長得不管多正，inkerker長得有多宅而且可能還終年足不出戶，不過只要兩個人保持人體均溫37度，那今天你把兩個人全身塗黑拿來做實驗，作出來的強度-波長曲線就amazingly的完全一致。

簡單來說背後一定有相當基本的物理原理在裡面，由此看出這是一個可以得諾貝爾獎的絕佳題材(誤)，而就此開啟了百家爭鳴的大物理學家時代............To Be Continue