Discourseプラグイン開発 - パート2 - プラグインアウトレットへの接続

[Discourse]

前回のチュートリアル: Developing Discourse Plugins - Part 1 - Create a basic plugin

---

はじめに: Handlebarsテンプレート

Discourseのクライアントアプリケーションは、Ember.js JavaScriptフレームワークを使用して記述されています。Emberは、すべてのHTMLテンプレートにHandlebarsを使用します。そのリンク先にテンプレート言語に関する優れた入門記事がありますので、必ず熟読してください。

問題点: Discourseユーザーインターフェースへの要素の追加

多くのプラグインは、Discourseのウェブインターフェースを追加および拡張する必要があります。私たちはこれを実現するためのメカニズムを提供しており、handlebarsテンプレートではこれをプラグインアウトレットと呼びます。

Discourseのhandlebarsテンプレートを閲覧すると、次のようなマークアップがよく見られます。

<PluginOutlet @name="edit-topic" />

これは「edit-topic」という名前のプラグインアウトレットを宣言しています。これはテンプレート内の拡張ポイントであり、プラグイン作成者が独自のhandlebarsマークアップを追加するために利用できます。

プラグインを作成する際は、変更したいDiscourseのhandlebarsテンプレート（.hbsファイル内）で <PluginOutlet />を探してください。もし存在しない場合は、私たちに拡張を依頼してください！良いユースケースがあれば喜んで追加します。それをより簡単かつ迅速に行うために、githubでプルリクエストを送信してください！

プラグインアウトレットが存在する場所の例を確認したい場合は、OSXまたはLinuxを使用している場合は次のコマンドを実行できます。

git grep "<PluginOutlet" -- "*.hbs"

また、Discourse Developer Toolbarを有効にすることで、Discourseサイト上にプラグインアウトレットを表示することもできます。ブラウザのコンソールでDiscourseフォーラムでenableDevTools()と入力し、ページ左側に表示されるプラグのアイコンをクリックするだけです。

プラグインアウトレットへの接続

追加したいプラグインアウトレットを見つけたら、それに対応するconnectorを作成する必要があります。コネクタは、ファイル名にconnectors/<outlet name>が含まれるhandlebarsテンプレートにすぎません。

たとえば、Discourseのhandlebarsテンプレートが次のような場合：

<PluginOutlet @name="evil-trout" />

connectors/evil-troutディレクトリ内に作成したhandlebarsファイルはすべて自動的に追加されます。したがって、次の内容でファイルを作成した場合：

plugins/hello/assets/javascripts/discourse/connectors/evil-trout/hello.hbs

内容：

<b>Hello World</b>

Discourseは、テンプレート内のそのポイントに<b>Hello World</b>を挿入します。

ファイル名をhello.hbsと呼んだことに注意してください – ファイル名の最後の部分は重要ではありませんが、すべてのプラグインで一意である必要があります。拡張したい内容を説明する名前にするのが便利です。これにより、将来のデバッグが容易になります。

トラブルシューティング

• コネクタの名前を二重に確認し、プラグイン名と完全に一致していることを確認してください。

詳細情報

Using Plugin Outlet Connectors from a Theme or Plugin

Discourse includes hundreds of Plugin Outlets which can be used to inject new content or replace existing contend in the Discourse UI. ‘Outlet arguments’ are made available so that content can be customized based on the context. Choosing an outlet To find the name of a plugin outlet, search Discourse core for “<PluginOutlet”, or use the plugin outlet locations theme component. (e.g. topic-above-posts). Wrapper outlets Some outlets in core look like <PluginOutlet @name="foo" />. These allow you…

---

シリーズの続き

パート1: プラグインの基本
パート2: このトピック
パート3: サイト設定
パート4: git設定
パート5: 管理者インターフェース
パート6: 受け入れテスト
パート7: プラグインの公開

---

このドキュメントはバージョン管理されています - 変更の提案はgithubで行ってください。

[kennym (Kenny Meyer)]

Is there a list of plugin outlets?

More specifically I would like to know if one could modify the “create topic” template?

[cpradio]

@kennym

More specifically I would like to know if one could modify the “create topic” template?

In what way? Add new fields to the composer area (like the tagging plugin does)?

[kennym (Kenny Meyer)]

Yes, that’s what I am searching for.

[eviltrout (Robin Ward)]

I’d take a look at the tagging plugin then. It might have all you want!

[Andrew_Byrne]

@eviltrout is there a way to output directly to JSON.
basically creating a new API endpoint?

