38ch blog

気になるから言いたい。

Github EnterpriseをSlackと連携させる方法

会社で無料でGithub Enterpriseが使えるっぽいので、Slackと連携させてみました。
その時の設定が少しトリッキーだったので書いときます。

Webhook URLの取得

Slackで
App&Integrations > 検索バーでGithubを検索 > Add Configuration > 連携チャンネル選択 > switch to unauthed mode
でWebhook URLを取得できます。

ポイントはswitch to unauther modeです。分かりにくいところにあります。
f:id:null368:20170124221356p:plain


GithubにWebhookの追加

取得したWebhook URLをGithubに登録してあげましょう。
Setting > Hooks & services > Add webhook
で登録できます。

Payload URLに先ほど取得したWebhook URL、Content typeはapplication/jsonで大丈夫です。画面下部ではGithubのどのイベントをSlackにポストするかを選択できます。

divタグでng-keyupを使う方法

Angularを使って、入力フォームに入力があった後にEnterを押すと、検索が走るようにするためにng-keyupってやつを使うんですが、それを今回divタグにつけたかったので、やり方を調べてみました。

まず、一般的なやり方

<input type="text" class="form-control" placeholder="キーワードで検索" ng-model="$ctrl.keyword" ng-keyup="$event.keyCode == 13 ? $ctrl.search() : null">

divにng-keyupをつけるときにはtabindex="1"もセットにしてあげてください。

<div ng-keyup="$event.keyCode == 13 ? $ctrl.search() : null" tabindex="1">
     
</div>

tabindex="1"をつけると、そのdivをクリックしたときに謎の枠線が表示されます。 枠線はcssで強制的に消すかして対応してください。

.temp {
    outline: none !important; 
}

以下参考ページ

javascript - Using AngularJS ngKeyup on a div rather than an input - Stack Overflow

jquery - Strange border on tabIndex on <p> element - Stack Overflow