Allow shiny input priority to be configurable at the plot-level, closes #1043

Author: cpsievert

R/layout.R

@@ -101,6 +101,9 @@ rangeslider <- function(p, start = NULL, end = NULL, ...) {
 #' (see [here](https://github.com/ropensci/plotly/blob/master/inst/examples/rmd/MathJax/index.Rmd) 
 #' for an **rmarkdown** example and 
 #' [here](https://github.com/ropensci/plotly/blob/master/inst/examples/rmd/MathJax/index.Rmd) for a **shiny** example).
+#' @param priority the priority of shiny input events. If `NULL` (the default), then 
+#' [event_data()] becomes invalidated only when the input value changes. If `"event"`,
+#' then the event will always fire, regardless of whether the value has changed. 
 #' @author Carson Sievert
 #' @export
 #' @examples
@@ -131,7 +134,7 @@ rangeslider <- function(p, start = NULL, end = NULL, ...) {
 #' config(p, locale = "zh-CN")
 #' 
 
-config <- function(p, ..., collaborate = TRUE, cloud = FALSE, locale = NULL, mathjax = NULL) {
+config <- function(p, ..., collaborate = TRUE, cloud = FALSE, locale = NULL, mathjax = NULL, priority = NULL) {
 
   if (!is.null(locale)) {
     p$dependencies <- c(
@@ -170,6 +173,7 @@ config <- function(p, ..., collaborate = TRUE, cloud = FALSE, locale = NULL, mat
   }
 
   p$x$config$cloud <- cloud
+  p$x$config$priority <- priority
 
   p
 }

R/proxy.R

@@ -101,7 +101,8 @@ plotlyjs_methods <- function() {
   c(
     "restyle", "relayout", "update", "addTraces", "deleteTraces", "moveTraces",
     "extendTraces", "prependTraces", "purge", "toImage", "downloadImage", "animate",
-    "newPlot", "react", "validate", "makeTemplate", "validateTemplate", "addFrames"
+    "newPlot", "react", "validate", "makeTemplate", "validateTemplate", "addFrames",
+    "reconfig"
   )
 }
 

inst/examples/shiny/event_priority/app.R

@@ -0,0 +1,29 @@
+library(plotly)
+library(shiny)
+
+ui <- fluidPage(
+  checkboxInput("priority", "Shiny event priority", FALSE),
+  plotlyOutput("p")
+)
+
+server <- function(input, output, session) {
+  
+  output$p <- renderPlotly({
+    title <- if (input$priority) {
+      "Clicking on the same point repeatedly will keep triggering console output"
+    } else {
+      "Clicking on the same point won't trigger more output"
+    }
+    
+    plot_ly(mtcars, x = ~wt, y = ~mpg) %>%
+      layout(title = title) %>%
+      config(priority = if (input$priority) "event")
+  })
+  
+  observeEvent(event_data("plotly_click"), {
+    print("clicked!")
+  })
+  
+}
+
+shinyApp(ui, server)

inst/htmlwidgets/plotly.js

@@ -272,29 +272,35 @@ HTMLWidgets.widget({
 
     // send user input event data to shiny
     if (HTMLWidgets.shinyMode) {
+      var priority = x.config.priority ? {priority: x.config.priority} : undefined;
+      
       // https://plot.ly/javascript/zoom-events/
       graphDiv.on('plotly_relayout', function(d) {
         Shiny.setInputValue(
           ".clientValue-plotly_relayout-" + x.source, 
-          JSON.stringify(d)
+          JSON.stringify(d),
+          priority
         );
       });
       graphDiv.on('plotly_restyle', function(d) {
         Shiny.setInputValue(
           ".clientValue-plotly_restyle-" + x.source, 
-          JSON.stringify(d)
+          JSON.stringify(d),
+          priority
         );
       });
       graphDiv.on('plotly_hover', function(d) {
         Shiny.setInputValue(
           ".clientValue-plotly_hover-" + x.source, 
-          JSON.stringify(eventDataWithKey(d))
+          JSON.stringify(eventDataWithKey(d)),
+          priority
         );
       });
       graphDiv.on('plotly_click', function(d) {
         Shiny.setInputValue(
           ".clientValue-plotly_click-" + x.source, 
-          JSON.stringify(eventDataWithKey(d))
+          JSON.stringify(eventDataWithKey(d)),
+          priority
         );
       });
       graphDiv.on('plotly_selected', function(d) {
@@ -307,47 +313,52 @@ HTMLWidgets.widget({
         if (d) {
           Shiny.setInputValue(
             ".clientValue-plotly_selected-" + x.source, 
-            JSON.stringify(eventDataWithKey(d))
+            JSON.stringify(eventDataWithKey(d)),
+            priority
           );
           var limits = d.range ? d.range : d.lassoPoints;
           Shiny.setInputValue(
             ".clientValue-plotly_brush-" + x.source, 
-            JSON.stringify(limits)
+            JSON.stringify(limits),
+            priority
           );
         }
       });
       graphDiv.on('plotly_selecting', function(d) {
         if (d) {
           Shiny.setInputValue(
             ".clientValue-plotly_selecting-" + x.source, 
-            JSON.stringify(eventDataWithKey(d))
+            JSON.stringify(eventDataWithKey(d)),
+            priority
           );
           var limits = d.range ? d.range : d.lassoPoints;
           Shiny.setInputValue(
             ".clientValue-plotly_brushing-" + x.source, 
-            JSON.stringify(limits)
+            JSON.stringify(limits),
+            priority
           );
         }
       });
       graphDiv.on('plotly_unhover', function(eventData) {
-        Shiny.setInputValue(".clientValue-plotly_hover-" + x.source, null);
+        Shiny.setInputValue(".clientValue-plotly_hover-" + x.source, null, priority);
       });
       graphDiv.on('plotly_doubleclick', function(eventData) {
-        Shiny.setInputValue(".clientValue-plotly_click-" + x.source, null);
+        Shiny.setInputValue(".clientValue-plotly_click-" + x.source, null, priority);
       });
       // 'plotly_deselect' is code for doubleclick when in select mode
       graphDiv.on('plotly_deselect', function(eventData) {
-        Shiny.setInputValue(".clientValue-plotly_selected-" + x.source, null);
-        Shiny.setInputValue(".clientValue-plotly_selecting-" + x.source, null);
-        Shiny.setInputValue(".clientValue-plotly_brush-" + x.source, null);
-        Shiny.setInputValue(".clientValue-plotly_brushing-" + x.source, null);
-        Shiny.setInputValue(".clientValue-plotly_click-" + x.source, null);
+        Shiny.setInputValue(".clientValue-plotly_selected-" + x.source, null, priority);
+        Shiny.setInputValue(".clientValue-plotly_selecting-" + x.source, null, priority);
+        Shiny.setInputValue(".clientValue-plotly_brush-" + x.source, null, priority);
+        Shiny.setInputValue(".clientValue-plotly_brushing-" + x.source, null, priority);
+        Shiny.setInputValue(".clientValue-plotly_click-" + x.source, null, priority);
       });
 
       graphDiv.on('plotly_clickannotation', function(d) {
-        Shiny.setInputValue(".clientValue-plotly_clickannotation-" + x.source, JSON.stringify(d.fullAnnotation));
+        Shiny.setInputValue(".clientValue-plotly_clickannotation-" + x.source, JSON.stringify(d.fullAnnotation), priority);
       });
 
+      // This is a 'true' event -- always give it priority
       graphDiv.on('plotly_afterplot', function() {
         Shiny.setInputValue(".clientValue-plotly_afterplot-" + x.source, "afterplot", {priority: "event"});
       });