Bind to scroll events?

[kmader]

It would be great if you could bind to scroll events with shinyjs
http://api.jquery.com/scroll/
The use case would be making scroll wheel zoom in and out on a chart / rotate through different variables to be plotted.

[daattali]

Hi @kmader , this doesn't seem like a feature that I'll add into shinyjs to have native support because it's very specialized and I don't think many will use it (I try to keep shinyjs to only have common useful functionality). That said, might be able to use the shinyjs::onevent() function with event="scroll" (I haven't tried it), and you can definitely use extendShinyjs() to make it a bit easier to bind

[kmader]

the scroll event didn't work because a plot had nothing to scroll, the mousewheel plugin and your tool as is, works perfectly, thanks

library(tidyverse)
library(shiny)
library(shinyjs)

ui <- fluidPage(
  useShinyjs(),  # Include shinyjs
  sliderInput("slice", "Slice Number", 0, 100, 50),
  plotOutput("image_view")
  includeScript("https://cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.1.13/jquery.mousewheel.min.js")
)

server <- function(input, output, session) {
  output$image_view <- renderPlot({
    expand.grid(x = c(1:input$slice), y = c(1:10)) %>%
      ggplot(aes(x, y))+
      geom_raster()+
      theme_bw(10)
  })
  onevent("mousewheel", "image_view", {
    updateSliderInput(session, "slice", value = input$slice-1)
  })
}

shinyApp(ui, server, enableBookmarking = "url")

[daattali]

The scroll event would maybe work if you place it on an element that is tall enough to require a scroll

[kmader]

True, the event that gets passed if you use a function in onevent instead of a block doesn't appear to have all the fields a jquery-mousewheel event has (like deltaX, ...) https://github.com/jquery/jquery-mousewheel. All I see are below, do I need to rework the code so it sends the mousewheel-style event?

$altKey
[1] FALSE
$button
[1] 0
$clientX
[1] 406
$ctrlKey
[1] FALSE
$pageX
[1] 406
$pageY
[1] 334
$screenX
[1] 886
$screenY
[1] 401
$shiftKey
[1] FALSE
$which
[1] 1

[daattali]

I just looked at the source code (because it's been a while since I wrote this feature), it looks like I do have a whitelist of properties. I looked at all the properties that exist for the standard events.

shinyjs/inst/srcjs/shinyjs-default-funcs.js

Line 450 in 6718270

var props = ['altKey', 'button', 'buttons', 'clientX', 'clienty',

I have to do this because many properties are not serializable and would cause the page to break when they try to be passed to R. Sine this plugin that you're using is a plugin and is not a conventional javascript event, I didn't know about those properties and they aren't in the list of accepted properties. If there's any properties you need, you can let me know which ones you specifically need

[kmader]

Perfect, thanks! I forked it, changed and tested it on my machine and it works fine. I also changed clienty to clientY, I assume that was a typo?