[Feature Request] Add option to zoom in sliderInput

[gogonzo]

Our sliderInput needs improvement for distributions where values are concentrated in a narrow range. It's hard to figure out where to set slider range. I propose option to zoom in the histogram by the user.

1. scenario where data are concentrated in some narrow range
2. User can select some range which will pop up the small window where additional range slider will be shown. Range of additional range input will be the same as selected range.
3. Selected range in the "small" slider are then reflected in the "main" slider.

[lcd2yyz]

It would also be very convenient for users to be able to enter the desired value range as text input.
Something like the numerical filter slider in RStudio SDE could be pretty nice.
It allows user to drag and drop to select on a range, or enter the value directly in the text box below.

[nikolas-burkoff]

Yes - I was thinking that being able to add the range might be all we actually need @lcd2yyz (i.e. behave like the slider in teal.goshawk - if you want to see the zoomed in distribution you can always use the variable browser to see what you are filtering) - it would then be much simpler both to use and to implement.

and if this was a widget in teal.widgets it could be reused in teal.goshawk...

One thing we need to be careful with is at the moment it's not possible to create invalid filters in the ui of the filter panel, but by adding input boxes it will be possible - so we should add shinyvalidate (?) and handle the case where the filter panel filtering would produce an error carefully (e.g. not apply filter until it's valid, have a save filter button which is disabled until it's valid)

[gogonzo]

@nikolas-burkoff Looks like we agree on this insightsengineering/teal.goshawk#205

[nikolas-burkoff]

See #144

[nikolas-burkoff]

Note

[nikolas-burkoff]

shinyvalidate plays nicely with the various inputs:

Though note for FilterStateDateTime we use 2 indpendent datepickers rather than a single range like in this example, which would can also be handled but you need the value of the "other" one included in the validation function

library(shiny)
library(shinyvalidate)
library(shinyWidgets)

ui <- fluidPage(
  numericRangeInput("range", "Select a range", value = c(10, 20)),
  dateRangeInput("date", "Select a date range", start = "2023-01-10", end = "2023-01-20"),
  airDatepickerInput("date2", "Select another date range", range = TRUE, value = c("2023-01-10", "2023-01-20")),
  airDatepickerInput("date_time", "Select a date range", range = TRUE, timepicker = TRUE, value = c("2023-01-10", "2023-01-20"))
)

server <- function(input, output, session) {
  iv <- shinyvalidate::InputValidator$new()

  iv$add_rule("range", sv_required("Invalid numeric range"))
  iv$add_rule("date", sv_required("Invalid date range"))
  iv$add_rule("date2", sv_required("Invalid date range"))
  iv$add_rule("datetime", sv_required("Invalid date time range"))
  iv$add_rule("range", ~ if ((.)[[1]] > (.)[[2]]) "Invalid numeric range")
  iv$add_rule("date", ~ if ((.)[[1]] > (.)[[2]]) "Invalid date range")
  iv$add_rule("date2", ~ if (length(.) < 2) "Invalid date range")
  iv$add_rule("date_time", ~ if (length(.) < 2) "Invalid datetime range")


  iv$enable()
}

shinyApp(ui, server)

[gogonzo]

Blocked to avoid conflicts with #129

[asbates]

@gogonzo I think this can be un-blocked now?

Also I'm not exactly sure what is needed here.

• I think we don't want a zoom but rather 2 input boxes?
• How much of Allow manually choosing range #144 do we need? For example,
  • What is the reset button supposed to do?
  • Do we need to add the validation? This feels like another issue to me because then we should do validation for all inputs.

[nikolas-burkoff]

So I think the only inputs which need validation are this new one and the date/date time range pickers ( #158) and those have been done

[gogonzo]

@asbates

• I think we don't want a zoom but rather 2 input boxes?

True, we prefer two input boxes

• How much of Allow manually choosing range #144 do we need? For example,
  • What is the reset button supposed to do?
  • Do we need to add the validation? This feels like another issue to me because then we should do validation for all inputs.

• Reset is something for later - it will reset selected to choices.
• Regarding validation - If I was doing this issue I'd probably do this if I felt it's missing. Some inputs already have validation (date and datetime).

[donyunardi]

This is blocked by:

• Research on improving numeric range input using plotly #233
• Research on better solution to manually enter numeric ranges #234