Skip to content

Commit

Permalink
Render bookdown
Browse files Browse the repository at this point in the history
  • Loading branch information
jhudsl-robot committed May 26, 2022
1 parent 6ba8344 commit 2ce313a
Show file tree
Hide file tree
Showing 13 changed files with 572 additions and 203 deletions.
51 changes: 0 additions & 51 deletions docs/01-intro.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,57 +3,6 @@

# Introduction

To add a warning box like the following use:

`<div class = "warning">`

Followed by the text you want inside/

`</div>`

The line above marks the end of the box.

This will create the following:

<div class = "warning">

Followed by the text you want inside/

</div>

Here is a `<div class = "notice">` box:

<div class = "notice">

note text

</div>

Here is a `<div class = "github">` box:

<div class = "github">

github text

</div>


Here is a `<div class = "dictionary">` box:

<div class = "dictionary">

dictionary text

</div>


Here is a `<div class = "reflection">` box:

<div class = "reflection">

reflection text

</div>

## Motivation

Expand Down
165 changes: 128 additions & 37 deletions docs/02-chapter_of_course.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,18 @@

# A new chapter

*If you haven't yet read the getting started Wiki pages; [start there](https://github.com/jhudsl/OTTR_Template/wiki/Getting-started)
If you haven't yet read the getting started Wiki pages; [start there](https://github.com/jhudsl/OTTR_Template/wiki/Getting-started).

To see the rendered version of this chapter and the rest of the template, see here: https://jhudatascience.org/OTTR_Template/.

Every chapter needs to start out with this chunk of code:




## Learning Objectives

*Every chapter also needs Learning objectives that will look like this:
Every chapter also needs Learning objectives that will look like this:

This chapter will cover:

Expand All @@ -27,15 +30,17 @@ For this chapter, we'll need the following packages attached:
library(magrittr)
```

# Topic of Section
## Topic of Section

You can write all your text in sections like this!
You can write all your text in sections like this, using `##` to indicate a new header. you can use additional pound symbols to create lower levels of headers.

