pistema 新生無齡安瓶

結合緊緻、活化、修護等保養功效，內含Pistema®多元賦活因子，能從肌膚底層調理並增加防禦力，加速修護老化肌膚，改善鬆弛線條，讓肌齡更顯年輕。

https://www.mariavon-beauty.com.tw/products/%E6%96%B0%E7%94%9F%E7%84%A1%E9%BD%A1%E5%AE%89%E7%93%B6

how to fix IOS error ITMS 90035 invalid signature

How to fix error itms 90035 invalid signature



This  causes by some *.sh file in archive processing.
You need to delete the .sh file under project.










Some reference in below.

http://stackoverflow.com/questions/29807784/xcode-error-itms-90035-invalid-signature

http://stackoverflow.com/questions/29859996/error-itms-90035

Viewport for response layout

Viewport 是個 meta tag，一個虛擬的窗口。
主要是解決不同尺寸不同解析度造成顯示上的差異。
當你設定的頁面尺吋和devices不同，造成跑版的現像。

<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1″>

屬性說明
with=devices-width 指定viewport的寛度為devices的寛度

禁止使用者放大縮小

<meta name="viewport" content="user-scalable=0">
<meta name="viewport" content="user-scalable=no">

初始放大比例

<meta name="viewport" content="width=device-width, initial-scale=1.0">

限制放大比例

<meta name="viewport" content="width=device-width, maximum-scale=15.0">

限制縮小比例

<meta name="viewport" content="width=device-width, minimum-scale=0.1">

Reference:
http://developer.apple.com/library/IOS/#documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

http://webdesignerwall.com/tutorials/viewport-meta-tag-for-non-responsive-design

https://developer.mozilla.org/en-US/docs/Mobile/Viewport_meta_tag

http://www.w3.org/TR/css-device-adapt/#the-viewport

FBplus Facebook library

最近發現，Facebook API久沒用，往往會忘了差不多。
每次都要花上一點時間，復習一下。
這次索性把他包成library.方便日後使用。

Github : https://github.com/TerrenceTang/FBplus

FBplus

FBplus is a light javascript library for handling facebook data.
FBplus is used url to insert or query data, so developer doesn't need to load heavy library.
FBplus is build on jquery, so user needs to load jquery library before using FBplus

Setting

In first, developer needs to set you app information

    FBplus.prototype.config = {
        TOKEN:'access token',
        CLIENT_ID:"your app id ",
        SECRET_ID:"your secret id",
        CODE:"user's code",
        REDIRECT_URI:"after login, where will be redirect to "
    };

• TOKEN ：
• CLIENT_ID:
• SECRET_ID:
• CODE:
• REDIRECT_URI:

Start

FBplus is implemented by sandbox methodology. So developer needs to choose which module does he needs.

    new FBplus(['checkin', 'friends', 'config', 'auth', 'wall'], function(plus){
        // dosomethings
    });

    or

    new FBplus("*", function(plus){
        // dosomethings
    });

Auth

The module of Auth is using to help developer to create login url or deal token

    new FBplus(['auth'], function(plus){
        // the scope is about permession which will developer access
        var scope = "read_stream,publish_checkins,publish_stream,user_status,user_checks,user_birthday,friends_status";

        // get login link
        plus.auth.getLoginUrl(scope);

        // get logout link
        plus.auth.getLogoutUrl()

        //get long live token, this is danger to use in client, because it needs the secret id.
        //add this feature is because the defuault timeout in facebook is 2 hours.
        //In develop step, developer needs always re-load access token, it is very annoying.
        plus.auth.ltoken().done(success_callback_function).fail(fail_callback_function);

    });

more information to see facebook permession

Wall

