How to reference an image from JS file in packaged Shiny app?

Question

I am creating an R package which provides some helper functions to build a Shiny app.

One of the JS files packaged with the app needs to reference an image file. But I can't figure out how to reference it.

Currently, the js file is located in

my_package/inst/www/js/my_jsfile.js

This file needs to reference

my_package/inst/www/img/my_img.gif

In the JS file, what should the relative URL to the image be?

I tried various options, such as the following, which do not work, when launching in a Shiny app built with the package:

../my_img.gif

www/img/my_img.gif

My JS looks like this:

function showRecordingIcon() {

  var img = document.createElement("img");
  img.style.display = "block";
  img.src =  "img/record.gif";
  img.width = "280";
  img.height = "280";
}

This was working before I packaged it.

Answer 1

If your goal is to get file path from the inst folder in your package on the user system, try:

system.file('www/js/my_file.js', package = 'NAMEOFYOURPACKAGE', mustWork = T)

Answer 2

Did you use shiny::addResourcePath("img", "/path/to/img/folder")

Something like shiny::addResourcePath("img", system.file('www', 'img', package = 'NAMEOFYOURPACKAGE', mustWork = T)

Next, you can refer to it as "img/record.gif"