## Subtopic
See [here](https://www.rstudio.com/wp-content/uploads/2015/02/rmarkdown-cheatsheet.pdf) for additional general information about how you can format text within R Markdown files. In addition, see [here](https://pandoc.org/MANUAL.html#pandocs-markdown) for more in depth and advanced options.

Here's a subheading and some text in this subsection!
### Subtopic

### Code examples
Here's a subheading (using three pound symbols) and some text in this subsection!

## Code examples

You can demonstrate code like this:

Expand Down Expand Up @@ -97,25 +102,27 @@ dev.off()
## 2
```

### Image example
## Image example

How to include a Google slide. It's simplest to use the `ottrpal` package:

![](resources/images/02-chapter_of_course_files/figure-docx//1YmwKdIy9BeQ3EShgZhvtb3MgR8P6iDX4DfFD65W_gdQ_gcc4fbee202_0_141.png)

But if you have the slide or some other image locally downloaded you can also use html like this:
![](resources/images/02-chapter_of_course_files/figure-docx//1YmwKdIy9BeQ3EShgZhvtb3MgR8P6iDX4DfFD65W_gdQ_gcc4fbee202_0_141.png){width=100%}

But if you have the slide or some other image locally downloaded you can also use HTML like this:

<img src="resources/images/02-chapter_of_course_files/figure-html//1YmwKdIy9BeQ3EShgZhvtb3MgR8P6iDX4DfFD65W_gdQ_gcc4fbee202_0_141.png" title="Major point!! example image" alt="Major point!! example image" style="display: block; margin: auto;" />

### Video examples
## Video examples
You may also want to embed videos in your course. If alternatively, you just want to include a link you can do so like this:

To show videos in your course, you can use markdown syntax like this:
Check out this [link to a video](https://www.youtube.com/embed/VOCYL-FNbr0) using markdown syntax.

[A video we want to show](https://www.youtube.com/embed/VOCYL-FNbr0)
### Using `knitr`

To embed videos in your course, you can use `knitr::include_url()` like this:
Note that you should use `echo=FALSE` in the code chunk because we don't want the code part of this to show up. If you are unfamiliar with [how R Markdown code chunks work, read this](https://rmarkdown.rstudio.com/lesson-3.html).

Alternatively, you can use `knitr::include_url()` like this:
Note that we are using `echo=FALSE` in the code chunk because we don't want the code part of this to show up.
If you are unfamiliar with [how R Markdown code chunks work, read this](https://rmarkdown.rstudio.com/lesson-3.html).


```
Expand All @@ -124,41 +131,48 @@ If you are unfamiliar with [how R Markdown code chunks work, read this](https://

<iframe src="https://www.youtube.com/embed/VOCYL-FNbr0" width="100%" height="400px"></iframe>

OR this works:
### Using HTML

<iframe src="https://www.youtube.com/embed/VOCYL-FNbr0" width="672" height="400px"></iframe>

### Links to files
## File examples

This works:
You can again use simple markdown syntax to just include a link to a file like so:

[A file](https://www.bgsu.edu/content/dam/BGSU/center-for-faculty-excellence/docs/TLGuides/TLGuide-Learning-Objectives.pdf).

Alternatively you can embed files like PDFs.

<iframe src="https://www.bgsu.edu/content/dam/BGSU/center-for-faculty-excellence/docs/TLGuides/TLGuide-Learning-Objectives.pdf" width="100%" height="800px"></iframe>
### Using `knitr`

Or this:
<iframe src="https://academicaffairs.ucsc.edu/events/documents/Microaggressions_Examples_Arial_2014_11_12.pdf" width="100%" height="400px"></iframe>

[This works](https://www.bgsu.edu/content/dam/BGSU/center-for-faculty-excellence/docs/TLGuides/TLGuide-Learning-Objectives.pdf).

Or this:

<iframe src="https://www.bgsu.edu/content/dam/BGSU/center-for-faculty-excellence/docs/TLGuides/TLGuide-Learning-Objectives.pdf" width="672" height="800px"></iframe>
### Using HTML

### Links to websites
<iframe src="https://academicaffairs.ucsc.edu/events/documents/Microaggressions_Examples_Arial_2014_11_12.pdf" width="672" height="800px"></iframe>

Examples of including a website link.
## Website Examples

Yet again you can use a link to a website like so:

[A Website](https://yihui.org)

Or, you can embed some websites.

### Using `knitr`

This works:

<iframe src="https://yihui.org" width="100%" height="400px"></iframe>

OR this:

![Another link](https://yihui.org)

OR this:
### Using HTML

<iframe src="https://yihui.org" width="672" height="400px"></iframe>

### Citation examples
## Citation examples

We can put citations at the end of a sentence like this [@rmarkdown2021].
Or multiple citations [@rmarkdown2021, @Xie2018].
Expand All @@ -167,16 +181,94 @@ but they need a ; separator [@rmarkdown2021; @Xie2018].

In text, we can put citations like this @rmarkdown2021.

### FYI boxes
## Stylized boxes

Occasionally, you might find it useful to emphasize a particular piece of information. To help you do so, we have provided css code and images (no need for you to worry about that!) to create the following stylized boxes.

You can use these boxes in your course with either of two options: using HTML code or Pandoc syntax.

::: {.fyi}
### Using `rmarkdown` container syntax

The `rmarkdown` package allows for a different syntax to be converted to the HTML that you just saw and also allows for conversion to LaTeX. See the [Bookdown](https://bookdown.org/yihui/rmarkdown-cookbook/custom-blocks.html) documentation for more information [@Xie2020]. Note that Bookdown uses Pandoc.


```
::: {.notice}
Note using rmarkdown syntax.
:::
```

::: {.notice}
Note using rmarkdown syntax.

:::

As an example you might do something like this:

::: {.notice}
Please click on the subsection headers in the left hand
navigation bar (e.g., 2.1, 4.3) a second time to expand the
table of contents and enable the `scroll_highlight` feature
([see more](introduction.html#scroll-highlight)).
([see more](introduction.html#scroll-highlight))
:::

### Dropdown summaries

### Using HTML

To add a warning box like the following use:

```
<div class = "notice">
Followed by the text you want inside
</div>
```

This will create the following:

<div class = "notice">

Followed by the text you want inside

</div>

Here is a `<div class = "warning">` box:

<div class = "warning">

Note text

</div>

Here is a `<div class = "github">` box:

<div class = "github">

GitHub text

</div>


Here is a `<div class = "dictionary">` box:

<div class = "dictionary">

dictionary text

</div>


Here is a `<div class = "reflection">` box:

<div class = "reflection">

reflection text

</div>



## Dropdown summaries

<details><summary> You can hide additional information in a dropdown menu </summary>
Here's more words that are hidden.
Expand All @@ -202,7 +294,7 @@ devtools::session_info()
## collate en_US.UTF-8
## ctype en_US.UTF-8
## tz Etc/UTC
## date 2022-05-16
## date 2022-05-26
##
## ─ Packages ───────────────────────────────────────────────────────────────────
## package * version date lib source
Expand Down Expand Up @@ -233,7 +325,6 @@ devtools::session_info()
## pkgbuild 1.1.0 2020-07-13 [1] RSPM (R 4.0.2)
## pkgconfig 2.0.3 2019-09-22 [1] RSPM (R 4.0.3)
## pkgload 1.1.0 2020-05-29 [1] RSPM (R 4.0.3)
## png 0.1-7 2013-12-03 [1] CRAN (R 4.0.2)
## prettyunits 1.1.1 2020-01-24 [1] RSPM (R 4.0.3)
## processx 3.4.4 2020-09-03 [1] RSPM (R 4.0.2)
## ps 1.3.4 2020-08-11 [1] RSPM (R 4.0.2)
Expand Down
38 changes: 26 additions & 12 deletions docs/404.html
Original file line number Diff line number Diff line change
Expand Up @@ -170,24 +170,38 @@
<ul>
<li class="chapter" data-level="2.1" data-path="a-new-chapter.html"><a href="a-new-chapter.html#learning-objectives"><i class="fa fa-check"></i><b>2.1</b> Learning Objectives</a></li>
<li class="chapter" data-level="2.2" data-path="a-new-chapter.html"><a href="a-new-chapter.html#libraries"><i class="fa fa-check"></i><b>2.2</b> Libraries</a></li>
<li class="chapter" data-level="2.3" data-path="a-new-chapter.html"><a href="a-new-chapter.html#topic-of-section"><i class="fa fa-check"></i><b>2.3</b> Topic of Section</a>
<ul>
<li class="chapter" data-level="2.3.1" data-path="a-new-chapter.html"><a href="a-new-chapter.html#subtopic"><i class="fa fa-check"></i><b>2.3.1</b> Subtopic</a></li>
</ul></li>
<li class="chapter" data-level="2.4" data-path="a-new-chapter.html"><a href="a-new-chapter.html#code-examples"><i class="fa fa-check"></i><b>2.4</b> Code examples</a></li>
<li class="chapter" data-level="2.5" data-path="a-new-chapter.html"><a href="a-new-chapter.html#image-example"><i class="fa fa-check"></i><b>2.5</b> Image example</a></li>
<li class="chapter" data-level="2.6" data-path="a-new-chapter.html"><a href="a-new-chapter.html#video-examples"><i class="fa fa-check"></i><b>2.6</b> Video examples</a>
<ul>
<li class="chapter" data-level="2.6.1" data-path="a-new-chapter.html"><a href="a-new-chapter.html#using-knitr"><i class="fa fa-check"></i><b>2.6.1</b> Using <code>knitr</code></a></li>
<li class="chapter" data-level="2.6.2" data-path="a-new-chapter.html"><a href="a-new-chapter.html#using-html"><i class="fa fa-check"></i><b>2.6.2</b> Using HTML</a></li>
</ul></li>
<li class="chapter" data-level="3" data-path="topic-of-section.html"><a href="topic-of-section.html"><i class="fa fa-check"></i><b>3</b> Topic of Section</a>
<li class="chapter" data-level="2.7" data-path="a-new-chapter.html"><a href="a-new-chapter.html#file-examples"><i class="fa fa-check"></i><b>2.7</b> File examples</a>
<ul>
<li class="chapter" data-level="3.1" data-path="topic-of-section.html"><a href="topic-of-section.html#subtopic"><i class="fa fa-check"></i><b>3.1</b> Subtopic</a>
<li class="chapter" data-level="2.7.1" data-path="a-new-chapter.html"><a href="a-new-chapter.html#using-knitr-1"><i class="fa fa-check"></i><b>2.7.1</b> Using <code>knitr</code></a></li>
<li class="chapter" data-level="2.7.2" data-path="a-new-chapter.html"><a href="a-new-chapter.html#using-html-1"><i class="fa fa-check"></i><b>2.7.2</b> Using HTML</a></li>
</ul></li>
<li class="chapter" data-level="2.8" data-path="a-new-chapter.html"><a href="a-new-chapter.html#website-examples"><i class="fa fa-check"></i><b>2.8</b> Website Examples</a>
<ul>
<li class="chapter" data-level="2.8.1" data-path="a-new-chapter.html"><a href="a-new-chapter.html#using-knitr-2"><i class="fa fa-check"></i><b>2.8.1</b> Using <code>knitr</code></a></li>
<li class="chapter" data-level="2.8.2" data-path="a-new-chapter.html"><a href="a-new-chapter.html#using-html-2"><i class="fa fa-check"></i><b>2.8.2</b> Using HTML</a></li>
</ul></li>
<li class="chapter" data-level="2.9" data-path="a-new-chapter.html"><a href="a-new-chapter.html#citation-examples"><i class="fa fa-check"></i><b>2.9</b> Citation examples</a></li>
<li class="chapter" data-level="2.10" data-path="a-new-chapter.html"><a href="a-new-chapter.html#stylized-boxes"><i class="fa fa-check"></i><b>2.10</b> Stylized boxes</a>
<ul>
<li class="chapter" data-level="3.1.1" data-path="topic-of-section.html"><a href="topic-of-section.html#code-examples"><i class="fa fa-check"></i><b>3.1.1</b> Code examples</a></li>
<li class="chapter" data-level="3.1.2" data-path="topic-of-section.html"><a href="topic-of-section.html#image-example"><i class="fa fa-check"></i><b>3.1.2</b> Image example</a></li>
<li class="chapter" data-level="3.1.3" data-path="topic-of-section.html"><a href="topic-of-section.html#video-examples"><i class="fa fa-check"></i><b>3.1.3</b> Video examples</a></li>
<li class="chapter" data-level="3.1.4" data-path="topic-of-section.html"><a href="topic-of-section.html#links-to-files"><i class="fa fa-check"></i><b>3.1.4</b> Links to files</a></li>
<li class="chapter" data-level="3.1.5" data-path="topic-of-section.html"><a href="topic-of-section.html#links-to-websites"><i class="fa fa-check"></i><b>3.1.5</b> Links to websites</a></li>
<li class="chapter" data-level="3.1.6" data-path="topic-of-section.html"><a href="topic-of-section.html#citation-examples"><i class="fa fa-check"></i><b>3.1.6</b> Citation examples</a></li>
<li class="chapter" data-level="3.1.7" data-path="topic-of-section.html"><a href="topic-of-section.html#fyi-boxes"><i class="fa fa-check"></i><b>3.1.7</b> FYI boxes</a></li>
<li class="chapter" data-level="3.1.8" data-path="topic-of-section.html"><a href="topic-of-section.html#dropdown-summaries"><i class="fa fa-check"></i><b>3.1.8</b> Dropdown summaries</a></li>
<li class="chapter" data-level="2.10.1" data-path="a-new-chapter.html"><a href="a-new-chapter.html#using-rmarkdown-container-syntax"><i class="fa fa-check"></i><b>2.10.1</b> Using <code>rmarkdown</code> container syntax</a></li>
<li class="chapter" data-level="2.10.2" data-path="a-new-chapter.html"><a href="a-new-chapter.html#using-html-3"><i class="fa fa-check"></i><b>2.10.2</b> Using HTML</a></li>
</ul></li>
<li class="chapter" data-level="3.2" data-path="topic-of-section.html"><a href="topic-of-section.html#print-out-session-info"><i class="fa fa-check"></i><b>3.2</b> Print out session info</a></li>
<li class="chapter" data-level="2.11" data-path="a-new-chapter.html"><a href="a-new-chapter.html#dropdown-summaries"><i class="fa fa-check"></i><b>2.11</b> Dropdown summaries</a></li>
<li class="chapter" data-level="2.12" data-path="a-new-chapter.html"><a href="a-new-chapter.html#print-out-session-info"><i class="fa fa-check"></i><b>2.12</b> Print out session info</a></li>
</ul></li>
<li class="chapter" data-level="" data-path="about-the-authors.html"><a href="about-the-authors.html"><i class="fa fa-check"></i>About the Authors</a></li>
<li class="chapter" data-level="4" data-path="references.html"><a href="references.html"><i class="fa fa-check"></i><b>4</b> References</a></li>
<li class="chapter" data-level="3" data-path="references.html"><a href="references.html"><i class="fa fa-check"></i><b>3</b> References</a></li>
<li class="divider"></li>
<p style="text-align:center;"> <a href="https://github.com/jhudsl/OTTR_Template" target="blank" > This content was published with</a> <a href="https://bookdown.org/" target="blank"> bookdown by:</a> </p>
<p style="text-align:center;"> <a href="http://jhudatascience.org/"> The Johns Hopkins Data Science Lab </a></p>
Expand Down
2 changes: 1 addition & 1 deletion docs/About.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ These credits are based on our [course contributors table guidelines](https://gi
## collate en_US.UTF-8
## ctype en_US.UTF-8
## tz Etc/UTC
## date 2022-05-16
## date 2022-05-26
##
## ─ Packages ───────────────────────────────────────────────────────────────────
## package * version date lib source
Expand Down
Binary file modified docs/Course_Name.docx
Binary file not shown.
Loading

0 comments on commit 2ce313a

Please sign in to comment.