OmniAICreator/Qiita-1.07M huggingface dataset:
CodeMirrorでAutoCompleteする

JavaScriptで作られたエディタCodeMirrorで、こんな風に補完をしたい。

![](http://i.gyazo.com/3151ad8c32e9f4ceec169cc0841e4abd.png)

## 準備

まず以下のjsとcssを読み込む

- codemirror/lib/codemirror.js
- codemirror/lib/codemirror.css
- codemirror/addon/hint/show-hint.js
- codemirror/addon/hint/show-hint.css

## 同期的に補完候補を表示する

以下coffeescript
elはなんか適当なDOMTextAreaELement渡してください。

```coffeescript
{Pos} = CodeMirror
autocomplete = (cm) ->
  CodeMirror.showHint cm, ->
    cur   = cm.getCursor()
    token = cm.getTokenAt(cur)
    start = token.start
    end   = token.end
    from  = Pos(cur.line, start)
    to    = Pos(cur.line, end)

    list:[
      "aaa"
      "bbb"
      "ccc"
      ]
    from: from
    to: to

CodeMirror.fromTextArea el,
  extraKeys:
   'Tab': autocomplete
```

TabキーでAutoCompleteを発火させる。showHintで上のような構造体を渡せば補完が走る


## 非同期的に補完候補を表示する

```coffeescript
{Pos} = CodeMirror
autocompleteAsync = (cm) ->
  callback = (cm) ->
    cur   = cm.getCursor()
    token = cm.getTokenAt(cur)
    start = token.start
    end   = token.end
    from  = Pos(cur.line, start)
    to    = Pos(cur.line, end)

    setTimeout ->
      CodeMirror.showHint cm, ->
        list:[
          "aaa"
          "bbb"
          "ccc"
          ]
        from: from
        to: to
    , 400

  callback.async = true
  CodeMirror.showHint cm, callback
  
CodeMirror.fromTextArea el,
  extraKeys:]
   'Tab': autocompleteAsync
```

# 入力したら常に補完できないか確認する

Tabを押さずにキー入力の度に補完を発火できるかどうか確認する。

```coffeescript
{Pos} = CodeMirror
watchChange = (cm) ->
  CodeMirror.showHint cm, ->
    cur   = cm.getCursor()
    token = cm.getTokenAt(cur)
    start = token.start
    end   = token.end
    from  = Pos(cur.line, start)
    to    = Pos(cur.line, end)

    if token.string is '@'
      list:[
        "@aaa"
        "@bbb"
        "@ccc"
        ]
      from: from
      to: to

cm = CodeMirror.fromTextArea el,
cm.on 'change', -> watchChange(cm)
```

この例だと @ を入力したら @aaa, @bbb, @ccc を候補に出る。


## 実践編

バッファ内からすべての単語を探し、入力中の文字列とマッチしたものを表示する。
(ここではunderscoreも使っているので注意)

```coffeescript
{Pos} = CodeMirror
collectBufferWords = (cm, word) ->
  bufferWords = _.compact(cm.getValue().split(/\n|\s/))
  _.uniq _.filter bufferWords, (w) ->
    w.indexOf(word) > -1 and w isnt word

autocompleteAnyWords = (cm) ->
  CodeMirror.showHint cm, ->
    cur   = cm.getCursor()
    token = cm.getTokenAt(cur)
    start = token.start
    end   = token.end

    from  = Pos(cur.line, start)
    to    = Pos(cur.line, end)
    currentWord = token.string
    ch = cur.ch
    line = cur.line

    while --ch > -1
      t = cm.getTokenAt({ch, line})
      if t.string is ' '
        break
      currentWord= t.string + currentWord

    matchedWords = collectBufferWords(cm, currentWord)

    list: matchedWords
    from: {ch, line}
    to: to
  
CodeMirror.fromTextArea el,
  extraKeys:]
   'Tab': autocompleteAnyWords
```

これで冒頭の

![](http://i.gyazo.com/3151ad8c32e9f4ceec169cc0841e4abd.png)

ができるってワケ
トリビア：定数値の文字列表現

```py
>>> repr(None) is repr(None)
False
>>> repr(True) is repr(True)
True
```

`bool`型定数は、文字列オブジェクトを内部でキャッシュして使い回しているのに、`None`は毎回文字列オブジェクトを毎回作っている。
おそらく合理的な意図はなく、`bool`でやっている効率化を`None`ではやり忘れているだけ。
Brackets Terminal - Mac 上で tty.js のインストールが上手くできない


Brackets 上で Terminal を実行するための拡張機能がうまく動かなかったので、対処方法をメモ。

### 問題の概要

Brackets Terminal の実行には Node の tty.js が求められる。

しかし、npm 経由で tty.js をインストールすると、次のようなエラーが発生する。

```
$ npm install -g tty.js

> pty.js@0.2.3 install ~/.nvm/v0.10.32/lib/node_modules/tty.js/node_modules/pty.js
> node-gyp rebuild

  CXX(targer) Release/obj.target/pty/src/unix/pty.o
../src/unix/pty.cc:499:10: error: use of undeclared identifier 'openpty'
  return openpty(amaster, aslave, name, (termios *)termp, (winsize *)winp);
         ^
../src/unix/pty.cc:545:10: error: use of undeclared identifier 'forkpty'
  return forkpty(amaster, name, (termios *)termp, (winsize *)winp);
         ^

2 errors generated.
```

### 対処方法

Stack overflow に似た問題の対処方法が掲載されている。
[Errors installing pty.js (node)](http://stackoverflow.com/questions/24949902/errors-installing-pty-js-node)

どうも npm 環境下では、pty.js@0.2.3 が include している `<util.h>` へのパスが lib に登録されていない模様。

github 上の tty.js であれば、この問題へ対処済みの pty.js を使用しているので問題を解決できる。

具体的には次のコマンドを実行。

```
npm install -g chjj/tty.js.git
```

**付記**
次のコマンドだと、なぜかエラーが発生するので `https://...com/` を省略して実行する。
`npm install -g https://github.com/chjj/tty.js.git`

あとは `tty.js --port 8080 &` で tty.js を実行し、Brackets Terminal から tty.js へ接続すればOK。

![brackets - terminal.png](https://qiita-image-store.s3.amazonaws.com/0/54471/6f3ac8f5-35d1-0ddf-a0f4-73a39fee9af6.png "brackets - terminal.png")
FinderからPathをコピーしたい

- MavericksまでFinderでファイル選択⌘Iで表示された場所をコピーしてPATH取得してた
- Yosemiteでは場所の表示が変わってしまった。

ファイルを選択して普通にファイルコピー⌘C
ターミナルで⌘V

これでPATH貼り付けられる
たぶん前からあったんだと思うけどなんとなくやってみたら出来たから
atom snippet packageの使い方

[snippet](https://github.com/atom/snippets)のREADMEの翻訳っぽいもの．

# Snippet package

`tab`を入力すると，直前に入力しているプリフィックスにマッチするスニペットが展開されます．

Atom > Open Your Snippets メニューを選択するとスニペットの追加が行えます．

## Snippet Format

スニペットはパッケージの `snippets/`フォルダに保存されています．
また`.atom/snippets.cson`からも読み込まれます．

スニペットファイルは`.json`, `.cson`のどちらかで作成できます．

```coffeescript
'.source.js':
  'console.log':
    'prefix': 'log'
    'body': 'console.log(${1:"crash"});$2'
```

トップレベルのキー(`.source.js`)はスニペットが適用されるセレクタです．
次のインデントのキー(`.console.log`)はスニペットの名前です．

各スニペットには

 * `prefix` スニペットを展開するときに指定するプリフィックス 
 * `body` スニペット本文を指定します．

あとで訳す

$ followed by a number are the tabs stops which can be cycled between by pressing tab once a snippet has been triggered.

The above example adds a log snippet to JavaScript files that would expand to.

console.log("crash");
The string "crash" would be initially selected and pressing tab again would place the cursor after the ;

## 複数行のbody

`"""`で囲みます．

```coffeescript
'.source.js':
  'if, else if, else':
    'prefix': 'ieie'
    'body': """
      if (${1:true}) {
        $2
      } else if (${3:false}) {
        $4
      } else {
        $5
      }
    """
```

***

(以下は翻訳ではありません．)

変数も使えます．

```coffeescript

HEADER = 
  'prefix': 'header'
  'body'  : """
   ## @author kazup0n(@kazup0n)
   ## all rights reserved.
   """

'.source.coffee':
  'header': HEADER

'source.rb':
  'header': HEADER

```
[メモ書き] Googleタグマネージャーが上手く動かないんだけど.....

タグマネージャーごときに少し時間取られてムカついたので書いた.

## とりあえずタグアシスタント(chrome拡張）
https://chrome.google.com/webstore/detail/tag-assistant-by-google/kejbdjndbnbjgmefkgdddjlbokphdefk?hl=en

chrome使ってない？シラン

## タグアシスタントで大体解決
![Screenshot 2014-11-13 17.38.50.png](https://qiita-image-store.s3.amazonaws.com/0/30440/194d58a6-0255-129f-99b2-9a269958b86d.png)

errorの内容も割と詳しく教えてくれる.

## ルール設定のし忘れ
![Screenshot_2014-11-13_17_33_17.png](https://qiita-image-store.s3.amazonaws.com/0/30440/8c7acbcb-e1d4-e0d2-5bc7-366678d88eb7.png)

僕はこれだった.

## bodyに入れる
これで動かなくなるかは謎だけど、ドキュメントにbodyに入れろと書いてあった.
EC2に複数のENIをアタッチする手順と制約（Public-ip,DNSが割当てられなくなる）


そもそも、ENIをインスタンスにアタッチしただけでは、OS上で認識してくれないので、OS上での操作が必要になります。

## 1.手順（eth-configの作成、プロセス再起動）

`/etc/sysconfig/network-scripts/ifcfg-eth1`を作成します。
（ethxxのxx部分や、IP、サブネットマスクなどは、適宜自分のネットワークの値に合わせて設定してください）

```/etc/sysconfig/network-scripts/ifcfg-eth1
DEVICE="eth1"
BOOTPROTO="static"
ONBOOT="yes"
BROADCAST=172.31.0.255
NETMASK=255.255.255.0
NETWORK=172.31.0.0
IPADDR=172.31.100.250
```

`service network restart`　で、networkプロセスを再起動


手順自体は難しくないですが、
これら一通りの流れで気になったポイントを纏めておきます。


## 2.AWS上の制約、仕様

追加対象のENIは、メインのネットワークサブネットと同AZのサブネットのENIしか選択できない（リストに出てこない）

複数ENIをアタッチした場合、動的なPublic-IPやDNS名は振られなくなってしまうので注意。
知らずに設定してしまい、再起動やSTOP→STARTすると、Public-IPが振られてこないので"アクセスできない状態"になり、一瞬焦ることになります。
（EIP振ってアクセスすればいいんですが、起きた瞬間は、やべーって思ってしまった）

[AWS公式資料](http://docs.aws.amazon.com/ja_jp/AWSEC2/latest/UserGuide/using-instance-addressing.html#public-ip-addresses)



また、複数のIP（NIC）を持つことによる問題（ルーティングとか）は、以下のサイトがすごく参考になりました。

[ENIについて考えてみた -log4motoさん](http://d.hatena.ne.jp/j3tm0t0/20120410/1334086123)
[もう一度ENIについて考えてみた(Linux編) -log4motoさん](http://d.hatena.ne.jp/j3tm0t0/20121217/1355774969)
VIsual Studio Communityの利用条件など

http://www.visualstudio.com/products/visual-studio-community-vs

Q: Who can use Visual Studio Community? 
Q: 誰がVisual Studio Communityを利用できますか？

A: Here’s how individual developers can use Visual Studio Community:<br />A: 個人の開発者がVisual Studio Communityを利用できる条件は次の通りです:

+ Any individual developer can use Visual Studio Community to create their own free or paid apps.<br />すべての個人開発者は、Visual Studio Communityを利用して、無料または有料のアプリケーションを作成できます。

Here’s how Visual Studio Community can be used in organizations:<br />組織内でVisual Studio Communityを利用できる条件は次の通りです:

+ An unlimited number of users within an organization can use Visual Studio Community for the following scenarios: in a classroom learning environment, for academic research, or for contributing to open source projects.<br />集合学習環境、学術研究、オープンソースプロジェクトへの貢献について……組織内のユーザーは何人であってもVisual Studio Communityを利用できます。
+ For all other usage scenarios: In non-enterprise organizations, up to 5 users can use Visual Studio Community. In enterprise organizations (meaning those with >250 PCs or > $1MM in annual revenue), no use is permitted beyond the open source, academic research, and classroom learning environment scenarios described above.<br />それ以外のすべての利用シナリオについて……非エンタープライズ組織においては、5人以下のユーザーに限りVisual Studio Communityを利用できます。エンタープライズ組織（PCを250台より多く所持するか、年間売上が100万ドルより多い組織）においては、上で述べたオープンソース、学術研究、集合学習環境を超えた範囲での利用は認められません。
CakePHP2のvalidationDomainでpoファイルを分割する

# CakePHP2のvalidationDomainでpoファイルを分割する

Validationのメッセージで多言語ファイルを使う場合、`default.po`が参照されます。  
これで基本問題無いのですが、案件の規模が大きくなると`default.po`の中にValidationメッセージとそれ以外のメッセージで入り乱れて収集がつかなくなります。  

`validationDomain`を設定するとValidation用のpoファイルを別に分けることが可能になります。    
また、案件を跨いでValidationメッセージの共有がしやすくなるというメリットもあるかと思います！

## 設定

```
class AppModel extends Model {
    // これでvalidation.poに分けれます。(名前は適当にどうぞ)
    public $validationDomain = 'validation';
}
```

## ちなみに
これがが動いてます
```
__d($domain, $msg, $args = null) {
```
AngularJSのインターセプターを使った、認証チェック

AngularJS+Typescriptで会員制サービスを作ったので、その時に使ったソースコードの一部です。

ページ遷移時にresponseをインターセプトしてステータスが401だったらログインに飛ばす。

画面リロード時には$routeChangeSuccessが呼ばれないので、コントローラが呼ばれるたびに認証チェックする処理が別途必要になります。

```js:app.ts
/**
 * インターセプター
 */
context.app.factory("SessionInterceptor", function ($q:ng.IQService, $location:ng.ILocationService) {
    return {
        request: function (config) {
            return config || $q.when(config);
        },
        requestError: function(request){
            return $q.reject(request);
        },
        response: function (response) {
            return response || $q.when(response);
        },
        responseError: function (response) {
            if (response && response.status === 401) {
                $location.url("/login");
            }
            return $q.reject(response);
        }
    };
});

/**
 * 環境設定
 */
context.app.config(function ($routeProvider:ng.route.IRouteProvider, $locationProvider:ng.ILocationProvider, $translateProvider:ng.translate.ITranslateProvider, $httpProvider:ng.IHttpProvider) {
    $locationProvider.html5Mode(true);
    $locationProvider.hashPrefix('!');

    /**
     * route設定
     */
    $routeProvider
        .when("/",         { templateUrl: "/view/top/Top.html" })
        .when("/login",    { templateUrl: "/view/login/Login.html" })
        .otherwise({redirectTo: "/notFound"});

    /**
     * セッションチェック
     */
    $httpProvider.interceptors.push("SessionInterceptor");
}).run(function($rootScope:ng.IRootScopeService, loginService:domain.login.ILoginService, $location:ng.ILocationService) {
    // route変更時のイベント
    $rootScope.$on("$routeChangeSuccess", function(event, current, next) {
        if(!loginService.isLogged) {
            $location.url("/login");
        }
    });
});

```
gitで日本語ファイル名を表示する方法

# gitで日本語ファイル名を表示する方法

gitで日本語ファイル名を`git commit`や`git status`で表示する方法
よく忘れるので備忘録

## 設定内容
```
git config --global core.quotepath false
```

---

### 設定前

```
git status

"\346\227\245\346\234\254\350\252\236OK.xlsx"
```

### 設定後

```
git status

日本語OK.xls
```
MacでのApacheのVirtualHost設定で気をつけること

# このドキュメントについて
MacでVirtualHostを設定して、複数のローカルサイトを別ドメインでみたい場合の設定

# 最終的な設定内容

## /etc/hostsの設定 

```

127.0.0.1   a.test.jp
127.0.0.1   b.test.jp
```

## /etc/apache2/httpd.confの設定
変更なし

## /etc/hosts

```

127.0.0.1       a.test.jp b.test.jp localhost
::1             a.test.jp b.test.jp localhost
```

## /etc/apache2/other/httpd-vhosts.conf

```apache

Listen 80
NameVirtualHost *:80

<VirtualHost *:80>
    ServerName     a.test.jp
    DocumentRoot   "/Users/hoge/a"
    CustomLog      "/var/log/a-error_log" common
    ErrorLog       "/var/log/a-error_log"
    <Directory "/Users/hoge/a">
    Options Indexes FollowSymLinks MultiViews
    AllowOverride None
    Order allow,deny
    Allow from all
    </Directory>
</VirtualHost>
<VirtualHost *:80>
    ServerName     b.test.jp
    DocumentRoot   "/Users/hoge/b"
    CustomLog      "/var/log/b-error_log" common
    ErrorLog       "/var/log/b-error_log"
    <Directory "/Users/hoge/b">
    Options Indexes FollowSymLinks MultiViews
    AllowOverride None
    Order allow,deny
    Allow from all
    </Directory>
</VirtualHost>
```


# 途中でいくつかひっかかったときのこと

## apacheを再起動してもエラーが標準出力されない

```apache

httpd -S
```

でエラーがでていないか確認

## /etc/apache2/extraをincludeするとssl証明書関連でエラー

最初、httpd.confで/etc/apache2/extra/*をIncludeしてしていたが、ssl関連ファイルでエラーがでるので、読み込みが必要なファイルのみ/etc/apache2/othersにコピーして使用

```apache

Include /private/etc/apache2/other/*.conf
```

上記の行はデフォルトで書かれているので、追記する必要はなし

## httpd: Could not reliably determine the server's fully qualified domain name, using 127.0.0.1 for ServerName

httpd.confのServerNameの設定をしていないため。

ServerNameに127.0.0.1を使用した、FQDN(ドメイン名)が確定できませんでした。
Apacheの設定と、サーバ自身の名前の設定と、それに紐付けられたIPの設定を同じにしないと上記のメッセージがでます。

* /etc/apache2/httpd.conf
 
```

ServerName localhost:80
```

* /etc/hosts

```

127.0.0.1       a.test.jp b.test.jp localhost
::1             a.test.jp b.test.jp localhost
```


# stackoverflowでのVirtualHostが動作しない関連の投稿

このあたりを疑ってみる。

* [apache: don't have permission to access / on this server. when I am using virtualhost](http://stackoverflow.com/questions/10445455/apache-dont-have-permission-to-access-on-this-server-when-i-am-using-virtua)


* [VirtualHosts does not work on Mac OS 10.7](http://stackoverflow.com/questions/10464229/virtualhosts-does-not-work-on-mac-os-10-7)

# 参考

* [apache virtualhostの設定](http://kazmax.zpp.jp/apache/apache4.html)


# おまけ
東洋経済オンラインで「エンジニア夫婦のあるある日記」を連載中です

[エンジニア夫婦のあるある日記](http://toyokeizai.net/search/author?category%5B%5D=TK%3E%E8%A8%98%E4%BA%8B&category%5B%5D=TK%3E%E5%A4%96%E5%A0%B1&author_name=%E3%81%BC%E3%81%B8%E3%81%BC%E3%81%B8)

![あるある日記.jpg](https://qiita-image-store.s3.amazonaws.com/0/32215/14d59814-449c-7cec-c463-59650d3ab1a3.jpeg)
vimを起動する時に警告が出るようになったのを直した


以下のような警告が出るようになっていた。

```
[neobundle] neobundle#rc() is deprecated function.
[neobundle] It will be removed in the next version.
[neobundle] Please use neobundle#begin()/neobundle#end() instead.
Press ENTER or type command to continue
```

`.vimrc`を変更

```
call neobundle#rc(expand('~/.vim/bundle/'))
```

↓

```
call neobundle#begin(expand('~/.vim/bundle/'))
NeoBundleFetch 'Shougo/neobundle.vim'
call neobundle#end()
```


#### thanks
- http://qiita.com/musclemikiya/items/58edc801264aca151446  
ここをそのままコピペしただけ。
Web Audio APIのソースコード


## WebKit (Chrome, Opera, Safari)
- リポジトリ
  - [WebKit/webkit](https://github.com/WebKit/webkit)
- インターフェース
  - https://github.com/WebKit/webkit/tree/master/Source/WebCore/Modules/webaudio
- 音響処理はここに書かれている
  - https://github.com/WebKit/webkit/tree/master/Source/WebCore/platform/audio


## Gecko (Firefox)
- リポジトリ
  - [mozilla/gecko-dev](https://github.com/mozilla/gecko-dev)
- インターフェース
  - https://github.com/mozilla/gecko-dev/tree/master/dom/media/webaudio
- 音響処理はblinkから持ってきている
  - https://github.com/mozilla/gecko-dev/tree/master/dom/media/webaudio/blink

## Spec
- [原文](http://www.w3.org/TR/webaudio/)
- [日本語訳](http://g200kg.github.io/web-audio-api-ja/)
[メモ書き] windowsから送られてきたzipがMacで文字化けするの何とかする

## Q. windowsから送られてきたzipがMacで文字化け何とかしたい

## A. unarコマンドを使う
コレ
http://unarchiver.c3.cx/commandline

> brew install unar

brew 使ってない方はよしなに

> unar windowsから送られてきた.zip

でOK.

向こうのエンコードによってはダメかも

## Q. ファイル名は解消出来たけど、中身が文字化けしてんだけど

## A. nkfコマンドをつかう
(Linux系ではおなじみかな）
> brew install nkf

UTF-8コードへ変換
> nkf -w 文字化けしてるファイル.txt > 適当なファイル名.txt
配列から偶数番目・奇数番目だけを取り出すワンライナー

※0番目を偶数として数え始めることにします

# 偶数番目

```php
array_map('current', array_chunk($array, 2))
```

# 奇数番目

```php
array_map('current', array_chunk(array_slice($array, 1), 2))
```
WebPayを使ってRailsアプリに決済機能組み込み


Railsのアプリに決済機能を組み込もう、ということでWebPayを少し触ってみた。
（そういえば先日のRebuildに、中の人が出演されてましたね）

- [WebPay: 開発者向けクレジットカード決済サービス](https://webpay.jp/)
- [Rebuild: 65: Disrupting Payments (hmsk)](http://rebuild.fm/65/)

ドキュメントの説明がしっかり書いてあるし、APIはすごく扱いやすい印象。

## 前準備
テスト環境（決済が実際には発生しない）をすぐに利用できる。
WebPayにアカウント登録すると、「テスト環境用公開可能鍵」「テスト環境用非公開鍵」の2つのAPIキーが発行される。

これらを環境変数にでも入れておく。
（`ENV['webpay_public_key']`, `ENV['webpay_secret_key']`とする)

以下、実装。
※内容は2014年11月時点のものです

## 実装
[ドキュメント](https://webpay.jp/docs/introduction)をざっと読んで簡単なものを書いた。
実際にプロダクトに組み込むときは、例外処理など含めもっとちゃんと書かないといけないだろう。

まずview側。[CheckoutHelper](https://webpay.jp/docs/checkout)というのを使うと簡単。
すごく便利で、クライアントサイドでのカード情報のトークン化やバリデートなどを行ってくれる。
決済処理のactionを実行するformタグを書いて、その中でいくつかの`data-`属性を埋め込んだjsを呼ぶだけ。

```slim:hoge.html.slim
div
  = form_tag payment_purchase_path
    = javascript_include_tag "https://checkout.webpay.jp/v2/", \
    class: 'webpay-button', :'data-text' => 'アレを購入', \
    :'data-submit-text' => '￥10,000をカードで支払う', :'data-key' => "#{ENV['webpay_public_key']}",\
    :'data-lang' => 'ja'
```

つぎに購入処理を行うcontroller。

```ruby:app/controllers/payment_controller.rb
require 'webpay'

class PaymentController < ApplicationController
  def purchase
    webpay = WebPay.new(ENV['webpay_secret_key'])
    
    # WebPay上での顧客の情報を作成
    customer = webpay.customer.create(card: params['webpay-token'])
    
    # 顧客情報を使って支払い
    webpay.charge.create(
      amount: 10_000,
      currency: 'jpy',
      customer: customer.id
    )
  rescue WebPay::ErrorResponse::CardError => e
    # エラーハンドリング。発生する例外の種類がいくつか用意されているので、内容に応じて処理を書く
  end
end
```

実際の画面は以下の様な感じ。ボタンができて、

![スクリーンショット 2014-11-14 3.10.13.png](https://qiita-image-store.s3.amazonaws.com/0/1795/a4f60f59-c9e7-10af-7012-e4d22942fbb6.png "スクリーンショット 2014-11-14 3.10.13.png")

クリックするとカード情報入力のフォームが出る。

![スクリーンショット 2014-11-14 3.10.40.png](https://qiita-image-store.s3.amazonaws.com/0/1795/ca349676-9d08-80cc-3282-a99a76ed8ef3.png "スクリーンショット 2014-11-14 3.10.40.png")

で、カードの情報を入力すれば決済完了。
テスト用に利用できるカード情報が[提供](https://webpay.jp/docs/mock_cards)されていたりする。
先述したとおりCheckoutHelperがカードの情報をトークン化しており、サーバサイドでそのトークンを`params['webpay-token']`として扱っている。サーバ側にカードの生情報は送信されない。

トークン決済についてのくわしい説明はドキュメント参照。
https://webpay.jp/docs/payments_with_token

上記のコードだと、購入する毎にWebPay上の顧客情報を新規作成するようになっているが、顧客の情報（とカード情報）を2回目以降の購入で再利用することも可能。
例えばこちらのアプリ側の`users`テーブルのcustomer_idカラムに、コード中の`customer`のID（`customer.id`で取得可能な一意な文字列）を保存しておく。これを利用することで、以下のように、登録済のWebPay顧客情報を取得することができる。

```ruby:app/controllers/payment_controller.rb
customer = webpay.customer.retrieve(current_user.customer_id)
```

## ダッシュボード
WebPayにログインするとダッシュボードが用意されている。課金の履歴や顧客のリスト、イベントのログなどが見られる。

![スクリーンショット 2014-11-14 3.46.08.png](https://qiita-image-store.s3.amazonaws.com/0/1795/81647dd8-0e39-0bbf-3d59-4c39211e4f8c.png "スクリーンショット 2014-11-14 3.46.08.png")

## おわり
簡単に決済機能が実装できちゃってマジですごいと思った。ステキですね。
定期課金（例：月額）機能やwebhookの送信機能なども用意されているので、もう少しいじってみます。
（正式に利用するには、商用環境の申請が必要）
subprocess.Popenで実行したコマンドの出力を徐々に表示する


subprocessモジュールを使って外部コマンドを実行する際には、`communicate`メソッドをよく使用していた。

```python:subprocess.Popen.communicate()
import subprocess

(stdoutdata, stderrdata) = subprocess.Popen(['some', 'command'], stdout=subprocess.PIPE).communicate()
print(stdoutdata)
```

しかしビルドスクリプトなど、結果を非同期に出力したい場合は`communicate`メソッドでは実現できない。[ライブラリリファレンス](http://docs.python.jp/2/library/subprocess.html#subprocess.Popen.communicate)にあるとおり、`communicate`メソッドはプロセス終了まで待ち、その後に標準出力のデータを返すからだ。

この要求を実現したい場合、ioモジュールを使って子プロセスの出力に対応したストリームを作成する必要がある。

(ref) http://docs.python.jp/2/library/subprocess.html#subprocess.Popen.stdout
(ref) https://gist.github.com/mattbornski/3299031


```python:子プロセスの出力に対応したストリーム
def exec_process(commands):
    process = subprocess.Popen(commands, stdout=subprocess.PIPE, bufsize=-1)
    with io.open(process.stdout.fileno(), closefd=False) as stream:
        [print(line.rstrip('\n')) for line in stream]

    # プロセス終了まで待ち、結果を判定する
    process.wait()
    if process.returncode != 0:
        print('Build process aborts.')
        sys.exit(1)
```

以下、何点かハマった点のメモ

1.`io.open`でストリームを生成する際には、ファイルパスまたはファイル記述子(`(file object).fileno()`で取得可能)を与える必要がある。`subprocess.Popen.stdout`のパス名は分からないため、ファイル記述子を与える必要がある。ファイルオブジェクト(=`subprocess.Popen.stdout`)をそのまま与えるのではないことに注意する。

(ref) http://docs.python.jp/2/library/io.html#io.open


```python:
# process.stdoutをio.openに直接与えると実行時例外で終了する。
def exec_process(commands):
    process = subprocess.Popen(commands, stdout=subprocess.PIPE, bufsize=-1)
    with io.open(process.stdout, closefd=False) as stream:
        [print(line.rstrip('\n')) for line in stream]
```

2.`io.open`でストリームを生成する際、`closefd=False`を指定する必要がある。デフォルトでは`closefd=True`であり、その状態だと以下のエラーが発生する。

```
close failed in file object destructor:
IOError: [Errno 9] Bad file descriptor
```

streamが閉じられるタイミング(=今回の場合、with文を抜ける時)で、子プロセスの掴んでいるファイルオブジェクト(=`subprocess.Popen.stdout`)を閉じようとすることが原因だと考えられる。
不思議の国のセグエちゃん


Size Classesは使わない主義の人です。ですが、Size Classesを使った場合と使わない場合では、セグエの動作はかなり変わりますのでみんな注意しよう。なにしろ、Adaptive Segueですからネ。

旧セグエが全般的にdeprecatedとか早まって解釈しないようにしないと、足下をすくわれますヨ。まあなんだ、早くしないと遅くなるからね。

Size Classes使わない場合、チェックボックスを外したり、旧来プロジェクトのセグエ、例えばpushセグエはNavigationViewControllerでないと使えません。他VCにも設定はできるのですが、ただのViewControllerに設定すると問答無用で落ちます。やったー。

なお、このモードでは普通にpushとかmodalとか黒ダイアログが表示され、deprecatedとも言われません。ガンガン使っていきましょう。責任は持たないよ。

で、同じ場面で、普通のVCにSizeClassesを使った場合。

適応型のセグエなので、showが設定してあると、「ああん？　こいつpushしたいみたいだけどー、このVCでは無理ー。無理だからー。適当にモーダルで遷移しておくけど、いいだろ？」という具合でなんと、**落ちずに遷移**します。おお、落ちない方向に倒すなんてApple的ダネ。

Adaptiveというのは、こういうことなんだー、と嬉しく（？）なりました。

ですから、'show' イコール push **ではない**です。
show 書いておけばとりあえず落ちないで遷移するよ、かな？

ただ、チェックボックスのフラグで動きが変わったり、意図しないパターンの遷移をするかもしれないんで、インターフェースビルダーというかストーリーボードの最近の仕様は結構頭おかしいとおもいました。

今日のところは以上です。

（つづく？）
Yosemite上のtmuxからだとterminal-notifierがハングする際の解決法


結論 :smile:
------

### ハングする件 :smiling_imp:

https://github.com/alloy/terminal-notifier/issues/115 に書いてある通り、`reattach-to-user-namespace`を入れて、以下の設定を`.tmux.conf`に入れてやれば動く。

```
brew install reattach-to-user-namespace
```

```.tmux.conf
set-option -g default-command "reattach-to-user-namespace -l zsh"
```

`reattach-to-user-namespace`はクリップボード共有のために入れているひとも多いはずだし、すでにこの設定は入ってると思う。


### tmuxとzsh-notifyの相性が悪い件 :broken_heart:

~~mainstreamのzsh-notifyじゃなくて、 https://github.com/shrkw/zsh-notify/tree/tmux_support を使う。~~

ダメだった。まだ解決してない。 https://twitter.com/_atton/status/533034969224855552

ターミナルAppがカレントウィンドウかどうか、カレントタブかどうかのAppleScriptのところが正常に動いてないので直さないといけない。

```shell-session
git clone git@github.com:shrkw/zsh-notify.git
git checkout tmux-support
```

環境	 :ship:
------

```shell-session
$ terminal-notifier -V
terminal-notifier (1.6.2) is a command-line tool to send OS X User Notifications.
$ tmux -V
tmux 1.9a
$ reattach-to-user-namespace -v
reattach-to-user-namespace version 2.3
    Supported OSes: OS X 10.5-10.10
```

経緯など :skull:
---------

http://qiita.com/kei_s/items/96ee6929013f587b5878 を見まして、いっちょ通知の設定でもするかと気張ったけど、そもそも`brew install terminal-notifier`で入れた`terminal-notifier`が動かない。  
おかしいなあと思いつつtmuxの外から試すと動く。あれれと検索してみると、すぐに https://github.com/alloy/terminal-notifier/issues/106 が見つかった次第。

### tmuxとzsh-notifyの相性が悪い件

素のzsh-notifyだとtmuxのことを考慮してなくてtmuxのウィンドウがフォアグラウンドにあっても通知がきてしまう。コマンド実行時のtmuxの`#{window_id}`を保存しといて、終わったときに現在のアクティブな`#{window_id}`と比較すればいいんじゃないかと思って雑な実装を一通り書き終わってPR作るかと思ったところで上記のブランチを見つけた。

けど、ちょっと中途半端な状態のブランチだったので、フォークしてターミナルAppで動くように数行加えた次第。
初心者がBlenderでパンダを描こうとしてみた

http://nvtrlab.jp/column/2-2

このサイトさんを見ながらBlenderでパンダに挑戦する。

#画面の分割でつまづく
右上の三角をつかんで画面が分割出来るのはわかった。
しかし分割しすぎて戻せない。
Ctrl+zを押してもオブジェクトが戻って画面は戻らない。
なんか、どうも画面には順番があって、
どの画面を結合するかによってつかむ右上の三角が違うらしい。

#ガイド絵が見えない
下絵を置いたはいいが、オブジェクトをぐりぐり動かしても下絵が見えない。
私はmacbookairを使っていますが、
正面からの下絵は1、右からの下絵は3を押すことで見えた。
ちなみに「横からの下絵を設定する」とあって横って右なのか左なのかわからなかったんだけど
どうやら右半分だけ作って左は右のをコピーして反転するだけなので右でいいらしい。

#Mirror Modifier設定出来ない
＞ミラー接合面が裂けないように、Clippingをチェック。これでMirror Modifier設定は完了です！
clippingを押した後どうすればいいのかわからず「適用」を押したら
「編集モードでモディファイアー適用は出来ません」のようなメッセージが。
適用は押さず、そのまま放置でいいらしいです。

#いよいよモデリング。

＞押し出し（E）+拡大縮小（S）+移動（G）などを駆使しながら、がむしゃらにひょうたんを作っていきます。
![スクリーンショット 2014-11-14 3.13.03.png](https://qiita-image-store.s3.amazonaws.com/0/57077/85aae7c8-38ee-0c75-7737-3ec8ca3d1370.png)

まだまだ修行がたりんようです。
PDFに文字入れる・スタンプ（DRM関連）

Re:VIEWで作成したPDFに、DRMのために文字を入れたくなったので調べた。

## pdfstamp

Re:VIEW使っているたのでさくさく導入できた

[作成時刻やバージョン情報を PDF にスタンプする](http://d.hatena.ne.jp/aki-yam/20100121/1264099509)
Macのlaunchctlでサービスの自動起動をさせたくない時のためのメモ

homebrewでMavericksにインストールしたdnsmasqがサービス管理にlaunchctlを利用していた。

```bash
> brew install dnsmasq
==> Downloading https://downloads.sf.net/project/machomebrew/Bottles/dnsmasq-2.72.mavericks.bottle.tar.gz
######################################################################## 100.0%
==> Pouring dnsmasq-2.72.mavericks.bottle.tar.gz
==> Caveats
To configure dnsmasq, copy the example configuration to /usr/local/etc/dnsmasq.conf
and edit to taste.
  cp /usr/local/opt/dnsmasq/dnsmasq.conf.example /usr/local/etc/dnsmasq.conf
To have launchd start dnsmasq at startup:
    sudo cp -fv /usr/local/opt/dnsmasq/*.plist /Library/LaunchDaemons
    sudo chown root /Library/LaunchDaemons/homebrew.mxcl.dnsmasq.plist
Then to load dnsmasq now:
    sudo launchctl load /Library/LaunchDaemons/homebrew.mxcl.dnsmasq.plist
WARNING: launchctl will fail when run under tmux.
==> Summary
?  /usr/local/Cellar/dnsmasq/2.72: 7 files, 496K
```

launchctlを用いたサービス管理の基本的な操作をメモする

# サービスのplistファイル
dnsmasqの場合はこのようなplistファイルが添付されているので、サービスに登録するにはこれをLaunchDaemonディレクトリ(いくつかある)に配置する必要がある。

```xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
  <dict>
    <key>Label</key>
    <string>homebrew.mxcl.dnsmasq</string>
    <key>ProgramArguments</key>
    <array>
      <string>/usr/local/opt/dnsmasq/sbin/dnsmasq</string>
      <string>--keep-in-foreground</string>
    </array>
    <key>RunAtLoad</key>
    <true/>
    <key>KeepAlive</key>
    <false/>
  </dict>
</plist>
```

# サービスのロード
```
sudo launchctl load /Library/LaunchDaemons/homebrew.mxcl.dnsmasq.plist
```
サービス情報を記録したサービス名のplistファイルをサービスとしてロードする。plistファイルはフルパス。
サービスを起動するためには後述する``launchctl start``が必要だが、plistに自動起動が設定されていた場合は即座にサービスが起動する。

# サービスのアンロード

```
sudo launchctl unload /Library/LaunchDaemons/homebrew.mxcl.dnsmasq.plist
```

サービスをアンロードする。起動していたサービスは終了する。

# サービスの起動
```
sudo launchctl start homebrew.mxcl.dnsmasq
```
ロードしたサービスを起動する。

# サービスの終了
```
sudo launchctl stop homebrew.mxcl.dnsmasq
```
起動したサービスを終了する。ただし、plist内で

```xml
    <key>KeepAlive</key>
    <true/>
```

と記述されていたら、終了してもすぐに自動的に再起動される。

# サービスの自動起動
サービスのplist内で

```xml
    <key>RunAtLoad</key>
    <true/>
```

と記述されていたら、サービスのロード時(OS起動時を含む)に自動的にサービスが起動される。

# まとめ
homebrewでインストールしたサービスが未来永劫勝手に起動されてしまうのが嫌だったら、RunAtLoadをfalseに設定すれば良い。または、plistのProgramArgument要素を覗けば叩いているコマンドラインが分かるので、それを見て勝手に叩けばよい。その場合、サービスを起動するには``launchctl load``してから``launchctl start``する必要がある。
Setting guest network: user-mode hostfwd

# hostfwd検証メモ

## 概要

Bridge Networkingを使わずに、User-mode hostfwdを使用してホストからゲストにSSHログインする。

## ネットワーク構成

+ hostonly (host <-> guest)

## 作業内容

### Host側

```
 -netdev user,id=hostonly0,net=10.2.0.0/8,host=10.2.0.2,dhcpstart=10.2.0.20,hostfwd=tcp:${hostfwd_addr}:${hostfwd_port}-:22 \
 -device ${nic_driver},netdev=hostonly0 \
```

### Guest側

/etc/sysconfig/network-scripts/ifcfg-eth0

```
DEVICE=eth0
TYPE=Ethernet
BOOTPROTO=dhcp
ONBOOT=yes
```

### SSH using Port Forwarding

```
$ ssh localhost -p <hostfwd_addr>
```

これでゲスト内にSSHログイン可能。
なお、eth0のIPアドレスは、10.2.0.20となっているはずである。

```
 -netdev user,id=hostonly0,net=10.2.0.0/8,host=10.2.0.2,dhcpstart=10.2.0.20,hostfwd=tcp:${hostfwd_addr}:${hostfwd_port}-:22 \
```

net, host, dhcpstart の値で変更可能。

## Links

+ http://www.linux-kvm.org/page/Networking
Styleの定義

**Styleの定義**

res/values/styles.xmlを作成して以下のように記述します。

```
<?xml version="1.0" encoding="utf-8"?>
<resources>
	<style name="Animation" parent="android:Animation" />
	<style name="Animation.Activity" parent="android:Animation.Activity">
		<item name="android:activityOpenEnterAnimation">@anim/activity_open_enter</item>
		<item name="android:activityOpenExitAnimation">@anim/activity_open_exit</item>
		<item name="android:activityCloseEnterAnimation">@anim/activity_close_enter</item>
		<item name="android:activityCloseExitAnimation">@anim/activity_close_exit</item>
	</style>
</resources>
```

これも基本的な動作はAnimation.Activityを継承しますので、parentで指定しておきます。
今回はactivityのopenとcloseのアニメーションを変更するので、それに関係する４つの要素だけ修正します。
各要素を上から順に説明します。

```
1.activityOpenEnterAnimationはstartActivityなどで開く対象のactivityのアニメーションを指定します。
2.activityOpenExitAnimationはstartActivityの呼び元の閉じられるactivityのアニメーションを指定します。
3.activityCloseEnterAnimationはfinishなどで閉じる事で表示されるactivityのアニメーションを指定します。
4.activityCloseExitAnimationはfinishの呼び元の閉じるactivityのアニメーションを指定します。
```

**TranslateAnimationクラスで指定する属性**

・android:fromXDelta：アニメーション開始時のX座標の値 
・andorid:toXDelta　：アニメーション終了時のX座標の値 
・android:fromYDelta：アニメーション開始時のY座標の値 
・android:toYDelta　：アニメーション終了時のY座標の値
 
**Animationクラスで指定する属性**
・android:duration　　 ：アニメーションの動作時間(msec) 
・android:fillAfter　　：true:アニメーション終了後にアニメーションの変換が適用 
・android:fillBefore　 ：true:アニメーション開始前にアニメーションの変換が適用 
・android:fillEnabled　：true:fillAfterが適用 
・android:repeatCount　：アニメーションの繰り返し回数 
・android:repeatMode　 ：アニメーションが終了した場合の振る舞い 
・android:startOffset　：アニメーションが開始する前に置く時間(msec) 
・android:zAdjustment　：アニメーション実行中のコンテンツについてZ軸方向の調整
Twitterの相対時間を`twitter.relative.time.js`を使って実現する

# Twitter Display Requirements

TwitterのAPIを使ってTweetを表示する場合、Timestampを決まった表記の相対時間で表示することが求められています。

> #### Tweet Timestamps
> 1. For Tweets that have been sent in the last 24 hours, use the short form timestamp relative to the current time, for example “20s” for a Tweet sent 20 seconds ago, “3m” for 3 minutes ago, “5h” for 5 hours ago.
>1. Tweets older than 24 hours should show a short form date including the day and month, e.g., “6 Jun”.
>
> [Display Requirements | Twitter Developers](https://dev.twitter.com/overview/terms/display-requirements)

軽量(8kb)で依存ライブラリのない`twitter.relative.time.js`を使えば簡単にこれを実現することができます。

[dforest/twitter-relative-time-js](https://github.com/dforest/twitter-relative-time-js)

# 使い方

`twitter.relative.time.min.js`をダウンロードして読み込んでください。

そして相対時間にしたい`Date`オブジェクトに対して`.toTwitterRelativeTime()`するだけでDisplay Requirementsに準拠した相対時間になります。

```js
new Date().toTwitterRelativeTime()
//=> 7s (for 7 seconds ago)
//=> 13m (for 13 minutes ago)
//=> 19h (for 19 hours ago)
//=> 23 Jan (older than 24 hours)
```

## 15ヶ国語対応

また、相対時間の表記として、以下の16ヶ国語にも対応しています。

- 英語 `en`
- 日本語 `ja`
- アラビア語 `ar`
- ドイツ語 `de`
- スペイン語 `es`
- フランス語 `fr`
- ヒンディー語 `hi`
- インドネシア語 `id`
- イタリア語 `it`
- 韓国語 `ko`
- マレー語 `ms`
- ポルトガル語 `pt`
- ロシア語 `ru`
- トルコ語 `tr`
- 簡体中国語 `zh-CN`
- 繁体中国語 `zh-TW`

```js
new Date().toTwitterRelativeTime('ja')
//=> 7秒前 (for 7 seconds ago)
//=> 13分前 (for 13 minutes ago)
//=> 19時間前 (for 19 hours ago)
//=> 1月23日 (older than 24 hours)
```

[dforest/twitter-relative-time-js](https://github.com/dforest/twitter-relative-time-js)
Wercker 関連記事 #wercker

# Wercker 関連記事 #wercker

更新日: 2014/11/18 23:06:56

|No.|タイトル|作成日|ストック数|
|--:|:--|:--:|--:|
|1|[Heroku 上の Ruboty を Wercker で自動デプロイ #ruboty #wercker](http://qiita.com/tbpgr/items/0023725093bd4f4ee8f7)|2014/11/17 23:27:34|0|
|2|[Wercker + Bitbucket で Ruby のプロジェクトの CI の疎通確認を行う #ruby #wercker #bitbucket](http://qiita.com/tbpgr/items/2ae195b4e37c76c4f141)|2014/11/14 00:42:50|2|
|3|[Wercker Best Practice #wercker](http://qiita.com/tbpgr/items/58b548887d2d27f43ff2)|2014/11/17 23:21:06|0|
|4|[Wercker Deployment #wercker](http://qiita.com/tbpgr/items/b5cc4f52e9c57290f416)|2014/11/17 23:22:04|0|
|5|[Wercker  The wercker command line interface](http://qiita.com/tbpgr/items/60d2cedd4dd720f175b6)|2014/11/18 22:58:56|0|
|6|[Wercker  ビルド結果を Slack に通知する #wercker #slack](http://qiita.com/tbpgr/items/7705995c9f679d97a382)|2014/11/18 23:06:03|0|
|7|[Wercker のバッジを README.md に追加する #wercker](http://qiita.com/tbpgr/items/52fba6b642faba865dd5)|2014/11/14 00:51:05|0|
|8|[Wercker 基礎 ＋ 外部構成図 ＋ 内部構成図 #wercker](http://qiita.com/tbpgr/items/13c8ac30dec94839a7a2)|2014/11/14 00:47:11|1|
Wercker のバッジを README.md に追加する #wercker

# Wercker のバッジを README.md に追加する #wercker
## 概要
Wercker のバッジを README.md に追加します

## 前提
下記記事の構成で、 Wercker による CI の設定が完了済みとします。
[Wercker + Bitbucket で Ruby のプロジェクトの CI の疎通確認を行う](http://qiita.com/tbpgr/items/2ae195b4e37c76c4f141)

## 手順
* Wercker の 該当プロジェクトのメニューを開き、 Badge ボタンを押下します
    ![badge_menu.png](https://qiita-image-store.s3.amazonaws.com/0/43480/a97f62b9-6a77-70e0-c852-462e24625c25.png)

* Copy ボタンで README に張り付ける Markdown のテキストをコピーする
* README.md に追記し、リポジトリに push する
    * コミットコメントに `[ci skip]` を含めことにより、ドキュメントの修正のみの場合などに CI の実行を中止する
* README を Bitbucket から確認します
    
* `[ci skip]` のため、処理結果が黄色で表示されました
    ![readme_ci_skip.png](https://qiita-image-store.s3.amazonaws.com/0/43480/8ba5bdd3-c5e1-e09a-9f84-b63fb3aa1e05.png)
* 再度 `[ci skip]` なしで push します
* テストが成功し、 緑色で表示されました
    ![readme_ci_success.png](https://qiita-image-store.s3.amazonaws.com/0/43480/e62d7d50-857e-aecf-ffb4-a5f68981f688.png)

## 参照
* [Wercker](http://wercker.com/)
シェルスクリプトで最後のTweetからの経過秒数を計算


# 用意するもの

[tw - Twitter client on Ruby.](http://shokai.github.io/tw/)


# 準備

1. ターミナルなどから`tw`を一回叩くとブラウザが起動するので、自分のTwitterアカウントでログインしておく
1. last_tweet_timediff.shとして下記を保存
1. @account_name に @hummer とか @付きで取得したいアカウント名に書き換える

```sh:last_tweet_timediff.sh
#!/bin/sh

# 最後のTweetからの経過秒数を表示

TZ=JST
LAST_TIME="`tw @account_name -format='#{time}' | awk '{print $1,$2}' | tail -n1`"
LAST_SECOND=`date -j -f "%Y-%m-%d %H:%M:%S" "$LAST_TIME" +%s`
NOW=`date +%s`

expr $NOW - $LAST_SECOND
```

# やってみる

```bash
$ ./last_tweet_timediff.sh
1614
```
psコマンドまとめ

自らの学習のためにpsコマンドについてまとめてみました。psコマンドはいろいろなオプションがあるので私が便利だと感じたものを抜粋してここに記載します。

<h2>psコマンドとは</h2>
実行中のプロセスを表示するコマンドです。表示されるプロセスの要素を下に記します。


<table>
<tr><th>要素</th><th>意味</th></tr>
<tr><td>F</td><td>プロセスの状態</td></tr>
<tr><td>USER</td><td>ユーザID</td></tr>
<tr><td>PID</td><td>プロセスID</td></tr>
<tr><td>%CPU</td><td>CPU使用率</td></tr>
<tr><td>%MEM</td><td>実メモリ使用量</td></tr>
<tr><td>VSZ</td><td>仮想メモリの使用サイズ(キロバイト表示)</td></tr>
<tr><td>RSS</td><td>物理メモリの使用サイズ(キロバイト表示)</td></tr>
<tr><td>TTY</td><td>使用端末</td></tr>
<tr><td>STAT</td><td>プロセスのステータス</td></tr>
<tr><td>PRI</td><td>プロセスの優先度</td></tr>
<tr><td>PPID</td><td>親プロセスのPID</td></tr>
<tr><td>NI</td><td>優先度を示すNICE値</td></tr>
<tr><td>SZ</td><td>プロセスが確保しているメモリサイズ</td></tr>
<tr><td>WCHAN</td><td>スリープ時のカーネル関数名</td></tr>
</table>

<h3>F(プロセスの状態)</h3>
Fは16進数で表記される。

<table>
<tr><th>状態表記</th><th>意味</th></tr>
<tr><td>00</td><td>終了</td></tr>
<tr><td>01</td><td>システム上の常駐プロセス</td></tr>
<tr><td>02</td><td>親プロセスからトレースされている</td></tr>
<tr><td>04</td><td>親プロセスからトレースされている状態で停止している</td></tr>
<tr><td>08</td><td>起動不可能</td></tr>
<tr><td>10</td><td>プロセスがメモリ上にありイベント終了までロックされている</td></tr>
<tr><td>20</td><td>スワップ不可能</td></tr>
</table>


<h3>STAT(プロセスステータス)</h3>

<table>
<tr><th>ステータス表記</th><th>意味</th></tr>
<tr><td>S</td><td>割り込み可能なスリープ状態</td></tr>
<tr><td>s</td><td>セッションリーダ</td></tr>
<tr><td>D</td><td>割り込み不可能なスリープ状態</td></tr>
<tr><td>R</td><td>実行可能状態(待ち状態)</td></tr>
<tr><td>O</td><td>実行中</td></tr>
<tr><td>I</td><td>プロセス生成中</td></tr>
<tr><td>Z</td><td>親プロセスとの関係が切れた状態（ゾンビプロセス）</td></tr>
<tr><td>N</td><td>優先度低い</td></tr>
<tr><td>></td><td>優先度高い</td></tr>
<tr><td>+</td><td>フォアグラウンドのプロセスグループに入っている</td></tr>
<tr><td>T</td><td>停止中</td></tr>
</table>

<h3>NICE値って何？</h3>
プロセスの優先度を示す値。範囲は-20〜19で、19が優先度が一番低い。

<h2>便利だと思った使い方</h2>
1:実行ユーザつきでプロセスを表示する

```
ps u
```

![スクリーンショット 2014-11-14 0.16.50.png](https://qiita-image-store.s3.amazonaws.com/0/58014/0716a50b-bfe3-a5b2-c445-a9cec0604de4.png)

2:詳細な情報つきで全てのプロセスを表示する

```
ps alx
```

![スクリーンショット 2014-11-14 0.23.30.png](https://qiita-image-store.s3.amazonaws.com/0/58014/34d41b15-74c2-6667-907a-f08ffd1c7e2a.png)

3:要素でソートしてプロセスを表示する。ここではrssの降順でソートさせます。(要素名に-(マイナス)をつけると降順になる)

```
ps aux --sort -rss
```

![スクリーンショット 2014-11-14 0.42.21.png](https://qiita-image-store.s3.amazonaws.com/0/58014/77633047-d2aa-4d16-8efb-5b8ee1ddff57.png)



<br /><br /><br />
お読みいただきありがとうございます。追記すべき事項があったら随時追記していきます。
Wercker 基礎 ＋ 外部構成図 ＋ 内部構成図 #wercker

# Wercker 基礎 ＋ 外部構成図 ＋ 内部構成図 #wercker
## 概要
継続的デリバリプラットフォーム Wercker の基礎と外部構成図、内部構成図

## Wercker とは？
Wercker は頻繁にテストやデプロイを行う開発者のための継続的デリバリ（ CD ）プラットフォーム。
継続的デプロイを利用することで、エンジニアはソフトウェア開発のおけるリスク・浪費を減らす。

## Wercker 外部構成図
外部とのやりとりに視点をおいた場合の Wercker の構成は以下のようになっています。
git リポジトリへの push をトリガーとして、 wercker を呼び出し、
Buildpipeline にて各種処理を実行し、 
クラウドへのデプロイを行います。

![basic_structures.png](https://qiita-image-store.s3.amazonaws.com/0/43480/7c1810cb-a35d-c3ce-eef5-e00c0c586e40.png)

※最後に、 Wercker 内部に視点をおいた構成図を紹介します。

## Wercker pipeline
Wercker にはアプリケーションを配布するためのステップとフェーズのセットからなる
パイプラインという概念があります。
続いて、 Wercker pipeline の構成要素について説明します

### Builds
Builds は wercker pipeline の Build のための各ステップの実行結果です。
Builds が成功すれば、配布可能なパッケージを作成します。
wercker pipeline は `wercker.yml` に記述します。
wercker pipeline は Box と Service からなるサンドボックス環境の中で実行されます。

### Git Push
各 `git push` に対して、 wercker は branch の種類を問わず
新しい Build をトリガーします。
wercker は SSH鍵 でリポジトリを clone し、Build を実行します。

### Box
wercker pipeline を実行する Box は、
OS と パッケージのセットからなります。

Wercker は boxes を用意してくれていますが、
自分で作成することも可能です。

Box の利用は、 `wercker.yml` の box 要素で記述します。
ruby の Box を使う場合は、以下のようになります。

~~~yaml
box: wercker/ruby
~~~

### Services
Services は DB ・ メッセージキュー など他のソフトウェアプロセスを実行する
Box です。
Services は Buildpipeline 側で作られる。

Service の指定は、 `wercker.yml` の services 要素で記述します。
ruby の Box と MySQL の Service を使う場合は、以下のようになります。

~~~yaml
box: wercker/ruby
services:
    - wercker/mysql
~~~

サービスを追加すると、該当サービス向けの新たな環境変数をダッシュボードから設定可能になります。

### Steps
Build の Steps は `wercker.yml` の build 配下に定義します。

~~~yaml
box: wercker/ruby
build:
    steps:
        - bundle-install
        - script:
            name: Run RSpec
            code: bundle exec rspec spec
~~~

`bundle-install` は wercher の組み込み機能で、 `bundle install` を実行します。
`script` は `name` と `code` のセットで利用し、
`name` は、 build の実行時の GUI 表示名に利用されます。
`code` はシェルを記述できます。

steps は順次実行されます。

### Package
Package は build の最後に実行され、デプロイ可能なパッケージを作成します。
このパッケージは、 deployment pipeline の入力にすることができます。

middleman で静的サイトを build して、 heroku にデプロイする
`wercker.yml` が下記になります。

~~~
build:
    steps:
        # Execute the bundle install step, a step provided by wercker
        - bundle-install
        # Execute a custom script step.
        - script:
            name: middleman build
            code: bundle exec middleman build --verbose
deploy:
    steps:
        - heroku-deploy
~~~

### Deploys
deploy pipeline は、 build をパスしたパッケージを配布します。
deploy pipeline は `wercker.yml` の deploy 要素を利用して記述します。

### Wercker 内部構成図

![micro_structures.png](https://qiita-image-store.s3.amazonaws.com/0/43480/d6653e9b-a173-3911-98a1-f8c2bae55ca3.png)

## 参照
* [Wercker](http://wercker.com/)
* [Gviz gem](https://github.com/melborne/Gviz)
    * 当記事の図は Gviz gem を利用して作成しています
Wercker + Bitbucket で Ruby のプロジェクトの CI の疎通確認を行う #ruby #wercker #bitbucket

# Wercker + Bitbucket で Ruby のプロジェクトの CI の疎通確認を行う #ruby #wercker #bitbucket
## 概要
Wercker + Bitbucket で Ruby のプロジェクトの CI を疎通させます

## 前提
* Bitbucket は登録済み
* 事前に ci_sample というリポジトリを作成。簡単な実装とテストを用意しておく
    * 適当な Ruby のプログラムを実装します
    * 適当な Ruby のプログラムのテストコード（ rspec ）を実装します
    * Gemfile を用意しておきます( rspec のみ指定)  

~~~ruby
# A sample Gemfile
source "https://rubygems.org"

gem 'rspec', '~> 2.14.1'
~~~

## 手順
* Wercker にユーザー登録
* Apps + Add を選択
    ![1select_apps.png](https://qiita-image-store.s3.amazonaws.com/0/43480/84ecc0af-3bb8-cc0d-567a-77da6698b3dc.png)

* Choose a Git Provider
    * Bitbucket を選択します
        ![1choose_git_provider.png](https://qiita-image-store.s3.amazonaws.com/0/43480/a5aeb71a-6f3e-40eb-87f6-2a17ebd59ed6.png)
* Select a repository
    * ci_sample を選択
        ![1select_repository.png](https://qiita-image-store.s3.amazonaws.com/0/43480/9defaec3-f895-3459-a8d4-3d6d303ffa2b.png)
* Configure access
    * Add the deploy key to the selected repository for me を選択します
        ![4configure_access.png](https://qiita-image-store.s3.amazonaws.com/0/43480/6731afd3-935f-ffce-4b4a-c4081ab1fc4b.png)
    * Bitbucket のデプロイ鍵設定が反映されたことを確認できます
        ![5configure_access.png](https://qiita-image-store.s3.amazonaws.com/0/43480/889f4edc-c7bd-a40e-97b3-f83689f03d5a.png)
* Setup your wercker.yml
    * Bitbucket のリポジトリのルートディレクトリに wercker.yml を追加します
    * wercker.yml を下記のように編集します

~~~ruby
box: wercker/ruby
build:
    steps:
        - script:
            name: Bundle install
            code: bundle install
        - script:
            name: Run RSpec
            code: bundle exec rspec spec
~~~

* Finish を選択
* Bitbucket に push をします
* push をトリガーに、 wercker が実行されます。
* 結果を確認します
    wercker.yml で指定した name が表示されています
        ![6deploy_result.png](https://qiita-image-store.s3.amazonaws.com/0/43480/2110edda-2632-6053-b884-19b29dcc8492.png)
* Run RSpec の部分をクリックすると、結果が表示されます  
    ![7rspec_result.png](https://qiita-image-store.s3.amazonaws.com/0/43480/c25e06ff-7245-b795-3103-9884c7d28666.png)

## 参照
[Wercker](http://wercker.com/)
Elixir Comprehensions(内包表記) Scope #elixir

# Elixir Comprehensions(内包表記) Scope

## 概要
Elixir の Comprehensions(内包表記) 内の変数スコープについて

Comprehensions(内包表記) 内の変数は、内包処理内部のみに影響し、
外部には影響を与えません。

## サンプル

~~~elixir
outer = "outer"
result = for outer <- Enum.to_list(1..10), do: outer * 2
IO.inspect result
IO.inspect outer
~~~

## 出力

~~~
[2, 4, 6, 8, 10, 12, 14, 16, 18, 20]
"outer"
~~~

## 参照
* [Enum to_list](http://elixir-lang.org/docs/stable/elixir/Enum.html#to_list/1)
* [Elixir getting_started 18 Comprehensions](http://elixir-lang.org/getting_started/18.html)
Windows上でGolangのコードをクロスコンパイルする

自分の環境での作業手順なので最小手順としては抜けがあるかも。

- golangをインストールして実行できる状態まで設定する
- [Chocolately](https://chocolatey.org/)でmingwをインストールする `choco install mingw`
- [mitchellh/gox](https://github.com/mitchellh/gox)をインストールする `go get github.com/mitchellh/gox`
- `gox -build-toolchain`
- コンパイルするコードのあるディレクトリで `gox`
- 各環境向けのバイナリができる
PHPの配列を安全にJSONシリアライズする

以前 [PHPのlist()はタプル展開のための機能 - Qiita](http://qiita.com/tadsan/items/0beaf61747397c1e3db8) にも書きましたが、PHPの[配列](http://php.net/manual/language.types.array.php)型は非常に多くの機能はあり、0から始まる連番のインデックスを持つ「配列」としての側面と、ほかの言語で連想リスト(Association list, alist)やハッシュマップ、辞書などと呼ばれるコレクションとしての側面を合せ持ちます。

この仕様はとてもいいところと悪いところがあるのですが、PHPの型をPHP以外に出力(シリアライズ)するときには若干困ることがあります。たとへば、PHPの配列を`json_encode`でJSONにシリアライズするときなどです。

## 問題

```php
<?php

$num = range(1, 10);
echo json_encode($num).PHP_EOL;
// => [1,2,3,4,5,6,7,8,9,10]
// これは想定通り

$num = range(1, 10);
// 奇数ならtrueを返す函数
$is_odd = function ($n) { return $n % 2 === 1; };
$num = array_filter($num, $is_odd);
echo json_encode($num).PHP_EOL;
// => {"0":1,"2":3,"4":5,"6":7,"8":9}
// あれれー
```

## 解決策

`array_values`です… 配列に`array_values`を掛けると、純粋な配列であることを保証できるようになります… かつ、最初から連番の配列に`array_values`を使っても安全です…

逆に、数値で連番であるがJSONにはオブジェクト型にしてやりたい、といふときは`json_encode`に`JSON_FORCE_OBJECT`フラグを立ててやるといいです。

```php
<?php
/**
 * @param  array  $value
 * @param  int    $options
 * @param  int    $depth
 * @return string JSON
 * @link   http://php.net/manual/function.json-encode.php
 */
function json_encode_array(array $value$options = 0, $depth = 512)
{
    return json_encode(array_values($value, $options, $depth));
}

/**
 * @param  array|object $value
 * @param  int    $options
 * @param  int    $depth
 * @return string JSON
 * @link   http://php.net/manual/function.json-encode.php
 */
function json_encode_object($value, $options = 0, $depth = 512)
{
    $options |= JSON_FORCE_OBJECT;

    return json_encode($value, $options, $depth);
}
```

これでハッピーになれますね！

## おまけ

JSONを利用してるみなさまには釈迦に説法なのですが、[JSONの仕様](http://www.json.org/json-ja.html)によれば「ほかの言語で連想リスト(Association list, alist)やハッシュマップ、辞書などと呼ばれるコレクション」に相当する、 `{"key": "value"}` のようなものの名前(型)は「object」です。

ってことは、[`json_decode`](http://php.net/manual/ja/function.json-decode.php)に第二引数を渡さなかったときに、デフォルトで`stdClass`になるのも自然… ってそんなわけあるか`stdClass`はちょっとつらい。

幸ひにしてPHPの配列と`stdClass`はキャストで簡単に相互変換できるからいいんですけどね、いいんですけどね。

## あとがき

[PHP - 文字列配列から空文字を除去するバッドノウハウ - Qiita](http://qiita.com/tadsan/items/9a0ef5b4375a3701d73d) にも似たようなこと書いてた。

-----

## 補足

すっかり忘れてたんだけど`JSON_FORCE_OBJECT`フラグを立てると、要素も再帰的にオブジェクトになるので、場合によってはコレジャナイ結果を引き起すことがあるかも。ってわけで今回紹介した`json_encode_object`が役に立つことって少ないんじゃないですかね。
nvmインストールからnodeインストールまで (ubuntu)


## nvmインストール

```Bash
vagrant@vagrant-ubuntu-trusty-64:~$ curl https://raw.githubusercontent.com/creationix/nvm/v0.18.0/install.sh | bash
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
100  4058  100  4058    0     0    724      0  0:00:05  0:00:05 --:--:--  1319
=> Downloading nvm as script to '/home/vagrant/.nvm'

=> Appending source string to /home/vagrant/.bashrc
=> Close and reopen your terminal to start using nvm

vagrant@vagrant-ubuntu-trusty-64:~$ nvm -v
 nvm: command not found
```

ターミナルを閉じてから開け、か。なるほど。


```Bash
vagrant@vagrant-ubuntu-trusty-64:~$ nvm --version
0.18.0
```

## nodeインストール

```Bash
nvm install v0.10
nvm alias default 0.10
```

ここはmacと同じです。
２つ目のコマンドを入れないとターミナルを再度立ち上げた時（以下略）
Tex の Tips (自分はMacPortsでインストールされたTex-Liveを使用)


# そもそも論(Texの話題からはそれるけど)
Macportsで入れたVimとMacVimの違いとは？

# BibTeX置き場
## Mendeley
* .bibの原本は，Dropbox/Mendeley/bibtexに置いている

## texliveとの連携  
> sudo ln -s ~/Dropbox/Mendeley/bibtex ~/Library/texmf/bibtex/bib  

シンボリックリンクをはる
> sudo mktexlsr

すれば完成

# パッケージの入れ方
***.tds.zipを解凍して名前を変更したものを以下の置き場所に入れて，
> sudo mktexlsr

すればおけ？

## 置き場所
### ~/Library/texmf/tex/latex 以下に置くか
* いわゆるTEXMFHOME
* TEXMFHOME はユーザー個別の設定を保存する場所です。
* 今は**ここに置いている**

### /usr/local/texlive/texmf-local/tex/(MacPotrs使っている場合は，/opt/local/以下のところに) 以下に置くか
* いわゆるTEXMFLOCAL
* TEXMFLOCALとは、MacTeX/TeX Live 本体のアップデートに影響を受けないディレクトリで、そのコンピュータのユーザー全員に共通の設定を保存します。
* sudo権限がいるかなと

# PDF形式の図の挿入
## extractbbを自動的に実行させる
MacPotrs使っている場合は，/opt/local/etc/texmf/texmf.cnf.d/20options.cnfに(最後コンマつけるの忘れずに！)

```20options.cnf
shell_escape_commands = \
bibtex,bibtex8,bibtexu,upbibtex,biber,\
kpsewhich,\
makeindex,mendex,texindy,xindy,\
mpost,upmpost,\
repstopdf,epspdf,extractbb,
```
を追加して
> sudo /opt/local/libexec/texlive-update-cnf texmf.cnf

さらに
> sudo mktexlsr

を実行

とやってもできないいいいい！

> kpsewhich -var-value TEXMFLOCAL
/opt/local/share/texmf-local
kpsewhich -show-path=texmf.cnf
/opt/local/etc/texmf

* 参考 [TeX入門/図表 - TeX Wiki](http://oku.edu.mie-u.ac.jp/~okumura/texwiki/?TeX%E5%85%A5%E9%96%80%2F%E5%9B%B3%E8%A1%A8#a58e4bcb)
Redmieプラグインのロードの順番を制御する

"Redmineプラグインのロードの順番を制御できない" から引き続き。
http://qiita.com/ayweak/items/5390fb2dc3155a16320a

https://github.com/rails/rails/blob/v3.2.20/railties/lib/rails/plugin.rb 辺りを真似て、以下のようにしました。

https://gist.github.com/ayweak/f08a162866100bd09f86#file-30-redmine-rb-diff

```diff:config/initializers/30-redmine.rb.diff
--- a/redmine-2.6.0/config/initializers/30-redmine.rb   2014-10-22 04:13:09.000000000 +0900
+++ b/redmine-2.6.0/config/initializers/30-redmine.rb   2014-11-13 16:11:10.000000000 +0900
@@ -16,7 +16,7 @@
       openid_authentication_store : :memory
 end

-Redmine::Plugin.load
+Redmine::Plugin.load(Redmine::Configuration['plugins'] || ['all'])
 unless Redmine::Configuration['mirror_plugins_assets_on_startup'] == false
   Redmine::Plugin.mirror_assets
 end
```

https://gist.github.com/ayweak/f08a162866100bd09f86#file-plugin-rb-diff

```diff:lib/redmine/plugin.rb.diff
--- a/redmine-2.6.0/lib/redmine/plugin.rb       2014-10-22 04:13:10.000000000 +0900
+++ b/redmine-2.6.0/lib/redmine/plugin.rb       2014-11-13 16:11:10.000000000 +0900
@@ -137,8 +137,20 @@
       registered_plugins[id.to_sym].present?
     end

-    def self.load
-      Dir.glob(File.join(self.directory, '*')).sort.each do |directory|
+    def self.load(list)
+      paths = Dir.glob(File.join(self.directory, '*'))
+
+      if !list.include?('all') then
+        paths.delete_if do |p|
+          !list.include?(File.basename(p))
+        end
+      end
+
+      paths.sort_by! do |p|
+        [list.index(File.basename(p)) || list.index('all'), p]
+      end
+
+      paths.each do |directory|
         if File.directory?(directory)
           lib = File.join(directory, "lib")
           if File.directory?(lib)
```

あとは config/configuration.yml に以下のように書くと期待する動きをしてくれるっぽいです。

```yaml:config/configuration.yml
production:
  plugins:
    - plugin_x
    - plugin_p
    - all
```

Redmine や Rails の詳しいことは分かっていないので、何か問題がありそうな気がします。