From 95cd322de2c139c843ac10237e06a34c9a4071cd Mon Sep 17 00:00:00 2001
From: InfinityLoop <swsoyee@gmail.com>
Date: Sun, 7 Mar 2021 23:45:28 +0900
Subject: [PATCH 1/9] feat(gridView): implement feature (#24)

---
 NAMESPACE                  |  1 +
 R/grid.R                   | 84 ++++++++++++++++++++++++++++++++++++++
 inst/htmlwidgets/r3dmol.js | 28 ++++++++++++-
 man/m_grid.Rd              | 62 ++++++++++++++++++++++++++++
 4 files changed, 173 insertions(+), 2 deletions(-)
 create mode 100644 R/grid.R
 create mode 100644 man/m_grid.Rd

diff --git a/NAMESPACE b/NAMESPACE
index a8ab9b7..3a46c34 100644
--- a/NAMESPACE
+++ b/NAMESPACE
@@ -30,6 +30,7 @@ export(m_enable_fog)
 export(m_fetch_pdb)
 export(m_get_model)
 export(m_glimpse)
+export(m_grid)
 export(m_is_animated)
 export(m_multi_resi_sel)
 export(m_remove_all_labels)
diff --git a/R/grid.R b/R/grid.R
new file mode 100644
index 0000000..d94a96c
--- /dev/null
+++ b/R/grid.R
@@ -0,0 +1,84 @@
+#' Create a grid of viewers that share a WebGL canvas
+#'
+#' @param viewer a list contains sub-viewers.
+#' @param element_id HTML string identifier.
+#' @param configs grid configuration.
+#' @param viewer_config viewer specification to apply to all subviewers.
+#' @param width Fixed width for viewer (in css units). Ignored when used in a
+#' Shiny app -- use the \code{width} parameter in
+#' \code{\link[r3dmol]{r3dmolOutput}}.
+#' It is not recommended to use this parameter because the widget knows how to
+#' adjust its width automatically.
+#' @param height Fixed height for viewer (in css units). It is recommended to
+#' not use this parameter since the widget knows how to adjust its height
+#' automatically.
+#'
+#' @return
+#' @export
+#'
+#' @examples
+#' library(r3dmol)
+#'
+#' m1 <- r3dmol() %>%
+#'   m_add_model(data = pdb_6zsl, format = "pdb") %>%
+#'   m_zoom_to()
+#'
+#' m2 <- m1 %>%
+#'   m_set_style(style = m_style_cartoon(color = "spectrum"))
+#'
+#' m3 <- m1 %>%
+#'   m_set_style(style = m_style_stick())
+#'
+#' m4 <- m1 %>%
+#'   m_set_style(style = m_style_sphere())
+#'
+#' m_grid(
+#'   viewer = list(m1, m2, m3, m4),
+#'   configs = list(rows = 2, cols = 2, control_all = TRUE),
+#'   viewer_config = list(backgroundColor = "black")
+#' )
+m_grid <- function(viewer,
+                   element_id,
+                   configs,
+                   viewer_config = list(),
+                   width = NULL,
+                   height = NULL) {
+  if (missing(element_id)) {
+    element_id <- (sample(256, 10, replace = TRUE) - 1) %>%
+      as.hexmode() %>%
+      format(width = 2) %>%
+      paste(collapse = "")
+  }
+  if (missing(configs)) {
+    configs <- list(
+      rows = 1,
+      cols = length(viewer),
+      control_all = TRUE
+    )
+  }
+
+  x <- list(
+    viewer = viewer,
+    element_id = element_id,
+    configs = configs,
+    viewer_config = viewer_config,
+    api = "grid"
+  )
+
+  widget <- htmlwidgets::createWidget(
+    name = "r3dmol",
+    x,
+    width = width,
+    height = height,
+    package = "r3dmol",
+    elementId = element_id,
+    sizingPolicy = htmlwidgets::sizingPolicy(
+      defaultWidth = "100%",
+      knitr.figure = FALSE,
+      browser.fill = TRUE,
+      padding = 0
+    )
+  )
+
+  return(widget)
+}
diff --git a/inst/htmlwidgets/r3dmol.js b/inst/htmlwidgets/r3dmol.js
index 91d5068..750602b 100644
--- a/inst/htmlwidgets/r3dmol.js
+++ b/inst/htmlwidgets/r3dmol.js
@@ -52,6 +52,11 @@ HTMLWidgets.widget({
       renderValue(x) {
         // alias this
         const that = this;
+
+        if (x.viewer) {
+          viewer = x.viewer;
+        }
+
         if (!initialized) {
           initialized = true;
           // attach the widget to the DOM
@@ -60,7 +65,22 @@ HTMLWidgets.widget({
           $(el).css({
             position: x.position || 'relative',
           });
-          viewer = $3Dmol.createViewer($(container), x.configs);
+          if (x.api === 'grid') {
+            const viewers = $3Dmol.createViewerGrid($(container), x.configs, x.viewer_config);
+            let index = 0;
+            for (let i = 0; i < x.configs.rows; i += 1) {
+              for (let j = 0; j < x.configs.cols; j += 1) {
+                x.viewer[index].x.viewer = viewers[i][j];
+                that.renderValue(x.viewer[index].x);
+                index += 1;
+              }
+            }
+          }
+          if (x.viewer) {
+            viewer = x.viewer;
+          } else {
+            viewer = $3Dmol.createViewer($(container), x.configs);
+          }
         }
         // set listeners to events and pass data back to Shiny
         if (HTMLWidgets.shinyMode) {
@@ -89,7 +109,11 @@ HTMLWidgets.widget({
         }
         // Auto render
         if (isAutoRenderFunction.findIndex((element) => element === lastCallFunction) > -1) {
-          viewer.render();
+          if (x.viewer) {
+            x.viewer.render();
+          } else {
+            viewer.render();
+          }
         }
       },
 
diff --git a/man/m_grid.Rd b/man/m_grid.Rd
new file mode 100644
index 0000000..1b5fde9
--- /dev/null
+++ b/man/m_grid.Rd
@@ -0,0 +1,62 @@
+% Generated by roxygen2: do not edit by hand
+% Please edit documentation in R/grid.R
+\name{m_grid}
+\alias{m_grid}
+\title{Create a grid of viewers that share a WebGL canvas}
+\usage{
+m_grid(
+  viewer,
+  element_id,
+  configs,
+  viewer_config = list(),
+  width = NULL,
+  height = NULL
+)
+}
+\arguments{
+\item{viewer}{a list contains sub-viewers.}
+
+\item{element_id}{HTML string identifier.}
+
+\item{configs}{grid configuration.}
+
+\item{viewer_config}{viewer specification to apply to all subviewers.}
+
+\item{width}{Fixed width for viewer (in css units). Ignored when used in a
+Shiny app -- use the \code{width} parameter in
+\code{\link[r3dmol]{r3dmolOutput}}.
+It is not recommended to use this parameter because the widget knows how to
+adjust its width automatically.}
+
+\item{height}{Fixed height for viewer (in css units). It is recommended to
+not use this parameter since the widget knows how to adjust its height
+automatically.}
+}
+\value{
+
+}
+\description{
+Create a grid of viewers that share a WebGL canvas
+}
+\examples{
+library(r3dmol)
+
+m1 <- r3dmol() \%>\%
+  m_add_model(data = pdb_6zsl, format = "pdb") \%>\%
+  m_zoom_to()
+
+m2 <- m1 \%>\%
+  m_set_style(style = m_style_cartoon(color = "spectrum"))
+
+m3 <- m1 \%>\%
+  m_set_style(style = m_style_stick())
+
+m4 <- m1 \%>\%
+  m_set_style(style = m_style_sphere())
+
+m_grid(
+  viewer = list(m1, m2, m3, m4),
+  configs = list(rows = 2, cols = 2, control_all = TRUE),
+  viewer_config = list(backgroundColor = "black")
+)
+}

From 83a530ce0bba398c60c0c1c8f671f64c8107fd6a Mon Sep 17 00:00:00 2001
From: InfinityLoop <swsoyee@gmail.com>
Date: Sun, 7 Mar 2021 23:53:00 +0900
Subject: [PATCH 2/9] docs(news): update news

---
 NEWS.md | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/NEWS.md b/NEWS.md
index ad5a597..8ca6b9e 100644
--- a/NEWS.md
+++ b/NEWS.md
@@ -2,6 +2,7 @@
 
 ### Features
 
+* Add `m_grid()` to support multiple viewers ([#25](https://github.com/swsoyee/r3dmol/pull/25)).
 * Quickly look at structures with `m_glimpse()`. Initializes the viewer with 
 a range of useful defaults. Allows for quickly visually inspecting the structure
 and further customization of the viewer to speed up setup.
@@ -9,12 +10,9 @@ and further customization of the viewer to speed up setup.
 more information.
 * Add `speed` option for `m_spin()` and option for `keepH` in `m_add_model()` ([#13](https://github.com/swsoyee/r3dmol/pull/13)).
 
-### Documentation
-
-* Add logo for `{r3dmol}` ([#16](https://github.com/swsoyee/r3dmol/pull/16)).
-
 ### Others
 
+* Add logo for `{r3dmol}` ([#16](https://github.com/swsoyee/r3dmol/pull/16)).
 * Function `m_set_view_style()` is deprecated and replaced by `m_add_outline()`.
 * Upgrade `3Dmol.js` to the latest version (v1.6.2) ([#12](https://github.com/swsoyee/r3dmol/pull/12)).
 

From 67ef3fc0f8aefc61293ce71f0ddf678f2f6d0836 Mon Sep 17 00:00:00 2001
From: InfinityLoop <swsoyee@gmail.com>
Date: Sun, 7 Mar 2021 23:59:33 +0900
Subject: [PATCH 3/9] docs(home): add multiple viewers exmaple

---
 vignettes/r3dmol.Rmd | 26 +++++++++++++++++++++++++-
 1 file changed, 25 insertions(+), 1 deletion(-)

diff --git a/vignettes/r3dmol.Rmd b/vignettes/r3dmol.Rmd
index 70724ca..91bb829 100644
--- a/vignettes/r3dmol.Rmd
+++ b/vignettes/r3dmol.Rmd
@@ -111,7 +111,7 @@ r3dmol(id = "demo_sdf", elementId = "demo_sdf") %>%
   m_zoom_to()
 ```
 
-### Dynamic styles
+### Dynamic Styles
 
 ```{r Dynamic styles}
 r3dmol() %>%
@@ -126,6 +126,30 @@ r3dmol() %>%
   m_zoom_to()
 ```
 
+### Multiple Viewers
+
+```{r multiple viewers}
+m1 <- r3dmol() %>%
+  m_add_model(data = pdb_6zsl, format = "pdb") %>%
+  m_zoom_to()
+
+m2 <- m1 %>%
+  m_set_style(style = m_style_cartoon(color = "spectrum"))
+
+m3 <- r3dmol() %>%
+  m_add_model(data = pdb_1j72, format = "pdb") %>%
+  m_set_style(style = m_style_stick()) %>%
+  m_zoom_to()
+
+m4 <- m3 %>%
+  m_set_style(style = m_style_sphere())
+
+m_grid(
+  viewer = list(m1, m2, m3, m4),
+  configs = list(rows = 2, cols = 2, control_all = TRUE),
+  viewer_config = list(backgroundColor = "white")
+)
+```
 
 ## About `3Dmol.js`
 

From 23afa5e8ad36319d4a8edced1d31f5aee890fc18 Mon Sep 17 00:00:00 2001
From: InfinityLoop <swsoyee@gmail.com>
Date: Mon, 8 Mar 2021 00:01:05 +0900
Subject: [PATCH 4/9] style(home): format code

---
 vignettes/r3dmol.Rmd | 57 +++++++++++++++++++++++++-------------------
 1 file changed, 33 insertions(+), 24 deletions(-)

diff --git a/vignettes/r3dmol.Rmd b/vignettes/r3dmol.Rmd
index 91bb829..a3d07cd 100644
--- a/vignettes/r3dmol.Rmd
+++ b/vignettes/r3dmol.Rmd
@@ -1,7 +1,7 @@
 ---
 title: 'Introduction to r3dmol'
 author: 'Wei Su'
-date: '2021-02-05'
+date: '2021-03-08'
 output:
   # md_document:
   #   pandoc_args: ["--wrap=preserve"]
@@ -27,13 +27,13 @@ This is an R package that provides support for [`3Dmol.js`](https://3dmol.csb.pi
 
 ```{r installation, eval=FALSE}
 # install.packages("devtools")
-devtools::install_github('swsoyee/r3dmol')
+devtools::install_github("swsoyee/r3dmol")
 ```
 
 ```{r demo}
 library(r3dmol)
 
-# Set up the initial viewer 
+# Set up the initial viewer
 r3dmol(
   viewer_spec = m_viewer_spec(
     cartoonQuality = 10,
@@ -44,21 +44,25 @@ r3dmol(
   elementId = "demo"
 ) %>%
   # Add model to scene
-  m_add_model(data = pdb_6zsl, format = "pdb") %>%  
+  m_add_model(data = pdb_6zsl, format = "pdb") %>%
   # Zoom to encompass the whole scene
   m_zoom_to() %>%
   # Set style of structures
-  m_set_style(style = m_style_cartoon(color = '#00cc96')) %>% 
+  m_set_style(style = m_style_cartoon(color = "#00cc96")) %>%
   # Set style of specific selection (selecting by secondary)
-  m_set_style(sel = m_sel(ss = 's'),                 
-              style = m_style_cartoon(color = '#636efa', arrows = TRUE)) %>% 
+  m_set_style(
+    sel = m_sel(ss = "s"),
+    style = m_style_cartoon(color = "#636efa", arrows = TRUE)
+  ) %>%
   # Style the alpha helix
-  m_set_style(sel = m_sel(ss = 'h'),                 # Style alpha helix
-              style = m_style_cartoon(color = '#ff7f0e')) %>%
+  m_set_style(
+    sel = m_sel(ss = "h"), # Style alpha helix
+    style = m_style_cartoon(color = "#ff7f0e")
+  ) %>%
   # Rotate the scene by given angle on given axis
-  m_rotate(angle = 90, axis = 'y') %>%
+  m_rotate(angle = 90, axis = "y") %>%
   # Animate the scene by spinning it
-  m_spin()                          
+  m_spin()
 ```
 
 ```{r xyz}
@@ -70,14 +74,18 @@ H    -0.465975   -0.364992    0.807088    0.283368    0.257996   -0.583024
 H    -0.465979   -0.364991   -0.807088    0.392764    0.342436    0.764260
 "
 
-r3dmol(width = 400,
-       height = 400,
-       backgroundColor = "0xeeeeee",
-       id = "demo_xyz",
-       elementId = "demo_xyz") %>%
-  m_add_model(data = xyz,
-              format = "xyz",
-              options = list(vibrate = list(frames = 10, amplitude = 1))) %>%
+r3dmol(
+  width = 400,
+  height = 400,
+  backgroundColor = "0xeeeeee",
+  id = "demo_xyz",
+  elementId = "demo_xyz"
+) %>%
+  m_add_model(
+    data = xyz,
+    format = "xyz",
+    options = list(vibrate = list(frames = 10, amplitude = 1))
+  ) %>%
   m_set_style(style = m_style_stick()) %>%
   m_animate(list(loop = "backAndForth")) %>%
   m_zoom_to()
@@ -106,8 +114,10 @@ $$$$"
 r3dmol(id = "demo_sdf", elementId = "demo_sdf") %>%
   m_add_model(data = benz, format = "sdf") %>%
   m_set_style(style = m_style_stick()) %>%
-  m_set_style(sel = m_sel(model = 0), 
-              style = m_style_stick(colorScheme = "cyanCarbon")) %>%
+  m_set_style(
+    sel = m_sel(model = 0),
+    style = m_style_stick(colorScheme = "cyanCarbon")
+  ) %>%
   m_zoom_to()
 ```
 
@@ -117,12 +127,11 @@ r3dmol(id = "demo_sdf", elementId = "demo_sdf") %>%
 r3dmol() %>%
   m_add_model(data = pdb_1j72) %>%
   m_set_style(style = m_style_cartoon(
-      colorfunc = "
+    colorfunc = "
         function(atom) {
           return atom.resi % 2 == 0 ? 'white' : 'green';
         }"
-    )
-  ) %>%
+  )) %>%
   m_zoom_to()
 ```
 

From 0a4e61cda9958a05ccc82189442f1a6a549b1764 Mon Sep 17 00:00:00 2001
From: InfinityLoop <swsoyee@gmail.com>
Date: Mon, 8 Mar 2021 00:11:51 +0900
Subject: [PATCH 5/9] ci: downgrade package version in lockfile

Some latest version is not avaliable now. It will cause GitHub Action failed.
---
 renv.lock | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/renv.lock b/renv.lock
index 5766aa8..b94edc7 100644
--- a/renv.lock
+++ b/renv.lock
@@ -189,10 +189,10 @@
     },
     "desc": {
       "Package": "desc",
-      "Version": "1.3.0",
+      "Version": "1.2.0",
       "Source": "Repository",
       "Repository": "CRAN",
-      "Hash": "b6963166f7f10b970af1006c462ce6cd"
+      "Hash": "6c8fe8fa26a23b79949375d372c7b395"
     },
     "diffobj": {
       "Package": "diffobj",
@@ -511,10 +511,10 @@
     },
     "pillar": {
       "Package": "pillar",
-      "Version": "1.5.1",
+      "Version": "1.5.0",
       "Source": "Repository",
       "Repository": "CRAN",
-      "Hash": "24622aa4a0d3de3463c34513edca99b2"
+      "Hash": "39a778e4e487ded8b1bf5bb617c567b3"
     },
     "pkgbuild": {
       "Package": "pkgbuild",

From b8ef3dca7188ef4b18cd6f417164da501fe2a37d Mon Sep 17 00:00:00 2001
From: bunchofbradys <36021261+bunchofbradys@users.noreply.github.com>
Date: Tue, 9 Mar 2021 07:57:22 +1100
Subject: [PATCH 6/9] edit: m_grid() - expose config options - autoc-compute
 rows / cols

---
 R/grid.R      | 47 ++++++++++++++++++++++++++++++-----------------
 man/m_grid.Rd | 32 +++++++++++++++++++-------------
 2 files changed, 49 insertions(+), 30 deletions(-)

diff --git a/R/grid.R b/R/grid.R
index d94a96c..5314a51 100644
--- a/R/grid.R
+++ b/R/grid.R
@@ -2,18 +2,20 @@
 #'
 #' @param viewer a list contains sub-viewers.
 #' @param element_id HTML string identifier.
-#' @param configs grid configuration.
+#' @param rows Number of rows in viewer grid.
+#' @param cols Number of columns in viewer grid.
+#' @param control_all Logical, simaultaneous mouse control of all windows in the
+#'  grid.
 #' @param viewer_config viewer specification to apply to all subviewers.
-#' @param width Fixed width for viewer (in css units). Ignored when used in a
-#' Shiny app -- use the \code{width} parameter in
+#' @param width Fixed width for combined viewer (in css units). Ignored when
+#' used in a Shiny app -- use the \code{width} parameter in
 #' \code{\link[r3dmol]{r3dmolOutput}}.
 #' It is not recommended to use this parameter because the widget knows how to
 #' adjust its width automatically.
-#' @param height Fixed height for viewer (in css units). It is recommended to
-#' not use this parameter since the widget knows how to adjust its height
-#' automatically.
+#' @param height Fixed height for combined viewer (in css units). It is
+#' recommended to not use this parameter since the widget knows how to adjust
+#' its height automatically.
 #'
-#' @return
 #' @export
 #'
 #' @examples
@@ -34,13 +36,17 @@
 #'
 #' m_grid(
 #'   viewer = list(m1, m2, m3, m4),
-#'   configs = list(rows = 2, cols = 2, control_all = TRUE),
-#'   viewer_config = list(backgroundColor = "black")
+#'   control_all = TRUE,
+#'   viewer_config = m_viewer_spec(
+#'      backgroundColor = "black"
+#'      )
 #' )
 m_grid <- function(viewer,
                    element_id,
-                   configs,
-                   viewer_config = list(),
+                   rows = NULL,
+                   cols = NULL,
+                   control_all = TRUE,
+                   viewer_config = m_viewer_spec(),
                    width = NULL,
                    height = NULL) {
   if (missing(element_id)) {
@@ -49,14 +55,21 @@ m_grid <- function(viewer,
       format(width = 2) %>%
       paste(collapse = "")
   }
-  if (missing(configs)) {
-    configs <- list(
-      rows = 1,
-      cols = length(viewer),
-      control_all = TRUE
-    )
+
+  if (is.null(rows)) {
+    rows <- ceiling(sqrt(length(viewer)))
+  }
+
+  if (is.null(cols)) {
+    cols <- ceiling(length(viewer) / rows)
   }
 
+  configs <- list(
+    rows = rows,
+    cols = cols,
+    control_all = control_all
+  )
+
   x <- list(
     viewer = viewer,
     element_id = element_id,
diff --git a/man/m_grid.Rd b/man/m_grid.Rd
index 1b5fde9..3cc4d07 100644
--- a/man/m_grid.Rd
+++ b/man/m_grid.Rd
@@ -7,8 +7,10 @@
 m_grid(
   viewer,
   element_id,
-  configs,
-  viewer_config = list(),
+  rows = NULL,
+  cols = NULL,
+  control_all = TRUE,
+  viewer_config = m_viewer_spec(),
   width = NULL,
   height = NULL
 )
@@ -18,22 +20,24 @@ m_grid(
 
 \item{element_id}{HTML string identifier.}
 
-\item{configs}{grid configuration.}
+\item{rows}{Number of rows in viewer grid.}
+
+\item{cols}{Number of columns in viewer grid.}
+
+\item{control_all}{Logical, simaultaneous mouse control of all windows in the
+grid.}
 
 \item{viewer_config}{viewer specification to apply to all subviewers.}
 
-\item{width}{Fixed width for viewer (in css units). Ignored when used in a
-Shiny app -- use the \code{width} parameter in
+\item{width}{Fixed width for combined viewer (in css units). Ignored when
+used in a Shiny app -- use the \code{width} parameter in
 \code{\link[r3dmol]{r3dmolOutput}}.
 It is not recommended to use this parameter because the widget knows how to
 adjust its width automatically.}
 
-\item{height}{Fixed height for viewer (in css units). It is recommended to
-not use this parameter since the widget knows how to adjust its height
-automatically.}
-}
-\value{
-
+\item{height}{Fixed height for combined viewer (in css units). It is
+recommended to not use this parameter since the widget knows how to adjust
+its height automatically.}
 }
 \description{
 Create a grid of viewers that share a WebGL canvas
@@ -56,7 +60,9 @@ m4 <- m1 \%>\%
 
 m_grid(
   viewer = list(m1, m2, m3, m4),
-  configs = list(rows = 2, cols = 2, control_all = TRUE),
-  viewer_config = list(backgroundColor = "black")
+  control_all = TRUE,
+  viewer_config = m_viewer_spec(
+     backgroundColor = "black"
+     )
 )
 }

From 2730039a7f73ca1bb1a5b1d5d829364d27a2337a Mon Sep 17 00:00:00 2001
From: bunchofbradys <36021261+bunchofbradys@users.noreply.github.com>
Date: Tue, 9 Mar 2021 07:57:36 +1100
Subject: [PATCH 7/9] docs: update vignette with new m_grid()

---
 vignettes/r3dmol.Rmd | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/vignettes/r3dmol.Rmd b/vignettes/r3dmol.Rmd
index a3d07cd..ab4e58e 100644
--- a/vignettes/r3dmol.Rmd
+++ b/vignettes/r3dmol.Rmd
@@ -155,8 +155,10 @@ m4 <- m3 %>%
 
 m_grid(
   viewer = list(m1, m2, m3, m4),
-  configs = list(rows = 2, cols = 2, control_all = TRUE),
-  viewer_config = list(backgroundColor = "white")
+  rows = 2, 
+  cols = 2, 
+  control_all = TRUE,
+  viewer_config = m_viewer_spec(backgroundColor = "lightblue")
 )
 ```
 

From 1f8cf12eb376442851a2b187410089b3b540d99f Mon Sep 17 00:00:00 2001
From: InfinityLoop <swsoyee@gmail.com>
Date: Tue, 9 Mar 2021 12:08:41 +0900
Subject: [PATCH 8/9] style(grid): format code

---
 R/grid.R             |  9 +++++----
 man/m_grid.Rd        | 11 +++++++----
 vignettes/r3dmol.Rmd |  8 +++++---
 3 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/R/grid.R b/R/grid.R
index 5314a51..9ec3537 100644
--- a/R/grid.R
+++ b/R/grid.R
@@ -1,12 +1,12 @@
 #' Create a grid of viewers that share a WebGL canvas
 #'
-#' @param viewer a list contains sub-viewers.
+#' @param viewer A list contains sub-viewers.
 #' @param element_id HTML string identifier.
 #' @param rows Number of rows in viewer grid.
 #' @param cols Number of columns in viewer grid.
 #' @param control_all Logical, simaultaneous mouse control of all windows in the
 #'  grid.
-#' @param viewer_config viewer specification to apply to all subviewers.
+#' @param viewer_config Viewer specification to apply to all subviewers.
 #' @param width Fixed width for combined viewer (in css units). Ignored when
 #' used in a Shiny app -- use the \code{width} parameter in
 #' \code{\link[r3dmol]{r3dmolOutput}}.
@@ -16,6 +16,7 @@
 #' recommended to not use this parameter since the widget knows how to adjust
 #' its height automatically.
 #'
+#' @return An \code{r3dmol} object (the output from \code{r3dmol()}).
 #' @export
 #'
 #' @examples
@@ -38,8 +39,8 @@
 #'   viewer = list(m1, m2, m3, m4),
 #'   control_all = TRUE,
 #'   viewer_config = m_viewer_spec(
-#'      backgroundColor = "black"
-#'      )
+#'     backgroundColor = "black"
+#'   )
 #' )
 m_grid <- function(viewer,
                    element_id,
diff --git a/man/m_grid.Rd b/man/m_grid.Rd
index 3cc4d07..7c30ddc 100644
--- a/man/m_grid.Rd
+++ b/man/m_grid.Rd
@@ -16,7 +16,7 @@ m_grid(
 )
 }
 \arguments{
-\item{viewer}{a list contains sub-viewers.}
+\item{viewer}{A list contains sub-viewers.}
 
 \item{element_id}{HTML string identifier.}
 
@@ -27,7 +27,7 @@ m_grid(
 \item{control_all}{Logical, simaultaneous mouse control of all windows in the
 grid.}
 
-\item{viewer_config}{viewer specification to apply to all subviewers.}
+\item{viewer_config}{Viewer specification to apply to all subviewers.}
 
 \item{width}{Fixed width for combined viewer (in css units). Ignored when
 used in a Shiny app -- use the \code{width} parameter in
@@ -39,6 +39,9 @@ adjust its width automatically.}
 recommended to not use this parameter since the widget knows how to adjust
 its height automatically.}
 }
+\value{
+An \code{r3dmol} object (the output from \code{r3dmol()}).
+}
 \description{
 Create a grid of viewers that share a WebGL canvas
 }
@@ -62,7 +65,7 @@ m_grid(
   viewer = list(m1, m2, m3, m4),
   control_all = TRUE,
   viewer_config = m_viewer_spec(
-     backgroundColor = "black"
-     )
+    backgroundColor = "black"
+  )
 )
 }
diff --git a/vignettes/r3dmol.Rmd b/vignettes/r3dmol.Rmd
index ab4e58e..ef7b1ad 100644
--- a/vignettes/r3dmol.Rmd
+++ b/vignettes/r3dmol.Rmd
@@ -155,10 +155,12 @@ m4 <- m3 %>%
 
 m_grid(
   viewer = list(m1, m2, m3, m4),
-  rows = 2, 
-  cols = 2, 
+  rows = 2,
+  cols = 2,
   control_all = TRUE,
-  viewer_config = m_viewer_spec(backgroundColor = "lightblue")
+  viewer_config = m_viewer_spec(
+    backgroundColor = "lightblue"
+  )
 )
 ```
 

From dd9313ea3cf5056f5e3f6743d6e5b8fdee2f8fb9 Mon Sep 17 00:00:00 2001
From: InfinityLoop <swsoyee@gmail.com>
Date: Tue, 9 Mar 2021 12:11:34 +0900
Subject: [PATCH 9/9] docs(todo): add some TODO comments

---
 R/grid.R   | 2 ++
 R/r3dmol.R | 1 +
 2 files changed, 3 insertions(+)

diff --git a/R/grid.R b/R/grid.R
index 9ec3537..1cb3b71 100644
--- a/R/grid.R
+++ b/R/grid.R
@@ -50,6 +50,7 @@ m_grid <- function(viewer,
                    viewer_config = m_viewer_spec(),
                    width = NULL,
                    height = NULL) {
+  # TODO move it to utils and add test
   if (missing(element_id)) {
     element_id <- (sample(256, 10, replace = TRUE) - 1) %>%
       as.hexmode() %>%
@@ -57,6 +58,7 @@ m_grid <- function(viewer,
       paste(collapse = "")
   }
 
+  # TODO move it to utils and add test
   if (is.null(rows)) {
     rows <- ceiling(sqrt(length(viewer)))
   }
diff --git a/R/r3dmol.R b/R/r3dmol.R
index c61a855..356a303 100644
--- a/R/r3dmol.R
+++ b/R/r3dmol.R
@@ -45,6 +45,7 @@ r3dmol <- function(id = NULL,
                    width = NULL,
                    height = NULL,
                    elementId = NULL) {
+  # TODO move it to utils and add test
   if (missing(id)) {
     id <- (sample(256, 10, replace = TRUE) - 1) %>%
       as.hexmode() %>%