The wall is about some activity of user or friend.

    new FBplus(['wall'], function(plus){
        // to get the home wall which include activitys of user and friends
        plus.wall.home().done(success_callback_function).fail(fail_callback_function);

        // to get the feed wall which base on friend's id
        plus.wall.feed("fid").done(success_callback_function).fail(fail_callback_function);

        // to get freined's shares
        plus.wall.shares("start_time", "limit").done(success_callback_function).fail(fail_callback_function);

        // get comments by id
        plus.wall.comments("id").done(success_callback_function).fail(fail_callback_function);

        // get comments by id
        plus.wall.likes("id").done(success_callback_function).fail(fail_callback_function);

        // get share links by id
        plus.wall.links("id").done(success_callback_function).fail(fail_callback_function);

        // insert message into wall
        plus.wall.insert({message:"content"}).done(success_callback_function).fail(fail_callback_function);
        // insert conment
        plus.wall.insertComment(id, {message:"content"}).done(success_callback_function).fail(fail_callback_function);
        // insert like
        plus.wall.insertLike(id).done(success_callback_function).fail(fail_callback_function);

    });

Friends

The module of friends shows friend list and information

    new FBplus(['friends'], function(plus){
        // show all friend
        plus.friends.list().done(success_callback_function).fail(fail_callback_function);

        // show information of friend
        plus.friends.nfo("fid").done(success_callback_function).fail(fail_callback_function);
        or
        plus.friends.info("me").done(success_callback_function).fail(fail_callback_function);
    });

Checkin

The module of checkin shows the checkin from user or friend

    new FBplus(['checkin'], function(plus){
        // show checkin from friend
        plus.checkin.friend("fid").done(success_callback_function).fail(fail_callback_function);

        // show checkin from me
        plus.checkin.me().done(success_callback_function).fail(fail_callback_function);

        // make checkin
        plus.checkin.insert(
            {
               coordinates:
               {
                  latitude:"25.07698687147",
                  longitude:"121.23201566872"
               },
               message:"test",
               place:"142800992448822"
            }
        success_callback_function, fail_callback_function);
    });

Groups

The module of groups shows the groups from user's id

    new FBplus(['groups'], function(plus){
        // show all groups by user's id
        plus.group.list("fid").done(success_callback_function).fail(fail_callback_function);

        // query informantion of group by groupd id
        plus.groups.info(gid).done(success_callback_function).fail(fail_callback_function);

        // query the members of group
        plus.groups.members(gid).done(success_callback_function).fail(fail_callback_function);

        // query the feed  by group's id
        plus.groups.feed(gid).done(success_callback_function).fail(fail_callback_function);
    });

Query Parameter

When querying data, there are several useful parameters that enable you to filter and page through connection data:

• limit
• offset
• until
• since

more information

   new FBplus(['checkin'], function(plus){
       // get 3 numbers data
       plus.checkin.me({limit:3});
       // get checkin which create until yesterday
       plus.checkin,me({until:"yesterday"});
       // get checkin which was created  since yesterday
       plus.checkin,me({since:"yesterday"});
    });

apache 更改目錄位置後出現 You don't have permission to access

修改 /etc/apache2/sites-enabled/000-default 文件
將DocumentRoot，與Directory 指向新路徑。如


DocumentRoot /home/terrence/project1/
<Directory /home/terrence/project1/>
# The Options directive is both complicated and important. 


Options Indexes FollowSymLinks  
# AllowOverride controls what directives may be placed in .htaccess files. 
# It can be "All", "None", or any combination of the keywords:  
#   Options FileInfo AuthConfig Limit  
AllowOverride None  


# Controls who can get stuff from this server.  
Order allow,deny  
Allow from all  
</Directory>

然後執行 sudo /etc/init.d/apache2 restart 重開

如果還是一直有問題，那想必是該目錄沒有執行的權限。
sudo chmod -R +x project1

切記。所有網頁連父目錄都要有執行的權限。

如何透過Dropbox建立Git Server

如果沒有自己的Git Server可以到Github升申免費帳號。但缺點就是如果你沒付費，就必需公開你的程式碼。
不過透過Dropbox也可以建立Git Server進行協同開發。

請先記住一件事，一般在開發，Mater是指本地端的Repo預設名字。遠端則稱為Origin

1.進入Dropbox，建立你要分享的目錄。
2.進入該目錄，輸入

$git init –bare

  加了--bare這參數後，這個目錄下不會有.git目錄，且在這個目錄中不會看到你的程式檔案。
  所以只能透過pull同步最新程式。而不能直接進入資料匣修改。

3.進入你目前專案的目錄(非Dropbox的目錄)，設定遠端目錄的路徑。

$git remote add origin Dropbox的目錄/OurProject

