Matrixにカスタムスタンプを設定する

yamako
360
0
0

Matrixにカスタムスタンプを設定する

Published at March 10, 2021 11:25 p.m.
Edited at March 23, 2021 7:29 p.m.

ちゃんとしたものを書く時間がとれそうにないので、とりあえずざっくり手順を書きます。

  • ためした場所: https://matrix.fedibird.com
  • 必要なもの
    • GitHubのアカウント
    • Matrix のアカウント
    • スタンプ画像いくつか

手順

まず、これを自分の GitHub リポジトリに fork してきます。
https://github.com/maunium/stickerpicker

そして上記を git clone してきます。

https://github.com/maunium/stickerpicker/wiki/Creating-packs に従って python の環境を整えて、スタンプ画像を Matrix のサーバにアップロードし、構成ファイルを git push します。

ちなみにアクセストークンの場所が超わかりづらいのですが、Element では 設定→ヘルプ の下の方に隠されてます。
https://webapps.stackexchange.com/questions/131056/how-to-get-an-access-token-for-element-riot-matrix

アップロードしている様子です。初回はサーバURLとアクセストークンをきかれます。

(.venv) [🐱:~/src/ywindish/stickerpicker (master %=)] $ sticker-pack --add-to-index web/packs/ ~/Downloads/nakayosi_oneesans
[Warning] Magic is not installed, using file extensions to guess mime types
Processing 01-arigato.png... uploaded
Processing 02-omedeto.png... uploaded
Processing 03-otsukare-natsuko.png... uploaded
Processing 04-niya.png... uploaded
Processing 05-ok.png... uploaded
Processing 06-nade.png... uploaded
Processing 07-eeee.png... uploaded
Processing 08-iine.png... uploaded
Processing 09-dame.png... uploaded
Processing 10-uresii.png... uploaded
Processing 11-ganbatte.png... uploaded
Processing 11-uhuhu.png... uploaded
Processing 12-hatarakitakunai.png... uploaded
Processing 13-tira.png... uploaded
Wrote pack to /Users/yamako/Downloads/nakayosi_oneesans/pack.json
Copied pack to web/packs/nakayosi_oneesans.json
Added nakayosi_oneesans.json to web/packs/index.json

つぎに https://github.com/maunium/stickerpicker/wiki/Hosting-on-GitHub-pages のとおりに fork してきたものを GitHub Pages で公開します。

こんなかんじでスタンプ一覧にアクセスできるようになります。
https://ywindish.github.io/stickerpicker/web/?theme=$theme

さいごに https://github.com/maunium/stickerpicker/wiki/Enabling-the-widget に従って自分の Matrix アカウントの開発者ツールで公開したサイトのURLなどを設定します。

開発者ツールは、チャットを入力するところで /devtools って打つと出てきます。

もとの m.widget がこれ。これが

{
	"10d7e2c4-d3c0-4823-8847-0948b40fcf75": {
		"content": {
			"type": "m.stickerpicker",
			"url": "https://scalar.vector.im/api/widgets/id/10d7e2c4-d3c0-4823-8847-0948b40fcf75/stickers.html",
			"name": "ステッカーパック"
		},
		"sender": "@yamako:matrix.fedibird.com",
		"state_key": "10d7e2c4-d3c0-4823-8847-0948b40fcf75",
		"type": "m.widget",
		"id": "10d7e2c4-d3c0-4823-8847-0948b40fcf75"
	}
}

こうなる

{
	"stickerpicker": {
		"content": {
			"type": "m.stickerpicker",
			"url": "https://ywindish.github.io/stickerpicker/web/?theme=$theme",
			"name": "yamako-sticker-pack",
			"data": {}
		},
		"sender": "@yamako:matrix.fedibird.com",
		"state_key": "stickerpicker",
		"type": "m.widget",
		"id": "stickerpicker"
	}
}

これで保存すると自作スタンプに置き換わってるはずです。


2021/03/23追記: 元の設定の URL 部分を自作のものに変更しただけでもいけそうでした。

{
  "type": "m.widgets",
  "content": {
    "10d7e2c4-d3c0-4823-8847-0948b40fcf75": {
      "content": {
        "type": "m.stickerpicker",
        "url": "https://ywindish.github.io/stickerpicker/web/?theme=$theme",
        "name": "ステッカーパック"
      },
      "sender": "@yamako:matrix.fedibird.com",
      "state_key": "10d7e2c4-d3c0-4823-8847-0948b40fcf75",
      "type": "m.widget",
      "id": "10d7e2c4-d3c0-4823-8847-0948b40fcf75"
    }
  }
}

既知の問題

  • もともとあったスタンプは使えなくなります
    • すでに送ったものは消えません。また、設定をもとにもどせばたぶんまた使えます
    • もともとあるやつはこの表にある Scalar というやつっぽいです ( fedibird.matrix.com の場合)。スタンプを新たに追加できないバージョンです
    • 共存させる方法もあるのかもしれませんがわかりません
  • 面倒くさいです
    • かなり面倒くさいです。気楽にスタンプを追加できるような仕組みをつくったら需要があるかもしれません。というか探せばすでにありそう