diff --git a/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_1/index.html b/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_1/index.html index bbfa1f87..dc507055 100644 --- a/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_1/index.html +++ b/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_1/index.html @@ -1,2 +1,2 @@ -Bokehlist card 1 · DemoCards.jl
Edit on GitHub
+Bokehlist card 1 · DemoCards.jl
Edit on GitHub
diff --git a/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_2/index.html b/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_2/index.html index 459760ce..4e8f50e8 100644 --- a/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_2/index.html +++ b/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_2/index.html @@ -1,2 +1,2 @@ -Bokehlist card 2 · DemoCards.jl
Edit on GitHub
+Bokehlist card 2 · DemoCards.jl
Edit on GitHub
diff --git a/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/index.html b/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/index.html index cedb28bd..130ad6fd 100644 --- a/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/index.html +++ b/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/index.html @@ -1,2 +1,2 @@ -Bokehlist card 3 · DemoCards.jl
Edit on GitHub
+Bokehlist card 3 · DemoCards.jl
Edit on GitHub
diff --git a/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/index.html b/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/index.html index 40653457..a5efff67 100644 --- a/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/index.html +++ b/dev/bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/index.html @@ -1,2 +1,2 @@ -Bokehlist card 4 · DemoCards.jl
Edit on GitHub
+Bokehlist card 4 · DemoCards.jl
Edit on GitHub
diff --git a/dev/bokehlist/index.html b/dev/bokehlist/index.html index 2e59cdc0..e9cc7f26 100644 --- a/dev/bokehlist/index.html +++ b/dev/bokehlist/index.html @@ -40,4 +40,4 @@

some description here

- + diff --git a/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_1/index.html b/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_1/index.html index ce476994..3558dbd7 100644 --- a/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_1/index.html +++ b/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_1/index.html @@ -1,2 +1,2 @@ -Bulmagrid card 1 · DemoCards.jl
Edit on GitHub
+Bulmagrid card 1 · DemoCards.jl
Edit on GitHub
diff --git a/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_2/index.html b/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_2/index.html index 4ed0438d..425490ce 100644 --- a/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_2/index.html +++ b/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_2/index.html @@ -1,2 +1,2 @@ -Bulmagrid card 2 · DemoCards.jl
Edit on GitHub
+Bulmagrid card 2 · DemoCards.jl
Edit on GitHub
diff --git a/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/index.html b/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/index.html index b5093871..9d4a9703 100644 --- a/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/index.html +++ b/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/index.html @@ -1,2 +1,2 @@ -Bulmagrid card 3 · DemoCards.jl
Edit on GitHub
+Bulmagrid card 3 · DemoCards.jl
Edit on GitHub
diff --git a/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/index.html b/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/index.html index bab16fa0..98d6dbcf 100644 --- a/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/index.html +++ b/dev/bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/index.html @@ -1,2 +1,2 @@ -Bulmagrid card 4 · DemoCards.jl
Edit on GitHub
+Bulmagrid card 4 · DemoCards.jl
Edit on GitHub
diff --git a/dev/bulmagrid/index.html b/dev/bulmagrid/index.html index 8460d06e..e0f1384d 100644 --- a/dev/bulmagrid/index.html +++ b/dev/bulmagrid/index.html @@ -60,4 +60,4 @@

card image

- + diff --git a/dev/concepts/index.html b/dev/concepts/index.html index b0ed0e23..22defcc0 100644 --- a/dev/concepts/index.html +++ b/dev/concepts/index.html @@ -19,4 +19,4 @@ "quickstart.md", "array.md" ] -}
Note

🚧 Unlike DemoPage, a DemoSection does not yet support "theme" and "template" keys. A drawback of this design is that you have to put template contents into the "description" key, even if it contains hundreds of words.

Demo card

In simple words, a demo card consists of a link to its content and other relavent informations. In "grid" theme, it looks just like a card.

Depending on how your demos are written, there are two types of demo cards:

JuliaDemoCards are julia files that are specially handled by DemoCards to generate associated assets, for example, markdown files (.md) and jupyter notebooks (.ipynb).

Remarks

Currently, there're two special names used in DemoCards.jl:

To free you from managing/re-organizing demo structure, some decisions are made here:

Note

If you've specified orders in config.json, then for every new demos, you need to add its filename to order. DemoCards.jl isn't smart enough to guess what you really want.

+}
Note

🚧 Unlike DemoPage, a DemoSection does not yet support "theme" and "template" keys. A drawback of this design is that you have to put template contents into the "description" key, even if it contains hundreds of words.

Demo card

In simple words, a demo card consists of a link to its content and other relavent informations. In "grid" theme, it looks just like a card.

Depending on how your demos are written, there are two types of demo cards:

JuliaDemoCards are julia files that are specially handled by DemoCards to generate associated assets, for example, markdown files (.md) and jupyter notebooks (.ipynb).

Remarks

Currently, there're two special names used in DemoCards.jl:

To free you from managing/re-organizing demo structure, some decisions are made here:

Note

If you've specified orders in config.json, then for every new demos, you need to add its filename to order. DemoCards.jl isn't smart enough to guess what you really want.

diff --git a/dev/grid/grid_section_1/grid_subsection_1/grid_card_1/index.html b/dev/grid/grid_section_1/grid_subsection_1/grid_card_1/index.html index 89ae9984..022cc63e 100644 --- a/dev/grid/grid_section_1/grid_subsection_1/grid_card_1/index.html +++ b/dev/grid/grid_section_1/grid_subsection_1/grid_card_1/index.html @@ -1,2 +1,2 @@ -Grid card 1 · DemoCards.jl
Edit on GitHub
+Grid card 1 · DemoCards.jl
Edit on GitHub
diff --git a/dev/grid/grid_section_1/grid_subsection_1/grid_card_2/index.html b/dev/grid/grid_section_1/grid_subsection_1/grid_card_2/index.html index 09257a87..ced4ed8f 100644 --- a/dev/grid/grid_section_1/grid_subsection_1/grid_card_2/index.html +++ b/dev/grid/grid_section_1/grid_subsection_1/grid_card_2/index.html @@ -1,2 +1,2 @@ -Grid card 2 · DemoCards.jl
Edit on GitHub
+Grid card 2 · DemoCards.jl
Edit on GitHub
diff --git a/dev/grid/grid_section_1/grid_subsection_2/grid_card_3/index.html b/dev/grid/grid_section_1/grid_subsection_2/grid_card_3/index.html index 23a7055a..9ee1b47f 100644 --- a/dev/grid/grid_section_1/grid_subsection_2/grid_card_3/index.html +++ b/dev/grid/grid_section_1/grid_subsection_2/grid_card_3/index.html @@ -1,2 +1,2 @@ -Grid card 3 · DemoCards.jl
Edit on GitHub
+Grid card 3 · DemoCards.jl
Edit on GitHub
diff --git a/dev/grid/grid_section_1/grid_subsection_2/grid_card_4/index.html b/dev/grid/grid_section_1/grid_subsection_2/grid_card_4/index.html index 65a2d0bb..02f4f740 100644 --- a/dev/grid/grid_section_1/grid_subsection_2/grid_card_4/index.html +++ b/dev/grid/grid_section_1/grid_subsection_2/grid_card_4/index.html @@ -1,2 +1,2 @@ -Grid card 4 · DemoCards.jl
Edit on GitHub
+Grid card 4 · DemoCards.jl
Edit on GitHub
diff --git a/dev/grid/index.html b/dev/grid/index.html index d5268371..f64c8c50 100644 --- a/dev/grid/index.html +++ b/dev/grid/index.html @@ -28,4 +28,4 @@

some description here

card-cover-image

Grid card 4

- + diff --git a/dev/index.html b/dev/index.html index 635647b6..09888531 100644 --- a/dev/index.html +++ b/dev/index.html @@ -1,2 +1,2 @@ -Home · DemoCards.jl
Edit on GitHub

DemoCards.jl

Let's focus on writing good demos.

A plugin package to Documenter.jl that dynamically generate demos and associated assets for you.

Note

Please read the Documenter.jl documentation first if you're unfamiliar with the julia documentation system.

Package Features

  • a plugin package to Documenter.jl to manage all your demos.
  • folder structure is the demo structure.
  • minimal configuration.
  • CI friendly
  • support demos in markdown and julia format.
+Home · DemoCards.jl
Edit on GitHub

DemoCards.jl

Let's focus on writing good demos.

A plugin package to Documenter.jl that dynamically generate demos and associated assets for you.

Note

Please read the Documenter.jl documentation first if you're unfamiliar with the julia documentation system.

Package Features

  • a plugin package to Documenter.jl to manage all your demos.
  • folder structure is the demo structure.
  • minimal configuration.
  • CI friendly
  • support demos in markdown and julia format.
diff --git a/dev/list/index.html b/dev/list/index.html index 4ed54cc4..e91f22a9 100644 --- a/dev/list/index.html +++ b/dev/list/index.html @@ -40,4 +40,4 @@

some description here

- + diff --git a/dev/list/list_section_1/list_subsection_1/list_card_1/index.html b/dev/list/list_section_1/list_subsection_1/list_card_1/index.html index 1d151898..b2889d96 100644 --- a/dev/list/list_section_1/list_subsection_1/list_card_1/index.html +++ b/dev/list/list_section_1/list_subsection_1/list_card_1/index.html @@ -1,2 +1,2 @@ -List card 1 · DemoCards.jl
Edit on GitHub
+List card 1 · DemoCards.jl
Edit on GitHub
diff --git a/dev/list/list_section_1/list_subsection_1/list_card_2/index.html b/dev/list/list_section_1/list_subsection_1/list_card_2/index.html index fb7dad54..20e13762 100644 --- a/dev/list/list_section_1/list_subsection_1/list_card_2/index.html +++ b/dev/list/list_section_1/list_subsection_1/list_card_2/index.html @@ -1,2 +1,2 @@ -List card 2 · DemoCards.jl
Edit on GitHub
+List card 2 · DemoCards.jl
Edit on GitHub
diff --git a/dev/list/list_section_1/list_subsection_2/list_card_3/index.html b/dev/list/list_section_1/list_subsection_2/list_card_3/index.html index 62f12fd7..4b01a395 100644 --- a/dev/list/list_section_1/list_subsection_2/list_card_3/index.html +++ b/dev/list/list_section_1/list_subsection_2/list_card_3/index.html @@ -1,2 +1,2 @@ -List card 3 · DemoCards.jl
Edit on GitHub
+List card 3 · DemoCards.jl
Edit on GitHub
diff --git a/dev/list/list_section_1/list_subsection_2/list_card_4/index.html b/dev/list/list_section_1/list_subsection_2/list_card_4/index.html index 586a80dc..255c4a1f 100644 --- a/dev/list/list_section_1/list_subsection_2/list_card_4/index.html +++ b/dev/list/list_section_1/list_subsection_2/list_card_4/index.html @@ -1,2 +1,2 @@ -List card 4 · DemoCards.jl
Edit on GitHub
+List card 4 · DemoCards.jl
Edit on GitHub
diff --git a/dev/pluto/index.html b/dev/pluto/index.html index c6e12352..3ff8b72e 100644 --- a/dev/pluto/index.html +++ b/dev/pluto/index.html @@ -12,8 +12,8 @@ #> date = "2020-01-31" #> description = "this demo shows how you can pass extra demo information to DemoCards package. All these are optional." #> julia: "1.0" -#> hidden: "false"

See also: MarkdownDemoCard, JuliaDemoCard, DemoSection, DemoPage

source
DemoCards.save_democards — Method
save_democards(card_dir::AbstractString, card::PlutoDemoCard;
+#> hidden: "false"

See also: MarkdownDemoCard, JuliaDemoCard, DemoSection, DemoPage

source
DemoCards.save_democards — Method
save_democards(card_dir::AbstractString, card::PlutoDemoCard;
                project_dir,
                src,
                credit,
-               nbviewer_root_url)

Process the original pluto notebook and saves it.

The processing pipeline is:

  1. preprocess and copy source file
  2. generate markdown file
  3. copy the markdown file to cache folder
  4. insert header and footer to generated markdown file
source
+ nbviewer_root_url)

Process the original pluto notebook and saves it.

The processing pipeline is:

  1. preprocess and copy source file
  2. generate markdown file
  3. copy the markdown file to cache folder
  4. insert header and footer to generated markdown file
source diff --git a/dev/preview/index.html b/dev/preview/index.html index e3ca4262..644711d0 100644 --- a/dev/preview/index.html +++ b/dev/preview/index.html @@ -31,4 +31,4 @@ img = testimage("mandril") save("assets/mandril.png", img); #hide #md -# ![](assets/mandril.png)

Doing this with make_demos("testimages") would just fails because it is not a recognizable folder structure, but preview_demos("testimages") works nicely with this by creating a wrapper folder preview page:

preview random files

+# ![](assets/mandril.png)

Doing this with make_demos("testimages") would just fails because it is not a recognizable folder structure, but preview_demos("testimages") works nicely with this by creating a wrapper folder preview page:

preview random files

diff --git a/dev/quickstart/index.html b/dev/quickstart/index.html index fd8a3513..d9830c81 100644 --- a/dev/quickstart/index.html +++ b/dev/quickstart/index.html @@ -84,4 +84,4 @@ │ ├── Project.toml │ └── src/ ├── src/ -└── test/ +└── test/ diff --git a/dev/quickstart/usage_example/basics/configure_card/index.html b/dev/quickstart/usage_example/basics/configure_card/index.html index 2e3f2f5d..00df8a12 100644 --- a/dev/quickstart/usage_example/basics/configure_card/index.html +++ b/dev/quickstart/usage_example/basics/configure_card/index.html @@ -6,4 +6,4 @@ author: "[Johnny Chen](https://github.com/johnnychen94); Jane Doe" date: 2020-09-13 description: This demo show you how to pass additional meta info of card to DemoCards.jl ----

As you can see, if configured, there will be badges for author and date info. If there are multiple authors, they could be splitted by semicolon ;. For example, author: Jane Doe; John Roe would generate two author badges.

Tip

If author is configured as markdown url format, then the generated badge will be clickable.

Warning

A badly formatted YAML frontmatter will currently trigger a build failure with perhaps hard to understand error. Sometimes, you need to assist YAML parser by explicitly quoting the content with "". See the author field above as an instance.

This page was generated using DemoCards.jl.

+---

As you can see, if configured, there will be badges for author and date info. If there are multiple authors, they could be splitted by semicolon ;. For example, author: Jane Doe; John Roe would generate two author badges.

Tip

If author is configured as markdown url format, then the generated badge will be clickable.

Warning

A badly formatted YAML frontmatter will currently trigger a build failure with perhaps hard to understand error. Sometimes, you need to assist YAML parser by explicitly quoting the content with "". See the author field above as an instance.

This page was generated using DemoCards.jl.

diff --git a/dev/quickstart/usage_example/basics/configure_sec_and_page/index.html b/dev/quickstart/usage_example/basics/configure_sec_and_page/index.html index f6e5608b..0fd871db 100644 --- a/dev/quickstart/usage_example/basics/configure_sec_and_page/index.html +++ b/dev/quickstart/usage_example/basics/configure_sec_and_page/index.html @@ -25,4 +25,4 @@ "properties":{ "notebook": "false" } -}

Then all julia demos will not generate jupyter notebook unless it's override somewhere in the lower level, e.g, sec1/config.json or demo1.jl.

Only a subset of demo entries support the property propagation, currently supported items are:

This page was generated using DemoCards.jl.

+}

Then all julia demos will not generate jupyter notebook unless it's override somewhere in the lower level, e.g, sec1/config.json or demo1.jl.

Only a subset of demo entries support the property propagation, currently supported items are:

This page was generated using DemoCards.jl.

diff --git a/dev/quickstart/usage_example/basics/hidden_card/index.html b/dev/quickstart/usage_example/basics/hidden_card/index.html index ed7545d1..c4d543d2 100644 --- a/dev/quickstart/usage_example/basics/hidden_card/index.html +++ b/dev/quickstart/usage_example/basics/hidden_card/index.html @@ -1,4 +1,4 @@ This is a hidden card · DemoCards.jl
Edit on GitHub
+imresize(testimage("camera"); ratio=0.25)

This page was generated using DemoCards.jl and Literate.jl.

diff --git a/dev/quickstart/usage_example/basics/hide_your_card_from_index/index.html b/dev/quickstart/usage_example/basics/hide_your_card_from_index/index.html index be0da53c..786dccfe 100644 --- a/dev/quickstart/usage_example/basics/hide_your_card_from_index/index.html +++ b/dev/quickstart/usage_example/basics/hide_your_card_from_index/index.html @@ -2,4 +2,4 @@ Hide your card from page index layout · DemoCards.jl
Edit on GitHub

Hide your card from page index layout

There are cases that you want to hide one card in the generated page layout and only provide the entrance via reflink. For example, you have multiple version of demos and you only want to set the latest one as the default and provide legacy versions as reflink in the latest page.

This can be done by setting hidden: true in the frontmatter, for example:

---
 hidden: true
 id: hidden_card
----

By doing this, this page is not shown in the generated index page, the only way to visit it is through URLs. Usually, you can use Documenter's reflink feature to provide a reflink to the hidden page.

For example, [hidden card](@ref hidden_card) generates a reflink to the hidden page, note that it doesn't get displayed in quickstart index page.

Note

If you don't pass a index template to makedemos, i.e., makedemos(demodir), then it does not generate an index page for you. In this case, hidden keyword does not change anything, for obvious reasons.

This page was generated using DemoCards.jl.

+---

By doing this, this page is not shown in the generated index page, the only way to visit it is through URLs. Usually, you can use Documenter's reflink feature to provide a reflink to the hidden page.

For example, [hidden card](@ref hidden_card) generates a reflink to the hidden page, note that it doesn't get displayed in quickstart index page.

Note

If you don't pass a index template to makedemos, i.e., makedemos(demodir), then it does not generate an index page for you. In this case, hidden keyword does not change anything, for obvious reasons.

This page was generated using DemoCards.jl.

diff --git a/dev/quickstart/usage_example/basics/simple_markdown_demo/index.html b/dev/quickstart/usage_example/basics/simple_markdown_demo/index.html index 5657502e..39f3df84 100644 --- a/dev/quickstart/usage_example/basics/simple_markdown_demo/index.html +++ b/dev/quickstart/usage_example/basics/simple_markdown_demo/index.html @@ -1,2 +1,2 @@ -Simple markdown demo · DemoCards.jl
Edit on GitHub

Simple markdown demo

juliadocs

This demo show you what DemoCards.jl does to a markdown demo.

DemoCards.jl is a plugin package to Documenter.jl. Hence, in general, demos written in markdown format are directly passed to Documenter.jl without much preprocessing.

DemoCards.jl extracts some meta information from your demos:

  • The first title is extracted as the card title: the filename simple_markdown_demo.md gives the title "Simple markdown demo"
  • The first image link to Documenter.jl's logo is extracted as the cover image
  • The first paragraph is extracted as the description

When your mouse hover over the card, a description shows up, for example:

This becomes the simplest markdown demo!

This page was generated using DemoCards.jl.

+Simple markdown demo · DemoCards.jl
Edit on GitHub

Simple markdown demo

juliadocs

This demo show you what DemoCards.jl does to a markdown demo.

DemoCards.jl is a plugin package to Documenter.jl. Hence, in general, demos written in markdown format are directly passed to Documenter.jl without much preprocessing.

DemoCards.jl extracts some meta information from your demos:

  • The first title is extracted as the card title: the filename simple_markdown_demo.md gives the title "Simple markdown demo"
  • The first image link to Documenter.jl's logo is extracted as the cover image
  • The first paragraph is extracted as the description

When your mouse hover over the card, a description shows up, for example:

This becomes the simplest markdown demo!

This page was generated using DemoCards.jl.

diff --git a/dev/quickstart/usage_example/julia_demos/1.julia_demo/index.html b/dev/quickstart/usage_example/julia_demos/1.julia_demo/index.html index 9a283c34..5a99df7d 100644 --- a/dev/quickstart/usage_example/julia_demos/1.julia_demo/index.html +++ b/dev/quickstart/usage_example/julia_demos/1.julia_demo/index.html @@ -15,4 +15,4 @@ # cover: <cover> # id: <id> # description: <description> -#---
Tip

Comments are allowed before frontmatter, but it would only be appeared in the julia source codes. Normally, you may only want to add magic comments and license information before the YAML frontmatter.

This page was generated using DemoCards.jl and Literate.jl.

+#---
Tip

Comments are allowed before frontmatter, but it would only be appeared in the julia source codes. Normally, you may only want to add magic comments and license information before the YAML frontmatter.

This page was generated using DemoCards.jl and Literate.jl.

diff --git a/dev/quickstart/usage_example/julia_demos/2.cover_on_the_fly/index.html b/dev/quickstart/usage_example/julia_demos/2.cover_on_the_fly/index.html index 1ac848bf..42a633e4 100644 --- a/dev/quickstart/usage_example/julia_demos/2.cover_on_the_fly/index.html +++ b/dev/quickstart/usage_example/julia_demos/2.cover_on_the_fly/index.html @@ -22,4 +22,4 @@ -# This is inside the warning box +# This is inside the warning box # - # This is out side the warning box
Warning

This is inside the warning box

This is out side the warning box

This page was generated using DemoCards.jl and Literate.jl.

+ # This is out side the warning box
Warning

This is inside the warning box

This is out side the warning box

This page was generated using DemoCards.jl and Literate.jl.

diff --git a/dev/references/index.html b/dev/references/index.html index 35bb26ce..11cc8f29 100644 --- a/dev/references/index.html +++ b/dev/references/index.html @@ -35,7 +35,7 @@ │ ├── basic_demo_2_1.md │ └── basic_demo_2_2.md ├── config.json -└── template.md
Warning

A section should only hold either subsections or demo files. A folder that has both subfolders and demo files (e.g., *.md) is invalid.

See also: MarkdownDemoCard, DemoSection

source
DemoCards.DemoSection — Type
struct DemoSection <: Any
+└── template.md
Warning

A section should only hold either subsections or demo files. A folder that has both subfolders and demo files (e.g., *.md) is invalid.

See also: MarkdownDemoCard, DemoSection

source
DemoCards.DemoSection — Type
struct DemoSection <: Any
 DemoSection(root::String)

Constructs a demo section that holds either nested subsections or demo cards.

Fields

Besides the root path to the demo section folder root, this struct has some other fields:

  • cards: demo cards found in root
  • subsections: nested subsections found in root

Configuration

You can manage an extra config.json file to customize rendering of a demo section. Supported items are:

  • order: specify the cards order or subsections order. By default, it's case-insensitive alphabetic order.
  • title: specify the title of this demo section. By default, it's the folder name of root.
  • description: some header description that you want to add before demo cards.
  • properties: a dictionary of properties that can be propagated to its children items. The same properties in the children items, if exist, have higher priority.

The following is an example of config.json:

{
     "title": "learn by examples",
     "description": "some one-line description can be useful.",
@@ -64,7 +64,7 @@
 └── part2
     ├── config.json
     ├── demo_23.md
-    └── demo_24.md
Warning

A section should only hold either subsections or demo files. A folder that has both subfolders and demo files (e.g., *.md) is invalid.

See also: MarkdownDemoCard, DemoPage

source
DemoCards.JuliaDemoCard — Type
struct JuliaDemoCard <: AbstractDemoCard
+    └── demo_24.md
Warning

A section should only hold either subsections or demo files. A folder that has both subfolders and demo files (e.g., *.md) is invalid.

See also: MarkdownDemoCard, DemoPage

source
DemoCards.JuliaDemoCard — Type
struct JuliaDemoCard <: AbstractDemoCard
 JuliaDemoCard(path::String)

Constructs a julia-format demo card from existing julia file path.

The julia file is written in Literate syntax.

Fields

Besides path, this struct has some other fields:

  • path: path to the source julia file
  • cover: path to the cover image
  • id: cross-reference id
  • title: one-line description of the demo card
  • author: author(s) of this demo.
  • date: the update date of this demo.
  • description: multi-line description of the demo card
  • julia: Julia version compatibility
  • hidden: whether this card is shown in the generated index page
  • notebook: enable or disable the jupyter notebook generation. Valid values are true or false.

Configuration

You can pass additional information by adding a YAML front matter to the julia file. Supported items are:

  • cover: an URL or a relative path to the cover image. If not specified, it will use the first available image link, or all-white image if there's no image links.
  • description: a multi-line description to this file, will be displayed when the demo card is hovered. By default it uses title.
  • id: specify the id tag for cross-references. By default it's infered from the filename, e.g., simple_demo from simple demo.md.
  • title: one-line description to this file, will be displayed under the cover image. By default, it's the name of the file (without extension).
  • author: author name. If there are multiple authors, split them with semicolon ;.
  • date: any string contents that can be passed to Dates.DateTime. For example, 2020-09-13.
  • julia: Julia version compatibility. Any string that can be converted to VersionNumber
  • hidden: whether this card is shown in the layout of index page. The default value is false.

An example of the front matter (note the leading #):

# ---
 # title: passing extra information
 # cover: cover.png
@@ -74,7 +74,7 @@
 # description: this demo shows how you can pass extra demo information to DemoCards package. All these are optional.
 # julia: 1.0
 # hidden: false
-# ---

See also: MarkdownDemoCard, PlutoDemoCard, DemoSection, DemoPage

source
DemoCards.MarkdownDemoCard — Type
struct MarkdownDemoCard <: AbstractDemoCard
+# ---

See also: MarkdownDemoCard, PlutoDemoCard, DemoSection, DemoPage

source
DemoCards.MarkdownDemoCard — Type
struct MarkdownDemoCard <: AbstractDemoCard
 MarkdownDemoCard(path::String)

Constructs a markdown-format demo card from existing markdown file path.

Fields

Besides path, this struct has some other fields:

  • path: path to the source markdown file
  • cover: path to the cover image
  • id: cross-reference id
  • title: one-line description of the demo card
  • author: author(s) of this demo.
  • date: the update date of this demo.
  • description: multi-line description of the demo card
  • hidden: whether this card is shown in the generated index page

Configuration

You can pass additional information by adding a YAML front matter to the markdown file. Supported items are:

  • cover: an URL or a relative path to the cover image. If not specified, it will use the first available image link, or all-white image if there's no image links.
  • description: a multi-line description to this file, will be displayed when the demo card is hovered. By default it uses title.
  • id: specify the id tag for cross-references. By default it's infered from the filename, e.g., simple_demo from simple demo.md.
  • title: one-line description to this file, will be displayed under the cover image. By default, it's the name of the file (without extension).
  • author: author name. If there are multiple authors, split them with semicolon ;.
  • date: any string contents that can be passed to Dates.DateTime. For example, 2020-09-13.
  • hidden: whether this card is shown in the layout of index page. The default value is false.

An example of the front matter:

---
 title: passing extra information
 cover: cover.png
@@ -83,17 +83,17 @@
 date: 2020-01-31
 description: this demo shows how you can pass extra demo information to DemoCards package. All these are optional.
 hidden: false
----

See also: JuliaDemoCard, PlutoDemoCard, DemoSection, DemoPage

source
DemoCards.copy_assets_and_configs — Function
copy_assets_and_configs(src_page_dir, dst_build_dir=pwd())

copy only assets, configs and templates from src_page_dir to dst_build_dir. The folder structure is preserved under dst_build_dir/$(basename(src_page_dir))

order in config files are modified accordingly.

source
DemoCards.democard — Method
democard(path::String)::T

Constructs a concrete AbstractDemoCard instance.

The return type T is determined by the extension of the path to your demofile. Currently supported types are:

source
DemoCards.generate_or_copy_pagedir — Method
generate_or_copy_pagedir(src_path, build_dir)

copy the page folder structure from src_path to build_dir/$(basename(src_path). If src_path does not live in a standard demo page folder structure, generate a preview version.

source
DemoCards.get_default_order — Method

return case-insensitive alphabetic order

source
DemoCards.infer_pagedir — Method
infer_pagedir(card_path; rootdir="")

Given a demo card path, infer the outmost dir path that makes it a valid demo page. If it fails to find such dir path, return nothing.

The inference is done recursively, rootdir sets a stop condition for the inference process.

Warning

This inference may not be the exact page dir in trivial cases, for example:

testdir/
+---

See also: JuliaDemoCard, PlutoDemoCard, DemoSection, DemoPage

source
DemoCards.copy_assets_and_configs — Function
copy_assets_and_configs(src_page_dir, dst_build_dir=pwd())

copy only assets, configs and templates from src_page_dir to dst_build_dir. The folder structure is preserved under dst_build_dir/$(basename(src_page_dir))

order in config files are modified accordingly.

source
DemoCards.democard — Method
democard(path::String)::T

Constructs a concrete AbstractDemoCard instance.

The return type T is determined by the extension of the path to your demofile. Currently supported types are:

source
DemoCards.generate_or_copy_pagedir — Method
generate_or_copy_pagedir(src_path, build_dir)

copy the page folder structure from src_path to build_dir/$(basename(src_path). If src_path does not live in a standard demo page folder structure, generate a preview version.

source
DemoCards.get_default_order — Method

return case-insensitive alphabetic order

source
DemoCards.infer_pagedir — Method
infer_pagedir(card_path; rootdir="")

Given a demo card path, infer the outmost dir path that makes it a valid demo page. If it fails to find such dir path, return nothing.

The inference is done recursively, rootdir sets a stop condition for the inference process.

Warning

This inference may not be the exact page dir in trivial cases, for example:

testdir/
 └── examples
     └── sections
-        └── demo1.md

Both testdir and examples can be valid dir path for a demo page, this function would just return testdir as it is the outmost match.

source
DemoCards.input_bool — Method
input_bool(prompt)::Bool

Print prompt message and trigger user input for confirmation.

source
DemoCards.makedemos — Function
makedemos(source::String;
+        └── demo1.md

Both testdir and examples can be valid dir path for a demo page, this function would just return testdir as it is the outmost match.

source
DemoCards.input_bool — Method
input_bool(prompt)::Bool

Print prompt message and trigger user input for confirmation.

source
DemoCards.makedemos — Function
makedemos(source::String;
           root = "<current-directory>",
           src = "src",
           build = "build",
           branch = "gh-pages",
           edit_branch = "master",
           credit = true,
-          throw_error = false) -> page_path, postprocess_cb

Make a demo page for source and return the path to the generated index file.

Processing pipeline:

  1. analyze the folder structure source and loading all available configs.
  2. copy assets
  3. preprocess demo files and save it
  4. save/copy cover images
  5. generate postprocess callback function, which includes url-redirection.
Warning

By default, makedemos generates all the necessary files to docs/src/, this means that the data you pass to makedemos should not be placed at docs/src/. A recommendation is to put folders in docs/. For example, docs/quickstart is a good choice.

Inputs

  • source: dir path to the root page of your demos; relative to docs.

Outputs

  • page_path: path to demo page's index. You can directly pass it to makedocs.
  • postprocess_cb: callback function for postprocess. You can call postprocess_cb() after makedocs.
  • theme_assets: the stylesheet assets that you may need to pass to Documenter.HTML. When the demo page has no theme, it will return nothing.

Keywords

  • root::String: should be equal to Documenter's setting. Typically it is "docs" if this function is called in docs/make.jl file.
  • src::String: should be equal to Documenter's setting. By default it's "src".
  • build::String: should be equal to Documenter's setting. By default it's "build".
  • edit_branch::String: should be equal to Documenter's setting. By default it's "master".
  • branch::String: should be equal to Documenter's setting. By default it's "gh-pages".
  • credit::Bool: true to show a "This page is generated by ..." info. By default it's true.
  • throw_error::Bool: true to throw an error when the julia demo build fails; otherwise it will continue the build with warnings.

Examples

The following is the simplest example for you to start with:

# 1. preprocess and generate demo files to docs/src
+          throw_error = false) -> page_path, postprocess_cb

Make a demo page for source and return the path to the generated index file.

Processing pipeline:

  1. analyze the folder structure source and loading all available configs.
  2. copy assets
  3. preprocess demo files and save it
  4. save/copy cover images
  5. generate postprocess callback function, which includes url-redirection.
Warning

By default, makedemos generates all the necessary files to docs/src/, this means that the data you pass to makedemos should not be placed at docs/src/. A recommendation is to put folders in docs/. For example, docs/quickstart is a good choice.

Inputs

  • source: dir path to the root page of your demos; relative to docs.

Outputs

  • page_path: path to demo page's index. You can directly pass it to makedocs.
  • postprocess_cb: callback function for postprocess. You can call postprocess_cb() after makedocs.
  • theme_assets: the stylesheet assets that you may need to pass to Documenter.HTML. When the demo page has no theme, it will return nothing.

Keywords

  • root::String: should be equal to Documenter's setting. Typically it is "docs" if this function is called in docs/make.jl file.
  • src::String: should be equal to Documenter's setting. By default it's "src".
  • build::String: should be equal to Documenter's setting. By default it's "build".
  • edit_branch::String: should be equal to Documenter's setting. By default it's "master".
  • branch::String: should be equal to Documenter's setting. By default it's "gh-pages".
  • credit::Bool: true to show a "This page is generated by ..." info. By default it's true.
  • throw_error::Bool: true to throw an error when the julia demo build fails; otherwise it will continue the build with warnings.
  • filter_function::Function: the function is passed each potential DemoCard, and the card is excluded if the function returns false. By default, all potential cards are included.

Examples

The following is the simplest example for you to start with:

# 1. preprocess and generate demo files to docs/src
 examples, postprocess_cb, demo_assets = makedemos("examples")
 
 assets = []
@@ -113,13 +113,13 @@
         "basic",
         "advanced"
     ]
-}

For more details of how config.json is configured, please check DemoCards.DemoPage.

source
DemoCards.parse — Method
parse([T::Val], card::AbstractDemoCard)
+}

For more details of how config.json is configured, please check DemoCards.DemoPage.

source
DemoCards.parse — Method
parse([T::Val], card::AbstractDemoCard)
 parse(T::Val, contents)
-parse(T::Val, path)

Parse the content of card and return the configuration.

Currently supported items are: title, id, cover, description.

Note

Users of this function need to use haskey to check if keys are existed. They also need to validate the values.

source
DemoCards.preview_demos — Method
preview_demos(demo_path; kwargs...)

Generate a docs preview for a single demo card.

Return values

  • index_file: absolute path to the index file of the demo page. You can open this in your browser and see the generated demos.

Arguments

  • demo_path: path to your demo file or folder. It can be path to the demo file, the folder of multiple scripts. If standard demo page folder structure is detected, use it, and otherwise will create a preview version of it.

Parameters

  • theme: the card theme you want to use in the preview. By default, it infers from your page config file. To not generate index page, you could pass nothing to it. See also cardtheme for theme choices.
  • assets = String[]: this is passed to Documenter.HTML
  • edit_branch = "master": same to that in makedemos
  • credit = true: same to that in makedemos
  • throw_error = false: same to that in makedemos
  • require_html = true: if it needs to trigger the Documenter workflow and generate HTML preview. If set to false, the return value is then the path to the generated index.md file. This is an experimental keyword and should not be considered stable.
  • clean = true: whether you need to first clean up the existing sandbox building dir.
source
DemoCards.redirect_link — Method
redirect_link(src_file, source, root, src, build, edit_branch)

Redirect the "Edit On GitHub" link of generated demo files to its original url, without this a 404 error is expected.

source
DemoCards.save_cover — Method
save_cover(path::String, card::AbstractDemoCard)

process the cover image and save it.

source
DemoCards.save_democards — Method
save_democards(root::String, page::DemoPage; credit, nbviewer_root_url)

recursively process and save source demo file

source
DemoCards.save_democards — Method
save_democards(card_dir::String, card::JuliaDemoCard;
+parse(T::Val, path)

Parse the content of card and return the configuration.

Currently supported items are: title, id, cover, description.

Note

Users of this function need to use haskey to check if keys are existed. They also need to validate the values.

source
DemoCards.preview_demos — Method
preview_demos(demo_path; kwargs...)

Generate a docs preview for a single demo card.

Return values

  • index_file: absolute path to the index file of the demo page. You can open this in your browser and see the generated demos.

Arguments

  • demo_path: path to your demo file or folder. It can be path to the demo file, the folder of multiple scripts. If standard demo page folder structure is detected, use it, and otherwise will create a preview version of it.

Parameters

  • theme: the card theme you want to use in the preview. By default, it infers from your page config file. To not generate index page, you could pass nothing to it. See also cardtheme for theme choices.
  • assets = String[]: this is passed to Documenter.HTML
  • edit_branch = "master": same to that in makedemos
  • credit = true: same to that in makedemos
  • throw_error = false: same to that in makedemos
  • require_html = true: if it needs to trigger the Documenter workflow and generate HTML preview. If set to false, the return value is then the path to the generated index.md file. This is an experimental keyword and should not be considered stable.
  • clean = true: whether you need to first clean up the existing sandbox building dir.
source
DemoCards.redirect_link — Method
redirect_link(src_file, source, root, src, build, edit_branch)

Redirect the "Edit On GitHub" link of generated demo files to its original url, without this a 404 error is expected.

source
DemoCards.save_cover — Method
save_cover(path::String, card::AbstractDemoCard)

process the cover image and save it.

source
DemoCards.save_democards — Method
save_democards(root::String, page::DemoPage; credit, nbviewer_root_url)

recursively process and save source demo file

source
DemoCards.save_democards — Method
save_democards(card_dir::String, card::JuliaDemoCard;
                project_dir,
                src,
                credit,
-               nbviewer_root_url)

process the original julia file and save it.

The processing pipeline is:

  1. preprocess and copy source file
  2. generate ipynb file
  3. generate markdown file
  4. insert header and footer to generated markdown file
source
DemoCards.save_democards — Method
save_democards(card_dir::String, card::MarkdownDemoCard)

process the original markdown file and save it.

The processing pipeline is:

  1. strip the front matter
  2. insert a level-1 title and id
source
DemoCards.split_frontmatter — Method
split_frontmatter(contents) -> frontmatter, body

splits the YAML frontmatter out from markdown and julia source code. Leading # will be stripped for julia codes.

contents can be String or vector of String. Outputs have the same type of contents.

source
DemoCards.walkpage — Method
walkpage([f=identity], page; flatten=true, max_depth=Inf)

Walk through the page structure and apply function f to each of the item.

By default, the page structure is not preserved in the result. To preserve that, you could pass flatten=false to the function.

Examples

This is particulaly useful to generate information for the page structure. For example:

julia> page = DemoPage("docs/quickstart/");
+               nbviewer_root_url)

process the original julia file and save it.

The processing pipeline is:

  1. preprocess and copy source file
  2. generate ipynb file
  3. generate markdown file
  4. insert header and footer to generated markdown file
source
DemoCards.save_democards — Method
save_democards(card_dir::String, card::MarkdownDemoCard)

process the original markdown file and save it.

The processing pipeline is:

  1. strip the front matter
  2. insert a level-1 title and id
source
DemoCards.split_frontmatter — Method
split_frontmatter(contents) -> frontmatter, body

splits the YAML frontmatter out from markdown and julia source code. Leading # will be stripped for julia codes.

contents can be String or vector of String. Outputs have the same type of contents.

source
DemoCards.walkpage — Method
walkpage([f=identity], page; flatten=true, max_depth=Inf)

Walk through the page structure and apply function f to each of the item.

By default, the page structure is not preserved in the result. To preserve that, you could pass flatten=false to the function.

Examples

This is particulaly useful to generate information for the page structure. For example:

julia> page = DemoPage("docs/quickstart/");
 
 julia> walkpage(page; flatten=true) do item
     basename(item.path)
@@ -147,7 +147,7 @@
             "2.cover_on_the_fly.jl"
         ]
     ]
-]
source
DemoCards.CardThemes.cardtheme — Function
cardtheme(theme = "grid";
+]
source
DemoCards.CardThemes.cardtheme — Function
cardtheme(theme = "grid";
           root = "<current-directory>",
           src = "src",
-          destination = "democards") -> templates, stylesheet_path

For given theme, return the templates and path to stylesheet.

root and destination should have the same value to that passed to makedemos.

Available themes are:

  • "bulmagrid"
  • "bokehlist"
  • "grid"
  • "list"
source
+ destination = "democards") -> templates, stylesheet_path

For given theme, return the templates and path to stylesheet.

root and destination should have the same value to that passed to makedemos.

Available themes are:

source diff --git a/dev/search/index.html b/dev/search/index.html index 4541edfe..5d0bb2e4 100644 --- a/dev/search/index.html +++ b/dev/search/index.html @@ -1,2 +1,2 @@ -Search · DemoCards.jl

