From bf8b5fb0b936aa56eca9c69bf26f6540852dd1dc Mon Sep 17 00:00:00 2001
From: vedhav <vedhaviyash4@gmail.com>
Date: Mon, 4 Nov 2024 20:18:17 +0530
Subject: [PATCH 1/7] feat: make sure that the examples take up the full page
 width

---
 R/tag_examplesShinylive.R | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/R/tag_examplesShinylive.R b/R/tag_examplesShinylive.R
index c278dab..4cf39d9 100644
--- a/R/tag_examplesShinylive.R
+++ b/R/tag_examplesShinylive.R
@@ -192,11 +192,13 @@ format.rd_section_examplesShinylive <- function(x, ...) {
     "style=\"",
     paste(
       "height: 800px",
-      "width: 100\\%",
+      "width: 100vw",
       "border: 1px solid rgba(0,0,0,0.175)",
       "border-radius: .375rem",
-      "position: relative",
+      "position: absolute",
       "z-index: 1",
+      "left: 0",
+      "margin-top: 30px",
       sep = "; "
     ),
     "\""
@@ -205,9 +207,6 @@ format.rd_section_examplesShinylive <- function(x, ...) {
   jscode <- "
 $(function() {
   var if_pkgdown = [...document.scripts].filter(x => x.src.includes(\"pkgdown.js\")).length > 0;
-  if (if_pkgdown) {
-    $(\"iframe.iframe_shinylive\").css(\"width\", \"150\\%\");
-  }
 });"
   paste0(
     "\\section{Examples in Shinylive}{\n",
@@ -216,7 +215,7 @@ $(function() {
       "  \\item{example-", seq_along(x$value), "}{\n",
       "    \\href{", x$value, "}{Open in Shinylive}\n",
       "    \\if{html}{\\out{<script type=\"text/javascript\">", gsub("\n", "", jscode), "</script>}}\n",
-      "    \\if{html}{\\out{<iframe class=\"iframe_shinylive\" src=\"", x$value, "\" ", iframe_style, "></iframe>}}\n", # nolint: line_length_linter.
+      "    \\if{html}{\\out{<iframe class=\"iframe_shinylive\" src=\"", x$value, "\" ", iframe_style, "></iframe><div style='height: 800px;'></div>}}\n", # nolint: line_length_linter.
       "  }\n",
       collapse = ""
     ),

From 5f33b7470414e8b6383dbaa9ea570c1165cff187 Mon Sep 17 00:00:00 2001
From: vedhav <vedhaviyash4@gmail.com>
Date: Mon, 4 Nov 2024 20:23:50 +0530
Subject: [PATCH 2/7] chore: use the same app_height in both the places

---
 R/tag_examplesShinylive.R | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/R/tag_examplesShinylive.R b/R/tag_examplesShinylive.R
index 4cf39d9..783e2bf 100644
--- a/R/tag_examplesShinylive.R
+++ b/R/tag_examplesShinylive.R
@@ -188,10 +188,11 @@ roxy_tag_rd.roxy_tag_examplesShinylive <- function(x, base_path, env) {
 #' @noRd
 #' @exportS3Method format rd_section_examplesShinylive
 format.rd_section_examplesShinylive <- function(x, ...) {
+  app_height <- "800px"
   iframe_style <- paste0(
     "style=\"",
     paste(
-      "height: 800px",
+      "height: ", app_height,
       "width: 100vw",
       "border: 1px solid rgba(0,0,0,0.175)",
       "border-radius: .375rem",
@@ -215,7 +216,7 @@ $(function() {
       "  \\item{example-", seq_along(x$value), "}{\n",
       "    \\href{", x$value, "}{Open in Shinylive}\n",
       "    \\if{html}{\\out{<script type=\"text/javascript\">", gsub("\n", "", jscode), "</script>}}\n",
-      "    \\if{html}{\\out{<iframe class=\"iframe_shinylive\" src=\"", x$value, "\" ", iframe_style, "></iframe><div style='height: 800px;'></div>}}\n", # nolint: line_length_linter.
+      "    \\if{html}{\\out{<iframe class=\"iframe_shinylive\" src=\"", x$value, "\" ", iframe_style, "></iframe><div style='height: ", app_height, ";'></div>}}\n", # nolint: line_length_linter.
       "  }\n",
       collapse = ""
     ),

From 5fd0d2b042f430b7ea024b96b736408521622710 Mon Sep 17 00:00:00 2001
From: vedhav <vedhaviyash4@gmail.com>
Date: Mon, 4 Nov 2024 20:24:34 +0530
Subject: [PATCH 3/7] chore: remove redundant code

---
 R/tag_examplesShinylive.R | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/R/tag_examplesShinylive.R b/R/tag_examplesShinylive.R
index 783e2bf..c485b7a 100644
--- a/R/tag_examplesShinylive.R
+++ b/R/tag_examplesShinylive.R
@@ -204,18 +204,12 @@ format.rd_section_examplesShinylive <- function(x, ...) {
     ),
     "\""
   )
-  # If in pkgdown website - increase the width
-  jscode <- "
-$(function() {
-  var if_pkgdown = [...document.scripts].filter(x => x.src.includes(\"pkgdown.js\")).length > 0;
-});"
   paste0(
     "\\section{Examples in Shinylive}{\n",
     "\\describe{\n",
     paste0(
       "  \\item{example-", seq_along(x$value), "}{\n",
       "    \\href{", x$value, "}{Open in Shinylive}\n",
-      "    \\if{html}{\\out{<script type=\"text/javascript\">", gsub("\n", "", jscode), "</script>}}\n",
       "    \\if{html}{\\out{<iframe class=\"iframe_shinylive\" src=\"", x$value, "\" ", iframe_style, "></iframe><div style='height: ", app_height, ";'></div>}}\n", # nolint: line_length_linter.
       "  }\n",
       collapse = ""

From 4f46cdbe2870a99c37e8b23da1e79e311ee79bd9 Mon Sep 17 00:00:00 2001
From: vedhav <vedhaviyash4@gmail.com>
Date: Mon, 4 Nov 2024 20:35:21 +0530
Subject: [PATCH 4/7] fix: use proper height

---
 R/tag_examplesShinylive.R | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/R/tag_examplesShinylive.R b/R/tag_examplesShinylive.R
index c485b7a..ff9bb87 100644
--- a/R/tag_examplesShinylive.R
+++ b/R/tag_examplesShinylive.R
@@ -192,7 +192,7 @@ format.rd_section_examplesShinylive <- function(x, ...) {
   iframe_style <- paste0(
     "style=\"",
     paste(
-      "height: ", app_height,
+      paste0("height: ", app_height),
       "width: 100vw",
       "border: 1px solid rgba(0,0,0,0.175)",
       "border-radius: .375rem",

From f545769d23bf9e1b57edfb103c4d621d7fcc717c Mon Sep 17 00:00:00 2001
From: vedhav <vedhaviyash4@gmail.com>
Date: Tue, 5 Nov 2024 20:26:36 +0530
Subject: [PATCH 5/7] fix: use a max width for the embedded shiny apps

---
 R/tag_examplesShinylive.R | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/R/tag_examplesShinylive.R b/R/tag_examplesShinylive.R
index ff9bb87..4fcc40a 100644
--- a/R/tag_examplesShinylive.R
+++ b/R/tag_examplesShinylive.R
@@ -189,17 +189,20 @@ roxy_tag_rd.roxy_tag_examplesShinylive <- function(x, base_path, env) {
 #' @exportS3Method format rd_section_examplesShinylive
 format.rd_section_examplesShinylive <- function(x, ...) {
   app_height <- "800px"
+  app_max_width <- "1400px"
   iframe_style <- paste0(
     "style=\"",
     paste(
       paste0("height: ", app_height),
       "width: 100vw",
+      paste0("max-width: ", app_max_width),
       "border: 1px solid rgba(0,0,0,0.175)",
       "border-radius: .375rem",
       "position: absolute",
-      "z-index: 1",
-      "left: 0",
+      "left: 50\\%",
       "margin-top: 30px",
+      "transform: translateX(-50\\%)",
+      "z-index: 1",
       sep = "; "
     ),
     "\""

From b8c1caf72a875770ffb6bfd1f882846a341aa7cc Mon Sep 17 00:00:00 2001
From: vedhav <vedhaviyash4@gmail.com>
Date: Wed, 6 Nov 2024 10:48:01 +0530
Subject: [PATCH 6/7] chore: fix broken test

---
 R/tag_examplesShinylive.R | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/R/tag_examplesShinylive.R b/R/tag_examplesShinylive.R
index 4fcc40a..f7afde4 100644
--- a/R/tag_examplesShinylive.R
+++ b/R/tag_examplesShinylive.R
@@ -213,7 +213,8 @@ format.rd_section_examplesShinylive <- function(x, ...) {
     paste0(
       "  \\item{example-", seq_along(x$value), "}{\n",
       "    \\href{", x$value, "}{Open in Shinylive}\n",
-      "    \\if{html}{\\out{<iframe class=\"iframe_shinylive\" src=\"", x$value, "\" ", iframe_style, "></iframe><div style='height: ", app_height, ";'></div>}}\n", # nolint: line_length_linter.
+      "    \\if{html}{\\out{<iframe class=\"iframe_shinylive\" src=\"", x$value, "\" ", iframe_style, "></iframe>}}\n", # nolint: line_length_linter.
+      "    \\if{html}{\\out{<div style='height: ", app_height, "; display: block;'>&nbsp;</div>}}\n",
       "  }\n",
       collapse = ""
     ),

From 579f7b9aa83c7ffab60f22ec61083d93e30414af Mon Sep 17 00:00:00 2001
From: vedhav <vedhaviyash4@gmail.com>
Date: Wed, 6 Nov 2024 13:15:23 +0530
Subject: [PATCH 7/7] chore: use empty a tag to pass the test

---
 R/tag_examplesShinylive.R | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/R/tag_examplesShinylive.R b/R/tag_examplesShinylive.R
index f7afde4..3c96f55 100644
--- a/R/tag_examplesShinylive.R
+++ b/R/tag_examplesShinylive.R
@@ -214,7 +214,8 @@ format.rd_section_examplesShinylive <- function(x, ...) {
       "  \\item{example-", seq_along(x$value), "}{\n",
       "    \\href{", x$value, "}{Open in Shinylive}\n",
       "    \\if{html}{\\out{<iframe class=\"iframe_shinylive\" src=\"", x$value, "\" ", iframe_style, "></iframe>}}\n", # nolint: line_length_linter.
-      "    \\if{html}{\\out{<div style='height: ", app_height, "; display: block;'>&nbsp;</div>}}\n",
+      # empty a tag because Tidy complains about empty spans.
+      "    \\if{html}{\\out{<a style='height: ", app_height, "; display: block;'></a>}}\n",
       "  }\n",
       collapse = ""
     ),