feat: add gisucus app

example/book.toml

@@ -59,3 +59,12 @@ announcement-banner.enable = true
 announcement-banner.id = "0.2.4"
 announcement-banner.theme = "default"
 announcement-banner.message = "*Version **0.2.4** now has relased, check it out [here](https://github.com/MR-Addict/mdbook-embedify/releases/tag/0.2.4).*"
+
+giscus.enable = true
+giscus.repo = "MR-Addict/mdbook-embedify"
+giscus.repo-id = "R_kgDOLCxX0Q"
+giscus.category = "General"
+giscus.category-id = "DIC_kwDOLCxX0c4CdGx"
+giscus.reactions-enabled = "1"
+giscus.theme = "light"
+giscus.lang = "en"

example/src/SUMMARY.md

@@ -7,6 +7,7 @@
 - [Third Party Apps](third-party/intro.md)
   - [Gist](third-party/gist.md)
   - [Youtube](third-party/youtube.md)
+  - [Giscus](third-party/giscus.md)
   - [Bilibili](third-party/bilibili.md)
   - [Codesandbox](third-party/codesandbox.md)
   - [Stackblitz](third-party/stackblitz.md)

example/src/global-embedding.md

@@ -27,6 +27,15 @@ announcement-banner.enable = true
 announcement-banner.id = "0.2.4"
 announcement-banner.theme = "default"
 announcement-banner.message = "*Version **0.2.4** now has relased, check it out [here](https://github.com/MR-Addict/mdbook-embedify/releases/tag/0.2.4).*"
+
+giscus.enable = true
+giscus.repo = "MR-Addict/mdbook-embedify"
+giscus.repo-id = "R_kgDOLCxX0Q"
+giscus.category = "General"
+giscus.category-id = "DIC_kwDOLCxX0c4CdGx-"
+giscus.reactions-enabled = "1"
+giscus.theme = "light"
+giscus.lang = "en"
 ```
 
 You can see more details about each app at its own page.

example/src/third-party/giscus.md

@@ -0,0 +1,54 @@
+## Options
+
+| Option            | Description      | Required | Default |
+| :---------------- | :--------------- | :------- | :------ |
+| repo              | Repository       | Yes      | - -     |
+| repo-id           | Repository ID    | Yes      | - -     |
+| category          | Category         | Yes      | - -     |
+| category-id       | Category ID      | Yes      | - -     |
+| reactions-enabled | Enable reactions | No       | 1       |
+| theme             | Theme            | No       | light   |
+| lang              | Language         | No       | en      |
+
+## Example
+
+<!-- embed ignore begin -->
+
+```text
+{% embed giscus repo="MR-Addict/mdbook-embedify" repo-id="R_kgDOLCxX0Q" category="General" category-id="DIC_kwDOLCxX0c4CdGx-" theme="light" %}
+```
+
+<!-- embed ignore end -->
+
+This book's giscus is enabled, you can see it at the bottom of this page. And you can also have a try by commenting below.
+
+However, you may want to enable it for the whole book. You can do this by adding below options to `book.toml` file:
+
+```toml
+giscus.enable = true
+giscus.repo = "MR-Addict/mdbook-embedify"
+giscus.repo-id = "R_kgDOLCxX0Q"
+giscus.category = "General"
+giscus.category-id = "DIC_kwDOLCxX0c4CdGx"
+giscus.reactions-enabled = "1"
+giscus.theme = "light"
+giscus.lang = "en"
+```
+
+## Good to know
+
+Giscus is a comments system powered by GitHub Discussions. It's a great way to have discussions about our book. But it's only supported while your app is deployed. You can't see it if you open it with **file://** protocol.
+
+The simple way is to serve your book with a static server. For example:
+
+**python installed**
+
+```sh
+python -m http.server --directory book
+```
+
+**node.js installed**
+
+```sh
+npx serve book
+```

src/embed.rs

@@ -70,6 +70,29 @@ fn render_announcement_banner(config: &Config) -> String {
     utils::render_template("announcement-banner", &options)
 }
 
+fn render_giscus(config: &Config) -> String {
+    // get the config
+    let repo = utils::get_config_string(config, "giscus.repo", "");
+    let repo_id = utils::get_config_string(config, "giscus.repo-id", "");
+    let category = utils::get_config_string(config, "giscus.category", "");
+    let category_id = utils::get_config_string(config, "giscus.category-id", "");
+    let reactions_enabled = utils::get_config_string(config, "giscus.reactions-enabled", "1");
+    let theme = utils::get_config_string(config, "giscus.theme", "light");
+    let lang = utils::get_config_string(config, "giscus.lang", "en");
+
+    // render the template
+    let options = vec![
+        ("repo".to_string(), repo),
+        ("repo-id".to_string(), repo_id),
+        ("category".to_string(), category),
+        ("category-id".to_string(), category_id),
+        ("reactions-enabled".to_string(), reactions_enabled),
+        ("theme".to_string(), theme),
+        ("lang".to_string(), lang),
+    ];
+    utils::render_template("giscus", &options)
+}
+
 impl Preprocessor for Embed {
     fn name(&self) -> &str {
         "mdbook-embedify"
@@ -80,6 +103,7 @@ impl Preprocessor for Embed {
 
         let scroll_to_top = utils::get_config_bool(config, "scroll-to-top.enable");
         let announcement_banner = utils::get_config_bool(config, "announcement-banner.enable");
+        let giscus = utils::get_config_bool(config, "giscus.enable");
 
         book.for_each_mut(|item| {
             if let mdbook::book::BookItem::Chapter(chapter) = item {
@@ -97,6 +121,11 @@ impl Preprocessor for Embed {
                     let template = render_announcement_banner(config);
                     chapter.content.push_str(&template);
                 }
+                // render the global giscus comments
+                if giscus {
+                    let template = render_giscus(config);
+                    chapter.content.push_str(&template);
+                }
             }
         });
 

templates/giscus.html

@@ -0,0 +1,23 @@
+<style>
+  .giscus {
+    margin-top: 6rem;
+  }
+</style>
+
+<script
+  src="{% src|https://giscus.app/client.js %}"
+  data-repo="{% repo %}"
+  data-repo-id="{% repo-id %}"
+  data-category="{% category %}"
+  data-category-id="{% category-id %}"
+  data-mapping="title"
+  data-strict="0"
+  data-reactions-enabled="{% reactions-enabled|1 %}"
+  data-emit-metadata="0"
+  data-input-position="bottom"
+  data-theme="{% theme|light %}"
+  data-lang="{% lang|en %}"
+  data-loading="lazy"
+  crossorigin="anonymous"
+  async
+></script>