shinyMobile (version 1.0.1)

addF7Popover: Add Framework7 popover

Description

addF7Popover adds a popover to the given target and show it if enabled by toggleF7Popover.

toggleF7Popover toggles the visibility of popover. See example for use case.

Usage

addF7Popover(
  id = NULL,
  selector = NULL,
  options,
  session = shiny::getDefaultReactiveDomain()
)
toggleF7Popover(
  id = NULL,
  selector = NULL,
  session = shiny::getDefaultReactiveDomain()
)

Arguments

id

Popover target id.

selector

jQuery selector. Allow more customization for the target (nested tags).

options

List of options to pass to the popover. See https://framework7.io/docs/popover.html#popover-parameters.

session

Shiny session object.

Examples

if (interactive()) {
 library(shiny)
 library(shinyMobile)

 lorem_ipsum <- "Lorem ipsum dolor sit amet,
           consectetur adipiscing elit. Quisque ac diam ac quam euismod
           porta vel a nunc. Quisque sodales scelerisque est, at porta
           justo cursus ac."

 popovers <- data.frame(
   id = paste0("target_", 1:10),
   content = paste("Popover content", 1:10, lorem_ipsum),
   stringsAsFactors = FALSE
 )


 shinyApp(
   ui = f7Page(
     options = list(theme = "ios"),
     title = "f7Popover",
     f7SingleLayout(
       navbar = f7Navbar(
         title = "f7Popover",
         subNavbar = f7SubNavbar(
           f7Toggle(
             inputId = "toggle",
             "Enable popover",
             color = "green",
             checked = TRUE
           )
         )
       ),
       f7Segment(
         lapply(seq_len(nrow(popovers)), function(i) {
           f7Button(
             inputId = sprintf("target_%s", i),
             sprintf("Target %s", i)
           )
         })
       )
     )
   ),
   server = function(input, output, session) {
     # Enable/disable (don't run first)
     observeEvent(input$toggle, {
       lapply(seq_len(nrow(popovers)), function(i) toggleF7Popover(id = popovers[i, "id"]) )
     }, ignoreInit = TRUE)

     # show
     lapply(seq_len(nrow(popovers)), function(i) {
       observeEvent(input[[popovers[i, "id"]]], {
         addF7Popover(
           id = popovers[i, "id"],
           options = list(
             content = popovers[i, "content"]
           )
         )
       })
     })
   }
 )
}