[Andrew_Byrne]

Ahhhhhhhh. new to this whole “ruby fad”
I have a partial solution that i’ll detail in:

Multiple topics in single API request

Using the Discourse API is pretty cool and I’ve used it to provide a number of custom interrogations in related sites. One thing that has caused me some issues is the fact I need to make single requests on each topic via: GET discourse.foo/t/topicID/1234.json for most Discourse systems this is cool but I am blending results, ie requesting multiple topics and adding them to a single post feed. when the number increases the requests become… annoying. I’m looking for a solution something along t…

[andrewroth]

Hi Robin,

The plugin-outlet-locations plugin seems to declare all the connectors with a register_asset line in plugin.rb. Starting here: discourse-plugin-outlet-locations/plugin.rb at master · Mittineague/discourse-plugin-outlet-locations · GitHub

Is that a necessary step?

[eviltrout (Robin Ward)]

Nope - that’s not necessary. All .es6 and .hbs files are loaded automatically in plugins.

[kourou (Ilias)]

I am still trying to figure out how plugins in Discourse work and I could use a little help.

I would like to modify the timeline scroll bar (in the right side of each topic). Actually, what I need to do is add some stuff (image/banner) below the scroll bar.
What template should I edit? Is there an existing plugin-outlet for that?

Thank you,
Ilias

[1c7 (Cheng Zheng)]

2018-4-28 work for me!

1. Plugin Outlet name

2. Code

3. Result

[sarahann (Sarah)]

This guide is great! I had my plugin showing in the /admin/plugins quite easily.

I was wondering though, how do you delete items from a template?

For privacy reasons, I wanted to delete the export to csv button in the /admin/users/list/active as well as the show emails button. But I didn’t find a plugin outlet connector for those parts of the UI.

I was trying to overwrite the following templates

/users-list-show.hbs
/users-list.hbs

with my plugin outlet.

But creating these files
/var/www/discourse/plugins/[my-plugin]/assets/javascripts/admin/templates/users-list-show.hbs
/var/www/discourse/plugins/[my-plugin]/assets/javascripts/admin/templates/users-list.hbs
and making changes to them didnt seem to work. Even after deleting the /var/www/discourse/tmp folder and restarting the server.

Is this the correct way to delete those buttons from the UI? Using css display: none; isn’t an option.

I feel like I am missing something really simple, any ideas?

[merefield (Robert)]

@sarahann

For privacy reasons, I wanted to delete the export to csv button in the /admin/users/list/active as well as the show emails button.

Not a direct technical answer to your question but why would you want to do that?

Only the admins can do this. They usually have full control of the server most likely anyway and could read the database, so hiding a button is a bit futile: emails will also show up in the Email logs and on your mail service logs. I’m afraid site admins are going to see a lot of email addresses!

Admins have full control, they see everything (except passwords presumably), so this is normal.

If you are an admin, get used to the responsibility which comes with knowing all of this!

[sarahann (Sarah)]

My concern was that moderators can access some things in the admin dashboard.
They can navigate to the ‘users’ tab and see the Export and the Show Emails buttons

We don’t want our moderators to be able to grab bulk emails like this.
I understand that the emails are visible on users profiles, but we didn’t want an easy way to get this information.

So I was trying to create a plugin that hides these buttons.

[merefield (Robert)]

Could be wrong, but this suggests it’s not an issue … have you Impersonated a Mod?

[sarahann (Sarah)]

Yes, the screenshot I took was from impersonating a mod.

We have a similar setup as the link you provided (Moderators ability to see emails inconsistent).

I’m not requesting the Discourse team makes any changes though, this isn’t an issue with Discourse.

I am trying customize Discourse for our situation. I was hoping that using a plugin outlet and referencing the files within that plugin was the right way to overwrite a template in Discourse. I just wasn’t able to successfully overwrite these files:

/users-list-show.hbs
/users-list.hbs

My changes never showed up. So I thought this plugin outlet topic could help

[merefield (Robert)]

Perhaps someone else can chime in, but I’ve always seen Outlets as additive. You may need an override technique instead (via javascript/Ember). I’m still learning this myself :).

[Mittineague]

I’m thinking that if overriding a template is the goal that it might be better to do this with a theme instead of a plugin.

[sarahann (Sarah)]

I was thinking that as well, but I didn’t want a user to swap their theme and be able to get different functionality. So I figured a plugin outlet would do the trick

[pfaffman (Jay Pfaffman)]

I think you can probably hide those with CSS.