SlickR and Shiny, duplicated carousels

[cschwem2er]

Hi,

thanks for creating this package! :) I am currently trying to set up a shiny app where users can inspect (random) images in a carousel, and after clicking a button, the carousel loads with new images.

Unfortunately, this does not work. Shiny adds another carousel below instead of replacing the existing one. See here as an example:

My setup looks roughly like this:

library(shiny)
library(tidyverse)
library(slickR)

# Define UI for app that draws a histogram ----
ui <- fluidPage(

    mainPanel(

      slickROutput("slickr", width="100%"),

      actionButton("submit", "An action button")

    )
 # )
)

server <- function(input, output) {

 load_random_images <- function(x) {
## some function to load a number of random images
}

  output$slickr <- renderSlickR({
    input$submit

    image_paths  <- load_randon_images()

    slickR(image_paths, height = 400, width = "100%",
           padding = 0) + 
      settings(dots = TRUE, infinite = FALSE,
               slidesToShow =  1,
               centerMode =FALSE,
              adaptiveHeight = TRUE)   
  })

}

shinyApp(ui = ui, server = server)

Do you know how to solve this problem?

[yonicd]

In your slickr call set the slideId to something static, else a random hash is used to avoid conflicts between sliders.

see vignette for an example

[cschwem2er]

Hi, thanks for your fast response, but adjusting the code as such does not solve the problem: slickR(image_paths, height = 400, width = "100%", padding = 0, slideId = "1337"))

[yonicd]

You are right. There is a new problem in the underlying js. I will look into it. Thanks for raising this issue!

[yonicd]

this patch should fix it https://github.com/yonicd/slickR/commit/1ab229e4c400e54187a406130610852b0300986c, let me know if it works for you.

[oceanscienceguru]

Hi there, I was chasing a similar issue as above and have pulled the patch in to fix it, though it seemingly has not solved everything. In short, I'm working with a fairly complex app and using a module to process some data and generate a carousel. The user can select which data the module processes and thus generates a carousel with a set of plots based on that data. The confusing thing is when I run the shiny app on my local windows machine for testing, it works great and the duplication issue is fixed. On the actual deployed Linux machine, the issue persists.

If this is likely not a slickR issue, no worries, I'll dig deeper and would appreciate any advice. Thanks.

Portion of the module that generates the carousel... when the user changes the datastream, the module is run and the livePlots list object is reloaded with the list of pre-generated ggplots:

  output$img <- renderSlickR({

  plotItUp <- list()
  for (i in 1:length(livePlots)){
    plotItUp[[i]] <- xmlSVG({show(livePlots[[i]])},standalone=TRUE, width = 9.5)
  }

  x <- slickR(obj = plotItUp,
         height = 400,
         slideId = userSelectedDataName
  ) + settings(dots = TRUE, autoplay = TRUE, fade = TRUE, infinite = TRUE, autoplaySpeed = 7500)

  x
})

EDIT: this appears to be somewhat browser related. On the deployed server, the duplication is NOT present when accessed using: Safari on Mac, Edge on Windows 11, Chrome on Windows 11. It duplicates on Firefox on Windows 11 (the same machine that can host the shiny app locally and it does NOT duplicate) and Safari on iOS.

[MPietzke]

I observed the same problem (after updating slickR from 0.5.0 to 0.6.0 and some other packages) and the tip with the slideID and the patch worked for me! (Windows + Firefox).

Well, at least when running locally. When publishing the app to shinyapps.io it doesn't work as the patch isn't transferred. Do you think you can bundle everything together into a new version that can be used with shinyapps.io?

[LaytonWashburn]

I am also getting duplications when using slickR in shiny. Is there a fix for this?