［Note］建立本地端Git專案請先執行 $git init ，初始化該資料匣。

4.接下來如果有新增檔案。可以先［進行］ git add , git commit。在透過下列指令上傳更新

$git push master origin

 
5.如果要下載新code，可以執行

$git pull origin master

常用指令：

把所有檔案都加入staged狀態

$git add -A 或 $git add .

各別新增為

$git add [File Path]

移除版本控制，設定為unstaged狀態

git reset [File Path]

檢查目前專案狀態

git status

檢視一下這個Repo之前commit的歷史記錄

git log

復原到指定版本

git checkout xxxx .

xxxx指的是版本編號的前四碼。

＊一般有小衝突git會自動幫你判斷合併，但太複雜的情況則需要手動處理。
開啟有衝突的檔案後，可以看到下列內容。

第一個A的內容
<<<<<<<
你加的C內容
=======
第二個A的內容
後面BB的內容
>>>>>>>

<<<<<<<  跟 >>>>>>> 標記描述了產生衝突的程式碼，其間以=======作為區隔，
第一個部份就是你新加的內容，第二個是遠端的內容。

Ref:
https://github.com/
http://www.mrmu.com.tw/2011/05/06/git-tutorial-for-beginner/

解決 405 Method not allowed問題

無法查看此摘要。請 按這裡查看文章。

VIM Plugin

快速註解功能
首先下載該外掛

sudo apt-get install vim-addon-manager vim-scripts

下載後執行安裝

vim-addons install enhanced-commentify

操作方式為選取要註解的範圍，輸入\x。便可以自動註解。選取後再輸入一次便可還原

Function List功能

首先下載該外掛

http://vim-taglist.sourceforge.net/

下載後執行安裝

vim-addons install taglist

在.vimrc加入快速鍵設定

map <f9>:Tlist<cr>

按Tab鍵自動完成［supertab］

Ref:

http://www.vim.org/scripts/script.php?script_id=182

透過關鍵字輸出預設內容[snippetsEmu]

Ref: 

http://blog.lauct.org/archives/874

Vim 的 JavaScript 縮排格式最佳化 外掛

http://blog.longwin.com.tw/2009/11/vim-javascript-indent-formatter-plugin-2009/

CTag

http://edt1023.sayya.org/vim/node13.html

http://stenlyho.blogspot.com/2008/11/ubuntuvim-plugin-ctagstaglist.html

Ref: http://blog.othree.net/log/2008/03/23/auto-complete-on-vim/http://blog.othree.net/log/2008/03/23/auto-complete-on-vim/

常用FBAPI 資料取得方式-取得user info & friend list & friends

在這記錄一些常的FB資料取得方式。

首先先宣告告queryFQL Function 簡介呼叫程序

  function queryFQL(sql , callBack){
    FB.api({method:'fql.query',query:sql}, callBack);
  }

取得所有群組名稱

queryFQL('select flid , name from friendlist where owner=me()' ,
  function(response){
    console.log(response);
  });

取得好友與所在群組資料

queryFQL('SELECT uid, flid FROM friendlist_member WHERE flid IN (SELECT flid FROM friendlist WHERE owner=me())' ,
  function(response){
    console.log(response);
  });

取得好友的詳細資料

queryFQL('SELECT name,pic_square, uid from user where uid in (SELECT uid2 FROM friend WHERE uid1 = me())', 
  function(response){                                                 
    console.log('user-data',response);                                
})

如果要確知道要取得那些資料，可以使用multiquery。減少request的發送次數
先宣告multiQueryFQL Function

var multiQueryFQL = function(sql , callBack){
  FB.api({method:'fql.multiquery',queries:sql} , callBack);
}

同時取得好友與分類名稱