Loading search...

    +Search · DemoCards.jl

    Loading search...

      diff --git a/dev/search_index.js b/dev/search_index.js index e4b335b2..5653b74a 100644 --- a/dev/search_index.js +++ b/dev/search_index.js @@ -1,3 +1,3 @@ var documenterSearchIndex = {"docs": -[{"location":"list/list_section_1/list_subsection_1/list_card_2/#List-card-2","page":"List card 2","title":"List card 2","text":"","category":"section"},{"location":"list/list_section_1/list_subsection_1/list_card_2/","page":"List card 2","title":"List card 2","text":"","category":"page"},{"location":"list/list_section_1/list_subsection_1/list_card_2/","page":"List card 2","title":"List card 2","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"references/#package_references","page":"Package References","title":"Package References","text":"","category":"section"},{"location":"references/","page":"Package References","title":"Package References","text":"Modules = [DemoCards, DemoCards.CardThemes]\nOrder = [:type, :function]","category":"page"},{"location":"references/#DemoCards.DemoPage","page":"Package References","title":"DemoCards.DemoPage","text":"struct DemoPage <: Any\nDemoPage(root::String)\n\nConstructs a demo page object.\n\nFields\n\nBesides the root path to the demo page folder root, this struct has some other fields:\n\ntitle: page title\ntemplate: template content of the demo page.\nsections: demo sections found in root\n\nConfiguration\n\nYou can manage an extra config.json file to customize rendering of a demo page. Supported items are:\n\norder: specify the sections order. By default, it's case-insensitive alphabetic order.\ntemplate: path to template filename. By default, it's \"index.md\". The content of the template file should has one and only one {{{democards}}}.\ntheme: specify which card theme should be used to generate the index page. If not specified, it will default to nothing.\nstylesheet: relative path to the stylesheet file to override the default stylesheet provided by \"theme\".\ntitle: specify the title of this demo page. By default, it's the folder name of root. Will be override by template.\nproperties: a dictionary of properties that can be propagated to its children items. The same properties in the children items, if exist, have higher priority.\n\nThe following is an example of config.json:\n\n{\n \"template\": \"template.md\",\n \"theme\": \"grid\",\n \"stylesheet\": \"assets/gridstyle.css\",\n \"order\": [\n \"basic\",\n \"advanced\"\n ],\n \"properties\": {\n \"notebook\": \"false\",\n \"julia\": \"1.6\",\n \"author\": \"Johnny Chen\"\n }\n}\n\nExamples\n\nThe following is the simplest folder structure of a DemoPage:\n\ndemos\n└── basic\n ├── demo_1.md\n ├── demo_2.md\n ├── demo_3.md\n ├── demo_4.md\n ├── demo_5.md\n ├── demo_6.md\n ├── demo_7.md\n └── demo_8.md\n\nnote: Note\nA DemoPage doesn't manage demo files directly, so here you'll need a DemoSection basic to manage them.\n\nThe following is a typical folder structure of a DemoPage:\n\ndemos\n├── advanced\n│ ├── advanced_demo_1.md\n│ └── advanced_demo_2.md\n├── basic\n│ ├── part1\n│ │ ├── basic_demo_1_1.md\n│ │ └── basic_demo_1_2.md\n│ └── part2\n│ ├── config.json\n│ ├── basic_demo_2_1.md\n│ └── basic_demo_2_2.md\n├── config.json\n└── template.md\n\nwarning: Warning\nA section should only hold either subsections or demo files. A folder that has both subfolders and demo files (e.g., *.md) is invalid.\n\nSee also: MarkdownDemoCard, DemoSection\n\n\n\n\n\n","category":"type"},{"location":"references/#DemoCards.DemoSection","page":"Package References","title":"DemoCards.DemoSection","text":"struct DemoSection <: Any\nDemoSection(root::String)\n\nConstructs a demo section that holds either nested subsections or demo cards.\n\nFields\n\nBesides the root path to the demo section folder root, this struct has some other fields:\n\ncards: demo cards found in root\nsubsections: nested subsections found in root\n\nConfiguration\n\nYou can manage an extra config.json file to customize rendering of a demo section. Supported items are:\n\norder: specify the cards order or subsections order. By default, it's case-insensitive alphabetic order.\ntitle: specify the title of this demo section. By default, it's the folder name of root.\ndescription: some header description that you want to add before demo cards.\nproperties: a dictionary of properties that can be propagated to its children items. The same properties in the children items, if exist, have higher priority.\n\nThe following is an example of config.json:\n\n{\n \"title\": \"learn by examples\",\n \"description\": \"some one-line description can be useful.\",\n \"order\": [\n \"quickstart.md\",\n \"array.md\"\n ],\n \"properties\": {\n \"notebook\": \"false\",\n \"julia\": \"1.6\",\n \"author\": \"Johnny Chen\"\n }\n}\n\nExamples\n\nThe following is the simplest folder structure of a DemoSection:\n\nsection\n├── demo_1.md\n├── demo_2.md\n├── demo_3.md\n├── demo_4.md\n├── demo_5.md\n├── demo_6.md\n├── demo_7.md\n└── demo_8.md\n\nThe following is a typical nested folder structure of a DemoSection:\n\nsection\n├── config.json\n├── part1\n│ ├── demo_21.md\n│ └── demo_22.md\n└── part2\n ├── config.json\n ├── demo_23.md\n └── demo_24.md\n\nwarning: Warning\nA section should only hold either subsections or demo files. A folder that has both subfolders and demo files (e.g., *.md) is invalid.\n\nSee also: MarkdownDemoCard, DemoPage\n\n\n\n\n\n","category":"type"},{"location":"references/#DemoCards.JuliaDemoCard","page":"Package References","title":"DemoCards.JuliaDemoCard","text":"struct JuliaDemoCard <: AbstractDemoCard\nJuliaDemoCard(path::String)\n\nConstructs a julia-format demo card from existing julia file path.\n\nThe julia file is written in Literate syntax.\n\nFields\n\nBesides path, this struct has some other fields:\n\npath: path to the source julia file\ncover: path to the cover image\nid: cross-reference id\ntitle: one-line description of the demo card\nauthor: author(s) of this demo.\ndate: the update date of this demo.\ndescription: multi-line description of the demo card\njulia: Julia version compatibility\nhidden: whether this card is shown in the generated index page\nnotebook: enable or disable the jupyter notebook generation. Valid values are true or false.\n\nConfiguration\n\nYou can pass additional information by adding a YAML front matter to the julia file. Supported items are:\n\ncover: an URL or a relative path to the cover image. If not specified, it will use the first available image link, or all-white image if there's no image links.\ndescription: a multi-line description to this file, will be displayed when the demo card is hovered. By default it uses title.\nid: specify the id tag for cross-references. By default it's infered from the filename, e.g., simple_demo from simple demo.md.\ntitle: one-line description to this file, will be displayed under the cover image. By default, it's the name of the file (without extension).\nauthor: author name. If there are multiple authors, split them with semicolon ;.\ndate: any string contents that can be passed to Dates.DateTime. For example, 2020-09-13.\njulia: Julia version compatibility. Any string that can be converted to VersionNumber\nhidden: whether this card is shown in the layout of index page. The default value is false.\n\nAn example of the front matter (note the leading #):\n\n# ---\n# title: passing extra information\n# cover: cover.png\n# id: non_ambiguious_id\n# author: Jane Doe; John Roe\n# date: 2020-01-31\n# description: this demo shows how you can pass extra demo information to DemoCards package. All these are optional.\n# julia: 1.0\n# hidden: false\n# ---\n\nSee also: MarkdownDemoCard, PlutoDemoCard, DemoSection, DemoPage\n\n\n\n\n\n","category":"type"},{"location":"references/#DemoCards.MarkdownDemoCard","page":"Package References","title":"DemoCards.MarkdownDemoCard","text":"struct MarkdownDemoCard <: AbstractDemoCard\nMarkdownDemoCard(path::String)\n\nConstructs a markdown-format demo card from existing markdown file path.\n\nFields\n\nBesides path, this struct has some other fields:\n\npath: path to the source markdown file\ncover: path to the cover image\nid: cross-reference id\ntitle: one-line description of the demo card\nauthor: author(s) of this demo.\ndate: the update date of this demo.\ndescription: multi-line description of the demo card\nhidden: whether this card is shown in the generated index page\n\nConfiguration\n\nYou can pass additional information by adding a YAML front matter to the markdown file. Supported items are:\n\ncover: an URL or a relative path to the cover image. If not specified, it will use the first available image link, or all-white image if there's no image links.\ndescription: a multi-line description to this file, will be displayed when the demo card is hovered. By default it uses title.\nid: specify the id tag for cross-references. By default it's infered from the filename, e.g., simple_demo from simple demo.md.\ntitle: one-line description to this file, will be displayed under the cover image. By default, it's the name of the file (without extension).\nauthor: author name. If there are multiple authors, split them with semicolon ;.\ndate: any string contents that can be passed to Dates.DateTime. For example, 2020-09-13.\nhidden: whether this card is shown in the layout of index page. The default value is false.\n\nAn example of the front matter:\n\n---\ntitle: passing extra information\ncover: cover.png\nid: non_ambiguious_id\nauthor: Jane Doe; John Roe\ndate: 2020-01-31\ndescription: this demo shows how you can pass extra demo information to DemoCards package. All these are optional.\nhidden: false\n---\n\nSee also: JuliaDemoCard, PlutoDemoCard, DemoSection, DemoPage\n\n\n\n\n\n","category":"type"},{"location":"references/#DemoCards.copy_assets_and_configs","page":"Package References","title":"DemoCards.copy_assets_and_configs","text":"copy_assets_and_configs(src_page_dir, dst_build_dir=pwd())\n\ncopy only assets, configs and templates from src_page_dir to dst_build_dir. The folder structure is preserved under dst_build_dir/$(basename(src_page_dir))\n\norder in config files are modified accordingly.\n\n\n\n\n\n","category":"function"},{"location":"references/#DemoCards.democard-Tuple{String}","page":"Package References","title":"DemoCards.democard","text":"democard(path::String)::T\n\nConstructs a concrete AbstractDemoCard instance.\n\nThe return type T is determined by the extension of the path to your demofile. Currently supported types are:\n\nMarkdownDemoCard for markdown files\nJuliaDemoCard for julia files\nPlutoDemoCard for pluto files\nUnmatchedCard for unmatched files\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.generate_or_copy_pagedir-Tuple{Any, Any}","page":"Package References","title":"DemoCards.generate_or_copy_pagedir","text":"generate_or_copy_pagedir(src_path, build_dir)\n\ncopy the page folder structure from src_path to build_dir/$(basename(src_path). If src_path does not live in a standard demo page folder structure, generate a preview version.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.get_default_order-Tuple{DemoCards.DemoSection}","page":"Package References","title":"DemoCards.get_default_order","text":"return case-insensitive alphabetic order\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.infer_pagedir-Tuple{Any}","page":"Package References","title":"DemoCards.infer_pagedir","text":"infer_pagedir(card_path; rootdir=\"\")\n\nGiven a demo card path, infer the outmost dir path that makes it a valid demo page. If it fails to find such dir path, return nothing.\n\nThe inference is done recursively, rootdir sets a stop condition for the inference process.\n\nwarning: Warning\nThis inference may not be the exact page dir in trivial cases, for example:testdir/\n└── examples\n └── sections\n └── demo1.mdBoth testdir and examples can be valid dir path for a demo page, this function would just return testdir as it is the outmost match.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.input_bool-Tuple{Any}","page":"Package References","title":"DemoCards.input_bool","text":"input_bool(prompt)::Bool\n\nPrint prompt message and trigger user input for confirmation.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.makedemos","page":"Package References","title":"DemoCards.makedemos","text":"makedemos(source::String;\n root = \"\",\n src = \"src\",\n build = \"build\",\n branch = \"gh-pages\",\n edit_branch = \"master\",\n credit = true,\n throw_error = false) -> page_path, postprocess_cb\n\nMake a demo page for source and return the path to the generated index file.\n\nProcessing pipeline:\n\nanalyze the folder structure source and loading all available configs.\ncopy assets\npreprocess demo files and save it\nsave/copy cover images\ngenerate postprocess callback function, which includes url-redirection.\n\nwarning: Warning\nBy default, makedemos generates all the necessary files to docs/src/, this means that the data you pass to makedemos should not be placed at docs/src/. A recommendation is to put folders in docs/. For example, docs/quickstart is a good choice.\n\nInputs\n\nsource: dir path to the root page of your demos; relative to docs.\n\nOutputs\n\npage_path: path to demo page's index. You can directly pass it to makedocs.\npostprocess_cb: callback function for postprocess. You can call postprocess_cb() after makedocs.\ntheme_assets: the stylesheet assets that you may need to pass to Documenter.HTML. When the demo page has no theme, it will return nothing.\n\nKeywords\n\nroot::String: should be equal to Documenter's setting. Typically it is \"docs\" if this function is called in docs/make.jl file.\nsrc::String: should be equal to Documenter's setting. By default it's \"src\".\nbuild::String: should be equal to Documenter's setting. By default it's \"build\".\nedit_branch::String: should be equal to Documenter's setting. By default it's \"master\".\nbranch::String: should be equal to Documenter's setting. By default it's \"gh-pages\".\ncredit::Bool: true to show a \"This page is generated by ...\" info. By default it's true.\nthrow_error::Bool: true to throw an error when the julia demo build fails; otherwise it will continue the build with warnings.\n\nExamples\n\nThe following is the simplest example for you to start with:\n\n# 1. preprocess and generate demo files to docs/src\nexamples, postprocess_cb, demo_assets = makedemos(\"examples\")\n\nassets = []\nisnothing(demo_assets) || (push!(assets, demo_assets))\n\n# 2. do the standard Documenter pipeline\nmakedocs(format = Documenter.HTML(assets = assets),\n pages = [\n \"Home\" => \"index.md\",\n examples\n ])\n\n# 3. postprocess after makedocs\npostprocess_cb()\n\nBy default, it won't generate the index page for your demos. To enable it and configure how index page is generated, you need to create \"examples/config.json\", whose contents should looks like the following:\n\n{\n \"theme\": \"grid\",\n \"order\": [\n \"basic\",\n \"advanced\"\n ]\n}\n\nFor more details of how config.json is configured, please check DemoCards.DemoPage.\n\n\n\n\n\n","category":"function"},{"location":"references/#DemoCards.parse-Tuple{Val, DemoCards.AbstractDemoCard}","page":"Package References","title":"DemoCards.parse","text":"parse([T::Val], card::AbstractDemoCard)\nparse(T::Val, contents)\nparse(T::Val, path)\n\nParse the content of card and return the configuration.\n\nCurrently supported items are: title, id, cover, description.\n\nnote: Note\nUsers of this function need to use haskey to check if keys are existed. They also need to validate the values.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.preview_demos-Tuple{String}","page":"Package References","title":"DemoCards.preview_demos","text":"preview_demos(demo_path; kwargs...)\n\nGenerate a docs preview for a single demo card.\n\nReturn values\n\nindex_file: absolute path to the index file of the demo page. You can open this in your browser and see the generated demos.\n\nArguments\n\ndemo_path: path to your demo file or folder. It can be path to the demo file, the folder of multiple scripts. If standard demo page folder structure is detected, use it, and otherwise will create a preview version of it.\n\nParameters\n\ntheme: the card theme you want to use in the preview. By default, it infers from your page config file. To not generate index page, you could pass nothing to it. See also cardtheme for theme choices.\nassets = String[]: this is passed to Documenter.HTML\nedit_branch = \"master\": same to that in makedemos\ncredit = true: same to that in makedemos\nthrow_error = false: same to that in makedemos\nrequire_html = true: if it needs to trigger the Documenter workflow and generate HTML preview. If set to false, the return value is then the path to the generated index.md file. This is an experimental keyword and should not be considered stable.\nclean = true: whether you need to first clean up the existing sandbox building dir.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.redirect_link-NTuple{6, Any}","page":"Package References","title":"DemoCards.redirect_link","text":"redirect_link(src_file, source, root, src, build, edit_branch)\n\nRedirect the \"Edit On GitHub\" link of generated demo files to its original url, without this a 404 error is expected.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.save_cover-Tuple{String, DemoCards.AbstractDemoCard}","page":"Package References","title":"DemoCards.save_cover","text":"save_cover(path::String, card::AbstractDemoCard)\n\nprocess the cover image and save it.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.save_democards-Tuple{String, DemoCards.DemoPage}","page":"Package References","title":"DemoCards.save_democards","text":"save_democards(root::String, page::DemoPage; credit, nbviewer_root_url)\n\nrecursively process and save source demo file\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.save_democards-Tuple{String, DemoCards.JuliaDemoCard}","page":"Package References","title":"DemoCards.save_democards","text":"save_democards(card_dir::String, card::JuliaDemoCard;\n project_dir,\n src,\n credit,\n nbviewer_root_url)\n\nprocess the original julia file and save it.\n\nThe processing pipeline is:\n\npreprocess and copy source file\ngenerate ipynb file\ngenerate markdown file\ninsert header and footer to generated markdown file\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.save_democards-Tuple{String, DemoCards.MarkdownDemoCard}","page":"Package References","title":"DemoCards.save_democards","text":"save_democards(card_dir::String, card::MarkdownDemoCard)\n\nprocess the original markdown file and save it.\n\nThe processing pipeline is:\n\nstrip the front matter\ninsert a level-1 title and id\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.split_frontmatter-Tuple{String}","page":"Package References","title":"DemoCards.split_frontmatter","text":"split_frontmatter(contents) -> frontmatter, body\n\nsplits the YAML frontmatter out from markdown and julia source code. Leading # will be stripped for julia codes.\n\ncontents can be String or vector of String. Outputs have the same type of contents.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.walkpage-Tuple{DemoCards.DemoPage}","page":"Package References","title":"DemoCards.walkpage","text":"walkpage([f=identity], page; flatten=true, max_depth=Inf)\n\nWalk through the page structure and apply function f to each of the item.\n\nBy default, the page structure is not preserved in the result. To preserve that, you could pass flatten=false to the function.\n\nExamples\n\nThis is particulaly useful to generate information for the page structure. For example:\n\njulia> page = DemoPage(\"docs/quickstart/\");\n\njulia> walkpage(page; flatten=true) do item\n basename(item.path)\nend\n\n\"Quick Start\" => [\n \"simple_markdown_demo.md\",\n \"configure_card.md\",\n \"configure_sec_and_page.md\",\n \"hide_your_card_from_index.md\",\n \"hidden_card.jl\",\n \"1.julia_demo.jl\",\n \"2.cover_on_the_fly.jl\"\n]\n\nIf flatten=false, then it gives you something like this:\n\n\"Quick Start\" => [\n \"Usage example\" => [\n \"Basics\" => [\n \"simple_markdown_demo.md\",\n \"configure_card.md\",\n \"configure_sec_and_page.md\",\n \"hide_your_card_from_index.md\",\n \"hidden_card.jl\"\n ],\n \"Julia demos\" => [\n \"1.julia_demo.jl\",\n \"2.cover_on_the_fly.jl\"\n ]\n ]\n]\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.CardThemes.cardtheme","page":"Package References","title":"DemoCards.CardThemes.cardtheme","text":"cardtheme(theme = \"grid\";\n root = \"\",\n src = \"src\",\n destination = \"democards\") -> templates, stylesheet_path\n\nFor given theme, return the templates and path to stylesheet.\n\nroot and destination should have the same value to that passed to makedemos.\n\nAvailable themes are:\n\n\"bulmagrid\"\n\"bokehlist\"\n\"grid\"\n\"list\"\n\n\n\n\n\n","category":"function"},{"location":"quickstart/#quickstart","page":"Quick Start","title":"Quick Start","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This section describes how you can set up your demos easily in five lines of codes.","category":"page"},{"location":"quickstart/#Manage-your-demo-files","page":"Quick Start","title":"Manage your demo files","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"The rules of demo management are super simple:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"you need one demo page (folder) to hold all the demo files\na demo page has several demo sections (subfolders)\na demo section either\nhas other demo sections as nested subsections, or,\nhas the demo files (.md, .jl)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"In the following example:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"we have one demo page: \"quickstart\" –-> The current page you're looking at\n\"quickstart\" has one demo section: \"usage example\"\n\"usage example\" has two demo subsections: \"basics\" and \"julia_demos\"\n\"basics\" section holds all markdown demos\n\"julia_demos\" section holds all julia demos\n\"assets\" folders are ignored by DemoCards.jl\n\"index.md\" is where all demo cards are organized in (aka page template)\n\"config.json\" are configuration files (there are many of them!)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"docs/quickstart\n├── config.json\n├── index.md\n└── usage_example\n ├── basics\n │ ├── assets\n │ ├── config.json\n │ ├── configure_card.md\n │ ├── configure_sec_and_page.md\n │ ├── hidden_card.jl\n │ ├── hide_your_card_from_index.md\n │ └── simple_markdown_demo.md\n ├── config.json\n └── julia_demos\n ├── 1.julia_demo.jl\n ├── 2.cover_on_the_fly.jl\n ├── assets\n └── config.json","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This is the core idea, as long as you organize your folder in a structural way, DemoCards will read and process your demos to map your folder structure.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"using DemoCards\ncd(pkgdir(DemoCards)) do\n DemoCards.DemoPage(\"docs/quickstart\")\nend","category":"page"},{"location":"quickstart/#Deploy-your-demo-page","page":"Quick Start","title":"Deploy your demo page","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: democards workflow)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"The above image is the workflow of DemoCards. The deployment would be pretty easy:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"pass your demos to makedemos, so that they're preprocessed before passing into Documenter.jl\ngenerate the entire documentation using Documenter.makedocs\npost process the generated demos using callbacks.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"# 1. generate demo files\ndemopage, postprocess_cb, demo_assets = makedemos(\"demos\") # this is the relative path to docs/\n\n# if there are generated css assets, pass it to Documenter.HTML\nassets = []\nisnothing(demo_assets) || (push!(assets, demo_assets))\n\n# 2. normal Documenter usage\nformat = Documenter.HTML(assets = assets)\nmakedocs(format = format,\n pages = [\n \"Home\" => \"index.md\",\n demopage,\n ],\n sitename = \"Awesome demos\")\n\n# 3. postprocess after makedocs\npostprocess_cb()","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"In this example, there are three returned objects from makedemos:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"demopage: this is the relative path to the generated demos (typically in src), you can pass it to makedocs's pages.\npostprocess_cb: this is the callback function that you'll need to call after makedocs.\ndemo_assets: if available, it is the path to css file which you could pass to Documenter.HTML as style assets. If no theme is configured for your page, it will be `nothing.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"After it's set up, you can now focus on contributing more demos and leave other works to DemoCards.jl.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"🎉 The following example grids are generated using DemoCards! You can read them one by one for advanced configuration helps. Or you could read the Concepts page first to get better understanding about the DemoCards type system.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"","category":"page"},{"location":"quickstart/#Usage-example","page":"Quick Start","title":"Usage example","text":"","category":"section"},{"location":"quickstart/#Basics","page":"Quick Start","title":"Basics","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Demos can be written in typical markdown files with Documenter syntax, the only thing DemoCards does is to analyse the folder structure of your markdown files.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This demo show you what DemoCards.jl does to a markdown demo.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Simple markdown demo","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This demo show you how to pass additional meta info of card to DemoCards.jl","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Configure your card","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This demo shows you how to configure your demo page and sections.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Configure your section and page","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This demo shows you how to hide your card in page layout.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Hide your card from page index layout","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      ","category":"page"},{"location":"quickstart/#Julia-demos","page":"Quick Start","title":"Julia demos","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"It also supports julia source codes (powered by Literate.jl). With this you can not only show typical mardown demo to readers but also provide a downloadable source code and an online notebook link. Another advantage is that you can generate demo assets on the fly(e.g., cover pages, artifacts), which is not an easy task for typical markdown demos using Documenter alone.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This demo shows you how to write your demo in julia","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Write your demo in julia","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"this demo shows you how to generate cover on the fly","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Generate your cover on the fly","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      \n
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"
      ","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"","category":"page"},{"location":"quickstart/#Page-Themes","page":"Quick Start","title":"Page Themes","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"The page you are reading right now is the generated index page of demos. An index page always have cover images for the demos. An index page is only generated if you configure the theme option in your page config file (e.g., docs/quickstart/config.json):","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"{\n \"theme\": \"grid\"\n}","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"There are three themes available now:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"\"nothing\"(default): index page and associated assets will not be generated, instead, it will use the sidebar generated by Documenter.jl to navigate through pages. This is the default option when you doesn't configure \"theme\".\n\"grid\", \"bulmagrid\" and \"list\": an index page and associated cover images are generated","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Please check the \"Theme Gallery\" part for a preview of these themes.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"note: custom stylesheet\nOne could optionally override the default stylesheet with \"stylesheet\" entry in page config file:{\n \"theme\": \"grid\",\n \"stylesheet\": \"relative/path/to/stylesheet.css\"\n}","category":"page"},{"location":"quickstart/#What-DemoCards.jl-does","page":"Quick Start","title":"What DemoCards.jl does","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"The pipeline of makedemos is:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"analyze the structure of your demo folder and extracts supplementary configuration information\ncopy \"assets\" folder without processing\npreprocess demo files and save it\n(optional) process and save cover images\n(optional) generate index page\ngenerate a postprocessing callback function","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Since all files are generated to docs/src, the next step is to leave everything else to Documenter.jl 💯","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"warning: Warning\nBy default, makedemos generates all the necessary files to docs/src, this means that the data you pass to makedemos should not be placed at docs/src.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"For advanced usage of DemoCards.jl, you need to understand the core concepts of it.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"warning: Warning\nCurrently, there's no guarantee that this function works for untypical documentation folder structure. By the word typical, it is:.\n├── Project.toml\n├── docs/\n│ ├── demos/ # manage your demos outside docs/src\n│ ├── make.jl\n│ ├── Project.toml\n│ └── src/\n├── src/\n└── test/","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/#Hide-your-card-from-page-index-layout","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"","category":"section"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"(Image: )","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"There are cases that you want to hide one card in the generated page layout and only provide the entrance via reflink. For example, you have multiple version of demos and you only want to set the latest one as the default and provide legacy versions as reflink in the latest page.","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"This can be done by setting hidden: true in the frontmatter, for example:","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"---\nhidden: true\nid: hidden_card\n---","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"By doing this, this page is not shown in the generated index page, the only way to visit it is through URLs. Usually, you can use Documenter's reflink feature to provide a reflink to the hidden page.","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"For example, [hidden card](@ref hidden_card) generates a reflink to the hidden page, note that it doesn't get displayed in quickstart index page.","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"note: Note\nIf you don't pass a index template to makedemos, i.e., makedemos(demodir), then it does not generate an index page for you. In this case, hidden keyword does not change anything, for obvious reasons.","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/#Generate-your-cover-on-the-fly","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"(Image: Source code) (Image: notebook) (Image: compat)","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"There're many reasons that you don't want to mannually manage the cover image. DemoCards.jl allows you to generate the card cover on the fly for demos written in julia.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"Let's do this with a simple example","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"using TestImages, FileIO, ImageShow\n# ImageIO backend such as ImageMagick is required\ncover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover)","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"You can use this image later with cover, # ![](assets/lena_color_256.png) , or you can directly write it in your frontmatter","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/#Advanced-Literate-and-Documenter-tricks","page":"Generate your cover on the fly","title":"Advanced Literate & Documenter tricks","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"The following tricks are what you'd probably need to work on a real-world demo.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/#Hide-asset-generation","page":"Generate your cover on the fly","title":"Hide asset generation","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"There are cases that you want to hide the codes related to asset generation, e.g., the save(...) line. Fortunately, this is doable by combining the syntax of Documenter and Literate. For example, the following code can be inserted to whereever you need to generate the assets. The #src flag is used as a filter to tell Literate that this line is reserved only in the original source codes.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"save(\"assets/cover.png\", img_noise) #src","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"Gif image is also supported via ImageMagick:","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"# --- save covers --- #src\nusing ImageMagick #src\nimgs = map(10:5:50) do k #src\n colorview(RGB, rank_approx.(svdfactors, k)...) #src\nend #src\nImageMagick.save(\"assets/color_separations_svd.gif\", cat(imgs...; dims=3); fps=2) #src","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/#Hide-the-output-result","page":"Generate your cover on the fly","title":"Hide the output result","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"It does not look good to show the 0 result in the above code block as it does not provide anything that the reader cares. There are two ways to fix this.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"The first way is to insert a #hide flag to the line you don't want the user see. For example, if you write your source file in this way","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"it will show up in the generated HTML page as","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"The return value is still 0. Sometimes it is wanted, sometime it is not. To also hide the return value 0, you could insert a trivial nothing #hide #md to work it around.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide\nnothing #hide #md","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"generates","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide\nnothing #hide","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"No output at all. You could, of course, insert cover #hide #md or others you would like readers to see:","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide #md\ncover #hide #md","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"generates","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide\ncover #hide","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"The #md flag is used to keep a clean .jl file provided by the download-julia badge: (Image: )","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/#Be-careful-about-the-spaces-and-identation","page":"Generate your cover on the fly","title":"Be careful about the spaces and identation","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"Both Documenter and Literate has specifications on spaces, so you'd probably hit this issue sooner or later.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"Let's say, you want to create a warning box using the !!! warning syntax, and you'd probably ends up with something like this:","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"# !!! warning\n# This is inside the warning box\n#\n# This is out side the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"warning: Warning\n","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"This is inside the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"This is out side the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"The reason that contents are not shown correctly inside the warning box is that you need to insert five (not four) spaces to the following lines: Literate consumes one space, and Documenter consumes the other four.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":" # !!! warning\n-# This is inside the warning box\n+# This is inside the warning box\n #\n # This is out side the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"warning: Warning\nThis is inside the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"This is out side the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"bulmagrid/#Theme:-Bulma-Grid","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"","category":"section"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"Given demos organized as following, you can make them displayed in grid-like manner. This is like the \"grid\" theme but uses the Bulma CSS framework and is shipped with Documenter.jl.","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"bulmagrid\n├── assets\n│   └── logo.svg\n├── config.json\n├── bulmagrid_section_1\n│   ├── bulmagrid_subsection_1\n│   │   ├── bulmagrid_card_1.md\n│   │   └── bulmagrid_card_2.md\n│   └── bulmagrid_subsection_2\n│   ├── bulmagrid_card_3.md\n│   └── bulmagrid_card_4.md\n└── index.md","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"bulmagrid_demopage, bulmagrid_cb, bulmagrid_assets = makedemos(\"theme_gallery/bulmagrid\", bulmagrid_templates)","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"The page configuration file bulmagrid/config.json should contain an entry theme = \"bulmagrid\", e.g.,","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"{\n \"theme\": \"bulmagrid\"\n}","category":"page"},{"location":"bulmagrid/#Bulmagrid-section-1","page":"Theme: Bulma Grid","title":"Bulmagrid section 1","text":"","category":"section"},{"location":"bulmagrid/#Bulmagrid-subsection-1","page":"Theme: Bulma Grid","title":"Bulmagrid subsection 1","text":"","category":"section"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      ","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      \n
      \n
      \n

      \n Bulmagrid card 1\n

      \n

      \n some description here\n

      \n
      \n
      ","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"(Image: card image)","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      \n
      \n
      ","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      \n
      \n
      \n

      \n Bulmagrid card 2\n

      \n

      \n some description here\n

      \n
      \n
      ","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"(Image: card image)","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      \n
      \n
      ","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      ","category":"page"},{"location":"bulmagrid/#Bulmagrid-subsection-2","page":"Theme: Bulma Grid","title":"Bulmagrid subsection 2","text":"","category":"section"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      ","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      \n
      \n
      \n

      \n Bulmagrid card 3\n

      \n

      \n some description here\n

      \n
      \n
      ","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"(Image: card image)","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      \n
      \n
      ","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      \n
      \n
      \n

      \n Bulmagrid card 4\n

      \n

      \n some description here\n

      \n
      \n
      ","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"(Image: card image)","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      \n
      \n
      ","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"
      ","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_4/#List-card-4","page":"List card 4","title":"List card 4","text":"","category":"section"},{"location":"list/list_section_1/list_subsection_2/list_card_4/","page":"List card 4","title":"List card 4","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_4/","page":"List card 4","title":"List card 4","text":"","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_4/","page":"List card 4","title":"List card 4","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_3/#Grid-card-3","page":"Grid card 3","title":"Grid card 3","text":"","category":"section"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_3/","page":"Grid card 3","title":"Grid card 3","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_3/","page":"Grid card 3","title":"Grid card 3","text":"","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_3/","page":"Grid card 3","title":"Grid card 3","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/#configure_your_card","page":"Configure your card","title":"Configure your card","text":"","category":"section"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"(Image: Author) (Image: Author) (Image: Update time)","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"This page is generated from a markdown file. In DemoCards.jl's type system, it is called MarkdownDemoCard whose contents are written in the markdown format. ","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"The markdown files are almost directly passed to Documenter.jl, check the syntax of Documenter.jl if you are unfamiliar with the Julia flavor markdown syntax.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"DemoCards extracts potential information from the file to build the index page, e.g., name, title, reference id, cover image file/URL. If that's not available, then you would need to configure them by adding a YAML format front matter.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"Supported YAML keywords are list as follows:","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"cover: an URL or a relative path to the cover image. If not configured, it would use the DemoCard logo.\ndescription: a multi-line description to this file, will be displayed when the demo card is hovered.\nid: specify the id tag for cross-references.\ntitle: one-line description to this file, will be displayed under the cover image.\nauthor: author name. If there are multiple authors, split them with semicolon ;.\ndate: any string contents that can be passed to Dates.DateTime.\nhidden: whether this card is shown in the layout of index page.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"tip: Tip\nAll these YAML configs are optional. If specified, it has higher priority over the meta info extracted from the demo contents. For example, if you don't like the inferred demo title, then specify one explicitly in the YAML frontmatter.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"Of course, you have to make sure the --- flag shows at the first line of the markdown file, otherwise DemoCards would just read them as normal contents.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"For example, the markdown file of this page uses the following frontmatter:","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"---\ntitle: Configure your card\ncover: assets/logo.svg\nid: configure_your_card\nauthor: \"[Johnny Chen](https://github.com/johnnychen94); Jane Doe\"\ndate: 2020-09-13\ndescription: This demo show you how to pass additional meta info of card to DemoCards.jl\n---","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"As you can see, if configured, there will be badges for author and date info. If there are multiple authors, they could be splitted by semicolon ;. For example, author: Jane Doe; John Roe would generate two author badges.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"tip: Tip\nIf author is configured as markdown url format, then the generated badge will be clickable.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"warning: Warning\nA badly formatted YAML frontmatter will currently trigger a build failure with perhaps hard to understand error. Sometimes, you need to assist YAML parser by explicitly quoting the content with \"\". See the author field above as an instance.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/#Bulmagrid-card-3","page":"Bulmagrid card 3","title":"Bulmagrid card 3","text":"","category":"section"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/","page":"Bulmagrid card 3","title":"Bulmagrid card 3","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/","page":"Bulmagrid card 3","title":"Bulmagrid card 3","text":"","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/","page":"Bulmagrid card 3","title":"Bulmagrid card 3","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"list/#Theme:-List","page":"Theme: List","title":"Theme: List","text":"","category":"section"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"A basic DemoCards theme for list-like layout.","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"Given demos organized as following, you can make them displayed as a list of charts","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"list\n├── assets\n│   └── logo.svg\n├── config.json\n├── list_section_1\n│   ├── list_subsection_1\n│   │   ├── list_card_1.md\n│   │   └── list_card_2.md\n│   └── list_subsection_2\n│   ├── list_card_3.md\n│   └── list_card_4.md\n└── index.md","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"list_demopage, list_cb, list_assets = makedemos(\"theme_gallery/grid\", list_templates)","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"The page configuration file list/config.json should contain an entry theme = \"list\", e.g.,","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"{\n \"theme\": \"list\"\n}","category":"page"},{"location":"list/#List-section-1","page":"Theme: List","title":"List section 1","text":"","category":"section"},{"location":"list/#List-subsection-1","page":"Theme: List","title":"List subsection 1","text":"","category":"section"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n\n \n \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"(Image: list-card-cover-image)","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"List card 1","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"some description here","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n
      \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n\n \n \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"(Image: list-card-cover-image)","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"List card 2","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"some description here","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n
      \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      ","category":"page"},{"location":"list/#List-subsection-2","page":"Theme: List","title":"List subsection 2","text":"","category":"section"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n\n \n \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"(Image: list-card-cover-image)","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"List card 3","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"some description here","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n
      \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n\n \n \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"(Image: list-card-cover-image)","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"List card 4","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"some description here","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      \n
      \n
      ","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"
      ","category":"page"},{"location":"concepts/#concepts","page":"Concepts","title":"Concepts","text":"","category":"section"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"This page is a brief introduction on the internal core types provided by DemoCards.jl. Generally, you don't need to use them directly, but knowing them helps you to better organize and configure your demo pages. For detailed description, please refer to the Package References.","category":"page"},{"location":"concepts/#concepts_page","page":"Concepts","title":"DemoPage","text":"","category":"section"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"DemoPage is the root type in DemoCards.jl, everything else is contained in it directly or indirectly.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"You can configure your DemoPage by maintaining a config.json file, supported configuration keys are:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"\"order\": specify the section orders. By default, it's case-insensitive alphabetic order.\n\"title\": specify the title of this demo page.\n\"theme\": specify the index theme to use.\n\"template\": filename to template that will be used to generate the index page. This option doesn't work if \"theme\" is unconfigured or is \"nothing\", in which case no index page will be generated.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"A valid template is a markdown file that contains one and only one {{{democards}}}. For example,","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"# Examples\n\nThis page contains a set of examples for you to start with.\n\n{{{democards}}}\n\nContributions are welcomed at [DemoCards.jl](https://github.com/johnnychen94/DemoCards.jl) :D","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"Here's an example of config.json for DemoPage:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"{\n \"template\": \"index.md\",\n \"theme\": \"grid\",\n \"order\": [\n \"basic\",\n \"advanced\"\n ]\n}","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"note: Note\nKey template has higher priority over other keys. For example, if you provide both template and title in your config.json and the template file happens to have a title, title in config.json will be suppressed.","category":"page"},{"location":"concepts/#concepts_section","page":"Concepts","title":"DemoSection","text":"","category":"section"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"DemoSection defines the structure of your demo page. It has the following fields:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"cards: holds a list of demo cards.\nsubsections: holds a list of demo subsections.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"warning: Warning\nA DemoSection can't directly holds both cards and subsections; either of them should be empty vector.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"Similar to DemoPage, you can configure your DemoSection by maintaining a config.json file, supported configuration keys are:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"\"order\": specify the cards order or subsections order. By default, it's case-insensitive alphabetic order.\n\"title\": specify the title of this demo section.\n\"description\": words that would rendered under the section title.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"The following is an example of config.json:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"{\n \"title\": \"learn by examples\",\n \"description\": \"some one-line description can be useful.\",\n \"order\": [\n \"quickstart.md\",\n \"array.md\"\n ]\n}","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"note: Note\n🚧 Unlike DemoPage, a DemoSection does not yet support \"theme\" and \"template\" keys. A drawback of this design is that you have to put template contents into the \"description\" key, even if it contains hundreds of words.","category":"page"},{"location":"concepts/#concepts_card","page":"Concepts","title":"Demo card","text":"","category":"section"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"In simple words, a demo card consists of a link to its content and other relavent informations. In \"grid\" theme, it looks just like a card.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"Depending on how your demos are written, there are two types of demo cards:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"MarkdownDemoCard for markdown files, and\nJuliaDemoCard for julia files.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"JuliaDemoCards are julia files that are specially handled by DemoCards to generate associated assets, for example, markdown files (.md) and jupyter notebooks (.ipynb).","category":"page"},{"location":"concepts/#Remarks","page":"Concepts","title":"Remarks","text":"","category":"section"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"Currently, there're two special names used in DemoCards.jl:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"assets is a preserved name for DemoCards.jl to escape preprocessing\nconfig.json is used to tell DemoCards.jl more informations of current folder.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"To free you from managing/re-organizing demo structure, some decisions are made here:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"maintain a config.json in each folder\nalways use relative path\nall information is supplementary and hence optional","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"note: Note\nIf you've specified orders in config.json, then for every new demos, you need to add its filename to order. DemoCards.jl isn't smart enough to guess what you really want.","category":"page"},{"location":"list/list_section_1/list_subsection_1/list_card_1/#List-card-1","page":"List card 1","title":"List card 1","text":"","category":"section"},{"location":"list/list_section_1/list_subsection_1/list_card_1/","page":"List card 1","title":"List card 1","text":"","category":"page"},{"location":"list/list_section_1/list_subsection_1/list_card_1/","page":"List card 1","title":"List card 1","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"themeless/julia/item4/#Item4","page":"Item4","title":"Item4","text":"","category":"section"},{"location":"themeless/julia/item4/","page":"Item4","title":"Item4","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"themeless/julia/item4/","page":"Item4","title":"Item4","text":"","category":"page"},{"location":"themeless/julia/item4/","page":"Item4","title":"Item4","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"themeless/markdown/item1/#Item1","page":"Item1","title":"Item1","text":"","category":"section"},{"location":"themeless/markdown/item1/#subsection-1","page":"Item1","title":"subsection 1","text":"","category":"section"},{"location":"themeless/markdown/item1/","page":"Item1","title":"Item1","text":"This is the first subsection","category":"page"},{"location":"themeless/markdown/item1/#subsection-2","page":"Item1","title":"subsection 2","text":"","category":"section"},{"location":"themeless/markdown/item1/","page":"Item1","title":"Item1","text":"This is the section subsection","category":"page"},{"location":"themeless/markdown/item1/","page":"Item1","title":"Item1","text":"","category":"page"},{"location":"themeless/markdown/item1/","page":"Item1","title":"Item1","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_1/#Grid-card-1","page":"Grid card 1","title":"Grid card 1","text":"","category":"section"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_1/","page":"Grid card 1","title":"Grid card 1","text":"","category":"page"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_1/","page":"Grid card 1","title":"Grid card 1","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/#hidden_card","page":"This is a hidden card","title":"This is a hidden card","text":"","category":"section"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/#This-is-a-hidden-card","page":"This is a hidden card","title":"This is a hidden card","text":"","category":"section"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"This card doesn't get displayed in quickstart index page page and can only be viewed with relink [hidden card](@ref hidden_card).","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"Note that hidden cards are still processed by DemoCards to get you necessary assets.","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"using ImageCore, ImageTransformations, TestImages\n\nimresize(testimage(\"camera\"); ratio=0.25)","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"themeless/markdown/item2/#Item2","page":"Item2","title":"Item2","text":"","category":"section"},{"location":"themeless/markdown/item2/","page":"Item2","title":"Item2","text":"","category":"page"},{"location":"themeless/markdown/item2/","page":"Item2","title":"Item2","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_3/#List-card-3","page":"List card 3","title":"List card 3","text":"","category":"section"},{"location":"list/list_section_1/list_subsection_2/list_card_3/","page":"List card 3","title":"List card 3","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_3/","page":"List card 3","title":"List card 3","text":"","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_3/","page":"List card 3","title":"List card 3","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_2/#Bulmagrid-card-2","page":"Bulmagrid card 2","title":"Bulmagrid card 2","text":"","category":"section"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_2/","page":"Bulmagrid card 2","title":"Bulmagrid card 2","text":"","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_2/","page":"Bulmagrid card 2","title":"Bulmagrid card 2","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/#Simple-markdown-demo","page":"Simple markdown demo","title":"Simple markdown demo","text":"","category":"section"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"(Image: juliadocs)","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"This demo show you what DemoCards.jl does to a markdown demo.","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"DemoCards.jl is a plugin package to Documenter.jl. Hence, in general, demos written in markdown format are directly passed to Documenter.jl without much preprocessing.","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"DemoCards.jl extracts some meta information from your demos:","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"The first title is extracted as the card title: the filename simple_markdown_demo.md gives the title \"Simple markdown demo\"\nThe first image link to Documenter.jl's logo is extracted as the cover image\nThe first paragraph is extracted as the description","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"When your mouse hover over the card, a description shows up, for example:","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"(Image: )","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"This becomes the simplest markdown demo!","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_4/#Grid-card-4","page":"Grid card 4","title":"Grid card 4","text":"","category":"section"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_4/","page":"Grid card 4","title":"Grid card 4","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_4/","page":"Grid card 4","title":"Grid card 4","text":"","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_4/","page":"Grid card 4","title":"Grid card 4","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/#juliademocard_example","page":"Write your demo in julia","title":"Write your demo in julia","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"(Image: Source code) (Image: notebook) (Image: compat) (Image: Author) (Image: Update time)","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"Different from markdown format demo, source demo files are preprocessed so that it generates:","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"assets such as cover image\njulia source file\nmardkown file\njupyter notebook file","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"Links to nbviewer and source files are provided as well.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"note: Note\nThis entails every source file being executed three times: 1) asset generation, 2) notebook generation, and 3) Documenter HTML generation. If the generation time is too long for your application, you could then choose to write your demo in markdown format. Or you can disable the notebook generation via the notebook keyword in your demos, this helps reduce the runtime to 2x.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"The conversions from source demo files to .jl, .md and .ipynb files are mainly handled by Literate.jl. The syntax to control/filter the outputs can be found here","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"x = 1//3\ny = 2//5\nx + y","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"Images can be loaded and displayed","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"using TestImages, ImageShow\nimg = testimage(\"lena\")","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"The frontmatter is also written in YAML with only a leading #, for example:","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"# ---\n# title: \n# cover: <cover>\n# id: <id>\n# date: 2020-09-13\n# author: Johnny Chen\n# julia: 1.3\n# description: <description>\n# ---","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"In addition to the keywords supported by markdown files, Julia format demos accept one extra frontmatter keyword: julia. It allows you to specify the compat version of your demo. With this, DemoCards would:","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"throw a warning if your demos are generated using a lower version of Julia\ninsert a compat version badge.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"The warning is something like \"The running Julia version 1.0.5 is older than the declared compatible version 1.3.0.\"","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"Another extra keyword is notebook, it allows you to control whether you needs to generate jupyter notebook .ipynb for the demo. The valid values are true and false. See also Override default values with properties on how to disable all notebook generation via the properties entry.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"warning: Warning\nYou should be careful about the leading whitespaces after the first #. Frontmatter as weird as the following is not guaranteed to work and it is very likely to hit a YAML parsing error.#---\n# title: <title>\n# cover: <cover>\n# id: <id>\n# description: <description>\n#---","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"tip: Tip\nComments are allowed before frontmatter, but it would only be appeared in the julia source codes. Normally, you may only want to add magic comments and license information before the YAML frontmatter.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_1/#Bulmagrid-card-1","page":"Bulmagrid card 1","title":"Bulmagrid card 1","text":"","category":"section"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_1/","page":"Bulmagrid card 1","title":"Bulmagrid card 1","text":"","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_1/","page":"Bulmagrid card 1","title":"Bulmagrid card 1","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"pluto/#pluto","page":"Pluto.jl support","title":"Pluto.jl notebooks support","text":"","category":"section"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"Pluto.jl is a modern interactive notebook for Julia. The Pluto notebook content is saved as a Julia script with special syntax decorations to support features like built-in dependency management and reactive cell execution. In this section, we will discuss how we can add demos written using Pluto as DemoCards.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"DemoCards.jl natively supports only Julia and markdown files. Pluto notebooks are supported via an extension to the existing package. PlutoStaticHTML.jl is used for rendering pluto notebooks to desired markdown format. The functionality for rendering pluto notebooks is automatically loaded when PlutoStaticHTML is imported into the current environment.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"note: Note\nJulia versions before julia 1.9 doesn't support the extension functionality. Requires.jl is used for conditional loading of code in older julia versions.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"The set of functionalities supported for Julia and Markdown files is also supported for Pluto. We can compose any number of Pluto, Julia or Markdown files together for a demo.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"If one of the demos contains a pluto notebook, we just need to add PlutoStaticHTML to the list of imports.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"using Documenter, DemoCards # Load functionality for markdown and julia\nusing PlutoStaticHTML # Import the pluto notebook functionality to DemoCards\n\n# The tutorials folders/sub-folders can contain pluto, julia and markdown\ntutorials, tutorials_cb, tutorial_assets = makedemos(\"tutorials\")","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"warning: Warning\nThe pluto notebooks in DemoCards are evaluated sequentially and not in parallel. This was done primarily to avoid repetitive logs in CI. We recommend using the cache functionality with the pluto notebooks in case of heavy workloads.","category":"page"},{"location":"pluto/#Adding-frontmatter-to-pluto-notebooks","page":"Pluto.jl support","title":"Adding frontmatter to pluto notebooks","text":"","category":"section"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"Pluto.jl has its own GUI to manipulate the front matter of a notebook. This makes it easier for users to create and edit frontmatter. The pluto frontmatter is not saved in YAML format. See this PR for more details.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"warning: Warning\nFrontmatter support for Pluto demoCards are currently limited to the frontmatter support for pluto. It doesn't support the inference of title, description, id or cover from the content of the notebook. Make sure to explicitly mention custom configs in the frontmatter to avoid surprises.","category":"page"},{"location":"pluto/#Cache-computationally-expensive-notebooks","page":"Pluto.jl support","title":"Cache computationally expensive notebooks","text":"","category":"section"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"Rendering a Pluto notebook is sometimes time and resource-consuming, especially in a CI environment. Fortunately, PlutoStaticHTML.jl has a cache functionality that uses outputs of previous runs as a cache. If the source pluto notebook (.jl file) or the Julia environment didn't change from the last run, the output md file of the last run is used instead of re-rendering the source. DemoCards stores all the rendered pluto notebooks in a pluto_output folder under the docs folder.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"During the demo creation process, DemoCards.jl checks for a file with a cache (filename with .md extension) in docs/pluto_output for each pluto notebook. For example: if the pluto notebook file name is example_demo.jl, it searches for cache with filename example_demo.md. If the cache exists and the input hash and the Julia version matches, rendering is skipped, and the cache is used as output. For more insight into the cache mechanism, visit the cache documentation on PlutoStaticHTML.","category":"page"},{"location":"pluto/#Examples","page":"Pluto.jl support","title":"Examples","text":"","category":"section"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"The usage of pluto notebooks as DemoCards can be found in GraphNeuralNetworks.jl.","category":"page"},{"location":"pluto/#References","page":"Pluto.jl support","title":"References","text":"","category":"section"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"DemoCards.PlutoDemoCard\nDemoCards.save_democards(card_dir::AbstractString, card::DemoCards.PlutoDemoCard;\n project_dir,\n src,\n credit,\n nbviewer_root_url)","category":"page"},{"location":"pluto/#DemoCards.PlutoDemoCard","page":"Pluto.jl support","title":"DemoCards.PlutoDemoCard","text":"struct PlutoDemoCard <: AbstractDemoCard\nPlutoDemoCard(path::AbstractString)\n\nConstructs a pluto-format demo card from a pluto notebook path.\n\nFields\n\nBesides path, this struct has some other fields:\n\npath: path to the source markdown file\ncover: path to the cover image\nid: cross-reference id\ntitle: one-line description of the demo card\nauthor: author(s) of this demo.\ndate: the update date of this demo.\ndescription: multi-line description of the demo card\njulia: Julia version compatibility\nhidden: whether this card is shown in the generated index page\n\nConfiguration\n\nYou can pass additional information by adding a pluto front-matter section to the notebook. Supported items are:\n\ncover: an URL or a relative path to the cover image. If not specified, it will use the first available image link, or all-white image if there's no image links.\ndescription: a multi-line description to this file, will be displayed when the demo card is hovered. By default it uses title.\nid: specify the id tag for cross-references. By default it's infered from the filename, e.g., simple_demo from simple demo.jl.\ntitle: one-line description to this file, will be displayed under the cover image. By default, it's the name of the file (without extension).\nauthor: author name. If there are multiple authors, split them with semicolon ;.\njulia: Julia version compatibility. Any string that can be converted to VersionNumber\ndate: any string contents that can be passed to Dates.DateTime. For example, 2020-09-13.\nhidden: whether this card is shown in the layout of index page. The default value is false.\n\nAn example of pluto front matter in the notebook:\n\n#> [frontmatter]\n#> title = \"passing extra information\"\n#> cover = \"cover.png\"\n#> id = \"non_ambiguious_id\"\n#> author = \"Jane Doe; John Roe\"\n#> date = \"2020-01-31\"\n#> description = \"this demo shows how you can pass extra demo information to DemoCards package. All these are optional.\"\n#> julia: \"1.0\"\n#> hidden: \"false\"\n\nSee also: MarkdownDemoCard, JuliaDemoCard, DemoSection, DemoPage\n\n\n\n\n\n","category":"type"},{"location":"pluto/#DemoCards.save_democards-Tuple{AbstractString, DemoCards.PlutoDemoCard}","page":"Pluto.jl support","title":"DemoCards.save_democards","text":"save_democards(card_dir::AbstractString, card::PlutoDemoCard;\n project_dir,\n src,\n credit,\n nbviewer_root_url)\n\nProcess the original pluto notebook and saves it.\n\nThe processing pipeline is:\n\npreprocess and copy source file\ngenerate markdown file\ncopy the markdown file to cache folder\ninsert header and footer to generated markdown file\n\n\n\n\n\n","category":"method"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/#Bulmagrid-card-4","page":"Bulmagrid card 4","title":"Bulmagrid card 4","text":"","category":"section"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/","page":"Bulmagrid card 4","title":"Bulmagrid card 4","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/","page":"Bulmagrid card 4","title":"Bulmagrid card 4","text":"","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/","page":"Bulmagrid card 4","title":"Bulmagrid card 4","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_2/#Grid-card-2","page":"Grid card 2","title":"Grid card 2","text":"","category":"section"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_2/","page":"Grid card 2","title":"Grid card 2","text":"","category":"page"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_2/","page":"Grid card 2","title":"Grid card 2","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_2/#Bokehlist-card-2","page":"Bokehlist card 2","title":"Bokehlist card 2","text":"","category":"section"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_2/","page":"Bokehlist card 2","title":"Bokehlist card 2","text":"","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_2/","page":"Bokehlist card 2","title":"Bokehlist card 2","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"bokehlist/#Theme:-BokehList","page":"Theme: BokehList","title":"Theme: BokehList","text":"","category":"section"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"BokehList is a list theme used in Bokeh.jl.","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"Given demos organized as following, you can make them displayed as a list of charts","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"bokehlist\n├── assets\n│   └── logo.svg\n├── config.json\n├── bokehlist_section_1\n│   ├── bokehlist_subsection_1\n│   │   ├── bokehlist_card_1.md\n│   │   └── bokehlist_card_2.md\n│   └── bokehlist_subsection_2\n│   ├── bokehlist_card_3.md\n│   └── bokehlist_card_4.md\n└── index.md","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"bokehlist_demopage, bokehlist_cb, bokehlist_assets = makedemos(\"theme_gallery/bokehlist\", bokehlist_templates)","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"The page configuration file bokehlist/config.json should contain an entry theme = \"bokehlist\", e.g.,","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"{\n \"theme\": \"bokehlist\"\n}","category":"page"},{"location":"bokehlist/#Bokehlist-section-1","page":"Theme: BokehList","title":"Bokehlist section 1","text":"","category":"section"},{"location":"bokehlist/#Bokehlist-subsection-1","page":"Theme: BokehList","title":"Bokehlist subsection 1","text":"","category":"section"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card-section\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"bokeh-list-card-cover\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"(Image: bokeh-list-card-cover-image)","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div></td>\n <td><div class=\"bokeh-list-card-text\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"Bokehlist card 1","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>\n <div class=\"bokeh-list-card-description\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"some description here","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"bokeh-list-card-cover\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"(Image: bokeh-list-card-cover-image)","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div></td>\n <td><div class=\"bokeh-list-card-text\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"Bokehlist card 2","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>\n <div class=\"bokeh-list-card-description\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"some description here","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>","category":"page"},{"location":"bokehlist/#Bokehlist-subsection-2","page":"Theme: BokehList","title":"Bokehlist subsection 2","text":"","category":"section"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card-section\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"bokeh-list-card-cover\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"(Image: bokeh-list-card-cover-image)","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div></td>\n <td><div class=\"bokeh-list-card-text\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"Bokehlist card 3","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>\n <div class=\"bokeh-list-card-description\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"some description here","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"bokeh-list-card-cover\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"(Image: bokeh-list-card-cover-image)","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div></td>\n <td><div class=\"bokeh-list-card-text\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"Bokehlist card 4","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>\n <div class=\"bokeh-list-card-description\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"some description here","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/#Configure-your-section-and-page","page":"Configure your section and page","title":"Configure your section and page","text":"","category":"section"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"This demo shows you how to configure your demo page and sections.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"By default, a demo section takes the folder name as its section title, and it takes the file orders as its card orders, which can be unsatisfying in many cases. Luckily, DemoCards.jl reads the config.json file in the section folder, for example:","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"{\n \"title\": \"Basic Usage\",\n \"order\": [\n \"simple_markdown_demo.md\",\n \"configure_with_yaml.md\"\n ]\n}","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"A demo page is maintained in a similar manner, except that it needs extra keys to configure the template page. For example:","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"{\n \"template\": \"template.md\",\n \"theme\": \"grid\",\n \"order\": [\n \"basic\",\n \"advanced\"\n ]\n}","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"If template is not specified, \"index.md\" will be used if available, otherwise, it will use a blank template generated by DemoCards.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"There are three possible options for theme:","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"\"nothing\": It won't generate the index page, instead, it will use the sidebar generated by Documenter for navigation purpose. template option doesn't affect, neither.\n\"grid\": a grid like index page.\n\"list\": a list like index page.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"You can check the \"Theme Gallery\" to see how different themes look like.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/#[Override-default-values-with-properties](@ref-page_sec_properties)","page":"Configure your section and page","title":"Override default values with properties","text":"","category":"section"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"Another item that could be useful is properties, it is written as a dictionary-like format, and provides a way to override some default values. Properties can be configured at any level and it follows very simple rules:","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"Properties at a higher level item can be propagated into lower level items\nProperties at lower level items are of higher priority","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"example_page/\n├── config.json\n├── sec1\n│ ├── config.json\n│ ├── demo1.jl\n│ ├── demo2.jl\n│ └── demo3.md\n└── sec2\n ├── demo4.jl\n └── demo5.jl","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"For example, in the above folder structure, if we configure example_page/config.json with","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"{\n \"properties\":{\n \"notebook\": \"false\"\n }\n}","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"Then all julia demos will not generate jupyter notebook unless it's override somewhere in the lower level, e.g, sec1/config.json or demo1.jl.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"Only a subset of demo entries support the property propagation, currently supported items are:","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"Julia files: notebook allows you to enable/disable the jupyter notebook generation.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_1/#Bokehlist-card-1","page":"Bokehlist card 1","title":"Bokehlist card 1","text":"","category":"section"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_1/","page":"Bokehlist card 1","title":"Bokehlist card 1","text":"","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_1/","page":"Bokehlist card 1","title":"Bokehlist card 1","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"themeless/julia/item3/#Item3","page":"Item3","title":"Item3","text":"","category":"section"},{"location":"themeless/julia/item3/","page":"Item3","title":"Item3","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"themeless/julia/item3/","page":"Item3","title":"Item3","text":"","category":"page"},{"location":"themeless/julia/item3/","page":"Item3","title":"Item3","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"preview/#preview","page":"Partial build","title":"Partial build","text":"","category":"section"},{"location":"preview/#The-REPL-way","page":"Partial build","title":"The REPL way","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Typically, when you write up examples and demos using DemoCards, you'll need to do include(\"docs/make.jl) to trigger a rebuild for many times. This is okay, just not that fast as you need to rebuild the whole documentation even if you are just making some trivial typo checks. This page shows how you could make this experience smoother, especially for julia demos.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"DemoCards uses Literate.jl as the backend to transform your julia files to markdown and jupyter notebook. This means that you can code up your example file with whatever programming environment you like. For example, you can use Ctrl-Enter to execute your codes line by line in Juno/VSCode, check the output, add comments, and so on; all these can be done without the need to build the documentation. ","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"For example, assume that you are writing a demos/sec1/demo1.jl","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"# demos/sec1/demo1.jl\n\nusing Images # you can `Ctrl-Enter` in VSCode to execute this line\n\nimg = testimage(\"camera\") # `Ctrl-Enter` again, and see the output in the plot panel\n\n# and add more example codes in a REPL way","category":"page"},{"location":"preview/#Beyond-REPL","page":"Partial build","title":"Beyond REPL","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"This REPL workflow works pretty well and responsive until you start to building the documentation. For example, There are a lot of demos in JuliaImages demos and it takes several minutes to build the whole documentation. If we're only to make many some small modifications to one of the demo, then it would be pretty painful to wait the whole build pipeline ends. After all, why should we build demos we don't care about? Fortunately, DemoCards provides a sandbox environment for you to preview your demos without doing so, which is preview_demos.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Assume that your docs/make.jl is written up like the following:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"# 1. generate demo files\ndemopage, postprocess_cb, demo_assets = makedemos(\"demos\") # this is the relative path to docs/\n\n# if there are generated css assets, pass it to Documenter.HTML\nassets = []\nisnothing(demo_assets) || (push!(assets, demo_assets))\n\n# 2. normal Documenter usage\nformat = Documenter.HTML(assets = assets)\nmakedocs(format = format,\n pages = [\n \"Home\" => \"index.md\",\n demopage,\n ],\n sitename = \"Awesome demos\")\n\n# 3. postprocess after makedocs\npostprocess_cb()","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"To preview only one demo in demos folder, say, demos/sec1/demo1.jl, what you need to do is:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"preview_demos(\"docs/demos/sec1/demo1.jl\")","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"It will output the path to the generated index.html file, for example, it might be something like this:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"\"/var/folders/c0/p23z1x6x3jg_qtqsy_r421y40000gn/T/jl_5sc8fM/build/democards/demos/index.html\"","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Open this file in your favorite browser, and you'll see a reduced version of the demo page, which only contains one demo file. Other unrelated contents are not included in this page.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"This preview_demos function is not reserved for single file, it works for folders, too. For example, you could use it with preview_demos(\"demos/sec1\"), or just preview_demos(\"demos\").","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"preview_demos does not do anything magic, it simply copies the single demo file and its assets into a sandbox folder, and trigger the Documenter.makedocs in that folder. Because it doesn't contain any other files, this process becomes much faster than include(\"docs/make.jl\") workflow. Compared to rebuild the whole documentation, building a preview version only adds about 1 extra second to include(\"demo1.jl\").","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"If the file is placed in a typical demo page folder structure, preview_demos(file) will preserve that structure. In cases that demo page folder structure is not detected, it will instead create such a folder structure. You can check the following JuliaImages example to see how it looks like.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"tip: Tip\nprewview_demos accepts an additional theme keyword, that you can use this to override the page theme specified in config.json. For example, if \"grid\" theme is specified in config.json file, calling preview_demos(\"demos\", theme=\"list\") would just get you to the list style look without any changes.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"note: Note\npreview_demos does not include any other part of the documentation in the preview, hence reflinks are very likely to be broken and you will receieve warnings about that. In this case, you still need to include(\"docs/make.jl\") to rebuild the whole documentation if reflinks are what you concern about.","category":"page"},{"location":"preview/#Example-–-JuliaImages","page":"Partial build","title":"Example – JuliaImages","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Let's take the docs of JuliaImages as a live example, and illustrate how preview_demos can be used in practice.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"First, let's clone the JuliaImages docs repo:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"git clone https://github.com/JuliaImages/juliaimages.github.io.git\ncd juliaimages.github.io.git","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"The result might change, but you can still get the idea.","category":"page"},{"location":"preview/#preview-the-whole-demo-page","page":"Partial build","title":"preview the whole demo page","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"The following page is generated by preview_demos(\"docs/examples\"), note that all other documentation contents are not generated in this page. It only contains the contents in \"docs/examples\".","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"(Image: preview page)","category":"page"},{"location":"preview/#Preview-one-section-in-the-demo-page","page":"Partial build","title":"Preview one section in the demo page","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"This is the page generated by preview_demos(\"docs/examples/color_channels\"), it only generates the \"Color Channels\" section:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"(Image: preview section)","category":"page"},{"location":"preview/#Preview-only-one-file-in-the-demo-page","page":"Partial build","title":"Preview only one file in the demo page","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"This is the page generated by preview_demos(\"docs/examples/color_separations_svd.jl\") with only one demo generated.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"(Image: preview one demo)","category":"page"},{"location":"preview/#Preview-files-without-demo-page-structure","page":"Partial build","title":"Preview files without demo page structure","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Assume that you have the following folder structure:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"testimages/\n├── cameraman.jl\n└── mandril.jl","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"with each file written in this way:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"# This shows how you can load the mandril test image\n\nusing Images, TestImages\nimg = testimage(\"mandril\")\nsave(\"assets/mandril.png\", img); #hide #md\n\n# ![](assets/mandril.png)","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Doing this with make_demos(\"testimages\") would just fails because it is not a recognizable folder structure, but preview_demos(\"testimages\") works nicely with this by creating a wrapper folder preview page:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"(Image: preview random files)","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/#Bokehlist-card-3","page":"Bokehlist card 3","title":"Bokehlist card 3","text":"","category":"section"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/","page":"Bokehlist card 3","title":"Bokehlist card 3","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/","page":"Bokehlist card 3","title":"Bokehlist card 3","text":"","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/","page":"Bokehlist card 3","title":"Bokehlist card 3","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"structure/#manipulation","page":"Structure manipulation","title":"Structure manipulation","text":"","category":"section"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"It is not uncommon that you'd need to manipulate the folder structure of your demos. For example, when you are creating new demos, or when you need to reorder the demos and sections. The core design of DemoCards.jl is to make such operation as trivial as possible; the less you modify make.jl, the safer you'll be.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"I'll explain it case by case, hopefully you'd get how things work out with DemoCards.jl.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Throughout this page, I'll use the following folder structure as an example:","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"examples\n├── part1\n│ ├── assets\n│ ├── config.json\n│ ├── demo_1.md\n│ ├── demo_2.md\n│ └── demo_3.md\n└── part2\n ├── demo_4.jl\n └── demo_5.jl","category":"page"},{"location":"structure/#To-add/remove/rename-a-demo-file","page":"Structure manipulation","title":"To add/remove/rename a demo file","text":"","category":"section"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Suppose we need to add one demo_6.jl in section \"part2\", just add the file in examples/part2 folder. Everything just works without the need to touch make.jl.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Adding demo_6.jl in section \"part1\" would be a little bit different, because there's a config file for this section: examples/part1/config.json. If \"order\" is not defined in the config file, it would be the same story. If \"order\" is defined in the config file, then you'll do one more step to specify the exact order you want demo_5.jl be placed at.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Removing/renaming the demo file is similar that, if needed, you'll need to remove/rename the demo from \"order\" in the config file.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"You have to do so because DemoCards is not smart enough to guess a partial order for you. Otherwise DemoCards would throw an error on it, for example, this is the error message if I change demo_1.md to demo1.md.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"┌ Warning: The following entries in examples/part1/config.json are not used anymore:\n│ demo_1.md\n└ @ DemoCards ~/Documents/Julia/DemoCards/src/utils.jl:29\n┌ Warning: The following entries in examples/part1/config.json are missing:\n│ demo1.md\n└ @ DemoCards ~/Documents/Julia/DemoCards/src/utils.jl:32\nERROR: LoadError: ArgumentError: incorrect order in examples/part1/config.json, please check the previous warning message.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"The error message says you have to modify the \"orders\" item in examples/part1/config.json accordingly.","category":"page"},{"location":"structure/#To-rename-a-section","page":"Structure manipulation","title":"To rename a section","text":"","category":"section"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Suppose we want to rename \"Part1\" to something more meaningful, say \"Markdown demos\". There are two ways to do so:","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"rename \"examples/part1\" to \"examples/markdown demos\"\nadd \"title\" = \"Markdown demos\" item in examples/part1/config.json.","category":"page"},{"location":"structure/#To-move-section-around","page":"Structure manipulation","title":"To move section around","text":"","category":"section"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"If everything demo_1.md, demo_2.md, demo_3.md needed are placed in examples/part1/assets, then it would be just a piece of cake to move the entire examples/part1 folder around. Say, move examples/part1 to examples/part1/markdown.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"To minimize the changes you need to do when you organize your demos, here's some general advice:","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Keep an assets folder for each of your section.\nTry to avoid specifying path in other folders.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"This is just some advice and you don't have to follow it. After all, we don't really change the folder structure that often.","category":"page"},{"location":"structure/#To-change-the-page-theme","page":"Structure manipulation","title":"To change the page theme","text":"","category":"section"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Change the \"theme\" item in examples/config.json and that's all.","category":"page"},{"location":"#DemoCards.jl","page":"Home","title":"DemoCards.jl","text":"","category":"section"},{"location":"","page":"Home","title":"Home","text":"Let's focus on writing good demos.","category":"page"},{"location":"","page":"Home","title":"Home","text":"A plugin package to Documenter.jl that dynamically generate demos and associated assets for you.","category":"page"},{"location":"","page":"Home","title":"Home","text":"note: Note\nPlease read the Documenter.jl documentation first if you're unfamiliar with the julia documentation system.","category":"page"},{"location":"#Package-Features","page":"Home","title":"Package Features","text":"","category":"section"},{"location":"","page":"Home","title":"Home","text":"a plugin package to Documenter.jl to manage all your demos.\nfolder structure is the demo structure.\nminimal configuration.\nCI friendly\nsupport demos in markdown and julia format.","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/#Bokehlist-card-4","page":"Bokehlist card 4","title":"Bokehlist card 4","text":"","category":"section"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/","page":"Bokehlist card 4","title":"Bokehlist card 4","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/","page":"Bokehlist card 4","title":"Bokehlist card 4","text":"","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/","page":"Bokehlist card 4","title":"Bokehlist card 4","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"grid/#theme-grid","page":"Theme: Grid","title":"Theme: Grid","text":"","category":"section"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"A basic DemoCards theme for grid-like layout.","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"Given demos organized as following, you can make them displayed in grid-like manner","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"grid\n├── assets\n│   └── logo.svg\n├── config.json\n├── grid_section_1\n│   ├── grid_subsection_1\n│   │   ├── grid_card_1.md\n│   │   └── grid_card_2.md\n│   └── grid_subsection_2\n│   ├── grid_card_3.md\n│   └── grid_card_4.md\n└── index.md","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"grid_demopage, grid_cb, grid_assets = makedemos(\"theme_gallery/grid\", grid_templates)","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"The page configuration file grid/config.json should contain an entry theme = \"grid\", e.g.,","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"{\n \"theme\": \"grid\"\n}","category":"page"},{"location":"grid/#Grid-section-1","page":"Theme: Grid","title":"Grid section 1","text":"","category":"section"},{"location":"grid/#Grid-subsection-1","page":"Theme: Grid","title":"Grid subsection 1","text":"","category":"section"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"grid-card-section\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"some description here","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"(Image: card-cover-image)","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"Grid card 1","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"some description here","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"(Image: card-cover-image)","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"Grid card 2","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"},{"location":"grid/#Grid-subsection-2","page":"Theme: Grid","title":"Grid subsection 2","text":"","category":"section"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"grid-card-section\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"some description here","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"(Image: card-cover-image)","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"Grid card 3","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"some description here","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"(Image: card-cover-image)","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"Grid card 4","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"}] +[{"location":"list/list_section_1/list_subsection_1/list_card_2/#List-card-2","page":"List card 2","title":"List card 2","text":"","category":"section"},{"location":"list/list_section_1/list_subsection_1/list_card_2/","page":"List card 2","title":"List card 2","text":"","category":"page"},{"location":"list/list_section_1/list_subsection_1/list_card_2/","page":"List card 2","title":"List card 2","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"references/#package_references","page":"Package References","title":"Package References","text":"","category":"section"},{"location":"references/","page":"Package References","title":"Package References","text":"Modules = [DemoCards, DemoCards.CardThemes]\nOrder = [:type, :function]","category":"page"},{"location":"references/#DemoCards.DemoPage","page":"Package References","title":"DemoCards.DemoPage","text":"struct DemoPage <: Any\nDemoPage(root::String)\n\nConstructs a demo page object.\n\nFields\n\nBesides the root path to the demo page folder root, this struct has some other fields:\n\ntitle: page title\ntemplate: template content of the demo page.\nsections: demo sections found in root\n\nConfiguration\n\nYou can manage an extra config.json file to customize rendering of a demo page. Supported items are:\n\norder: specify the sections order. By default, it's case-insensitive alphabetic order.\ntemplate: path to template filename. By default, it's \"index.md\". The content of the template file should has one and only one {{{democards}}}.\ntheme: specify which card theme should be used to generate the index page. If not specified, it will default to nothing.\nstylesheet: relative path to the stylesheet file to override the default stylesheet provided by \"theme\".\ntitle: specify the title of this demo page. By default, it's the folder name of root. Will be override by template.\nproperties: a dictionary of properties that can be propagated to its children items. The same properties in the children items, if exist, have higher priority.\n\nThe following is an example of config.json:\n\n{\n \"template\": \"template.md\",\n \"theme\": \"grid\",\n \"stylesheet\": \"assets/gridstyle.css\",\n \"order\": [\n \"basic\",\n \"advanced\"\n ],\n \"properties\": {\n \"notebook\": \"false\",\n \"julia\": \"1.6\",\n \"author\": \"Johnny Chen\"\n }\n}\n\nExamples\n\nThe following is the simplest folder structure of a DemoPage:\n\ndemos\n└── basic\n ├── demo_1.md\n ├── demo_2.md\n ├── demo_3.md\n ├── demo_4.md\n ├── demo_5.md\n ├── demo_6.md\n ├── demo_7.md\n └── demo_8.md\n\nnote: Note\nA DemoPage doesn't manage demo files directly, so here you'll need a DemoSection basic to manage them.\n\nThe following is a typical folder structure of a DemoPage:\n\ndemos\n├── advanced\n│ ├── advanced_demo_1.md\n│ └── advanced_demo_2.md\n├── basic\n│ ├── part1\n│ │ ├── basic_demo_1_1.md\n│ │ └── basic_demo_1_2.md\n│ └── part2\n│ ├── config.json\n│ ├── basic_demo_2_1.md\n│ └── basic_demo_2_2.md\n├── config.json\n└── template.md\n\nwarning: Warning\nA section should only hold either subsections or demo files. A folder that has both subfolders and demo files (e.g., *.md) is invalid.\n\nSee also: MarkdownDemoCard, DemoSection\n\n\n\n\n\n","category":"type"},{"location":"references/#DemoCards.DemoSection","page":"Package References","title":"DemoCards.DemoSection","text":"struct DemoSection <: Any\nDemoSection(root::String)\n\nConstructs a demo section that holds either nested subsections or demo cards.\n\nFields\n\nBesides the root path to the demo section folder root, this struct has some other fields:\n\ncards: demo cards found in root\nsubsections: nested subsections found in root\n\nConfiguration\n\nYou can manage an extra config.json file to customize rendering of a demo section. Supported items are:\n\norder: specify the cards order or subsections order. By default, it's case-insensitive alphabetic order.\ntitle: specify the title of this demo section. By default, it's the folder name of root.\ndescription: some header description that you want to add before demo cards.\nproperties: a dictionary of properties that can be propagated to its children items. The same properties in the children items, if exist, have higher priority.\n\nThe following is an example of config.json:\n\n{\n \"title\": \"learn by examples\",\n \"description\": \"some one-line description can be useful.\",\n \"order\": [\n \"quickstart.md\",\n \"array.md\"\n ],\n \"properties\": {\n \"notebook\": \"false\",\n \"julia\": \"1.6\",\n \"author\": \"Johnny Chen\"\n }\n}\n\nExamples\n\nThe following is the simplest folder structure of a DemoSection:\n\nsection\n├── demo_1.md\n├── demo_2.md\n├── demo_3.md\n├── demo_4.md\n├── demo_5.md\n├── demo_6.md\n├── demo_7.md\n└── demo_8.md\n\nThe following is a typical nested folder structure of a DemoSection:\n\nsection\n├── config.json\n├── part1\n│ ├── demo_21.md\n│ └── demo_22.md\n└── part2\n ├── config.json\n ├── demo_23.md\n └── demo_24.md\n\nwarning: Warning\nA section should only hold either subsections or demo files. A folder that has both subfolders and demo files (e.g., *.md) is invalid.\n\nSee also: MarkdownDemoCard, DemoPage\n\n\n\n\n\n","category":"type"},{"location":"references/#DemoCards.JuliaDemoCard","page":"Package References","title":"DemoCards.JuliaDemoCard","text":"struct JuliaDemoCard <: AbstractDemoCard\nJuliaDemoCard(path::String)\n\nConstructs a julia-format demo card from existing julia file path.\n\nThe julia file is written in Literate syntax.\n\nFields\n\nBesides path, this struct has some other fields:\n\npath: path to the source julia file\ncover: path to the cover image\nid: cross-reference id\ntitle: one-line description of the demo card\nauthor: author(s) of this demo.\ndate: the update date of this demo.\ndescription: multi-line description of the demo card\njulia: Julia version compatibility\nhidden: whether this card is shown in the generated index page\nnotebook: enable or disable the jupyter notebook generation. Valid values are true or false.\n\nConfiguration\n\nYou can pass additional information by adding a YAML front matter to the julia file. Supported items are:\n\ncover: an URL or a relative path to the cover image. If not specified, it will use the first available image link, or all-white image if there's no image links.\ndescription: a multi-line description to this file, will be displayed when the demo card is hovered. By default it uses title.\nid: specify the id tag for cross-references. By default it's infered from the filename, e.g., simple_demo from simple demo.md.\ntitle: one-line description to this file, will be displayed under the cover image. By default, it's the name of the file (without extension).\nauthor: author name. If there are multiple authors, split them with semicolon ;.\ndate: any string contents that can be passed to Dates.DateTime. For example, 2020-09-13.\njulia: Julia version compatibility. Any string that can be converted to VersionNumber\nhidden: whether this card is shown in the layout of index page. The default value is false.\n\nAn example of the front matter (note the leading #):\n\n# ---\n# title: passing extra information\n# cover: cover.png\n# id: non_ambiguious_id\n# author: Jane Doe; John Roe\n# date: 2020-01-31\n# description: this demo shows how you can pass extra demo information to DemoCards package. All these are optional.\n# julia: 1.0\n# hidden: false\n# ---\n\nSee also: MarkdownDemoCard, PlutoDemoCard, DemoSection, DemoPage\n\n\n\n\n\n","category":"type"},{"location":"references/#DemoCards.MarkdownDemoCard","page":"Package References","title":"DemoCards.MarkdownDemoCard","text":"struct MarkdownDemoCard <: AbstractDemoCard\nMarkdownDemoCard(path::String)\n\nConstructs a markdown-format demo card from existing markdown file path.\n\nFields\n\nBesides path, this struct has some other fields:\n\npath: path to the source markdown file\ncover: path to the cover image\nid: cross-reference id\ntitle: one-line description of the demo card\nauthor: author(s) of this demo.\ndate: the update date of this demo.\ndescription: multi-line description of the demo card\nhidden: whether this card is shown in the generated index page\n\nConfiguration\n\nYou can pass additional information by adding a YAML front matter to the markdown file. Supported items are:\n\ncover: an URL or a relative path to the cover image. If not specified, it will use the first available image link, or all-white image if there's no image links.\ndescription: a multi-line description to this file, will be displayed when the demo card is hovered. By default it uses title.\nid: specify the id tag for cross-references. By default it's infered from the filename, e.g., simple_demo from simple demo.md.\ntitle: one-line description to this file, will be displayed under the cover image. By default, it's the name of the file (without extension).\nauthor: author name. If there are multiple authors, split them with semicolon ;.\ndate: any string contents that can be passed to Dates.DateTime. For example, 2020-09-13.\nhidden: whether this card is shown in the layout of index page. The default value is false.\n\nAn example of the front matter:\n\n---\ntitle: passing extra information\ncover: cover.png\nid: non_ambiguious_id\nauthor: Jane Doe; John Roe\ndate: 2020-01-31\ndescription: this demo shows how you can pass extra demo information to DemoCards package. All these are optional.\nhidden: false\n---\n\nSee also: JuliaDemoCard, PlutoDemoCard, DemoSection, DemoPage\n\n\n\n\n\n","category":"type"},{"location":"references/#DemoCards.copy_assets_and_configs","page":"Package References","title":"DemoCards.copy_assets_and_configs","text":"copy_assets_and_configs(src_page_dir, dst_build_dir=pwd())\n\ncopy only assets, configs and templates from src_page_dir to dst_build_dir. The folder structure is preserved under dst_build_dir/$(basename(src_page_dir))\n\norder in config files are modified accordingly.\n\n\n\n\n\n","category":"function"},{"location":"references/#DemoCards.democard-Tuple{String}","page":"Package References","title":"DemoCards.democard","text":"democard(path::String)::T\n\nConstructs a concrete AbstractDemoCard instance.\n\nThe return type T is determined by the extension of the path to your demofile. Currently supported types are:\n\nMarkdownDemoCard for markdown files\nJuliaDemoCard for julia files\nPlutoDemoCard for pluto files\nUnmatchedCard for unmatched files\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.generate_or_copy_pagedir-Tuple{Any, Any}","page":"Package References","title":"DemoCards.generate_or_copy_pagedir","text":"generate_or_copy_pagedir(src_path, build_dir)\n\ncopy the page folder structure from src_path to build_dir/$(basename(src_path). If src_path does not live in a standard demo page folder structure, generate a preview version.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.get_default_order-Tuple{DemoCards.DemoSection}","page":"Package References","title":"DemoCards.get_default_order","text":"return case-insensitive alphabetic order\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.infer_pagedir-Tuple{Any}","page":"Package References","title":"DemoCards.infer_pagedir","text":"infer_pagedir(card_path; rootdir=\"\")\n\nGiven a demo card path, infer the outmost dir path that makes it a valid demo page. If it fails to find such dir path, return nothing.\n\nThe inference is done recursively, rootdir sets a stop condition for the inference process.\n\nwarning: Warning\nThis inference may not be the exact page dir in trivial cases, for example:testdir/\n└── examples\n └── sections\n └── demo1.mdBoth testdir and examples can be valid dir path for a demo page, this function would just return testdir as it is the outmost match.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.input_bool-Tuple{Any}","page":"Package References","title":"DemoCards.input_bool","text":"input_bool(prompt)::Bool\n\nPrint prompt message and trigger user input for confirmation.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.makedemos","page":"Package References","title":"DemoCards.makedemos","text":"makedemos(source::String;\n root = \"<current-directory>\",\n src = \"src\",\n build = \"build\",\n branch = \"gh-pages\",\n edit_branch = \"master\",\n credit = true,\n throw_error = false) -> page_path, postprocess_cb\n\nMake a demo page for source and return the path to the generated index file.\n\nProcessing pipeline:\n\nanalyze the folder structure source and loading all available configs.\ncopy assets\npreprocess demo files and save it\nsave/copy cover images\ngenerate postprocess callback function, which includes url-redirection.\n\nwarning: Warning\nBy default, makedemos generates all the necessary files to docs/src/, this means that the data you pass to makedemos should not be placed at docs/src/. A recommendation is to put folders in docs/. For example, docs/quickstart is a good choice.\n\nInputs\n\nsource: dir path to the root page of your demos; relative to docs.\n\nOutputs\n\npage_path: path to demo page's index. You can directly pass it to makedocs.\npostprocess_cb: callback function for postprocess. You can call postprocess_cb() after makedocs.\ntheme_assets: the stylesheet assets that you may need to pass to Documenter.HTML. When the demo page has no theme, it will return nothing.\n\nKeywords\n\nroot::String: should be equal to Documenter's setting. Typically it is \"docs\" if this function is called in docs/make.jl file.\nsrc::String: should be equal to Documenter's setting. By default it's \"src\".\nbuild::String: should be equal to Documenter's setting. By default it's \"build\".\nedit_branch::String: should be equal to Documenter's setting. By default it's \"master\".\nbranch::String: should be equal to Documenter's setting. By default it's \"gh-pages\".\ncredit::Bool: true to show a \"This page is generated by ...\" info. By default it's true.\nthrow_error::Bool: true to throw an error when the julia demo build fails; otherwise it will continue the build with warnings.\nfilter_function::Function: the function is passed each potential DemoCard, and the card is excluded if the function returns false. By default, all potential cards are included.\n\nExamples\n\nThe following is the simplest example for you to start with:\n\n# 1. preprocess and generate demo files to docs/src\nexamples, postprocess_cb, demo_assets = makedemos(\"examples\")\n\nassets = []\nisnothing(demo_assets) || (push!(assets, demo_assets))\n\n# 2. do the standard Documenter pipeline\nmakedocs(format = Documenter.HTML(assets = assets),\n pages = [\n \"Home\" => \"index.md\",\n examples\n ])\n\n# 3. postprocess after makedocs\npostprocess_cb()\n\nBy default, it won't generate the index page for your demos. To enable it and configure how index page is generated, you need to create \"examples/config.json\", whose contents should looks like the following:\n\n{\n \"theme\": \"grid\",\n \"order\": [\n \"basic\",\n \"advanced\"\n ]\n}\n\nFor more details of how config.json is configured, please check DemoCards.DemoPage.\n\n\n\n\n\n","category":"function"},{"location":"references/#DemoCards.parse-Tuple{Val, DemoCards.AbstractDemoCard}","page":"Package References","title":"DemoCards.parse","text":"parse([T::Val], card::AbstractDemoCard)\nparse(T::Val, contents)\nparse(T::Val, path)\n\nParse the content of card and return the configuration.\n\nCurrently supported items are: title, id, cover, description.\n\nnote: Note\nUsers of this function need to use haskey to check if keys are existed. They also need to validate the values.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.preview_demos-Tuple{String}","page":"Package References","title":"DemoCards.preview_demos","text":"preview_demos(demo_path; kwargs...)\n\nGenerate a docs preview for a single demo card.\n\nReturn values\n\nindex_file: absolute path to the index file of the demo page. You can open this in your browser and see the generated demos.\n\nArguments\n\ndemo_path: path to your demo file or folder. It can be path to the demo file, the folder of multiple scripts. If standard demo page folder structure is detected, use it, and otherwise will create a preview version of it.\n\nParameters\n\ntheme: the card theme you want to use in the preview. By default, it infers from your page config file. To not generate index page, you could pass nothing to it. See also cardtheme for theme choices.\nassets = String[]: this is passed to Documenter.HTML\nedit_branch = \"master\": same to that in makedemos\ncredit = true: same to that in makedemos\nthrow_error = false: same to that in makedemos\nrequire_html = true: if it needs to trigger the Documenter workflow and generate HTML preview. If set to false, the return value is then the path to the generated index.md file. This is an experimental keyword and should not be considered stable.\nclean = true: whether you need to first clean up the existing sandbox building dir.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.redirect_link-NTuple{6, Any}","page":"Package References","title":"DemoCards.redirect_link","text":"redirect_link(src_file, source, root, src, build, edit_branch)\n\nRedirect the \"Edit On GitHub\" link of generated demo files to its original url, without this a 404 error is expected.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.save_cover-Tuple{String, DemoCards.AbstractDemoCard}","page":"Package References","title":"DemoCards.save_cover","text":"save_cover(path::String, card::AbstractDemoCard)\n\nprocess the cover image and save it.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.save_democards-Tuple{String, DemoCards.DemoPage}","page":"Package References","title":"DemoCards.save_democards","text":"save_democards(root::String, page::DemoPage; credit, nbviewer_root_url)\n\nrecursively process and save source demo file\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.save_democards-Tuple{String, DemoCards.JuliaDemoCard}","page":"Package References","title":"DemoCards.save_democards","text":"save_democards(card_dir::String, card::JuliaDemoCard;\n project_dir,\n src,\n credit,\n nbviewer_root_url)\n\nprocess the original julia file and save it.\n\nThe processing pipeline is:\n\npreprocess and copy source file\ngenerate ipynb file\ngenerate markdown file\ninsert header and footer to generated markdown file\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.save_democards-Tuple{String, DemoCards.MarkdownDemoCard}","page":"Package References","title":"DemoCards.save_democards","text":"save_democards(card_dir::String, card::MarkdownDemoCard)\n\nprocess the original markdown file and save it.\n\nThe processing pipeline is:\n\nstrip the front matter\ninsert a level-1 title and id\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.split_frontmatter-Tuple{String}","page":"Package References","title":"DemoCards.split_frontmatter","text":"split_frontmatter(contents) -> frontmatter, body\n\nsplits the YAML frontmatter out from markdown and julia source code. Leading # will be stripped for julia codes.\n\ncontents can be String or vector of String. Outputs have the same type of contents.\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.walkpage-Tuple{DemoCards.DemoPage}","page":"Package References","title":"DemoCards.walkpage","text":"walkpage([f=identity], page; flatten=true, max_depth=Inf)\n\nWalk through the page structure and apply function f to each of the item.\n\nBy default, the page structure is not preserved in the result. To preserve that, you could pass flatten=false to the function.\n\nExamples\n\nThis is particulaly useful to generate information for the page structure. For example:\n\njulia> page = DemoPage(\"docs/quickstart/\");\n\njulia> walkpage(page; flatten=true) do item\n basename(item.path)\nend\n\n\"Quick Start\" => [\n \"simple_markdown_demo.md\",\n \"configure_card.md\",\n \"configure_sec_and_page.md\",\n \"hide_your_card_from_index.md\",\n \"hidden_card.jl\",\n \"1.julia_demo.jl\",\n \"2.cover_on_the_fly.jl\"\n]\n\nIf flatten=false, then it gives you something like this:\n\n\"Quick Start\" => [\n \"Usage example\" => [\n \"Basics\" => [\n \"simple_markdown_demo.md\",\n \"configure_card.md\",\n \"configure_sec_and_page.md\",\n \"hide_your_card_from_index.md\",\n \"hidden_card.jl\"\n ],\n \"Julia demos\" => [\n \"1.julia_demo.jl\",\n \"2.cover_on_the_fly.jl\"\n ]\n ]\n]\n\n\n\n\n\n","category":"method"},{"location":"references/#DemoCards.CardThemes.cardtheme","page":"Package References","title":"DemoCards.CardThemes.cardtheme","text":"cardtheme(theme = \"grid\";\n root = \"<current-directory>\",\n src = \"src\",\n destination = \"democards\") -> templates, stylesheet_path\n\nFor given theme, return the templates and path to stylesheet.\n\nroot and destination should have the same value to that passed to makedemos.\n\nAvailable themes are:\n\n\"bulmagrid\"\n\"bokehlist\"\n\"grid\"\n\"list\"\n\n\n\n\n\n","category":"function"},{"location":"quickstart/#quickstart","page":"Quick Start","title":"Quick Start","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This section describes how you can set up your demos easily in five lines of codes.","category":"page"},{"location":"quickstart/#Manage-your-demo-files","page":"Quick Start","title":"Manage your demo files","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"The rules of demo management are super simple:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"you need one demo page (folder) to hold all the demo files\na demo page has several demo sections (subfolders)\na demo section either\nhas other demo sections as nested subsections, or,\nhas the demo files (.md, .jl)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"In the following example:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"we have one demo page: \"quickstart\" –-> The current page you're looking at\n\"quickstart\" has one demo section: \"usage example\"\n\"usage example\" has two demo subsections: \"basics\" and \"julia_demos\"\n\"basics\" section holds all markdown demos\n\"julia_demos\" section holds all julia demos\n\"assets\" folders are ignored by DemoCards.jl\n\"index.md\" is where all demo cards are organized in (aka page template)\n\"config.json\" are configuration files (there are many of them!)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"docs/quickstart\n├── config.json\n├── index.md\n└── usage_example\n ├── basics\n │ ├── assets\n │ ├── config.json\n │ ├── configure_card.md\n │ ├── configure_sec_and_page.md\n │ ├── hidden_card.jl\n │ ├── hide_your_card_from_index.md\n │ └── simple_markdown_demo.md\n ├── config.json\n └── julia_demos\n ├── 1.julia_demo.jl\n ├── 2.cover_on_the_fly.jl\n ├── assets\n └── config.json","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This is the core idea, as long as you organize your folder in a structural way, DemoCards will read and process your demos to map your folder structure.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"using DemoCards\ncd(pkgdir(DemoCards)) do\n DemoCards.DemoPage(\"docs/quickstart\")\nend","category":"page"},{"location":"quickstart/#Deploy-your-demo-page","page":"Quick Start","title":"Deploy your demo page","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: democards workflow)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"The above image is the workflow of DemoCards. The deployment would be pretty easy:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"pass your demos to makedemos, so that they're preprocessed before passing into Documenter.jl\ngenerate the entire documentation using Documenter.makedocs\npost process the generated demos using callbacks.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"# 1. generate demo files\ndemopage, postprocess_cb, demo_assets = makedemos(\"demos\") # this is the relative path to docs/\n\n# if there are generated css assets, pass it to Documenter.HTML\nassets = []\nisnothing(demo_assets) || (push!(assets, demo_assets))\n\n# 2. normal Documenter usage\nformat = Documenter.HTML(assets = assets)\nmakedocs(format = format,\n pages = [\n \"Home\" => \"index.md\",\n demopage,\n ],\n sitename = \"Awesome demos\")\n\n# 3. postprocess after makedocs\npostprocess_cb()","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"In this example, there are three returned objects from makedemos:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"demopage: this is the relative path to the generated demos (typically in src), you can pass it to makedocs's pages.\npostprocess_cb: this is the callback function that you'll need to call after makedocs.\ndemo_assets: if available, it is the path to css file which you could pass to Documenter.HTML as style assets. If no theme is configured for your page, it will be `nothing.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"After it's set up, you can now focus on contributing more demos and leave other works to DemoCards.jl.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"🎉 The following example grids are generated using DemoCards! You can read them one by one for advanced configuration helps. Or you could read the Concepts page first to get better understanding about the DemoCards type system.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"","category":"page"},{"location":"quickstart/#Usage-example","page":"Quick Start","title":"Usage example","text":"","category":"section"},{"location":"quickstart/#Basics","page":"Quick Start","title":"Basics","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Demos can be written in typical markdown files with Documenter syntax, the only thing DemoCards does is to analyse the folder structure of your markdown files.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"<div class=\"grid-card-section\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This demo show you what DemoCards.jl does to a markdown demo.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Simple markdown demo","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This demo show you how to pass additional meta info of card to DemoCards.jl","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Configure your card","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This demo shows you how to configure your demo page and sections.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Configure your section and page","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This demo shows you how to hide your card in page layout.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Hide your card from page index layout","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>","category":"page"},{"location":"quickstart/#Julia-demos","page":"Quick Start","title":"Julia demos","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"It also supports julia source codes (powered by Literate.jl). With this you can not only show typical mardown demo to readers but also provide a downloadable source code and an online notebook link. Another advantage is that you can generate demo assets on the fly(e.g., cover pages, artifacts), which is not an easy task for typical markdown demos using Documenter alone.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"<div class=\"grid-card-section\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"This demo shows you how to write your demo in julia","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Write your demo in julia","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"this demo shows you how to generate cover on the fly","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"(Image: card-cover-image)","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Generate your cover on the fly","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>\n</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"</div>","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"","category":"page"},{"location":"quickstart/#Page-Themes","page":"Quick Start","title":"Page Themes","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"The page you are reading right now is the generated index page of demos. An index page always have cover images for the demos. An index page is only generated if you configure the theme option in your page config file (e.g., docs/quickstart/config.json):","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"{\n \"theme\": \"grid\"\n}","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"There are three themes available now:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"\"nothing\"(default): index page and associated assets will not be generated, instead, it will use the sidebar generated by Documenter.jl to navigate through pages. This is the default option when you doesn't configure \"theme\".\n\"grid\", \"bulmagrid\" and \"list\": an index page and associated cover images are generated","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Please check the \"Theme Gallery\" part for a preview of these themes.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"note: custom stylesheet\nOne could optionally override the default stylesheet with \"stylesheet\" entry in page config file:{\n \"theme\": \"grid\",\n \"stylesheet\": \"relative/path/to/stylesheet.css\"\n}","category":"page"},{"location":"quickstart/#What-DemoCards.jl-does","page":"Quick Start","title":"What DemoCards.jl does","text":"","category":"section"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"The pipeline of makedemos is:","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"analyze the structure of your demo folder and extracts supplementary configuration information\ncopy \"assets\" folder without processing\npreprocess demo files and save it\n(optional) process and save cover images\n(optional) generate index page\ngenerate a postprocessing callback function","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"Since all files are generated to docs/src, the next step is to leave everything else to Documenter.jl 💯","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"warning: Warning\nBy default, makedemos generates all the necessary files to docs/src, this means that the data you pass to makedemos should not be placed at docs/src.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"For advanced usage of DemoCards.jl, you need to understand the core concepts of it.","category":"page"},{"location":"quickstart/","page":"Quick Start","title":"Quick Start","text":"warning: Warning\nCurrently, there's no guarantee that this function works for untypical documentation folder structure. By the word typical, it is:.\n├── Project.toml\n├── docs/\n│ ├── demos/ # manage your demos outside docs/src\n│ ├── make.jl\n│ ├── Project.toml\n│ └── src/\n├── src/\n└── test/","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/#Hide-your-card-from-page-index-layout","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"","category":"section"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"(Image: )","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"There are cases that you want to hide one card in the generated page layout and only provide the entrance via reflink. For example, you have multiple version of demos and you only want to set the latest one as the default and provide legacy versions as reflink in the latest page.","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"This can be done by setting hidden: true in the frontmatter, for example:","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"---\nhidden: true\nid: hidden_card\n---","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"By doing this, this page is not shown in the generated index page, the only way to visit it is through URLs. Usually, you can use Documenter's reflink feature to provide a reflink to the hidden page.","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"For example, [hidden card](@ref hidden_card) generates a reflink to the hidden page, note that it doesn't get displayed in quickstart index page.","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"note: Note\nIf you don't pass a index template to makedemos, i.e., makedemos(demodir), then it does not generate an index page for you. In this case, hidden keyword does not change anything, for obvious reasons.","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"","category":"page"},{"location":"quickstart/usage_example/basics/hide_your_card_from_index/","page":"Hide your card from page index layout","title":"Hide your card from page index layout","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/#Generate-your-cover-on-the-fly","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"(Image: Source code) (Image: notebook) (Image: compat)","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"There're many reasons that you don't want to mannually manage the cover image. DemoCards.jl allows you to generate the card cover on the fly for demos written in julia.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"Let's do this with a simple example","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"using TestImages, FileIO, ImageShow\n# ImageIO backend such as ImageMagick is required\ncover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover)","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"You can use this image later with cover, # ![](assets/lena_color_256.png) , or you can directly write it in your frontmatter","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/#Advanced-Literate-and-Documenter-tricks","page":"Generate your cover on the fly","title":"Advanced Literate & Documenter tricks","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"The following tricks are what you'd probably need to work on a real-world demo.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/#Hide-asset-generation","page":"Generate your cover on the fly","title":"Hide asset generation","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"There are cases that you want to hide the codes related to asset generation, e.g., the save(...) line. Fortunately, this is doable by combining the syntax of Documenter and Literate. For example, the following code can be inserted to whereever you need to generate the assets. The #src flag is used as a filter to tell Literate that this line is reserved only in the original source codes.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"save(\"assets/cover.png\", img_noise) #src","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"Gif image is also supported via ImageMagick:","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"# --- save covers --- #src\nusing ImageMagick #src\nimgs = map(10:5:50) do k #src\n colorview(RGB, rank_approx.(svdfactors, k)...) #src\nend #src\nImageMagick.save(\"assets/color_separations_svd.gif\", cat(imgs...; dims=3); fps=2) #src","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/#Hide-the-output-result","page":"Generate your cover on the fly","title":"Hide the output result","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"It does not look good to show the 0 result in the above code block as it does not provide anything that the reader cares. There are two ways to fix this.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"The first way is to insert a #hide flag to the line you don't want the user see. For example, if you write your source file in this way","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"it will show up in the generated HTML page as","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"The return value is still 0. Sometimes it is wanted, sometime it is not. To also hide the return value 0, you could insert a trivial nothing #hide #md to work it around.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide\nnothing #hide #md","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"generates","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide\nnothing #hide","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"No output at all. You could, of course, insert cover #hide #md or others you would like readers to see:","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide #md\ncover #hide #md","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"generates","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"cover = testimage(\"lena_color_256\")\nsave(\"assets/lena_color_256.png\", cover) #hide\ncover #hide","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"The #md flag is used to keep a clean .jl file provided by the download-julia badge: (Image: )","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/#Be-careful-about-the-spaces-and-identation","page":"Generate your cover on the fly","title":"Be careful about the spaces and identation","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"Both Documenter and Literate has specifications on spaces, so you'd probably hit this issue sooner or later.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"Let's say, you want to create a warning box using the !!! warning syntax, and you'd probably ends up with something like this:","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"# !!! warning\n# This is inside the warning box\n#\n# This is out side the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"warning: Warning\n","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"This is inside the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"This is out side the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"The reason that contents are not shown correctly inside the warning box is that you need to insert five (not four) spaces to the following lines: Literate consumes one space, and Documenter consumes the other four.","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":" # !!! warning\n-# This is inside the warning box\n+# This is inside the warning box\n #\n # This is out side the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"warning: Warning\nThis is inside the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"This is out side the warning box","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"","category":"page"},{"location":"quickstart/usage_example/julia_demos/2.cover_on_the_fly/","page":"Generate your cover on the fly","title":"Generate your cover on the fly","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"bulmagrid/#Theme:-Bulma-Grid","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"","category":"section"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"Given demos organized as following, you can make them displayed in grid-like manner. This is like the \"grid\" theme but uses the Bulma CSS framework and is shipped with Documenter.jl.","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"bulmagrid\n├── assets\n│   └── logo.svg\n├── config.json\n├── bulmagrid_section_1\n│   ├── bulmagrid_subsection_1\n│   │   ├── bulmagrid_card_1.md\n│   │   └── bulmagrid_card_2.md\n│   └── bulmagrid_subsection_2\n│   ├── bulmagrid_card_3.md\n│   └── bulmagrid_card_4.md\n└── index.md","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"bulmagrid_demopage, bulmagrid_cb, bulmagrid_assets = makedemos(\"theme_gallery/bulmagrid\", bulmagrid_templates)","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"The page configuration file bulmagrid/config.json should contain an entry theme = \"bulmagrid\", e.g.,","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"{\n \"theme\": \"bulmagrid\"\n}","category":"page"},{"location":"bulmagrid/#Bulmagrid-section-1","page":"Theme: Bulma Grid","title":"Bulmagrid section 1","text":"","category":"section"},{"location":"bulmagrid/#Bulmagrid-subsection-1","page":"Theme: Bulma Grid","title":"Bulmagrid subsection 1","text":"","category":"section"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"<div class=\"columns is-multiline bulma-grid-card-section\">","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"<div class=\"column is-half\">\n <div class=\"card bulma-grid-card\">\n <div class=\"card-content\">\n <h3 class=\"is-size-5 bulma-grid-card-text\">\n Bulmagrid card 1\n </h3>\n <p class=\"is-size-6 bulma-grid-card-description\">\n some description here\n </p>\n </div>\n <div class=\"card-image bulma-grid-card-cover\">","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"(Image: card image)","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":" </div>\n </div>\n</div>","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"<div class=\"column is-half\">\n <div class=\"card bulma-grid-card\">\n <div class=\"card-content\">\n <h3 class=\"is-size-5 bulma-grid-card-text\">\n Bulmagrid card 2\n </h3>\n <p class=\"is-size-6 bulma-grid-card-description\">\n some description here\n </p>\n </div>\n <div class=\"card-image bulma-grid-card-cover\">","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"(Image: card image)","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":" </div>\n </div>\n</div>","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"</div>","category":"page"},{"location":"bulmagrid/#Bulmagrid-subsection-2","page":"Theme: Bulma Grid","title":"Bulmagrid subsection 2","text":"","category":"section"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"<div class=\"columns is-multiline bulma-grid-card-section\">","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"<div class=\"column is-half\">\n <div class=\"card bulma-grid-card\">\n <div class=\"card-content\">\n <h3 class=\"is-size-5 bulma-grid-card-text\">\n Bulmagrid card 3\n </h3>\n <p class=\"is-size-6 bulma-grid-card-description\">\n some description here\n </p>\n </div>\n <div class=\"card-image bulma-grid-card-cover\">","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"(Image: card image)","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":" </div>\n </div>\n</div>","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"<div class=\"column is-half\">\n <div class=\"card bulma-grid-card\">\n <div class=\"card-content\">\n <h3 class=\"is-size-5 bulma-grid-card-text\">\n Bulmagrid card 4\n </h3>\n <p class=\"is-size-6 bulma-grid-card-description\">\n some description here\n </p>\n </div>\n <div class=\"card-image bulma-grid-card-cover\">","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"(Image: card image)","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":" </div>\n </div>\n</div>","category":"page"},{"location":"bulmagrid/","page":"Theme: Bulma Grid","title":"Theme: Bulma Grid","text":"</div>","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_4/#List-card-4","page":"List card 4","title":"List card 4","text":"","category":"section"},{"location":"list/list_section_1/list_subsection_2/list_card_4/","page":"List card 4","title":"List card 4","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_4/","page":"List card 4","title":"List card 4","text":"","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_4/","page":"List card 4","title":"List card 4","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_3/#Grid-card-3","page":"Grid card 3","title":"Grid card 3","text":"","category":"section"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_3/","page":"Grid card 3","title":"Grid card 3","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_3/","page":"Grid card 3","title":"Grid card 3","text":"","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_3/","page":"Grid card 3","title":"Grid card 3","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/#configure_your_card","page":"Configure your card","title":"Configure your card","text":"","category":"section"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"(Image: Author) (Image: Author) (Image: Update time)","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"This page is generated from a markdown file. In DemoCards.jl's type system, it is called MarkdownDemoCard whose contents are written in the markdown format. ","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"The markdown files are almost directly passed to Documenter.jl, check the syntax of Documenter.jl if you are unfamiliar with the Julia flavor markdown syntax.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"DemoCards extracts potential information from the file to build the index page, e.g., name, title, reference id, cover image file/URL. If that's not available, then you would need to configure them by adding a YAML format front matter.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"Supported YAML keywords are list as follows:","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"cover: an URL or a relative path to the cover image. If not configured, it would use the DemoCard logo.\ndescription: a multi-line description to this file, will be displayed when the demo card is hovered.\nid: specify the id tag for cross-references.\ntitle: one-line description to this file, will be displayed under the cover image.\nauthor: author name. If there are multiple authors, split them with semicolon ;.\ndate: any string contents that can be passed to Dates.DateTime.\nhidden: whether this card is shown in the layout of index page.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"tip: Tip\nAll these YAML configs are optional. If specified, it has higher priority over the meta info extracted from the demo contents. For example, if you don't like the inferred demo title, then specify one explicitly in the YAML frontmatter.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"Of course, you have to make sure the --- flag shows at the first line of the markdown file, otherwise DemoCards would just read them as normal contents.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"For example, the markdown file of this page uses the following frontmatter:","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"---\ntitle: Configure your card\ncover: assets/logo.svg\nid: configure_your_card\nauthor: \"[Johnny Chen](https://github.com/johnnychen94); Jane Doe\"\ndate: 2020-09-13\ndescription: This demo show you how to pass additional meta info of card to DemoCards.jl\n---","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"As you can see, if configured, there will be badges for author and date info. If there are multiple authors, they could be splitted by semicolon ;. For example, author: Jane Doe; John Roe would generate two author badges.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"tip: Tip\nIf author is configured as markdown url format, then the generated badge will be clickable.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"warning: Warning\nA badly formatted YAML frontmatter will currently trigger a build failure with perhaps hard to understand error. Sometimes, you need to assist YAML parser by explicitly quoting the content with \"\". See the author field above as an instance.","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"","category":"page"},{"location":"quickstart/usage_example/basics/configure_card/","page":"Configure your card","title":"Configure your card","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/#Bulmagrid-card-3","page":"Bulmagrid card 3","title":"Bulmagrid card 3","text":"","category":"section"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/","page":"Bulmagrid card 3","title":"Bulmagrid card 3","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/","page":"Bulmagrid card 3","title":"Bulmagrid card 3","text":"","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_3/","page":"Bulmagrid card 3","title":"Bulmagrid card 3","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"list/#Theme:-List","page":"Theme: List","title":"Theme: List","text":"","category":"section"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"A basic DemoCards theme for list-like layout.","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"Given demos organized as following, you can make them displayed as a list of charts","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"list\n├── assets\n│   └── logo.svg\n├── config.json\n├── list_section_1\n│   ├── list_subsection_1\n│   │   ├── list_card_1.md\n│   │   └── list_card_2.md\n│   └── list_subsection_2\n│   ├── list_card_3.md\n│   └── list_card_4.md\n└── index.md","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"list_demopage, list_cb, list_assets = makedemos(\"theme_gallery/grid\", list_templates)","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"The page configuration file list/config.json should contain an entry theme = \"list\", e.g.,","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"{\n \"theme\": \"list\"\n}","category":"page"},{"location":"list/#List-section-1","page":"Theme: List","title":"List section 1","text":"","category":"section"},{"location":"list/#List-subsection-1","page":"Theme: List","title":"List subsection 1","text":"","category":"section"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"<div class=\"list-card-section\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"<div class=\"list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"list-card-cover\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"(Image: list-card-cover-image)","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":" </div></td>\n <td><div class=\"list-card-text\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"List card 1","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"</div>\n <div class=\"list-card-description\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"some description here","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"<div class=\"list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"list-card-cover\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"(Image: list-card-cover-image)","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":" </div></td>\n <td><div class=\"list-card-text\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"List card 2","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"</div>\n <div class=\"list-card-description\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"some description here","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"</div>","category":"page"},{"location":"list/#List-subsection-2","page":"Theme: List","title":"List subsection 2","text":"","category":"section"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"<div class=\"list-card-section\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"<div class=\"list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"list-card-cover\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"(Image: list-card-cover-image)","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":" </div></td>\n <td><div class=\"list-card-text\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"List card 3","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"</div>\n <div class=\"list-card-description\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"some description here","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"<div class=\"list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"list-card-cover\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"(Image: list-card-cover-image)","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":" </div></td>\n <td><div class=\"list-card-text\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"List card 4","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"</div>\n <div class=\"list-card-description\">","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"some description here","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"list/","page":"Theme: List","title":"Theme: List","text":"</div>","category":"page"},{"location":"concepts/#concepts","page":"Concepts","title":"Concepts","text":"","category":"section"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"This page is a brief introduction on the internal core types provided by DemoCards.jl. Generally, you don't need to use them directly, but knowing them helps you to better organize and configure your demo pages. For detailed description, please refer to the Package References.","category":"page"},{"location":"concepts/#concepts_page","page":"Concepts","title":"DemoPage","text":"","category":"section"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"DemoPage is the root type in DemoCards.jl, everything else is contained in it directly or indirectly.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"You can configure your DemoPage by maintaining a config.json file, supported configuration keys are:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"\"order\": specify the section orders. By default, it's case-insensitive alphabetic order.\n\"title\": specify the title of this demo page.\n\"theme\": specify the index theme to use.\n\"template\": filename to template that will be used to generate the index page. This option doesn't work if \"theme\" is unconfigured or is \"nothing\", in which case no index page will be generated.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"A valid template is a markdown file that contains one and only one {{{democards}}}. For example,","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"# Examples\n\nThis page contains a set of examples for you to start with.\n\n{{{democards}}}\n\nContributions are welcomed at [DemoCards.jl](https://github.com/johnnychen94/DemoCards.jl) :D","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"Here's an example of config.json for DemoPage:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"{\n \"template\": \"index.md\",\n \"theme\": \"grid\",\n \"order\": [\n \"basic\",\n \"advanced\"\n ]\n}","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"note: Note\nKey template has higher priority over other keys. For example, if you provide both template and title in your config.json and the template file happens to have a title, title in config.json will be suppressed.","category":"page"},{"location":"concepts/#concepts_section","page":"Concepts","title":"DemoSection","text":"","category":"section"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"DemoSection defines the structure of your demo page. It has the following fields:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"cards: holds a list of demo cards.\nsubsections: holds a list of demo subsections.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"warning: Warning\nA DemoSection can't directly holds both cards and subsections; either of them should be empty vector.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"Similar to DemoPage, you can configure your DemoSection by maintaining a config.json file, supported configuration keys are:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"\"order\": specify the cards order or subsections order. By default, it's case-insensitive alphabetic order.\n\"title\": specify the title of this demo section.\n\"description\": words that would rendered under the section title.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"The following is an example of config.json:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"{\n \"title\": \"learn by examples\",\n \"description\": \"some one-line description can be useful.\",\n \"order\": [\n \"quickstart.md\",\n \"array.md\"\n ]\n}","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"note: Note\n🚧 Unlike DemoPage, a DemoSection does not yet support \"theme\" and \"template\" keys. A drawback of this design is that you have to put template contents into the \"description\" key, even if it contains hundreds of words.","category":"page"},{"location":"concepts/#concepts_card","page":"Concepts","title":"Demo card","text":"","category":"section"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"In simple words, a demo card consists of a link to its content and other relavent informations. In \"grid\" theme, it looks just like a card.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"Depending on how your demos are written, there are two types of demo cards:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"MarkdownDemoCard for markdown files, and\nJuliaDemoCard for julia files.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"JuliaDemoCards are julia files that are specially handled by DemoCards to generate associated assets, for example, markdown files (.md) and jupyter notebooks (.ipynb).","category":"page"},{"location":"concepts/#Remarks","page":"Concepts","title":"Remarks","text":"","category":"section"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"Currently, there're two special names used in DemoCards.jl:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"assets is a preserved name for DemoCards.jl to escape preprocessing\nconfig.json is used to tell DemoCards.jl more informations of current folder.","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"To free you from managing/re-organizing demo structure, some decisions are made here:","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"maintain a config.json in each folder\nalways use relative path\nall information is supplementary and hence optional","category":"page"},{"location":"concepts/","page":"Concepts","title":"Concepts","text":"note: Note\nIf you've specified orders in config.json, then for every new demos, you need to add its filename to order. DemoCards.jl isn't smart enough to guess what you really want.","category":"page"},{"location":"list/list_section_1/list_subsection_1/list_card_1/#List-card-1","page":"List card 1","title":"List card 1","text":"","category":"section"},{"location":"list/list_section_1/list_subsection_1/list_card_1/","page":"List card 1","title":"List card 1","text":"","category":"page"},{"location":"list/list_section_1/list_subsection_1/list_card_1/","page":"List card 1","title":"List card 1","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"themeless/julia/item4/#Item4","page":"Item4","title":"Item4","text":"","category":"section"},{"location":"themeless/julia/item4/","page":"Item4","title":"Item4","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"themeless/julia/item4/","page":"Item4","title":"Item4","text":"","category":"page"},{"location":"themeless/julia/item4/","page":"Item4","title":"Item4","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"themeless/markdown/item1/#Item1","page":"Item1","title":"Item1","text":"","category":"section"},{"location":"themeless/markdown/item1/#subsection-1","page":"Item1","title":"subsection 1","text":"","category":"section"},{"location":"themeless/markdown/item1/","page":"Item1","title":"Item1","text":"This is the first subsection","category":"page"},{"location":"themeless/markdown/item1/#subsection-2","page":"Item1","title":"subsection 2","text":"","category":"section"},{"location":"themeless/markdown/item1/","page":"Item1","title":"Item1","text":"This is the section subsection","category":"page"},{"location":"themeless/markdown/item1/","page":"Item1","title":"Item1","text":"","category":"page"},{"location":"themeless/markdown/item1/","page":"Item1","title":"Item1","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_1/#Grid-card-1","page":"Grid card 1","title":"Grid card 1","text":"","category":"section"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_1/","page":"Grid card 1","title":"Grid card 1","text":"","category":"page"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_1/","page":"Grid card 1","title":"Grid card 1","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/#hidden_card","page":"This is a hidden card","title":"This is a hidden card","text":"","category":"section"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/#This-is-a-hidden-card","page":"This is a hidden card","title":"This is a hidden card","text":"","category":"section"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"This card doesn't get displayed in quickstart index page page and can only be viewed with relink [hidden card](@ref hidden_card).","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"Note that hidden cards are still processed by DemoCards to get you necessary assets.","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"using ImageCore, ImageTransformations, TestImages\n\nimresize(testimage(\"camera\"); ratio=0.25)","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"","category":"page"},{"location":"quickstart/usage_example/basics/hidden_card/","page":"This is a hidden card","title":"This is a hidden card","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"themeless/markdown/item2/#Item2","page":"Item2","title":"Item2","text":"","category":"section"},{"location":"themeless/markdown/item2/","page":"Item2","title":"Item2","text":"","category":"page"},{"location":"themeless/markdown/item2/","page":"Item2","title":"Item2","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_3/#List-card-3","page":"List card 3","title":"List card 3","text":"","category":"section"},{"location":"list/list_section_1/list_subsection_2/list_card_3/","page":"List card 3","title":"List card 3","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_3/","page":"List card 3","title":"List card 3","text":"","category":"page"},{"location":"list/list_section_1/list_subsection_2/list_card_3/","page":"List card 3","title":"List card 3","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_2/#Bulmagrid-card-2","page":"Bulmagrid card 2","title":"Bulmagrid card 2","text":"","category":"section"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_2/","page":"Bulmagrid card 2","title":"Bulmagrid card 2","text":"","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_2/","page":"Bulmagrid card 2","title":"Bulmagrid card 2","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/#Simple-markdown-demo","page":"Simple markdown demo","title":"Simple markdown demo","text":"","category":"section"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"(Image: juliadocs)","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"This demo show you what DemoCards.jl does to a markdown demo.","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"DemoCards.jl is a plugin package to Documenter.jl. Hence, in general, demos written in markdown format are directly passed to Documenter.jl without much preprocessing.","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"DemoCards.jl extracts some meta information from your demos:","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"The first title is extracted as the card title: the filename simple_markdown_demo.md gives the title \"Simple markdown demo\"\nThe first image link to Documenter.jl's logo is extracted as the cover image\nThe first paragraph is extracted as the description","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"When your mouse hover over the card, a description shows up, for example:","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"(Image: )","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"This becomes the simplest markdown demo!","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"","category":"page"},{"location":"quickstart/usage_example/basics/simple_markdown_demo/","page":"Simple markdown demo","title":"Simple markdown demo","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_4/#Grid-card-4","page":"Grid card 4","title":"Grid card 4","text":"","category":"section"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_4/","page":"Grid card 4","title":"Grid card 4","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_4/","page":"Grid card 4","title":"Grid card 4","text":"","category":"page"},{"location":"grid/grid_section_1/grid_subsection_2/grid_card_4/","page":"Grid card 4","title":"Grid card 4","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/#juliademocard_example","page":"Write your demo in julia","title":"Write your demo in julia","text":"","category":"section"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"(Image: Source code) (Image: notebook) (Image: compat) (Image: Author) (Image: Update time)","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"Different from markdown format demo, source demo files are preprocessed so that it generates:","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"assets such as cover image\njulia source file\nmardkown file\njupyter notebook file","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"Links to nbviewer and source files are provided as well.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"note: Note\nThis entails every source file being executed three times: 1) asset generation, 2) notebook generation, and 3) Documenter HTML generation. If the generation time is too long for your application, you could then choose to write your demo in markdown format. Or you can disable the notebook generation via the notebook keyword in your demos, this helps reduce the runtime to 2x.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"The conversions from source demo files to .jl, .md and .ipynb files are mainly handled by Literate.jl. The syntax to control/filter the outputs can be found here","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"x = 1//3\ny = 2//5\nx + y","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"Images can be loaded and displayed","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"using TestImages, ImageShow\nimg = testimage(\"lena\")","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"The frontmatter is also written in YAML with only a leading #, for example:","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"# ---\n# title: <title>\n# cover: <cover>\n# id: <id>\n# date: 2020-09-13\n# author: Johnny Chen\n# julia: 1.3\n# description: <description>\n# ---","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"In addition to the keywords supported by markdown files, Julia format demos accept one extra frontmatter keyword: julia. It allows you to specify the compat version of your demo. With this, DemoCards would:","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"throw a warning if your demos are generated using a lower version of Julia\ninsert a compat version badge.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"The warning is something like \"The running Julia version 1.0.5 is older than the declared compatible version 1.3.0.\"","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"Another extra keyword is notebook, it allows you to control whether you needs to generate jupyter notebook .ipynb for the demo. The valid values are true and false. See also Override default values with properties on how to disable all notebook generation via the properties entry.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"warning: Warning\nYou should be careful about the leading whitespaces after the first #. Frontmatter as weird as the following is not guaranteed to work and it is very likely to hit a YAML parsing error.#---\n# title: <title>\n# cover: <cover>\n# id: <id>\n# description: <description>\n#---","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"tip: Tip\nComments are allowed before frontmatter, but it would only be appeared in the julia source codes. Normally, you may only want to add magic comments and license information before the YAML frontmatter.","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"","category":"page"},{"location":"quickstart/usage_example/julia_demos/1.julia_demo/","page":"Write your demo in julia","title":"Write your demo in julia","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_1/#Bulmagrid-card-1","page":"Bulmagrid card 1","title":"Bulmagrid card 1","text":"","category":"section"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_1/","page":"Bulmagrid card 1","title":"Bulmagrid card 1","text":"","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_1/bulmagrid_card_1/","page":"Bulmagrid card 1","title":"Bulmagrid card 1","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"pluto/#pluto","page":"Pluto.jl support","title":"Pluto.jl notebooks support","text":"","category":"section"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"Pluto.jl is a modern interactive notebook for Julia. The Pluto notebook content is saved as a Julia script with special syntax decorations to support features like built-in dependency management and reactive cell execution. In this section, we will discuss how we can add demos written using Pluto as DemoCards.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"DemoCards.jl natively supports only Julia and markdown files. Pluto notebooks are supported via an extension to the existing package. PlutoStaticHTML.jl is used for rendering pluto notebooks to desired markdown format. The functionality for rendering pluto notebooks is automatically loaded when PlutoStaticHTML is imported into the current environment.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"note: Note\nJulia versions before julia 1.9 doesn't support the extension functionality. Requires.jl is used for conditional loading of code in older julia versions.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"The set of functionalities supported for Julia and Markdown files is also supported for Pluto. We can compose any number of Pluto, Julia or Markdown files together for a demo.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"If one of the demos contains a pluto notebook, we just need to add PlutoStaticHTML to the list of imports.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"using Documenter, DemoCards # Load functionality for markdown and julia\nusing PlutoStaticHTML # Import the pluto notebook functionality to DemoCards\n\n# The tutorials folders/sub-folders can contain pluto, julia and markdown\ntutorials, tutorials_cb, tutorial_assets = makedemos(\"tutorials\")","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"warning: Warning\nThe pluto notebooks in DemoCards are evaluated sequentially and not in parallel. This was done primarily to avoid repetitive logs in CI. We recommend using the cache functionality with the pluto notebooks in case of heavy workloads.","category":"page"},{"location":"pluto/#Adding-frontmatter-to-pluto-notebooks","page":"Pluto.jl support","title":"Adding frontmatter to pluto notebooks","text":"","category":"section"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"Pluto.jl has its own GUI to manipulate the front matter of a notebook. This makes it easier for users to create and edit frontmatter. The pluto frontmatter is not saved in YAML format. See this PR for more details.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"warning: Warning\nFrontmatter support for Pluto demoCards are currently limited to the frontmatter support for pluto. It doesn't support the inference of title, description, id or cover from the content of the notebook. Make sure to explicitly mention custom configs in the frontmatter to avoid surprises.","category":"page"},{"location":"pluto/#Cache-computationally-expensive-notebooks","page":"Pluto.jl support","title":"Cache computationally expensive notebooks","text":"","category":"section"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"Rendering a Pluto notebook is sometimes time and resource-consuming, especially in a CI environment. Fortunately, PlutoStaticHTML.jl has a cache functionality that uses outputs of previous runs as a cache. If the source pluto notebook (.jl file) or the Julia environment didn't change from the last run, the output md file of the last run is used instead of re-rendering the source. DemoCards stores all the rendered pluto notebooks in a pluto_output folder under the docs folder.","category":"page"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"During the demo creation process, DemoCards.jl checks for a file with a cache (filename with .md extension) in docs/pluto_output for each pluto notebook. For example: if the pluto notebook file name is example_demo.jl, it searches for cache with filename example_demo.md. If the cache exists and the input hash and the Julia version matches, rendering is skipped, and the cache is used as output. For more insight into the cache mechanism, visit the cache documentation on PlutoStaticHTML.","category":"page"},{"location":"pluto/#Examples","page":"Pluto.jl support","title":"Examples","text":"","category":"section"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"The usage of pluto notebooks as DemoCards can be found in GraphNeuralNetworks.jl.","category":"page"},{"location":"pluto/#References","page":"Pluto.jl support","title":"References","text":"","category":"section"},{"location":"pluto/","page":"Pluto.jl support","title":"Pluto.jl support","text":"DemoCards.PlutoDemoCard\nDemoCards.save_democards(card_dir::AbstractString, card::DemoCards.PlutoDemoCard;\n project_dir,\n src,\n credit,\n nbviewer_root_url)","category":"page"},{"location":"pluto/#DemoCards.PlutoDemoCard","page":"Pluto.jl support","title":"DemoCards.PlutoDemoCard","text":"struct PlutoDemoCard <: AbstractDemoCard\nPlutoDemoCard(path::AbstractString)\n\nConstructs a pluto-format demo card from a pluto notebook path.\n\nFields\n\nBesides path, this struct has some other fields:\n\npath: path to the source markdown file\ncover: path to the cover image\nid: cross-reference id\ntitle: one-line description of the demo card\nauthor: author(s) of this demo.\ndate: the update date of this demo.\ndescription: multi-line description of the demo card\njulia: Julia version compatibility\nhidden: whether this card is shown in the generated index page\n\nConfiguration\n\nYou can pass additional information by adding a pluto front-matter section to the notebook. Supported items are:\n\ncover: an URL or a relative path to the cover image. If not specified, it will use the first available image link, or all-white image if there's no image links.\ndescription: a multi-line description to this file, will be displayed when the demo card is hovered. By default it uses title.\nid: specify the id tag for cross-references. By default it's infered from the filename, e.g., simple_demo from simple demo.jl.\ntitle: one-line description to this file, will be displayed under the cover image. By default, it's the name of the file (without extension).\nauthor: author name. If there are multiple authors, split them with semicolon ;.\njulia: Julia version compatibility. Any string that can be converted to VersionNumber\ndate: any string contents that can be passed to Dates.DateTime. For example, 2020-09-13.\nhidden: whether this card is shown in the layout of index page. The default value is false.\n\nAn example of pluto front matter in the notebook:\n\n#> [frontmatter]\n#> title = \"passing extra information\"\n#> cover = \"cover.png\"\n#> id = \"non_ambiguious_id\"\n#> author = \"Jane Doe; John Roe\"\n#> date = \"2020-01-31\"\n#> description = \"this demo shows how you can pass extra demo information to DemoCards package. All these are optional.\"\n#> julia: \"1.0\"\n#> hidden: \"false\"\n\nSee also: MarkdownDemoCard, JuliaDemoCard, DemoSection, DemoPage\n\n\n\n\n\n","category":"type"},{"location":"pluto/#DemoCards.save_democards-Tuple{AbstractString, DemoCards.PlutoDemoCard}","page":"Pluto.jl support","title":"DemoCards.save_democards","text":"save_democards(card_dir::AbstractString, card::PlutoDemoCard;\n project_dir,\n src,\n credit,\n nbviewer_root_url)\n\nProcess the original pluto notebook and saves it.\n\nThe processing pipeline is:\n\npreprocess and copy source file\ngenerate markdown file\ncopy the markdown file to cache folder\ninsert header and footer to generated markdown file\n\n\n\n\n\n","category":"method"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/#Bulmagrid-card-4","page":"Bulmagrid card 4","title":"Bulmagrid card 4","text":"","category":"section"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/","page":"Bulmagrid card 4","title":"Bulmagrid card 4","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/","page":"Bulmagrid card 4","title":"Bulmagrid card 4","text":"","category":"page"},{"location":"bulmagrid/bulmagrid_section_1/bulmagrid_subsection_2/bulmagrid_card_4/","page":"Bulmagrid card 4","title":"Bulmagrid card 4","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_2/#Grid-card-2","page":"Grid card 2","title":"Grid card 2","text":"","category":"section"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_2/","page":"Grid card 2","title":"Grid card 2","text":"","category":"page"},{"location":"grid/grid_section_1/grid_subsection_1/grid_card_2/","page":"Grid card 2","title":"Grid card 2","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_2/#Bokehlist-card-2","page":"Bokehlist card 2","title":"Bokehlist card 2","text":"","category":"section"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_2/","page":"Bokehlist card 2","title":"Bokehlist card 2","text":"","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_2/","page":"Bokehlist card 2","title":"Bokehlist card 2","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"bokehlist/#Theme:-BokehList","page":"Theme: BokehList","title":"Theme: BokehList","text":"","category":"section"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"BokehList is a list theme used in Bokeh.jl.","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"Given demos organized as following, you can make them displayed as a list of charts","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"bokehlist\n├── assets\n│   └── logo.svg\n├── config.json\n├── bokehlist_section_1\n│   ├── bokehlist_subsection_1\n│   │   ├── bokehlist_card_1.md\n│   │   └── bokehlist_card_2.md\n│   └── bokehlist_subsection_2\n│   ├── bokehlist_card_3.md\n│   └── bokehlist_card_4.md\n└── index.md","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"bokehlist_demopage, bokehlist_cb, bokehlist_assets = makedemos(\"theme_gallery/bokehlist\", bokehlist_templates)","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"The page configuration file bokehlist/config.json should contain an entry theme = \"bokehlist\", e.g.,","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"{\n \"theme\": \"bokehlist\"\n}","category":"page"},{"location":"bokehlist/#Bokehlist-section-1","page":"Theme: BokehList","title":"Bokehlist section 1","text":"","category":"section"},{"location":"bokehlist/#Bokehlist-subsection-1","page":"Theme: BokehList","title":"Bokehlist subsection 1","text":"","category":"section"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card-section\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"bokeh-list-card-cover\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"(Image: bokeh-list-card-cover-image)","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div></td>\n <td><div class=\"bokeh-list-card-text\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"Bokehlist card 1","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>\n <div class=\"bokeh-list-card-description\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"some description here","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"bokeh-list-card-cover\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"(Image: bokeh-list-card-cover-image)","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div></td>\n <td><div class=\"bokeh-list-card-text\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"Bokehlist card 2","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>\n <div class=\"bokeh-list-card-description\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"some description here","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>","category":"page"},{"location":"bokehlist/#Bokehlist-subsection-2","page":"Theme: BokehList","title":"Bokehlist subsection 2","text":"","category":"section"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card-section\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"bokeh-list-card-cover\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"(Image: bokeh-list-card-cover-image)","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div></td>\n <td><div class=\"bokeh-list-card-text\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"Bokehlist card 3","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>\n <div class=\"bokeh-list-card-description\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"some description here","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"<div class=\"bokeh-list-card\">\n<table>\n <td valign=\"bottom\"><div class=\"bokeh-list-card-cover\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"(Image: bokeh-list-card-cover-image)","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div></td>\n <td><div class=\"bokeh-list-card-text\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"Bokehlist card 4","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>\n <div class=\"bokeh-list-card-description\">","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"some description here","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":" </div>\n </td>\n</tbody></table>\n</div>","category":"page"},{"location":"bokehlist/","page":"Theme: BokehList","title":"Theme: BokehList","text":"</div>","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/#Configure-your-section-and-page","page":"Configure your section and page","title":"Configure your section and page","text":"","category":"section"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"This demo shows you how to configure your demo page and sections.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"By default, a demo section takes the folder name as its section title, and it takes the file orders as its card orders, which can be unsatisfying in many cases. Luckily, DemoCards.jl reads the config.json file in the section folder, for example:","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"{\n \"title\": \"Basic Usage\",\n \"order\": [\n \"simple_markdown_demo.md\",\n \"configure_with_yaml.md\"\n ]\n}","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"A demo page is maintained in a similar manner, except that it needs extra keys to configure the template page. For example:","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"{\n \"template\": \"template.md\",\n \"theme\": \"grid\",\n \"order\": [\n \"basic\",\n \"advanced\"\n ]\n}","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"If template is not specified, \"index.md\" will be used if available, otherwise, it will use a blank template generated by DemoCards.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"There are three possible options for theme:","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"\"nothing\": It won't generate the index page, instead, it will use the sidebar generated by Documenter for navigation purpose. template option doesn't affect, neither.\n\"grid\": a grid like index page.\n\"list\": a list like index page.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"You can check the \"Theme Gallery\" to see how different themes look like.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/#[Override-default-values-with-properties](@ref-page_sec_properties)","page":"Configure your section and page","title":"Override default values with properties","text":"","category":"section"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"Another item that could be useful is properties, it is written as a dictionary-like format, and provides a way to override some default values. Properties can be configured at any level and it follows very simple rules:","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"Properties at a higher level item can be propagated into lower level items\nProperties at lower level items are of higher priority","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"example_page/\n├── config.json\n├── sec1\n│ ├── config.json\n│ ├── demo1.jl\n│ ├── demo2.jl\n│ └── demo3.md\n└── sec2\n ├── demo4.jl\n └── demo5.jl","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"For example, in the above folder structure, if we configure example_page/config.json with","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"{\n \"properties\":{\n \"notebook\": \"false\"\n }\n}","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"Then all julia demos will not generate jupyter notebook unless it's override somewhere in the lower level, e.g, sec1/config.json or demo1.jl.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"Only a subset of demo entries support the property propagation, currently supported items are:","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"Julia files: notebook allows you to enable/disable the jupyter notebook generation.","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"","category":"page"},{"location":"quickstart/usage_example/basics/configure_sec_and_page/","page":"Configure your section and page","title":"Configure your section and page","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_1/#Bokehlist-card-1","page":"Bokehlist card 1","title":"Bokehlist card 1","text":"","category":"section"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_1/","page":"Bokehlist card 1","title":"Bokehlist card 1","text":"","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_1/bokehlist_card_1/","page":"Bokehlist card 1","title":"Bokehlist card 1","text":"This page was generated using DemoCards.jl.","category":"page"},{"location":"themeless/julia/item3/#Item3","page":"Item3","title":"Item3","text":"","category":"section"},{"location":"themeless/julia/item3/","page":"Item3","title":"Item3","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"themeless/julia/item3/","page":"Item3","title":"Item3","text":"","category":"page"},{"location":"themeless/julia/item3/","page":"Item3","title":"Item3","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"preview/#preview","page":"Partial build","title":"Partial build","text":"","category":"section"},{"location":"preview/#The-REPL-way","page":"Partial build","title":"The REPL way","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Typically, when you write up examples and demos using DemoCards, you'll need to do include(\"docs/make.jl) to trigger a rebuild for many times. This is okay, just not that fast as you need to rebuild the whole documentation even if you are just making some trivial typo checks. This page shows how you could make this experience smoother, especially for julia demos.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"DemoCards uses Literate.jl as the backend to transform your julia files to markdown and jupyter notebook. This means that you can code up your example file with whatever programming environment you like. For example, you can use Ctrl-Enter to execute your codes line by line in Juno/VSCode, check the output, add comments, and so on; all these can be done without the need to build the documentation. ","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"For example, assume that you are writing a demos/sec1/demo1.jl","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"# demos/sec1/demo1.jl\n\nusing Images # you can `Ctrl-Enter` in VSCode to execute this line\n\nimg = testimage(\"camera\") # `Ctrl-Enter` again, and see the output in the plot panel\n\n# and add more example codes in a REPL way","category":"page"},{"location":"preview/#Beyond-REPL","page":"Partial build","title":"Beyond REPL","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"This REPL workflow works pretty well and responsive until you start to building the documentation. For example, There are a lot of demos in JuliaImages demos and it takes several minutes to build the whole documentation. If we're only to make many some small modifications to one of the demo, then it would be pretty painful to wait the whole build pipeline ends. After all, why should we build demos we don't care about? Fortunately, DemoCards provides a sandbox environment for you to preview your demos without doing so, which is preview_demos.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Assume that your docs/make.jl is written up like the following:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"# 1. generate demo files\ndemopage, postprocess_cb, demo_assets = makedemos(\"demos\") # this is the relative path to docs/\n\n# if there are generated css assets, pass it to Documenter.HTML\nassets = []\nisnothing(demo_assets) || (push!(assets, demo_assets))\n\n# 2. normal Documenter usage\nformat = Documenter.HTML(assets = assets)\nmakedocs(format = format,\n pages = [\n \"Home\" => \"index.md\",\n demopage,\n ],\n sitename = \"Awesome demos\")\n\n# 3. postprocess after makedocs\npostprocess_cb()","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"To preview only one demo in demos folder, say, demos/sec1/demo1.jl, what you need to do is:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"preview_demos(\"docs/demos/sec1/demo1.jl\")","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"It will output the path to the generated index.html file, for example, it might be something like this:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"\"/var/folders/c0/p23z1x6x3jg_qtqsy_r421y40000gn/T/jl_5sc8fM/build/democards/demos/index.html\"","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Open this file in your favorite browser, and you'll see a reduced version of the demo page, which only contains one demo file. Other unrelated contents are not included in this page.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"This preview_demos function is not reserved for single file, it works for folders, too. For example, you could use it with preview_demos(\"demos/sec1\"), or just preview_demos(\"demos\").","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"preview_demos does not do anything magic, it simply copies the single demo file and its assets into a sandbox folder, and trigger the Documenter.makedocs in that folder. Because it doesn't contain any other files, this process becomes much faster than include(\"docs/make.jl\") workflow. Compared to rebuild the whole documentation, building a preview version only adds about 1 extra second to include(\"demo1.jl\").","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"If the file is placed in a typical demo page folder structure, preview_demos(file) will preserve that structure. In cases that demo page folder structure is not detected, it will instead create such a folder structure. You can check the following JuliaImages example to see how it looks like.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"tip: Tip\nprewview_demos accepts an additional theme keyword, that you can use this to override the page theme specified in config.json. For example, if \"grid\" theme is specified in config.json file, calling preview_demos(\"demos\", theme=\"list\") would just get you to the list style look without any changes.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"note: Note\npreview_demos does not include any other part of the documentation in the preview, hence reflinks are very likely to be broken and you will receieve warnings about that. In this case, you still need to include(\"docs/make.jl\") to rebuild the whole documentation if reflinks are what you concern about.","category":"page"},{"location":"preview/#Example-–-JuliaImages","page":"Partial build","title":"Example – JuliaImages","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Let's take the docs of JuliaImages as a live example, and illustrate how preview_demos can be used in practice.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"First, let's clone the JuliaImages docs repo:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"git clone https://github.com/JuliaImages/juliaimages.github.io.git\ncd juliaimages.github.io.git","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"The result might change, but you can still get the idea.","category":"page"},{"location":"preview/#preview-the-whole-demo-page","page":"Partial build","title":"preview the whole demo page","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"The following page is generated by preview_demos(\"docs/examples\"), note that all other documentation contents are not generated in this page. It only contains the contents in \"docs/examples\".","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"(Image: preview page)","category":"page"},{"location":"preview/#Preview-one-section-in-the-demo-page","page":"Partial build","title":"Preview one section in the demo page","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"This is the page generated by preview_demos(\"docs/examples/color_channels\"), it only generates the \"Color Channels\" section:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"(Image: preview section)","category":"page"},{"location":"preview/#Preview-only-one-file-in-the-demo-page","page":"Partial build","title":"Preview only one file in the demo page","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"This is the page generated by preview_demos(\"docs/examples/color_separations_svd.jl\") with only one demo generated.","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"(Image: preview one demo)","category":"page"},{"location":"preview/#Preview-files-without-demo-page-structure","page":"Partial build","title":"Preview files without demo page structure","text":"","category":"section"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Assume that you have the following folder structure:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"testimages/\n├── cameraman.jl\n└── mandril.jl","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"with each file written in this way:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"# This shows how you can load the mandril test image\n\nusing Images, TestImages\nimg = testimage(\"mandril\")\nsave(\"assets/mandril.png\", img); #hide #md\n\n# ![](assets/mandril.png)","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"Doing this with make_demos(\"testimages\") would just fails because it is not a recognizable folder structure, but preview_demos(\"testimages\") works nicely with this by creating a wrapper folder preview page:","category":"page"},{"location":"preview/","page":"Partial build","title":"Partial build","text":"(Image: preview random files)","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/#Bokehlist-card-3","page":"Bokehlist card 3","title":"Bokehlist card 3","text":"","category":"section"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/","page":"Bokehlist card 3","title":"Bokehlist card 3","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/","page":"Bokehlist card 3","title":"Bokehlist card 3","text":"","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_3/","page":"Bokehlist card 3","title":"Bokehlist card 3","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"structure/#manipulation","page":"Structure manipulation","title":"Structure manipulation","text":"","category":"section"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"It is not uncommon that you'd need to manipulate the folder structure of your demos. For example, when you are creating new demos, or when you need to reorder the demos and sections. The core design of DemoCards.jl is to make such operation as trivial as possible; the less you modify make.jl, the safer you'll be.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"I'll explain it case by case, hopefully you'd get how things work out with DemoCards.jl.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Throughout this page, I'll use the following folder structure as an example:","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"examples\n├── part1\n│ ├── assets\n│ ├── config.json\n│ ├── demo_1.md\n│ ├── demo_2.md\n│ └── demo_3.md\n└── part2\n ├── demo_4.jl\n └── demo_5.jl","category":"page"},{"location":"structure/#To-add/remove/rename-a-demo-file","page":"Structure manipulation","title":"To add/remove/rename a demo file","text":"","category":"section"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Suppose we need to add one demo_6.jl in section \"part2\", just add the file in examples/part2 folder. Everything just works without the need to touch make.jl.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Adding demo_6.jl in section \"part1\" would be a little bit different, because there's a config file for this section: examples/part1/config.json. If \"order\" is not defined in the config file, it would be the same story. If \"order\" is defined in the config file, then you'll do one more step to specify the exact order you want demo_5.jl be placed at.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Removing/renaming the demo file is similar that, if needed, you'll need to remove/rename the demo from \"order\" in the config file.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"You have to do so because DemoCards is not smart enough to guess a partial order for you. Otherwise DemoCards would throw an error on it, for example, this is the error message if I change demo_1.md to demo1.md.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"┌ Warning: The following entries in examples/part1/config.json are not used anymore:\n│ demo_1.md\n└ @ DemoCards ~/Documents/Julia/DemoCards/src/utils.jl:29\n┌ Warning: The following entries in examples/part1/config.json are missing:\n│ demo1.md\n└ @ DemoCards ~/Documents/Julia/DemoCards/src/utils.jl:32\nERROR: LoadError: ArgumentError: incorrect order in examples/part1/config.json, please check the previous warning message.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"The error message says you have to modify the \"orders\" item in examples/part1/config.json accordingly.","category":"page"},{"location":"structure/#To-rename-a-section","page":"Structure manipulation","title":"To rename a section","text":"","category":"section"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Suppose we want to rename \"Part1\" to something more meaningful, say \"Markdown demos\". There are two ways to do so:","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"rename \"examples/part1\" to \"examples/markdown demos\"\nadd \"title\" = \"Markdown demos\" item in examples/part1/config.json.","category":"page"},{"location":"structure/#To-move-section-around","page":"Structure manipulation","title":"To move section around","text":"","category":"section"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"If everything demo_1.md, demo_2.md, demo_3.md needed are placed in examples/part1/assets, then it would be just a piece of cake to move the entire examples/part1 folder around. Say, move examples/part1 to examples/part1/markdown.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"To minimize the changes you need to do when you organize your demos, here's some general advice:","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Keep an assets folder for each of your section.\nTry to avoid specifying path in other folders.","category":"page"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"This is just some advice and you don't have to follow it. After all, we don't really change the folder structure that often.","category":"page"},{"location":"structure/#To-change-the-page-theme","page":"Structure manipulation","title":"To change the page theme","text":"","category":"section"},{"location":"structure/","page":"Structure manipulation","title":"Structure manipulation","text":"Change the \"theme\" item in examples/config.json and that's all.","category":"page"},{"location":"#DemoCards.jl","page":"Home","title":"DemoCards.jl","text":"","category":"section"},{"location":"","page":"Home","title":"Home","text":"Let's focus on writing good demos.","category":"page"},{"location":"","page":"Home","title":"Home","text":"A plugin package to Documenter.jl that dynamically generate demos and associated assets for you.","category":"page"},{"location":"","page":"Home","title":"Home","text":"note: Note\nPlease read the Documenter.jl documentation first if you're unfamiliar with the julia documentation system.","category":"page"},{"location":"#Package-Features","page":"Home","title":"Package Features","text":"","category":"section"},{"location":"","page":"Home","title":"Home","text":"a plugin package to Documenter.jl to manage all your demos.\nfolder structure is the demo structure.\nminimal configuration.\nCI friendly\nsupport demos in markdown and julia format.","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/#Bokehlist-card-4","page":"Bokehlist card 4","title":"Bokehlist card 4","text":"","category":"section"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/","page":"Bokehlist card 4","title":"Bokehlist card 4","text":"(Image: Source code) (Image: notebook)","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/","page":"Bokehlist card 4","title":"Bokehlist card 4","text":"","category":"page"},{"location":"bokehlist/bokehlist_section_1/bokehlist_subsection_2/bokehlist_card_4/","page":"Bokehlist card 4","title":"Bokehlist card 4","text":"This page was generated using DemoCards.jl and Literate.jl.","category":"page"},{"location":"grid/#theme-grid","page":"Theme: Grid","title":"Theme: Grid","text":"","category":"section"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"A basic DemoCards theme for grid-like layout.","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"Given demos organized as following, you can make them displayed in grid-like manner","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"grid\n├── assets\n│   └── logo.svg\n├── config.json\n├── grid_section_1\n│   ├── grid_subsection_1\n│   │   ├── grid_card_1.md\n│   │   └── grid_card_2.md\n│   └── grid_subsection_2\n│   ├── grid_card_3.md\n│   └── grid_card_4.md\n└── index.md","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"grid_demopage, grid_cb, grid_assets = makedemos(\"theme_gallery/grid\", grid_templates)","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"The page configuration file grid/config.json should contain an entry theme = \"grid\", e.g.,","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"{\n \"theme\": \"grid\"\n}","category":"page"},{"location":"grid/#Grid-section-1","page":"Theme: Grid","title":"Grid section 1","text":"","category":"section"},{"location":"grid/#Grid-subsection-1","page":"Theme: Grid","title":"Grid subsection 1","text":"","category":"section"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"grid-card-section\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"some description here","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"(Image: card-cover-image)","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"Grid card 1","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"some description here","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"(Image: card-cover-image)","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"Grid card 2","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"},{"location":"grid/#Grid-subsection-2","page":"Theme: Grid","title":"Grid subsection 2","text":"","category":"section"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"grid-card-section\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"some description here","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"(Image: card-cover-image)","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"Grid card 3","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"<div class=\"card grid-card\">\n<div class=\"grid-card-cover\">\n<div class=\"grid-card-description\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"some description here","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"(Image: card-cover-image)","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n<div class=\"grid-card-text\">","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"Grid card 4","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>\n</div>","category":"page"},{"location":"grid/","page":"Theme: Grid","title":"Theme: Grid","text":"</div>","category":"page"}] } diff --git a/dev/structure/index.html b/dev/structure/index.html index 97176c90..180ddd64 100644 --- a/dev/structure/index.html +++ b/dev/structure/index.html @@ -14,4 +14,4 @@ ┌ Warning: The following entries in examples/part1/config.json are missing: │ demo1.md └ @ DemoCards ~/Documents/Julia/DemoCards/src/utils.jl:32 -ERROR: LoadError: ArgumentError: incorrect order in examples/part1/config.json, please check the previous warning message.</code></pre><p>The error message says you have to modify the "orders" item in <code>examples/part1/config.json</code> accordingly.</p><h2 id="To-rename-a-section"><a class="docs-heading-anchor" href="#To-rename-a-section">To rename a section</a><a id="To-rename-a-section-1"></a><a class="docs-heading-anchor-permalink" href="#To-rename-a-section" title="Permalink"></a></h2><p>Suppose we want to rename <code>"Part1"</code> to something more meaningful, say <code>"Markdown demos"</code>. There are two ways to do so:</p><ul><li>rename <code>"examples/part1"</code> to <code>"examples/markdown demos"</code></li><li>add <code>"title" = "Markdown demos"</code> item in <code>examples/part1/config.json</code>.</li></ul><h2 id="To-move-section-around"><a class="docs-heading-anchor" href="#To-move-section-around">To move section around</a><a id="To-move-section-around-1"></a><a class="docs-heading-anchor-permalink" href="#To-move-section-around" title="Permalink"></a></h2><p>If everything <code>demo_1.md</code>, <code>demo_2.md</code>, <code>demo_3.md</code> needed are placed in <code>examples/part1/assets</code>, then it would be just a piece of cake to move the entire <code>examples/part1</code> folder around. Say, move <code>examples/part1</code> to <code>examples/part1/markdown</code>.</p><p>To minimize the changes you need to do when you organize your demos, here's some general advice:</p><ul><li>Keep an <code>assets</code> folder for each of your section.</li><li>Try to avoid specifying path in other folders.</li></ul><p>This is just some advice and you don't have to follow it. After all, we don't really change the folder structure that often.</p><h2 id="To-change-the-page-theme"><a class="docs-heading-anchor" href="#To-change-the-page-theme">To change the page theme</a><a id="To-change-the-page-theme-1"></a><a class="docs-heading-anchor-permalink" href="#To-change-the-page-theme" title="Permalink"></a></h2><p>Change the <code>"theme"</code> item in <code>examples/config.json</code> and that's all.</p></article><nav class="docs-footer"><a class="docs-footer-prevpage" href="../preview/">« Partial build</a><a class="docs-footer-nextpage" href="../pluto/">Pluto.jl support »</a><div class="flexbox-break"></div><p class="footer-message">Powered by <a href="https://github.com/JuliaDocs/Documenter.jl">Documenter.jl</a> and the <a href="https://julialang.org/">Julia Programming Language</a>.</p></nav></div><div class="modal" id="documenter-settings"><div class="modal-background"></div><div class="modal-card"><header class="modal-card-head"><p class="modal-card-title">Settings</p><button class="delete"></button></header><section class="modal-card-body"><p><label class="label">Theme</label><div class="select"><select id="documenter-themepicker"><option value="documenter-light">documenter-light</option><option value="documenter-dark">documenter-dark</option></select></div></p><hr/><p>This document was generated with <a href="https://github.com/JuliaDocs/Documenter.jl">Documenter.jl</a> version 0.27.25 on <span class="colophon-date" title="Wednesday 9 August 2023 02:51">Wednesday 9 August 2023</span>. Using Julia version 1.9.2.</p></section><footer class="modal-card-foot"></footer></div></div></div></body></html> +ERROR: LoadError: ArgumentError: incorrect order in examples/part1/config.json, please check the previous warning message.</code></pre><p>The error message says you have to modify the "orders" item in <code>examples/part1/config.json</code> accordingly.</p><h2 id="To-rename-a-section"><a class="docs-heading-anchor" href="#To-rename-a-section">To rename a section</a><a id="To-rename-a-section-1"></a><a class="docs-heading-anchor-permalink" href="#To-rename-a-section" title="Permalink"></a></h2><p>Suppose we want to rename <code>"Part1"</code> to something more meaningful, say <code>"Markdown demos"</code>. There are two ways to do so:</p><ul><li>rename <code>"examples/part1"</code> to <code>"examples/markdown demos"</code></li><li>add <code>"title" = "Markdown demos"</code> item in <code>examples/part1/config.json</code>.</li></ul><h2 id="To-move-section-around"><a class="docs-heading-anchor" href="#To-move-section-around">To move section around</a><a id="To-move-section-around-1"></a><a class="docs-heading-anchor-permalink" href="#To-move-section-around" title="Permalink"></a></h2><p>If everything <code>demo_1.md</code>, <code>demo_2.md</code>, <code>demo_3.md</code> needed are placed in <code>examples/part1/assets</code>, then it would be just a piece of cake to move the entire <code>examples/part1</code> folder around. Say, move <code>examples/part1</code> to <code>examples/part1/markdown</code>.</p><p>To minimize the changes you need to do when you organize your demos, here's some general advice:</p><ul><li>Keep an <code>assets</code> folder for each of your section.</li><li>Try to avoid specifying path in other folders.</li></ul><p>This is just some advice and you don't have to follow it. After all, we don't really change the folder structure that often.</p><h2 id="To-change-the-page-theme"><a class="docs-heading-anchor" href="#To-change-the-page-theme">To change the page theme</a><a id="To-change-the-page-theme-1"></a><a class="docs-heading-anchor-permalink" href="#To-change-the-page-theme" title="Permalink"></a></h2><p>Change the <code>"theme"</code> item in <code>examples/config.json</code> and that's all.</p></article><nav class="docs-footer"><a class="docs-footer-prevpage" href="../preview/">« Partial build</a><a class="docs-footer-nextpage" href="../pluto/">Pluto.jl support »</a><div class="flexbox-break"></div><p class="footer-message">Powered by <a href="https://github.com/JuliaDocs/Documenter.jl">Documenter.jl</a> and the <a href="https://julialang.org/">Julia Programming Language</a>.</p></nav></div><div class="modal" id="documenter-settings"><div class="modal-background"></div><div class="modal-card"><header class="modal-card-head"><p class="modal-card-title">Settings</p><button class="delete"></button></header><section class="modal-card-body"><p><label class="label">Theme</label><div class="select"><select id="documenter-themepicker"><option value="documenter-light">documenter-light</option><option value="documenter-dark">documenter-dark</option></select></div></p><hr/><p>This document was generated with <a href="https://github.com/JuliaDocs/Documenter.jl">Documenter.jl</a> version 0.27.25 on <span class="colophon-date" title="Wednesday 9 August 2023 02:52">Wednesday 9 August 2023</span>. Using Julia version 1.9.2.</p></section><footer class="modal-card-foot"></footer></div></div></div></body></html> diff --git a/dev/themeless/julia/item3/index.html b/dev/themeless/julia/item3/index.html index 4c72aaa2..d4f1b08e 100644 --- a/dev/themeless/julia/item3/index.html +++ b/dev/themeless/julia/item3/index.html @@ -1,2 +1,2 @@ <!DOCTYPE html> -<html lang="en"><head><meta charset="UTF-8"/><meta name="viewport" content="width=device-width, initial-scale=1.0"/><title>Item3 · DemoCards.jl
      Edit on GitHub
      +Item3 · DemoCards.jl
      Edit on GitHub
      diff --git a/dev/themeless/julia/item4/index.html b/dev/themeless/julia/item4/index.html index 7dba830d..b126f580 100644 --- a/dev/themeless/julia/item4/index.html +++ b/dev/themeless/julia/item4/index.html @@ -1,2 +1,2 @@ -Item4 · DemoCards.jl
      Edit on GitHub
      +Item4 · DemoCards.jl
      Edit on GitHub
      diff --git a/dev/themeless/markdown/item1/index.html b/dev/themeless/markdown/item1/index.html index e898e17b..caeed38c 100644 --- a/dev/themeless/markdown/item1/index.html +++ b/dev/themeless/markdown/item1/index.html @@ -1,2 +1,2 @@ -Item1 · DemoCards.jl
      Edit on GitHub
      +Item1 · DemoCards.jl
      Edit on GitHub
      diff --git a/dev/themeless/markdown/item2/index.html b/dev/themeless/markdown/item2/index.html index d6aff5dd..3ad166f0 100644 --- a/dev/themeless/markdown/item2/index.html +++ b/dev/themeless/markdown/item2/index.html @@ -1,2 +1,2 @@ -Item2 · DemoCards.jl
      Edit on GitHub
      +Item2 · DemoCards.jl
      Edit on GitHub