From 89632779420f3790f16d58062e5600cae170072e Mon Sep 17 00:00:00 2001 From: James J Balamuta Date: Sun, 28 Apr 2024 11:53:03 -0700 Subject: [PATCH] Add `html` shortcode (#6) * Add `html` shortcode * Add release note * Add HTML asset --- _extensions/embedio/embedio.lua | 85 +- asset-generation/my-html-page.qmd | 24 + docs/assets/my-html-page.html | 3665 +++++++++++++++++++++++++++++ docs/qembedio-embed-html.qmd | 23 + docs/qembedio-release-notes.qmd | 10 + 5 files changed, 3780 insertions(+), 27 deletions(-) create mode 100644 asset-generation/my-html-page.qmd create mode 100644 docs/assets/my-html-page.html create mode 100644 docs/qembedio-embed-html.qmd diff --git a/_extensions/embedio/embedio.lua b/_extensions/embedio/embedio.lua index 8f42694..96fa62a 100644 --- a/_extensions/embedio/embedio.lua +++ b/_extensions/embedio/embedio.lua @@ -64,42 +64,72 @@ local function ensureSlideCSSPresent() quarto.doc.include_text("in-header", slideCSS) end -local function revealjs(args, kwargs, meta , raw_args) +-- Define a function to generate HTML code for an iframe element +local function iframe_helper(file_name, height, full_screen_link, template, type) + -- Check if the file exists + checkFile(file_name) + + -- Define a template for displaying a full-screen link + local template_full_screen = [[ +

View %s in full screen

+ ]] + + -- Combine the template with file name and height to generate HTML code + local combined_str = string.format( + [[%s %s]], + -- Include full-screen link if specified + (full_screen_link == "true" and string.format(template_full_screen, file_name, type) or ""), + -- Insert the iframe template with file name and height + string.format(template, file_name, height) + ) + -- Return the combined HTML as a pandoc RawBlock + return pandoc.RawBlock('html', combined_str) +end + +-- Define the html() function for embedding HTML files +local function html(args, kwargs, meta, raw_args) + -- Check if the output format is HTML if not quarto.doc.is_format("html") then return end + + -- Get the HTML file name, height, and full-screen link option + local file_name = pandoc.utils.stringify(args[1] or kwargs["file"]) + local height = getOption(kwargs, "height", "475px") + local full_screen_link = getOption(kwargs, "full-screen-link", "true") - -- Enable CSS - ensureSlideCSSPresent() + -- Define the template for embedding HTML files + local template_html = [[ +
+ +
+ ]] - -- Supported options for now - - local slide_file_name = pandoc.utils.stringify(args[1] or kwargs["file"]) - checkFile(slide_file_name) + -- Call the iframe_helper() function with the HTML template + return iframe_helper(file_name, height, full_screen_link, template_html, "webpage") +end - local height = getOption(kwargs, "height", "475px") +-- Define the revealjs() function for embedding Reveal.js slides +local function revealjs(args, kwargs, meta, raw_args) + -- Check if the output format is HTML + if not quarto.doc.is_format("html") then return end + + -- Ensure that the Reveal.js CSS is present + ensureSlideCSSPresent() - -- Check if "full-screen" parameter exists in kwargs + -- Get the slide file name, height, and full-screen link option + local file_name = pandoc.utils.stringify(args[1] or kwargs["file"]) + local height = getOption(kwargs, "height", "475px") local full_screen_link = getOption(kwargs, "full-screen-link", "true") - -- HTML Template blocks + -- Define the template for embedding Reveal.js slides local template_revealjs = [[ -
- -
-]] - local template_revealjs_full_screen = [[ -

View slides in full screen

-]] +
+ +
+ ]] - -- Obtain the combined template - local combined_str = string.format( - [[%s %s]], - (full_screen_link == "true" and string.format(template_revealjs_full_screen, slide_file_name) or ""), - string.format(template_revealjs, slide_file_name, height) - ) - - -- Return as HTML block - return pandoc.RawBlock('html', combined_str) + -- Call the iframe_helper() function with the Reveal.js template + return iframe_helper(file_name, height, full_screen_link, template_revealjs, "slides") end local function audio(args, kwargs, meta) @@ -199,5 +229,6 @@ end return { ['audio'] = audio, ['pdf'] = pdf, - ["revealjs"] = revealjs + ['revealjs'] = revealjs, + ['html'] = html } diff --git a/asset-generation/my-html-page.qmd b/asset-generation/my-html-page.qmd new file mode 100644 index 0000000..be7d20c --- /dev/null +++ b/asset-generation/my-html-page.qmd @@ -0,0 +1,24 @@ +--- +title: "Example HTML Webpage" +format: html +embed-resources: true +--- + +## Welcome + +Hi! This is an embedded HTML webpage with `embedio`. + +## Some code + +```r +1 + 1 +``` + +## Math + +Display mode: + +$$c^2 = a^2 + b^2$$ + +Inline mode: $x = 1 + 2$ + diff --git a/docs/assets/my-html-page.html b/docs/assets/my-html-page.html new file mode 100644 index 0000000..3fb878a --- /dev/null +++ b/docs/assets/my-html-page.html @@ -0,0 +1,3665 @@ + + + + + + + + + +Example HTML Webpage + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ +
+
+

Example HTML Webpage

+
+ + + +
+ + + + +
+ + + +
+ + +
+

Welcome

+

Hi! This is an embedded HTML webpage with embedio.

+
+
+

Some code

+
1 + 1
+
+
+

Math

+

Display mode:

+

\[c^2 = a^2 + b^2\]

+

Inline mode: \(x = 1 + 2\)

+
+ +
+ + +
+ + + + + \ No newline at end of file diff --git a/docs/qembedio-embed-html.qmd b/docs/qembedio-embed-html.qmd new file mode 100644 index 0000000..6c0b00f --- /dev/null +++ b/docs/qembedio-embed-html.qmd @@ -0,0 +1,23 @@ +--- +title: "Embed HTML Webpage" +--- + +The `html` short code generates an embedded `