Mastodon に絵文字リアクションのサポートを追加した

発端

Mastodon のサーバーを運用しつつ、Fediverse の世界を楽しんでいるわけですが、Misskey の絵文字リアクションという隣の芝が青く見えてきました。そこでこんな投稿をしました。

Post by @su@fedi.fullstuck.net
View on Mastodon
Post by @su@fedi.fullstuck.net
View on Mastodon

2 番目の投稿に返事があり、kmyblue を教えていただきました。

Mastodon による絵文字リアクションの実装と言えば Fedibird が有名で、こちらしか知らなかったのですが、Fedibird は Mastodon ver.3 ベースであり、現行の ver.4 に移植するのはかなりきつそうでした。

その点、kmyblue は ver.4 ベースですので多少は楽できるかもと思い、Mastodon v4.4.7 に kmyblue の絵文字リアクション関係のコードを移植する方針で作業を開始しました。

方法

方法は至って単純です。

  1. Mastodon を fork する。
  2. fork した Mastodon を clone し、v4.4.7 に switch。
  3. kmyblue を clone する。
  4. WinMerge で両者を比較。
  5. kmyblue で grep emoji して該当するソースを検索。
  6. 前項で見つけたソースを WinMerge で差分を見て、関係ありそうなところを移植。
  7. kmyblue にしかないファイルについては、ファイル名に emoji が含まれてればそのままコピー。
  8. 一通り移植したら、bundle exec rails assets:precompile が通るか確認。
  9. bin/dev を実行してデバッグ。連合しなくてもわかるバグを取る。
  10. 連合しないとわからないバグを取るため AWS にデプロイ。
  11. AWS 環境でデバッグ。

という感じです。だいたい一週間でエラー無く動くようになりました。

動作

Mastodon から Misskey にリアクションを送る

  1. Misskey に投稿します。
  2. Mastodon に Misskey アカウントの投稿が流れてきます。リアクションします。
  3. リアクションしました。
  4. Misskey にリアクションが表示され、通知が来ます。

Misskey から Mastodon にリアクションを送る

  1. Mastodon に投稿します。
  2. Misskey に Mastodon アカウントの投稿が流れてきます。リアクションします。
  3. リアクションすると、MMastodon にリアクションが表示されます。
  4. Mastodon に通知が来ます。

ついでにやったこと

横長絵文字のサポート

kmyblue からの移植です。絵文字はマウスカーソルを hover すると 2 倍に大きくするようにしました。

カスタム:
オリジナル:

絵文字ピッカーを大きくする

オリジナルは 8 列ですが、これを 5 列にして絵文字を 40px にしました。

カスタム:
オリジナル:

ソースコード

ここにあります。Mastodon のリリースに合わせて rebase していく予定です。