Skip to content

ashbaldry/video

Repository files navigation

Lifecycle: experimental Codecov test coverage R-CMD-check

{video} - Interactive Video Player

{video} is a package that utilises the video.js library to play video on the modern web.

Installation

This package is not yet available on CRAN. To install the latest version:

install.packages("devtools")
devtools::install_github("ashbaldry/video")

Usage

The HTML way to include an audio file in any shiny application/web page is to use the <audio> tag. This cannot (easily) be manipulated from the server.

tags$video(src = "https://vjs.zencdn.net/v/oceans.mp4", type = "video/mp4", controls = NA)

video.js is a flexible video player that is more robust than the basic HTML5 video player, and can easily be manipulated from the server side of shiny applications.

library(shiny)
library(video)

ui <- fluidPage(
  title = "video Example",
  h1("Video Example"),
  video(
    "https://vjs.zencdn.net/v/oceans.mp4",
    elementId = "video"
  ),
  tags$p(
    "Currently playing:",
    textOutput("video_playing", container = tags$strong, inline = TRUE)
  )
)

server <- function(input, output, session) {
  output$video_playing <- renderText({
    if (isTRUE(input$video_playing)) "Yes" else "No"
  })

  observe({
    req(input$video_seek)
    if (round(input$video_seek) == 10) {
      pauseVideo("video")
    } else if (round(input$video_seek) == 20) {
      stopVideo("video")
    }
  })
}

shinyApp(ui, server)

video.js.shiny.Example.mp4

Whilst the buttons below the video aren't required for playing/pausing the video, they are linked to observeEvents that send messages from the server to the video to update.

Extending video.js

For those who want more from video.js and isn't currently available within {video}, then the API is very flexible (https://docs.videojs.com/), and any video can be retrieved in JavaScript using const player = videojs("id") and manipulated from there.

Examples

All examples are available in the Examples directory and can be run locally by installing the {video} package: