library(shiny)
library(shinyjs)
# Set up the UI
fluidPage(
# non-visible elements that set up other processes
useShinyjs()
,hidden(numericInput("vidTime","",0))
,hidden(actionButton("maulends","Maul Ends"))
,tags$script(
"$(document).on('click', '#Main_table button', function () {
Shiny.onInputChange('lastClickId',this.id);
Shiny.onInputChange('lastClick', Math.random())});")
# script to control the youtube player using keystrokes
# 37 is left arrow, 39 is right arrow, 32 is spacebar
,tags$script(HTML(
"$(function(){
$(document).keyup(function(e) {
if (e.which == 37) {
player.seekTo(player.getCurrentTime()-5)
} else if(e.which == 39){
player.seekTo(player.getCurrentTime()+5)
} else if (e.which == 32) {
if (player.getPlayerState() == 1) {
playerTime = player.getCurrentTime();
player.pauseVideo();
} else if (player.getPlayerState() == 2) {
player.playVideo();
}
}
});
})"
))
# Main UI code
,fluidRow(
# title at top of page
column(10
,headerPanel("UMRFC Game Tracker"))
,column(2
,HTML(' ')
,conditionalPanel("typeof player != 'undefined'"
,actionButton("export","Export Data")))
)
,fluidRow(
# Prompt to enter game metadata before the charting begins
conditionalPanel("typeof player == 'undefined'"
,fluidRow(
column(1)
,column(3
,selectInput("home","Home Team"
,choices = names(teams))
,selectInput("away","Away Team"
,choices = names(teams))
)
,column(3
,dateInput("gameDate","Game Date"
,max = Sys.Date())
,textInput("location","Game Location")
)
,column(2
,selectInput("type","Game Type"
,choices = c("15s","7s"))
,selectInput("side","Match Side"
,choices = c("A","B","C","Other"))
)
,column(2
,numericInput("minutesPerHalf","Minutes Per Half",40)
)
)
,fluidRow(
column(1)
,column(6
,textInput("link","Paste YouTube Link Here"
,width = 650))
,column(1
,actionButton("videoLoad","Load Video"))
,column(4)
)
)
)
,fluidRow(
# controls sidebar on the left
column(5
,conditionalPanel("typeof player != 'undefined'"
# picture of the pitch to collect X-Y coordinates data
,plotOutput("pitch", height = "auto",width = 540
,click = "click"
,dblclick = "dblclick"
)
# Possession Team Toggle (Will be updated to team names later)
,radioButtons("team","Possession",choices = list(Home = "H", Away = "A")
,inline = TRUE)
# Panel of all event buttons (only visible after the pitch is clicked)
,conditionalPanel("panelChoice == 1"
,p(
actionButton("turnover","Turnover")
,actionButton("knockon","Knock On")
,actionButton("penalty","Penalty")
,actionButton("intotouch","Into Touch")
,actionButton("maul","Maul"))
,p(
actionButton("receivekick","Receive Kick")
,actionButton("kickoff","Kickoff")
,actionButton("kick","Kick"))
,p(
actionButton("lineout","Lineout")
,actionButton("scrum","Scrum")
,actionButton("restart","Tap Restart"))
,p(
actionButton("try","Try")
,actionButton("other","Held Up/Other")
)
)
# Panel with result events for rucks (2), lineouts (7) and scrums (8)
,conditionalPanel("panelChoice == 2 || panelChoice == 7 || panelChoice == 8"
,p(
actionButton("setpieceturnover","Turnover"))
,p(
actionButton("backs","Backs")
,actionButton("forwards","Forwards")
,actionButton("ruckpenalty","Penalty")
,actionButton("pickandgo","Pick and Go")
,conditionalPanel("panelChoice == 7"
,actionButton("maulfromlineout","Maul"))
,conditionalPanel("panelChoice == 2"
,actionButton("boxkick","Box Kick"))
)
)
# Panel for Penalty result events
,conditionalPanel("panelChoice == 3"
,actionButton("penaltykick","Kick")
,actionButton("kickforpoints","Kick for Points")
,actionButton("scrumfrompen","Scrum")
,actionButton("restartfrompen","Tap Restart")
)
# Panel for conversion kick or kick for points
,conditionalPanel("panelChoice == 4"
,p("Click on the Pitch image to select the kick location")
,actionButton("madekick","Made")
,actionButton("missedkick","Missed")
)
# Panel for after a kick has begun(ends in receive kick or into touch)
,conditionalPanel("panelChoice == 5"
,p(paste0("Single click on the pitch image where the kick is received "
,"or where it goes into touch."))
)
# Panel for after a maul has begun
,conditionalPanel("panelChoice == 6"
,p("Single click on the pitch image where the maul ends.")
)
)
)
# main panel on the right that hosts the video and collected data
,column(7
,uiOutput("video")
,DT::dataTableOutput("Main_table")
)
)
)
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.