start rework accordions

RinteRface · Mar 8, 2024 · 5fd102a · 5fd102a
1 parent 5bb2dc5
commit 5fd102a
Show file tree

Hide file tree

Showing 5 changed files with 181 additions and 230 deletions.
diff --git a/DESCRIPTION b/DESCRIPTION
@@ -23,7 +23,7 @@ License: GPL-2
 Encoding: UTF-8
 URL: https://github.com/RinteRface/shinyMobile, https://rinterface.github.io/shinyMobile/
 BugReports: https://github.com/RinteRface/shinyMobile/issues
-RoxygenNote: 7.2.3
+RoxygenNote: 7.3.1
 Suggests: 
     knitr,
     rmarkdown,

diff --git a/R/f7Accordion.R b/R/f7Accordion.R
@@ -4,83 +4,60 @@
 #'
 #' @param ... Slot for \link{f7AccordionItem}.
 #' @param id Optional id to recover the state of the accordion.
-#' @param multiCollapse Whether to open multiple items at the same time. FALSE
-#' by default.
+#' @param side Accordion collapse toggle side. Default to right.
 #'
 #' @rdname accordion
 #'
 #' @examples
 #' # Accordion
-#' if(interactive()){
-#'  library(shiny)
-#'  library(shinyMobile)
-#'
-#'  shinyApp(
-#'   ui = f7Page(
-#'     title = "Accordions",
-#'     f7SingleLayout(
-#'      navbar = f7Navbar("Accordions"),
-#'      f7Accordion(
-#'       id = "myaccordion1",
-#'       f7AccordionItem(
-#'        title = "Item 1",
-#'        f7Block("Item 1 content"),
-#'        open = TRUE
-#'       ),
-#'       f7AccordionItem(
-#'        title = "Item 2",
-#'        f7Block("Item 2 content")
-#'       )
-#'      ),
-#'      f7Accordion(
-#'       multiCollapse = TRUE,
-#'       inputId = "myaccordion2",
-#'       f7AccordionItem(
-#'        title = "Item 1",
-#'        f7Block("Item 1 content")
-#'       ),
-#'       f7AccordionItem(
-#'        title = "Item 2",
-#'        f7Block("Item 2 content")
+#' if (interactive()) {
+#'   library(shiny)
+#'   library(shinyMobile)
+#'
+#'   shinyApp(
+#'     ui = f7Page(
+#'       title = "Accordions",
+#'       f7SingleLayout(
+#'         navbar = f7Navbar("Accordions"),
+#'         f7Accordion(
+#'           id = "myaccordion1",
+#'           f7AccordionItem(
+#'             title = "Item 1",
+#'             f7Block("Item 1 content"),
+#'             open = TRUE
+#'           ),
+#'           f7AccordionItem(
+#'             title = "Item 2",
+#'             f7Block("Item 2 content")
+#'           )
+#'         )
 #'       )
-#'      )
-#'     )
-#'   ),
-#'   server = function(input, output, session) {
-#'    observe({
-#'     print(
-#'      list(
-#'       accordion1 = input$myaccordion1,
-#'       accordion2 = input$myaccordion2
-#'      )
-#'     )
-#'    })
-#'   }
-#'  )
+#'     ),
+#'     server = function(input, output, session) {
+#'       observe({
+#'         print(input$myaccordion1)
+#'       })
+#'     }
+#'   )
 #' }
 #'
 #' @author David Granjon, \email{dgranjon@@ymail.com}
 #'
 #' @export
