IMAGE: https://cdn-ak.f.st-hatena.com/images/fotolife/i/ikmbear/20210108/20210108111222.jpg
Todoistのタスクが完了したら草を生やしたい
Pixelaというサービスを知ってから、私の頭の中は「どう草を生やすか」で持ちきりです。
今回は私が日常的に使っているタスク管理アプリ「Todoist」と連携し、タスクが完了したら草を生やすようにしてみました。
なんでも草を生やしたがるお年頃
ikuma-t/todoist-graph | Pixela https://t.co/2eRIHRZq5W #Pixela
— Ikuma_t (@ikumatdkr) 2021年1月8日
Pixela側の設定
一億総草生やし社会の実現のためには、「いつものそれ」ではいけませんね。というわけで、Pixela側の設定も記載します。
手順としては次の通りです。全部ターミナルからcurlコマンドで実行しています。
- （ユーザー未登録の場合）ユーザー登録
- Todoist用のグラフの作成
- Webhook の登録
1. （ユーザー未登録の場合）ユーザ登録
$ curl -X POST https://pixe.la/v1/users -d '{"token":"{PASSWORD}", "username":"ikuma-t", "agreeTermsOfService":"yes", "notMinor":"yes"}'tokenの後ろの{PASSWORD}には任意のパスワードを、usernameにはグローバルに一意な自分のユーザIDを設定してください。
※以降も設定した値に置き換えて進めてください。
2. Todoist用のグラフの作成
$ curl -X POST https://pixe.la/v1/users/ikuma-t/graphs -H 'X-USER-TOKEN:{PASSWORD}' -d '{"id":"todoist-graph","name":"todoist-graph","unit":"updates","type":"int","color":"ichou","timezone":"Asia/Tokyo"}'指定できるパラメータはPOST - /v1/users//graphs - Pixela API Documentを参照してください。
Scrapboxの更新頻度で草を生やす際に芝生色を使ったので、今回はcolorにichouを指定しています。
3. Webhookの登録
$ curl -X POST https://pixe.la/v1/users/ikuma-t/webhooks -H 'X-USER-TOKEN:{PASSWORD}' -d '{"graphID":"todoist-graph","type":"increment"}' | pbcopyリク$1トすると
{"webhookHash":"xxxxx.....xxxxx","message":"Success.","isSuccess":true}こんな感じの値が返ってくるのですが、これをコピーするためにpbcopyをくっつけています（手動でコピーしてもいいんですけどね）。
実際に使うのは"webhookHash":"xxxxx.....xxxxx"の値だけです。
これでPixelaの設定は完了です！Todoistの設定をしましょう！
Todoist側の設定
Todoistのタスク完了時に草を生やすには2種類の方法があります。
| TodoistAPI | IFTTT | |
|---|---|---|
| 利用可能なTodoistプラン | プレミアム | 制限なし |
| 送信可能なタイミング | タスク（追加、更新、完了、完了解除、削除） メモ（追加、更新、削除） プロジェクト（追加、更新、削除、$1、$1解除） ラベル（追加、更新、削除） フィルタ（追加、更新、削除） リマインダー（発火時） | タスク（追加、完了 ※いずれもPJもしくはラベル指定可能） |
今回はタスクを完了したら草生やすだけなので、どちらを使っても変わらないです。
この記事では両方の方法をご紹介したいと思います。（ちなみにIFTTTを通さない分、少し反映が早い(?)ので私はTodoistAPIを使っています）
方法1：IFTTTを使う
※IFTTTのアカウントを持っている前提で話を進めます。
こちらから新しいアプリを作成していきます。
流れとしては
- If ThisにTodoistを設定する
- Then ThatにWebhookを設定する
以上です！
1. If ThisにTodoistを設定する
※初めての場合、IFTTTとTodoistの連携が必要です。今回は省略いたします。
1.If Thisからスタートします。
2.連携するサービスにTodoistを設定します。
3.トリガーを設定します。
各トリガーの説明は図の通りです。今回はタスク完了時を想定しているので、「New Completed Task」を設定します
4.Todoistのどのプロジェクトを監視対象にするか設定します。今回は全部のタスクを監視対象としたいので「Any Project」のままにしておきます。
5.Create triggerを押して設定を完了します。
2. Then ThatにWebhookを設定する
1.Then Thatからスタートします。
2.連携するサービスにWebhooksを設定します。
3.道なりに進みます。
4.リク$1トを設定します。
URLには以下の値を設定します。なお{webhookHashの値}は、Pixelaの設定「3. Webhookの登録」で取得したwebhookHashの値に読み替えてください。
https://pixe.la/v1/users/{ユーザID}/webhooks/{webhookHashの値}Pixelaはリク$1トボディを必要としない（セットしても無視される）ので、画像の通り、Bodyは空欄にしておきましょう。
POST - /v1/users//webhooks/ - Pixela API Document
ここまできたら、Create action > continue > finishと道なりに進んで設定完了です！
試しにtodoistでタスクを完了してみると、草が生えますwwww
方法2：TodoistAPIを使う（※Todoistプレミアムユーザ向け）
次にTodoistAPIを利用した設定方法を説明します。
1.Todoist App Management Consoleにアクセス
2.Create a new appを選択
3.Pixelaをアプリとして登録する。
App display nameはなんでもいいです。わかりやすいように今回はPixelaとし、Create Appを選択します。
4.Webhookの設定をする下にスクロールすると「Webhooks」の設定欄があるので、以下のように設定しActivate webhooksを選択します。
なお{webhookHashの値}は、Pixelaの設定「3. Webhookの登録」で取得したwebhookHashの値に読み替えてください。
| 項目 | 値 |
|---|---|
| Webhooks callback URL | https://pixe.la/v1/users/{ユーザID}/webhooks/{webhookHashの値} |
| Webhooks version | 8（デフォルト） |
| Watched Events | item:completed |
5.開発用のアクセス$1ンを発行する
「Webhooks」の少し上にcreate test tokenボタンがあるので、押してください。
ここまでできたら設定完了です！
試しにtodoistでタスクを完了してみると、草が生えますwwww
草はいいよね
草を生やすと、「は！今日も草生やさなきゃ！」とモチベーション維持に繋がって良いですね〜。
次は「Notionを更新したら草を生やす」に挑戦したいのですが、
- Notionからの更新通知受け取り先はSlackしか対応していない
- Slackに投稿されたことをトリガーにしようと思っても、Pixelaへのリク$1ト時に
challengeに失敗してしまう
という状況なので、ちょっと難しいかもですね。うまくできたらまたブログにまとめたいと思います！
