toastui icon indicating copy to clipboard operation
toastui copied to clipboard

cal_events function example not working

Open nick-youngblut opened this issue 1 year ago • 2 comments

Description

I ran the example for the cal_events function, which includes:

clickSchedule = JS("function(event) {alert(event.schedule.id);}")

... but no alert is created upon a schedule-click event.

Expected Behavior

An alert should appear upon a schedule-click event. The alert should show the event id.

Current Behavior

No alert.

Steps to Reproduce

Simply run the example for the cal_events function

Context

I'm trying to debug an issue with cal_proxy_update(), and I was hoping to use:

clickSchedule = JS("function(event) {alert(event.schedule.id);}")

to make sure that I'm using the correct id for the list object that must be provided as the value param to the cal_proxy_update() function. However, I ran into this issue.

Your Environment

R version 4.3.1 (2023-06-16)
Platform: aarch64-apple-darwin20 (64-bit)
Running under: macOS Ventura 13.3

Matrix products: default
BLAS:   /System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libBLAS.dylib 
LAPACK: /Library/Frameworks/R.framework/Versions/4.3-arm64/Resources/lib/libRlapack.dylib;  LAPACK version 3.11.0

locale:
[1] en_US.UTF-8/en_US.UTF-8/en_US.UTF-8/C/en_US.UTF-8/en_US.UTF-8

time zone: America/Los_Angeles
tzcode source: internal

attached base packages:
[1] stats     graphics  grDevices datasets  utils     methods   base     

other attached packages:
[1] shinyjs_2.1.0         shinycssloaders_1.0.0 shinyTime_1.0.3       toastui_0.3.0         httr2_1.0.0          
[6] tidyr_1.3.1           dplyr_1.1.4           shinyBS_0.61.1        shiny_1.8.0          

loaded via a namespace (and not attached):
 [1] config_0.3.2        rappdirs_0.3.3      sass_0.4.7          utf8_1.2.4          generics_0.1.3     
 [6] renv_1.0.2          digest_0.6.33       magrittr_2.0.3      fastmap_1.1.1       jsonlite_1.8.7     
[11] promises_1.2.1      httr_1.4.7          purrr_1.0.2         fansi_1.0.6         jquerylib_0.1.4    
[16] cli_3.6.1           crayon_1.5.2        rlang_1.1.1         ellipsis_0.3.2      withr_2.5.0        
[21] cachem_1.0.8        yaml_2.3.8          tools_4.3.1         gargle_1.5.2        memoise_2.0.1      
[26] httpuv_1.6.11       curl_5.2.0          vctrs_0.6.5         R6_2.5.1            mime_0.12          
[31] lifecycle_1.0.3     fs_1.6.3            htmlwidgets_1.6.4   fontawesome_0.5.2   pkgconfig_2.0.3    
[36] pillar_1.9.0        bslib_0.5.1         later_1.3.1         glue_1.6.2          Rcpp_1.0.11        
[41] tibble_3.2.1        tidyselect_1.2.0    xtable_1.8-4        htmltools_0.5.7     phosphoricons_0.2.0
[46] shinyWidgets_0.8.1  compiler_4.3.1      askpass_1.2.0       openssl_2.1.1  

nick-youngblut avatar Jan 31 '24 21:01 nick-youngblut

Hello, Thanks for reporting that, this exemple is outdated. The JS library change schedule for event in its v2 release (https://github.com/nhn/tui.calendar/blob/main/docs/en/guide/migration-guide-v2.md#change-term-from-schedule-to-event), so correct syntax is now :

clickSchedule = JS("function(event) {alert(event.event.id);}")

Here's a complete example :

library(shiny)
library(toastui)

calendarProps <- data.frame(
  id = paste0("cal_", 1:3),
  name = c("TODO", "Meetings", "Tasks"),
  color = c("#FFF", "#FFF", "#000"),
  backgroundColor = c("#E41A1C", "#377EB8", "#4DAF4A"),
  borderColor = c("#a90000", "#005288", "#0a7f1c")
)

n <- 20
date_start <- sample(
  seq(from = as.POSIXct(Sys.Date()-14), by = "1 hour", length.out = 24*7*4),
  n, TRUE
)
date_end <- date_start + sample(1:25, n, TRUE) * 3600
schedules <- data.frame(
  id = paste0("event_", 1:n),
  calendarId = paste0("cal_", sample(1:3, n, TRUE)),
  title = LETTERS[1:n],
  body = paste("Body schedule", letters[1:n]),
  start = format(date_start, format = "%Y-%m-%d %H:00:00"),
  end = format(date_end, format = "%Y-%m-%d %H:00:00"),
  category = sample(c("allday", "time", "task"), n, TRUE),
  stringsAsFactors = FALSE
)

ui <- fluidPage(
  tags$h2("Custom click event"),
  fluidRow(
    column(
      width = 8,
      calendarOutput(outputId = "cal")
    ),
    column(
      width = 4,
      verbatimTextOutput(outputId = "res_click")
    )
  )
)

server <- function(input, output, session) {
  
  output$cal <- renderCalendar({
    calendar(useDetailPopup = FALSE) %>%
      cal_props(calendarProps) %>%
      cal_schedules(schedules) %>%
      cal_events(
        clickSchedule = JS("function(event) {Shiny.setInputValue('click', event)}")
      )
  })
  
  output$res_click <- renderPrint(input$click)
  
}

if (interactive())
  shinyApp(ui, server)

I will update the documentation accordingly.

Victor

pvictor avatar Feb 01 '24 10:02 pvictor

Thanks for the examples! They are very helpful! The same can be said about all of the other examples (and these).

nick-youngblut avatar Feb 01 '24 16:02 nick-youngblut