-f7Accordion <- function(..., id = NULL, multiCollapse = FALSE) {
-
-  accordionTag <- if (multiCollapse) {
-    shiny::tags$div(
-      class = "list",
-      shiny::tags$ul(...)
-    )
-  } else {
-    shiny::tags$div(
-      class = "list accordion-list",
-      shiny::tags$ul(...)
-    )
-  }
+f7Accordion <- function(..., id = NULL, side = c("right", "left")) {
+  side <- match.arg(side)
+  cl <- "list list-strong list-outline-ios list-dividers-ios inset-md accordion-list"
+  if (side == "left") cl <- sprintf("%s accordion-opposite", cl)
+  accordionTag <- shiny::tags$div(
+    class = cl,
+    shiny::tags$ul(...)
+  )
 
- tagAppendAttributes(
-   accordionTag,
-   id = id,
-   class = "collapsible"
- )
+  tagAppendAttributes(
+    accordionTag,
+    id = id,
+    class = "collapsible"
+  )
 }
 
 
@@ -96,15 +73,13 @@ f7Accordion <- function(..., id = NULL, multiCollapse = FALSE) {
 #' @export
 #' @rdname accordion
 f7AccordionItem <- function(..., title = NULL, open = FALSE) {
-
   accordionCl <- "accordion-item"
   if (open) accordionCl <- paste0(accordionCl, " accordion-item-opened")
 
   # item tag
   shiny::tags$li(
     class = accordionCl,
     shiny::tags$a(
-      href = "#",
       class = "item-content item-link",
       shiny::tags$div(
         class = "item-inner",
@@ -136,47 +111,46 @@ f7AccordionItem <- function(..., title = NULL, open = FALSE) {
 #' @examples
 #' # Update accordion
 #' if (interactive()) {
-#'  library(shiny)
-#'  library(shinyMobile)
-#'
-#'  shinyApp(
-#'    ui = f7Page(
-#'      title = "Accordions",
-#'      f7SingleLayout(
-#'        navbar = f7Navbar("Accordions"),
-#'        f7Button(inputId = "go", "Go"),
-#'        f7Accordion(
-#'          id = "myaccordion1",
-#'          f7AccordionItem(
-#'            title = "Item 1",
-#'            f7Block("Item 1 content"),
-#'            open = TRUE
-#'          ),
-#'          f7AccordionItem(
-#'            title = "Item 2",
-#'            f7Block("Item 2 content")
-#'          )
-#'        )
-#'      )
-#'    ),
-#'    server = function(input, output, session) {
-#'
-#'      observeEvent(input$go, {
-#'        updateF7Accordion(id = "myaccordion1", selected = 2)
-#'      })
-#'
-#'      observe({
-#'        print(
-#'          list(
-#'            accordion1_state = input$myaccordion1$state,
-#'            accordion1_values = unlist(input$myaccordion1$value)
-#'          )
-#'        )
-#'      })
-#'    }
-#'  )
+#'   library(shiny)
+#'   library(shinyMobile)
+#'
+#'   shinyApp(
+#'     ui = f7Page(
+#'       title = "Accordions",
+#'       f7SingleLayout(
+#'         navbar = f7Navbar("Accordions"),
+#'         f7Button(inputId = "go", "Go"),
+#'         f7Accordion(
+#'           id = "myaccordion1",
+#'           f7AccordionItem(
+#'             title = "Item 1",
+#'             f7Block("Item 1 content"),
+#'             open = TRUE
+#'           ),
+#'           f7AccordionItem(
+#'             title = "Item 2",
+#'             f7Block("Item 2 content")
+#'           )
+#'         )
+#'       )
+#'     ),
+#'     server = function(input, output, session) {
+#'       observeEvent(input$go, {
+#'         updateF7Accordion(id = "myaccordion1", selected = 2)
+#'       })
+#'
+#'       observe({
+#'         print(
+#'           list(
+#'             accordion1_state = input$myaccordion1$state,
+#'             accordion1_values = unlist(input$myaccordion1$value)
+#'           )
+#'         )
+#'       })
+#'     }
+#'   )
 #' }
 updateF7Accordion <- function(id, selected = NULL, session = shiny::getDefaultReactiveDomain()) {
-  message <-list(selected = selected)
+  message <- list(selected = selected)
   session$sendInputMessage(id, message)
 }
diff --git a/R/utils.R b/R/utils.R
@@ -15,22 +15,23 @@ colorToHex <- function(color) {
   if (is.null(color)) {
     "#007aff"
   } else {
-    switch (color,
-            "red" = "#ff3b30",
-            "green" = "#4cd964",
-            "blue" = "#2196f3",
-            "pink" = "#ff2d55",
-            "yellow" = "#ffcc00",
-            "orange" = "#ff9500",
-            "purple" = "#9c27b0",
-            "deeppurple" = "#673ab7",
-            "lightblue" = "#5ac8fa",
-            "teal" = "#009688",
-            "lime" = "#cddc39",
-            "deeporange" = "#ff6b22",
-            "gray" = "#8e8e93",
-            "white" = "#ffffff",
-            "black" = "#000000"
+    switch(color,
+      "primary" = "#007aff",
+      "red" = "#ff3b30",
+      "green" = "#4cd964",
+      "blue" = "#2196f3",
+      "pink" = "#ff2d55",
+      "yellow" = "#ffcc00",
+      "orange" = "#ff9500",
+      "purple" = "#9c27b0",
+      "deeppurple" = "#673ab7",
+      "lightblue" = "#5ac8fa",
+      "teal" = "#009688",
+      "lime" = "#cddc39",
+      "deeporange" = "#ff6b22",
+      "gray" = "#8e8e93",
+      "white" = "#ffffff",
+      "black" = "#000000"
     )
   }
 }
@@ -43,16 +44,17 @@ colorToHex <- function(color) {
 #' @export
 getF7Colors <- function() {
   c(
+    "primary",
     "red",
     "green",
     "blue",
     "pink",
     "yellow",
     "orange",
-    "purple" ,
+    "purple",
     "deeppurple",
     "lightblue",
-    "teal" ,
+    "teal",
     "lime",
     "deeporange",
     "gray",
@@ -136,11 +138,13 @@ sendCustomMessage <- function(type, message, session) {
 
 # Given a Shiny tag object, process singletons and dependencies. Returns a list
 # with rendered HTML and dependency objects.
-processDeps <- function (tags, session) {
+processDeps <- function(tags, session) {
   ui <- htmltools::takeSingletons(tags, session$singletons, desingleton = FALSE)$ui
   ui <- htmltools::surroundSingletons(ui)
-  dependencies <- lapply(htmltools::resolveDependencies(htmltools::findDependencies(ui)),
-                         shiny::createWebDependency)
+  dependencies <- lapply(
+    htmltools::resolveDependencies(htmltools::findDependencies(ui)),
+    shiny::createWebDependency
+  )
   names(dependencies) <- NULL
   list(html = htmltools::doRenderTags(ui), deps = dependencies)
 }
@@ -160,7 +164,6 @@ processDeps <- function (tags, session) {
 #' @param landscape Whether to put the device wrapper in landscape mode. Default to FALSE.
 #' @keywords internal
 app_container <- function(url, deps = FALSE, skin, color = NULL, landscape = FALSE) {
-
   # test app availability
   req <- httr::GET(url)
   show_app <- req$status_code == 200
@@ -179,7 +182,7 @@ app_container <- function(url, deps = FALSE, skin, color = NULL, landscape = FAL
       color = color,
       landscape = landscape
     )
-    if (deps){
+    if (deps) {
       shiny::tagList(
         shiny::tags$link(
           rel = "stylesheet",
@@ -197,8 +200,8 @@ app_container <- function(url, deps = FALSE, skin, color = NULL, landscape = FAL
 # Get arguments of function call at a given level. Level can be negative.
 get_args <- function(level) {
   cl <- sys.call(level)
-  f <- get(as.character(cl[[1]]), mode="function", sys.frame(-2))
-  cl <- match.call(definition=f, call=cl)
+  f <- get(as.character(cl[[1]]), mode = "function", sys.frame(-2))
+  cl <- match.call(definition = f, call = cl)
   as.list(cl)[-1]
 }