Dynamic image output based on user input shiny R

Question

I have a csv file that I am uploading into a shiny app. Amongst other info, the csv file contains a column of names (input) and a column of unique IDs associated with each name. Basically what I want to happen is each time a user selects a different name the app takes the corresponding ID and inserts it into a URL to show a PNG image as an output. For example, say the user selects the name "Joe Smith" and Joe's unique ID is "smithj01". I need the app to insert "smithj01" into a URL that is otherwise always the same to then show Joe's image. If the user then selects "John Doe" and John's unique ID is "doej01" I need the app to insert "doej01" into the same URL in order to show John's image.

I've tried writing a function that does this in the code below, but it still only shows a blue box with a question mark where the image should display.

I've tried again and again to solve this problem on my own, looked at numerous other posts and example code, but cannot, for the life of me, figure this out. Please help! Thank you so much!

library(shiny)

injury <- read.csv("injury_app.csv", stringsAsFactors = FALSE)

"player_id" = "ID"

player_photo_url = function(player_id) {
  paste0("http://ssref.net/scripts/image_resize.cgi?min=200&url=https://d2cwpp38twqe55.cloudfront.net/req/201612101/images/players/", player_id,".png")
}

ui <- fluidPage(
  titlePanel("Title Goes Here"),
  sidebarLayout(
    sidebarPanel(
      selectInput("Player", "Player",
                  choices = c("Enter a player..." = "", injury$Player))
    ),
    mainPanel(
      uiOutput("image")
    )
  )
)

server <- function(input, output) {
  current_player = reactive({
    req(input$Player)
  })
  output$image <- renderUI({tags$img(src = player_photo_url(current_player()["player_id"]))
  })
}

shinyApp(ui = ui, server = server)

Answer 1

You've got some strange things going on, but the most concerning thing seems to be your attempts at selecting the ID for the player name selected. Assuming the csv injury is read in as a data frame this should work:

library(shiny)

injury <- read.csv("injury_app.csv", stringsAsFactors = FALSE)
uniq_players <- sort(unique(injury$Player))

ui <- fluidPage(
  titlePanel("Title Goes Here"),
  sidebarLayout(
    sidebarPanel(
      selectInput("Player", "Player",
                  choices = c("Enter a player..." = "", uniq_players))
    ),
    mainPanel(
      uiOutput("image")
    )
  )
)

server <- function(input, output) {

  c_id <- reactive({
    shiny::validate(
      shiny::need(input$Player, "Select a player!")
    )
    injury[injury$Player == input$Player, "ID"]
  })

  c_url <- reactive({
    paste0("http://ssref.net/scripts/image_resize.cgi?min=200&url=https://d2cwpp38twqe55.cloudfront.net/req/201612101/images/players/", c_id(), ".png")
  })

  output$image <- renderUI({
    tags$img(src = c_url())
  })
}

shinyApp(ui = ui, server = server)