Custom shiny input (radio buttons) - help with .js file

I've been reading on custom shiny inputs (e.g., Shiny - How to create custom input bindings) and I think I get the general principle but Its still not exactly clear to me how to implement this with radio buttons.

I want to overlay radio buttons on specific areas of an image, so I've written the reprex below.

What does the customRadio.js file look like so that I can access the selected radio button via input$likert1 (or whatever the input would be)?


# Define UI for application that draws a histogram
ui <- navbarPage(title = "ACOM test app",
  header = 
    inlineCSS('.container {position: relative;}.container input[type="radio"] {position: absolute;}'),
    tags$script(src = "www/customRadio.js")
  tabPanel("Fixed position",
    # Application title
      column(width = 10, offset = 1, align = "center",
      shiny::column(width = 9, offset = 3, 

# Define server logic required to draw a histogram
server <- function(input, output) {
    print("radio1 change")
  output$questionText <- renderUI({
    tags$p("How effectively do you ask for information from store employees?", style="font-size:3rem;margin-top:15px;")

    output$scale <- renderUI({
      <div class="container">
        <img src="" style="height:550px;position:absolute;">
          <input type="radio" class = "customradio" name="option1" style="top:21px;left:280px;">
            <input type="radio" class = "customradio" name="option1" style="top:115px;left:280px;">
              <input type="radio" class = "customradio" name="option1" style="top:250px;left:280px;">
                <input type="radio" class = "customradio" name="option1" style="top:399px;left:280px;">
                  <input type="radio" class = "customradio" name="option1" style="top:512px;left:280px;">

# Run the application 
shinyApp(ui = ui, server = server)

Edit: If there is a way to do this using radioButton() and without custom inputs, I'm all ears.