multiQueryFQL([
  'select flid , name from friendlist where owner=me()', 
  'SELECT uid, flid FROM friendlist_member WHERE flid IN (SELECT flid FROM friendlist WHERE owner=me())',
  'SELECT name,pic_square, uid from user where uid in (SELECT uid2 FROM friend WHERE uid1 = me())'],
  function(response){};

第一個參數型態為Array，存放所有FQL Query指令。
回傳資料也為Array。對應各個FQL結果

至於取得的User詳細資料。可轉換為User['名稱'] ＝ UID ； 的儲存陣例，方便查詢
以上面使用multiQueryFQL查詢為例，第三個FQL查詢回傳Use的詳細資料

var users      = response[2].fql_result_set ;
var userInfo   = {} ;
for(var uid in users){
  userInfo[users[uid].uid.toString()] =  users[uid].name ;  
}

取得使用者圖片，可以以透過下列網址取得
http://graph.facebook.com/［user id］/picture

如果要將每個friend加入相對應的群組，方便資料查詣。則可以做個簡單的資料轉換。

var groupInfo  = response[0].fql_result_set ;
var friendList = response[1].fql_result_set ;
if(!groupInfo && !friendList && !users) return  ;
  for (var gid in groupInfo){
    if(!groupInfo[gid].user) groupInfo[gid].user = [] ;
      for(var fid in  friendList){
         if(groupInfo[gid].flid === friendList[fid].flid){
           groupInfo[gid].user.push(users[uid].uid);                          
           delete friendList[fid]; 
       }
    }
}

//最後groupInfo的資料格式為
[{flid:'0001',name:'title-name',user:['0001','0002']},{flid:'0002',name:'title-name',user:[xxx,xxx,]}]

常用 Regular Expression範例

寫程式常常需要檢查信用卡、日期、Email、IP、密碼... 等等.
下列有許多常用範例.

http://jana.bz/?site=blog&tid=32

http://lab.hsdn.net/blog/2009/09/%E5%B8%B8%E7%94%A8%E7%9A%84%E6%AD%A3%E8%A6%8F%E8%A1%A8%E7%A4%BA%E5%BC%8Fregular-expression/

也有些小工具,協助撰寫
http://www.hongkiat.com/blog/regular-expression-tools-resources/

Apache ab 網站壓力測試工具

ab（Apache Benchmark）是 Apache 內建的網站壓力測試工具，
你可以用來模擬測試多人連線測試。如「如果同時有 1000 個人拜訪你的網站，每個連線平均反應時間是多少？」

1.安裝Apache

sudo  apt-get  install  apache2

2.執行 usr/bin/ab

指令

ab -c 10 -n 1000 網址/

ab -c 10 -t 30 網址/

-c 10 建立10個連線
-n 1000 每個連線發出1000個request
-t 30 時間限制30秒

其它常用參數
同時 10 個連線，連續送出 10000 個request，並且使用 Keep-Alive 方式連線

ab -n 10000 -c 10 -k 網址

將測試的效能原始資料匯出成 CSV 檔

ab -e output.csv -n 10000 -c 10 網址

測試結果
Server Software:
Server Hostname: localhost
Server Port: 3000

Document Path: /
Document Length: 277 bytes

Concurrency Level: 100
Time taken for tests: 0.203 seconds
Complete requests: 100
Failed requests: 0
Write errors: 0
Total transferred: 39900 bytes
HTML transferred: 27700 bytes
＊Requests per second: 493.74 [#/sec] (mean)
＊Time per request: 202.534 [ms] (mean)
Time per request: 2.025 [ms] (mean, across all concurrent requests)
Transfer rate: 192.39 [Kbytes/sec] received

Connection Times (ms)
min mean[+/-sd] median max
Connect: 2 3 0.7 3 4
Processing: 5 106 56.0 108 197
Waiting: 5 106 56.0 108 197
Total: 8 109 55.7 112 200

Percentage of the requests served within a certain time (ms)
50% 112
66% 136
75% 161
80% 168
90% 184
95% 193
98% 198
99% 200
100% 200 (longest request)

Server Software: Web主機的作業系統與版本(若Web主機設定關閉此資訊則無)
Server Hostname: Web主機的IP位址(Hostname)
Server Port: Web主機的連接埠(Port)
Document Path: 測試網址的路徑部分
Document Length: 測試網頁回應的網頁大小
Concurrency Level: 同時進行壓力測試的人數
Time taken for tests: 本次壓力測試所花費的總秒數
Complete requests: 完成的要求數(Requests)
Failed requests: 失敗的要求數(Requests)
Write errors: 寫入失敗的數量
Total transferred: 本次壓力測試的總數據傳輸量(包括 HTTP Header 的資料也計算在內)
HTML transferred: 本次壓力測試的總數據傳輸量(僅計算回傳的 HTML 的資料)
Requests per second: 平均每秒可回應多少要求
Time per request: 平均每個要求所花費的時間(單位: 豪秒)
Time per request: 平均每個要求所花費的時間，跨所有同時連線數的平均值(單位: 豪秒)
Transfer rate: 從 ab 到 Web Server 之間的網路傳輸速度

最後的 Connection Times (ms) 指的是壓力測試時的連線處理時間：

橫軸欄位的部分：

min: 最小值
mean: 平均值(正、負標準差)
median: 平均值(中間值)
max: 最大值
縱軸欄位的部分：

Connect: 從 ab 發出 TCP 要求到 Web 主機所花費的建立時間。
Processing: 從 TCP 連線建立後，直到 HTTP 回應(Response)的資料全部都收到所花的時間。
Waiting: 從發送 HTTP 要求完後，到 HTTP 回應(Response)第一個 Byte 所等待的時間。
Total: 等於 Connect + Processing 的時間（因為 Waiting 包含在 Processing 時間內了）

參考網站
http://blog.miniasp.com/post/2008/06/Using-ApacheBench-ab-to-to-Web-stress-test.aspx
http://httpd.apache.org/docs/2.0/programs/ab.html

[Javascript]透過getBoundingClientRect method取得Div的left,top,right,bottom,height,width資訊

想想,一般當我們要取得div的樣式設定時,要如何處理.
嗯...我一時也想不到有什麼比較好的方法.腦中出現浮現的第一步,
是先透過document.getElementById()先取得object,再來找找,有沒有對應的屬性.
但,然後呢?

後來發現比較好的方法,是透過getBoundingClientRect().
透過該方法會回傳一個TextRange object, 該object包含了.left,top,right,bottom,height,width資訊

使用方式如下

<html>
    <head>
        <style type="text/css">
            #rect{
                width:200px;
                height:100px;
                margin-top:20px;
                background-color:#cccccc;
            }
        </style>
    </head>
    <body>
        <div id ='rect'>
            this is test area.
        </div>    
        <script>
            var div = document.getElementById("rect");
            if(div.getBoundingClientRect){
                var rect = div.getBoundingClientRect();
                var x = rect.left;
                var y = rect.top;
                var w = rect.right - rect.left;
                var h = rect.bottom - rect.top;
                var width = rect.width;
                var height = rect.height;
                console.log(x,y,w,h,width,height);
            }    
        </script>
    </body>
</html>

該範例輸出結果如下:

8 20 200 100 200 100

更多詳細資料可以參考下列網址
http://help.dottoro.com/ljvmcrrn.php

[javascript]在chrome中使用LOGE,LOGD,LOGW除錯

一般情況在編寫javascript時,對於驗證變數的輸出.最常用的方式是alert().
數量少時.是個不錯又偷懶的處理方式.
但,編寫複雜的大型專案時.這方式可就不適用了.
如果你是在chrome的browsr上.可以有更多的選擇.

一般會用console.log()來輸出程式執行時期的結果輸出.
但除了最基礎的console.log()還有
console.info()
console.error()
console.warn()
可以使用.

開發者可以依據輸出變數的目的.來選擇合適的提示方式.

但對於每次呼叫該function 都需要輸入長長的一串console.log()的方式.
感到麻煩.
所以是不是可以模仿Android的方式,使用LOGE(),LOGD(),LOGW(),LOGI()來輸出.
來達到偷懶的目的.

有些開發者會自己撰寫function來達到此一目的.

    function LOGE(log){
      console.error(log);
 };
 function LOGD(log){
      console.debug(log);
 };

此一做法很簡單,又明了的.可以達到簡化的目的.
但存在一個很嚴重的問題.
當我每次呼叫LOGE時,在輸出的結果.所顯示的行數.
為console.error的執行行數.而不是呼叫LOGE的所在行數.

所以可以使用另一方式.來改寫上面的function

   functon LOGE(log){
       return console.__proto__.error.bind(console , log);
   };

呼叫方式為

   LOGE('this is LOGE')()

如此一來,便可以清楚的知道LOGE的程式呼叫點.