app.R

library(shiny)    # for shiny apps
library(leaflet)  # renderLeaflet function
library(spData)   # loads the world dataset 
library(terra)
library(stars)
library(leaflet.extras2)
ui = fluidPage(
  leafletOutput(outputId = "map")
)

before_fire_tifs <- fs::dir_ls("before_fire", type="file")[[1]]
after_fire_tifs <- fs::dir_ls("after_fire", type="file")[[1]]
before_fire_nbr <- read_stars(before_fire_tifs)
after_fire_nbr <- read_stars(after_fire_tifs)
dnbr <- before_fire_nbr - after_fire_nbr


server = function(input, output) {
  output$map = renderLeaflet({
    #https://trafficonese.github.io/leaflet.extras2/reference/addSidebyside.html
    
    # addRasterImage options requires pre-release leaflet....
    stopifnot(compareVersion(as.character(packageVersion("leaflet")), "2.2.1") > 0)
    
    Map <- leaflet() |> 
      addMapPane("right", zIndex = 0) |> 
      addMapPane("left",  zIndex = 0) |>
      addTiles(group = "base", layerId = "baseid1", options = pathOptions(pane = "right")) |> 
      addTiles(group = "base", layerId = "baseid2", options = pathOptions(pane = "left")) |> 
      addRasterImage(x = rast(after_fire_nbr), options = leafletOptions(pane = "right"), group = "r1") |> 
      addRasterImage(x = rast(before_fire_nbr), options = leafletOptions(pane = "left"), group = "r2") |> 
      addLayersControl(overlayGroups = c("r1", "r2")) |>  
      addSidebyside(layerId = "sidecontrols",
                    rightId = "baseid1",
                    leftId  = "baseid2")
    
  })
}

shinyApp(ui, server)