diff options
author | Naeem Model <me@nmode.ca> | 2024-05-09 20:22:45 +0000 |
---|---|---|
committer | Naeem Model <me@nmode.ca> | 2024-05-09 20:22:45 +0000 |
commit | dce01ac19a0298388089ce4297a44ef2aa2c4c46 (patch) | |
tree | 1dbc74e9f7e9139f14a517b33a0e3c82c6e04dd0 | |
parent | e06a56581d43cb3c59d51b9b39e6d0fb36efe31c (diff) |
Revamp Shiny app
32 files changed, 1018 insertions, 0 deletions
diff --git a/inst/app/app.R b/inst/app/app.R new file mode 100644 index 0000000..639dc87 --- /dev/null +++ b/inst/app/app.R @@ -0,0 +1,13 @@ +ui <- htmlTemplate("index.html") + +server <- function(input, output) { + source("scripts/data.R", local = TRUE) + source("scripts/estimators.R", local = TRUE) + + react_values <- reactiveValues() + + data_logic(input, output, react_values) + estimators_logic(input, output, react_values) +} + +shinyApp(ui, server) diff --git a/inst/app/index.html b/inst/app/index.html new file mode 100644 index 0000000..83029c5 --- /dev/null +++ b/inst/app/index.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> + <head> + {{ bootstrapLib(theme = bslib::bs_theme(primary = "red")) }} + {{ headContent() }} + <title>Rnaught Web</title> + <link rel="stylesheet" type="text/css" href="styles.css"> + <!-- Enable tooltips. --> + <script> + $(document).ready(function(){ + $('[data-bs-toggle="tooltip"]').tooltip(); + }); + </script> + </head> + <body class="d-flex flex-column h-100"> + <noscript> + <strong>This application requires JavaScript.</strong> + </noscript> + {{ htmlTemplate("templates/navbar.html") }} + {{ htmlTemplate("templates/tabs.html") }} + {{ htmlTemplate("templates/content.html") }} + {{ htmlTemplate("templates/footer.html") }} + </body> +</html> diff --git a/inst/app/scripts/data.R b/inst/app/scripts/data.R new file mode 100644 index 0000000..06cb256 --- /dev/null +++ b/inst/app/scripts/data.R @@ -0,0 +1,236 @@ +# Main logic block for data-related interactions. +data_logic <- function(input, output, react_values) { + # Initialize a data frame to hold the datasets. + react_values$data_table <- data.frame( + Name = character(0), + `Time units` = character(0), + `Case counts` = character(0), + check.names = FALSE + ) + + render_plot(input, output) + single_entry(input, output, react_values) + bulk_entry(input, output, react_values) + render_data(output, react_values) + delete_data(input, react_values) + export_data(output, react_values) +} + +# Convert the input case counts string to an integer vector. +tokenize_counts <- function(counts_str) { + suppressWarnings(as.integer(unlist(strsplit(trimws(counts_str), ",")))) +} + +# Render the preview plot for single entry data. +render_plot <- function(input, output) { + observe({ + counts <- tokenize_counts(input$data_counts) + if (length(counts) > 0 && !anyNA(counts) && all(counts >= 0)) { + output$data_plot <- renderPlot( + plot(seq_along(counts) - 1, counts, type = "o", pch = 16, col = "red", + xlab = input$data_units, ylab = "Cases", cex.lab = 1.5, + xlim = c(0, max(length(counts) - 1, 1)), ylim = c(0, max(counts, 1)) + ) + ) + } else { + output$data_plot <- renderPlot( + plot(NULL, xlim = c(0, 10), ylim = c(0, 10), + xlab = input$data_units, ylab = "Cases", cex.lab = 1.5 + ) + ) + } + }) +} + +# Add a single dataset to the existing table. +single_entry <- function(input, output, react_values) { + observeEvent(input$data_single, { + valid <- TRUE + + # Ensure the dataset name is neither blank nor a duplicate. + name <- trimws(input$data_name) + if (name == "") { + output$data_name_warn <- renderText("The dataset name cannot be blank.") + valid <- FALSE + } else if (name %in% react_values$data_table[, 1]) { + output$data_name_warn <- renderText( + "There is already a dataset with the specified name." + ) + valid <- FALSE + } else { + output$data_name_warn <- renderText("") + } + + # Ensure the case counts are specified as a comma-separated of one or more + # non-negative integers. + counts <- tokenize_counts(input$data_counts) + if (length(counts) == 0) { + output$data_counts_warn <- renderText("Case counts cannot be blank.") + valid <- FALSE + } else if (anyNA(counts) || any(counts < 0)) { + output$data_counts_warn <- renderText( + "Case counts can only contain non-negative integers." + ) + valid <- FALSE + } else { + output$data_counts_warn <- renderText("") + } + + if (valid) { + # Add the new dataset to the data table. + new_row <- data.frame(name, input$data_units, toString(counts)) + colnames(new_row) <- c("Name", "Time units", "Case counts") + react_values$data_table <- rbind(react_values$data_table, new_row) + + # Evaluate all existing estimators on the new dataset and update the + # corresponding row in the estimates table. + update_estimates_rows(new_row, react_values) + + showNotification("Dataset added successfully.", + duration = 3, id = "notify-success" + ) + } + }) +} + +# Add multiple datasets to the existing table. +bulk_entry <- function(input, output, react_values) { + observeEvent(input$data_bulk, { + tryCatch( + { + datasets <- read.csv(text = input$data_area, header = FALSE, sep = ",") + + names <- trimws(datasets[, 1]) + units <- trimws(datasets[, 2]) + counts <- apply(datasets[, 3:ncol(datasets)], 1, + function(row) { + row <- suppressWarnings(as.integer(row)) + toString(row[!is.na(row) & row >= 0]) + } + ) + + warning_text <- "" + + # Ensure the dataset names are neither blank nor duplicates. + if (anyNA(names) || any(names == "")) { + warning_text <- paste0(warning_text, sep = "<br>", + "Each row must begin with a non-blank dataset name." + ) + } else { + if (length(unique(names)) != length(names)) { + warning_text <- paste0(warning_text, sep = "<br>", + "The rows contain duplicate dataset names." + ) + } + if (any(names %in% react_values$data_table[, 1])) { + warning_text <- paste0(warning_text, sep = "<br>", + "The rows contain dataset names which already exist." + ) + } + } + + # Ensure the second entry in each row is a time unit equal to + # "Days" or "Weeks". + if (!all(units %in% c("Days", "Weeks"))) { + warning_text <- paste0(warning_text, sep = "<br>", + "The second entry in each row must be either 'Days' or 'Weeks'." + ) + } + + # Ensure the counts in each row have at least one non-negative integer. + if (any(counts == "")) { + warning_text <- paste0(warning_text, sep = "<br>", + "Each row must contain at least one non-negative integer." + ) + } + + output$data_area_warn <- renderUI(HTML(warning_text)) + + if (warning_text == "") { + # Add the new datasets to the data table. + new_rows <- data.frame(names, units, counts) + colnames(new_rows) <- c("Name", "Time units", "Case counts") + react_values$data_table <- rbind(react_values$data_table, new_rows) + + # Evaluate all existing estimators on the new dataset and update the + # corresponding row in the estimates table. + update_estimates_rows(new_rows, react_values) + + showNotification("Datasets added successfully.", + duration = 3, id = "notify-success" + ) + } + }, + error = function(e) { + output$data_area_warn <- renderText( + "The input does not match the required format." + ) + } + ) + }) +} + +# Render the data table when new datasets are added. +render_data <- function(output, react_values) { + observe({ + output$data_table <- DT::renderDataTable(react_values$data_table) + }) +} + +# Delete rows in the data table, +# and the corresponding rows in the estimates table. +delete_data <- function(input, react_values) { + observeEvent(input$data_delete, { + new_table <- react_values$data_table[-input$data_table_rows_selected, ] + if (nrow(new_table) > 0) { + rownames(new_table) <- seq_len(nrow(new_table)) + } + react_values$data_table <- new_table + + if (ncol(react_values$estimates_table) == 1) { + react_values$estimates_table <- data.frame( + Datasets = react_values$data_table[, 1] + ) + } else { + react_values$estimates_table <- + react_values$estimates_table[-input$data_table_rows_selected, ] + } + }) +} + +# Export data table as a CSV file. +export_data <- function(output, react_values) { + output$data_export <- downloadHandler( + filename = function() { + paste0("Rnaught_data_", format(Sys.time(), "%y-%m-%d_%H-%M-%S"), ".csv") + }, + content = function(file) { + write.csv(react_values$data_table, file, row.names = FALSE) + } + ) +} + +# When new datasets are added, evaluate all existing estimators on them and +# add new rows to the estimates table. +update_estimates_rows <- function(datasets, react_values) { + new_rows <- data.frame( + matrix(nrow = nrow(datasets), ncol = ncol(react_values$estimates_table)) + ) + colnames(new_rows) <- colnames(react_values$estimates_table) + + for (row in seq_len(nrow(datasets))) { + new_rows[row, 1] <- datasets[row, 1] + + if (length(react_values$estimators) > 0) { + for (col in 2:ncol(react_values$estimates_table)) { + new_rows[row, col] <- eval_estimator( + react_values$estimators[[col - 1]], datasets[row, ] + ) + } + } + } + + react_values$estimates_table <- rbind( + react_values$estimates_table, new_rows + ) +} diff --git a/inst/app/scripts/estimators.R b/inst/app/scripts/estimators.R new file mode 100644 index 0000000..171d197 --- /dev/null +++ b/inst/app/scripts/estimators.R @@ -0,0 +1,305 @@ +estimators_logic <- function(input, output, react_values) { + # Initialize a data frame to hold estimates. + react_values$estimates_table <- data.frame(Dataset = character(0)) + # Initialize a list to hold added estimators. + react_values$estimators <- list() + + add_id(input, output, react_values) + add_idea(input, output, react_values) + add_seq_bayes(input, output, react_values) + add_wp(input, output, react_values) + + render_estimates(output, react_values) + delete_estimators(input, react_values) + export_estimates(output, react_values) +} + +# If an estimator is added, ensure it is not a duplicate and add it to the list +# of estimators. This function should be called at the end of each +# estimator-specific 'add' function, after validating their parameters. +add_estimator <- function(method, new_estimator, output, react_values) { + num_estimators <- length(react_values$estimators) + + # Check whether the new estimator is a duplicate, and warn if so. + for (i in seq_len(num_estimators)) { + if (identical(new_estimator, react_values$estimators[[i]])) { + showNotification("Error: This estimator has already been added.", + duration = 3, id = "notify-error" + ) + return() + } + } + + # Add the new estimator to the list of estimators. + react_values$estimators[[num_estimators + 1]] <- new_estimator + + showNotification("Estimator added successfully.", + duration = 3, id = "notify-success" + ) + + # Evaluate all the new estimator on all existing datasets and create a new + # column in the estimates table. + update_estimates_col(new_estimator, react_values) +} + +# Ensure serial intervals are specified as positive numbers. +validate_mu <- function(method, input, output) { + mu <- suppressWarnings(as.numeric(trimws(input[[paste0("mu_", method)]]))) + if (is.na(mu) || mu <= 0) { + output[[paste0("mu_", method, "_warn")]] <- renderText( + "The serial interval must be a positive number." + ) + return(NULL) + } + output[[paste0("mu_", method, "_warn")]] <- renderText("") + mu +} + +# Incidence Decay (ID). +add_id <- function(input, output, react_values) { + observeEvent(input$add_id, { + mu <- validate_mu("id", input, output) + if (!is.null(mu)) { + new_estimator <- list( + method = "id", mu = mu, mu_units = input$mu_id_units + ) + add_estimator("id", new_estimator, output, react_values) + } + }) +} + +# Incidence Decay and Exponential Adjustment (IDEA). +add_idea <- function(input, output, react_values) { + observeEvent(input$add_idea, { + mu <- validate_mu("idea", input, output) + if (!is.null(mu)) { + new_estimator <- list( + method = "idea", mu = mu, mu_units = input$mu_idea_units + ) + add_estimator("idea", new_estimator, output, react_values) + } + }) +} + +# Sequential Bayes (seqB). +add_seq_bayes <- function(input, output, react_values) { + observeEvent(input$add_seq_bayes, { + mu <- validate_mu("seq_bayes", input, output) + + kappa <- trimws(input$kappa) + kappa <- if (kappa == "") 20 else suppressWarnings(as.numeric(kappa)) + + if (is.na(kappa) || kappa <= 0) { + output$kappa_warn <- renderText( + "The maximum prior must be a positive number." + ) + } else if (!is.null(mu)) { + output$kappa_warn <- renderText("") + new_estimator <- list( + method = "seq_bayes", mu = mu, + mu_units = input$mu_seq_bayes_units, kappa = kappa + ) + add_estimator("seq_bayes", new_estimator, output, react_values) + } + }) +} + +# White and Pagano (WP). +add_wp <- function(input, output, react_values) { + observeEvent(input$add_wp, { + if (input$wp_mu_known == "Yes") { + mu <- validate_mu("wp", input, output) + if (!is.null(mu)) { + new_estimator <- list(method = "wp", + mu = mu, mu_units = input$mu_wp_units + ) + add_estimator("wp", new_estimator, output, react_values) + } + } else { + grid_length <- trimws(input$grid_length) + max_shape <- trimws(input$max_shape) + max_scale <- trimws(input$max_scale) + + suppressWarnings({ + grid_length <- if (grid_length == "") 100 else as.numeric(grid_length) + max_shape <- if (max_shape == "") 10 else as.numeric(max_shape) + max_scale <- if (max_scale == "") 10 else as.numeric(max_scale) + }) + + valid <- TRUE + + if (is.na(grid_length) || grid_length <= 0) { + output$grid_length_warn <- renderText( + "The grid length must be a positive integer." + ) + valid <- FALSE + } else { + output$grid_length_warn <- renderText("") + } + + if (is.na(max_shape) || max_shape <= 0) { + output$max_shape_warn <- renderText( + "The maximum shape must be a positive number." + ) + valid <- FALSE + } else { + output$max_shape_warn <- renderText("") + } + + if (is.na(max_scale) || max_scale <= 0) { + output$max_scale_warn <- renderText( + "The maximum scale must be a positive number." + ) + valid <- FALSE + } else { + output$max_scale_warn <- renderText("") + } + + if (valid) { + new_estimator <- list(method = "wp", mu = NA, grid_length = grid_length, + max_shape = max_shape, max_scale = max_scale + ) + add_estimator("wp", new_estimator, output, react_values) + } + } + }) +} + +# Convert an estimator's specified serial interval to match the time units of +# the given dataset. +convert_mu_units <- function(data_units, estimator_units, mu) { + if (data_units == "Days" && estimator_units == "Weeks") { + return(mu * 7) + } else if (data_units == "Weeks" && estimator_units == "Days") { + return(mu / 7) + } + mu +} + +# Add a column to the estimates table when a new estimator is added. +update_estimates_col <- function(estimator, react_values) { + dataset_rows <- seq_len(nrow(react_values$data_table)) + estimates <- dataset_rows + + for (row in dataset_rows) { + estimate <- eval_estimator(estimator, react_values$data_table[row, ]) + estimates[row] <- estimate + } + + estimates <- data.frame(estimates) + colnames(estimates) <- estimates_col_name(estimates, estimator) + + react_values$estimates_table <- cbind( + react_values$estimates_table, estimates + ) +} + +# Evaluate the specified estimator on the given dataset. +eval_estimator <- function(estimator, dataset) { + cases <- as.integer(unlist(strsplit(dataset[, 3], ","))) + + if (estimator$method == "id") { + mu <- convert_mu_units(dataset[, 2], estimator$mu_units, estimator$mu) + estimate <- round(Rnaught::id(cases, mu), 2) + } else if (estimator$method == "idea") { + mu <- convert_mu_units(dataset[, 2], estimator$mu_units, estimator$mu) + estimate <- round(Rnaught::idea(cases, mu), 2) + } else if (estimator$method == "seq_bayes") { + mu <- convert_mu_units(dataset[, 2], estimator$mu_units, estimator$mu) + estimate <- round(Rnaught::seq_bayes(cases, mu, estimator$kappa), 2) + } else if (estimator$method == "wp") { + if (is.na(estimator$mu)) { + estimate <- Rnaught::wp(cases, serial = TRUE, + grid_length = estimator$grid_length, + max_shape = estimator$max_shape, max_scale = estimator$max_scale + ) + estimated_mu <- round(sum(estimate$supp * estimate$pmf), 2) + estimate <- paste0(round(estimate$r0, 2), " (μ = ", estimated_mu, + " ", tolower(dataset[, 2]), ")" + ) + } else { + mu <- convert_mu_units(dataset[, 2], estimator$mu_units, estimator$mu) + estimate <- round(Rnaught::wp(cases, mu), 2) + } + } + + return(estimate) +} + +# Create the column name of an estimator when it is +# added to the estimates table. +estimates_col_name <- function(estimates, estimator) { + if (estimator$method == "id") { + return(paste0("ID", " (μ = ", estimator$mu, " ", + tolower(estimator$mu_units), ")" + )) + } else if (estimator$method == "idea") { + return(paste0("IDEA", " (μ = ", estimator$mu, " ", + tolower(estimator$mu_units), ")" + )) + } else if (estimator$method == "seq_bayes") { + return(paste0("seqB", " (μ = ", estimator$mu, " ", + tolower(estimator$mu_units), ", κ = ", estimator$kappa, ")" + )) + } else if (estimator$method == "wp") { + if (is.na(estimator$mu)) { + return(paste0("WP (", estimator$grid_length, ", ", + round(estimator$max_shape, 3), ", ", round(estimator$max_scale, 3), ")" + )) + } else { + return(paste0("WP", " (μ = ", estimator$mu, " ", + tolower(estimator$mu_units), ")" + )) + } + } +} + +# Render the estimates table whenever it is updated. +render_estimates <- function(output, react_values) { + observe({ + output$estimates_table <- DT::renderDataTable(react_values$estimates_table, + selection = list(target = "column", selectable = c(0)), + escape = FALSE, rownames = FALSE, + options = list( + columnDefs = list(list(className = "dt-left", targets = "_all")) + ), + ) + }) +} + +# Delete columns from the estimates table, +# as well as the corresponding estimators. +delete_estimators <- function(input, react_values) { + observeEvent(input$estimators_delete, { + cols_selected <- input$estimates_table_columns_selected + react_values$estimators <- react_values$estimators[-cols_selected] + react_values$estimates_table[, cols_selected + 1] <- NULL + }) +} + +# Export estimates table as a CSV file. +export_estimates <- function(output, react_values) { + output$estimates_export <- downloadHandler( + filename = function() { + paste0( + "Rnaught_estimates_", format(Sys.time(), "%y-%m-%d_%H-%M-%S"), ".csv" + ) + }, + content = function(file) { + output_table <- data.frame( + lapply(react_values$estimates_table, sub_entity) + ) + colnames(output_table) <- sub_entity( + colnames(react_values$estimates_table) + ) + write.csv(output_table, file, row.names = FALSE) + } + ) +} + +# Substitute HTML entity codes with natural names. +sub_entity <- function(obj) { + obj <- gsub("μ", "mu", obj) + obj <- gsub("κ", "kappa", obj) + obj +} diff --git a/inst/app/templates/content.html b/inst/app/templates/content.html new file mode 100644 index 0000000..8147c07 --- /dev/null +++ b/inst/app/templates/content.html @@ -0,0 +1,14 @@ +<div class="container-fluid tab-content px-3 py-3"> + <div id="about" class="tab-pane fade show active px-1"> + {{ htmlTemplate("templates/content/about.html") }} + </div> + <div id="data" class="tab-pane fade"> + {{ htmlTemplate("templates/content/data.html") }} + </div> + <div id="estimators" class="tab-pane fade"> + {{ htmlTemplate("templates/content/estimators.html") }} + </div> + <div id="help" class="tab-pane fade"> + {{ htmlTemplate("templates/content/help.html") }} + </div> +</div> diff --git a/inst/app/templates/content/about.html b/inst/app/templates/content/about.html new file mode 100644 index 0000000..aa806d5 --- /dev/null +++ b/inst/app/templates/content/about.html @@ -0,0 +1,27 @@ +<h1>Welcome to the Rnaught web application!</h1> +<p> + Rnaught is an R package and web application for estimating the + <a href="https://en.wikipedia.org/wiki/Basic_reproduction_number" target="_blank">basic reproduction number</a> + of infectious diseases. For information about using this application, view the + <span class="fw-bold text-primary">Help <span class="glyphicon glyphicon-question-sign"></span></span> tab. + To learn more about the package, visit the online + <a href="https://MI2YorkU.github.io/Rnaught" target="_blank">documentation</a> or + <a href="https://github.com/MI2YorkU/Rnaught" target="_blank">GitHub</a> repository. + Technical details about the estimators featured in this project can be found in the reference + <a href="https://doi.org/10.1371/journal.pone.0269306" target="_blank">article</a>. +</p> + +<h4>What is the basic reproduction number?</h4> +<p> + The basic reproduction number, denoted <em>R<sub>0</sub></em>, describes the expected number of infections caused by a + single infectious individual. It assumes that all individuals in a given population are susceptible to the disease, + and that no preventive measures (such as lockdowns or vaccinations) have been enforced. As such, it is a useful + indicator of the transmissibility of a disease during the early stages of its detection. +</p> +<p> + If <em>R<sub>0</sub></em> < 1, then the disease will eventually die out. On the other hand, if + <em>R<sub>0</sub></em> > 1, the rate at which the disease spreads is exponential. Typically, it is difficult to + determine <em>R<sub>0</sub></em> precisely, due to uncertainty in information relating to the spread of the disease. + Therefore, many estimation methods exist, each based on their own models and yielding different estimates. It is the + responsibility of public health officials to employ the most appropriate estimator given the situation at hand. +</p> diff --git a/inst/app/templates/content/data.html b/inst/app/templates/content/data.html new file mode 100644 index 0000000..eaae571 --- /dev/null +++ b/inst/app/templates/content/data.html @@ -0,0 +1,13 @@ +<nav class="nav nav-tabs"> + <a class="nav-link active" data-bs-toggle="tab" href="#enter-data">Enter data</a> + <a class="nav-link" data-bs-toggle="tab" href="#view-data">View data</a> +</nav> + +<div class="container-fluid tab-content"> + <div id="enter-data" class="pt-3 tab-pane fade show active"> + {{ htmlTemplate("templates/content/data/enter-data.html") }} + </div> + <div id="view-data" class="pt-3 tab-pane fade"> + {{ htmlTemplate("templates/content/data/view-data.html") }} + </div> +</div> diff --git a/inst/app/templates/content/data/enter-data.html b/inst/app/templates/content/data/enter-data.html new file mode 100644 index 0000000..621c785 --- /dev/null +++ b/inst/app/templates/content/data/enter-data.html @@ -0,0 +1,13 @@ +<div class="row mb-5"> + <form class="col-md"> + {{ htmlTemplate("templates/content/data/enter-data/single-entry.html") }} + </form> + <div class="col-md mt-5 mt-md-0 d-flex flex-column align-items-center"> + <h5>Data plot</h5> + {{ plotOutput(outputId = "data_plot") }} + </div> +</div> +<hr> +<form> + {{ htmlTemplate("templates/content/data/enter-data/bulk-entry.html") }} +</form> diff --git a/inst/app/templates/content/data/enter-data/bulk-entry.html b/inst/app/templates/content/data/enter-data/bulk-entry.html new file mode 100644 index 0000000..82a3ccf --- /dev/null +++ b/inst/app/templates/content/data/enter-data/bulk-entry.html @@ -0,0 +1,37 @@ +<h4 class="mb-3">Bulk entry</h4> +<!-- Button to toggle help text. --> +<button type="button" class="btn btn-outline-primary btn-sm" id="bulk-help-toggle" + data-bs-toggle="collapse" data-bs-target="#bulk-help"> + Show required format +</button> +<!-- Help text for bulk input format. --> +<div class="collapse mt-2" id="bulk-help"> + <div class="card card-body border-primary"> + <p>Enter one or more rows in the following format:</p> + <p class="overflow-x-scroll text-nowrap font-monospace"> + <u>Dataset name</u>,<u>Time units</u>,<u>Case counts</u> + </p> + <p> + <u class="font-monospace">Time units</u> must be one of + <u class="font-monospace">Days</u> or + <u class="font-monospace">Weeks</u>, and + <u class="font-monospace">Case counts</u> + must be a comma-separated list of one or more non-negative integers. + </p> + <p>Example:</p> + <p class="overflow-x-scroll text-nowrap font-monospace lh-sm"> + Montreal,Days,1,2,3,4,5,6,7,8,9,19<br> + Ottawa,Weeks,1,2,3,4,5,6,7,8,9,19<br> + Toronto,Days,1,2,3,4,5,6,7,8,9,19 + </p> + </div> +</div> +<!-- Data input area. --> +<div> + <textarea id="data_area" class="form-control shiny-input-textarea my-3" rows="3" wrap="off"></textarea> + <small id="data_area_warn" class="form-text text-primary shiny-html-output"></small> +</div> +<!-- Submit data. --> +<button id="data_bulk" type="button" class="btn btn-outline-primary btn-sm action-button"> + <span class="glyphicon glyphicon-plus"></span> Add +</button> diff --git a/inst/app/templates/content/data/enter-data/single-entry.html b/inst/app/templates/content/data/enter-data/single-entry.html new file mode 100644 index 0000000..9f249d9 --- /dev/null +++ b/inst/app/templates/content/data/enter-data/single-entry.html @@ -0,0 +1,39 @@ +<h4>Single entry</h4> +<!-- Dataset name. --> +<div class="my-3"> + <label class="form-label" for="data_name">Dataset name</label> + <input name="data_name" class="form-control" type="text"> + <small id="data_name_warn" class="form-text text-primary shiny-text-output"></small> +</div> +<!-- Case counts. --> +<div class="mb-3"> + <label class="form-label" for="data_counts"> + Case counts + <sup data-bs-toggle="tooltip" data-bs-placement="right" + data-bs-title="Enter as a comma-separated list of non-negative integers (example: 0,1,1,2,3,5,8,13)."> + [?] + </sup> + </label> + <input name="data_counts" class="form-control" type="text"> + <small id="data_counts_warn" class="form-text text-primary shiny-text-output"></small> +</div> +<!-- Time units. --> +<div class="mb-3"> + <label class="form-label" for="data_units">Time units</label> + <div class="shiny-input-radiogroup" id="data_units"> + <div class="form-check form-check-inline"> + <label class="form-check-label"> + <input type="radio" class="form-check-input me-2" name="data_units" value="Days">Days + </label> + </div> + <div class="form-check form-check-inline"> + <label class="form-check-label"> + <input type="radio" class="form-check-input me-2" name="data_units" value="Weeks" checked>Weeks + </label> + </div> + </div> +</div> +<!-- Submit data. --> +<button id="data_single" type="button" class="btn btn-outline-primary btn-sm action-button"> + <span class="glyphicon glyphicon-plus"></span> Add +</button> diff --git a/inst/app/templates/content/data/view-data.html b/inst/app/templates/content/data/view-data.html new file mode 100644 index 0000000..52f1e85 --- /dev/null +++ b/inst/app/templates/content/data/view-data.html @@ -0,0 +1,19 @@ +<h4>Data table</h4> +<!-- Data table. --> +<div class="my-3"> + {{ DT::dataTableOutput(outputId = "data_table") }} +</div> +<!-- Display inactive delete button when no rows are selected. --> +<button type="button" class="btn btn-primary btn-sm text-white" disabled + data-display-if="'data_table_rows_selected' in input && input.data_table_rows_selected.length == 0"> + <span class="glyphicon glyphicon-remove"></span> Delete row(s) +</button> +<!-- Display active delete button when at least one row is selected. --> +<button id="data_delete" type="button" class="btn btn-primary btn-sm action-button text-white" + data-display-if="'data_table_rows_selected' in input && input.data_table_rows_selected.length != 0"> + <span class="glyphicon glyphicon-remove"></span> Delete row(s) +</button> +<!-- Button to export data table as a CSV file. --> +<a id="data_export" type="button" class="btn btn-outline-primary btn-sm shiny-download-link"> + <span class="glyphicon glyphicon-download-alt"></span> Export table +</a> diff --git a/inst/app/templates/content/estimators.html b/inst/app/templates/content/estimators.html new file mode 100644 index 0000000..e664ad2 --- /dev/null +++ b/inst/app/templates/content/estimators.html @@ -0,0 +1,13 @@ +<nav class="nav nav-tabs"> + <a class="nav-link active" data-bs-toggle="tab" href="#add-estimators">Add estimators</a> + <a class="nav-link" data-bs-toggle="tab" href="#view-estimates">View estimates</a> +</nav> + +<div class="container-fluid tab-content"> + <div id="add-estimators" class="pt-3 tab-pane fade show active"> + {{ htmlTemplate("templates/content/estimators/add-estimators.html") }} + </div> + <div id="view-estimates" class="pt-3 tab-pane fade"> + {{ htmlTemplate("templates/content/estimators/view-estimates.html") }} + </div> +</div> diff --git a/inst/app/templates/content/estimators/add-estimators.html b/inst/app/templates/content/estimators/add-estimators.html new file mode 100644 index 0000000..dce2dae --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators.html @@ -0,0 +1,34 @@ +<div class="accordion accordion-flush" id="estimators-accordion"> + {{ + htmlTemplate("templates/content/estimators/add-estimators/components/panel.html", + id = "id", + header = "Incidence Decay (ID)", + reference_label = "Fisman et al. (PloS One, 2013)", + reference_url = "https://doi.org/10.1371/journal.pone.0083622" + ) + }} + {{ + htmlTemplate("templates/content/estimators/add-estimators/components/panel.html", + id = "idea", + header = "Incidence Decay and Exponential Adjustment (IDEA)", + reference_label = "Fisman et al. (PloS One, 2013)", + reference_url = "https://doi.org/10.1371/journal.pone.0083622" + ) + }} + {{ + htmlTemplate("templates/content/estimators/add-estimators/components/panel.html", + id = "seq_bayes", + header = "Sequential Bayes (seqB)", + reference_label = "Bettencourt and Riberio (PloS One, 2008)", + reference_url = "https://doi.org/10.1371/journal.pone.0002185" + ) + }} + {{ + htmlTemplate("templates/content/estimators/add-estimators/components/panel.html", + id = "wp", + header = "White and Pagano (WP)", + reference_label = "White and Pagano (Statistics in Medicine, 2008)", + reference_url = "https://doi.org/10.1002/sim.3136" + ) + }} +</div> diff --git a/inst/app/templates/content/estimators/add-estimators/components/mu.html b/inst/app/templates/content/estimators/add-estimators/components/mu.html new file mode 100644 index 0000000..f25a1c8 --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators/components/mu.html @@ -0,0 +1,20 @@ +<!-- Serial interval label and help tooltip. --> +<label class="form-label" for="mu_{{ id }}"> + Serial interval (μ) + <sup data-bs-toggle="tooltip" data-bs-placement="right" + data-bs-title="The serial interval is the time between when an infected individual (the infector) becomes + symptomatic, to when another individual (who is infected by the infector) becomes symptomatic."> + [?] + </sup> +</label> +<div class="input-group"> + <!-- Serial interval input field. --> + <input name="mu_{{ id }}" class="form-control" type="text"> + <!-- Days/weeks dropdown. --> + <select name="mu_{{ id }}_units" class="form-select"> + <option value="Days" selected>Days</option> + <option value="Weeks">Weeks</option> + </select> +</div> +<!-- Warning text for incorrect values. --> +<small id="mu_{{ id }}_warn" class="form-text text-primary shiny-text-output"></small> diff --git a/inst/app/templates/content/estimators/add-estimators/components/panel.html b/inst/app/templates/content/estimators/add-estimators/components/panel.html new file mode 100644 index 0000000..b1e0378 --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators/components/panel.html @@ -0,0 +1,21 @@ +<div class="accordion-item"> + <h2 class="accordion-header"> + <button class="accordion-button collapsed" type="button" + data-bs-toggle="collapse" data-bs-target="#{{ id }}"> + <h4>{{ header }}</h4> + </button> + </h2> + <div id="{{ id }}" class="accordion-collapse collapse" data-bs-parent="#estimators-accordion"> + <div class="accordion-body"> + <p>Reference: <a href="{{ reference_url }}" target="_blank"><em>{{ reference_label }}</em></a></p> + <p>{{ htmlTemplate(paste0("templates/content/estimators/add-estimators/descriptions/", id, ".html")) }}</p> + <h5>Parameters</h5> + <form class="my-3"> + {{ htmlTemplate(paste0("templates/content/estimators/add-estimators/parameters/", id, ".html")) }} + </form> + <button id="add_{{ id }}" type="button" class="btn btn-outline-primary btn-sm action-button"> + <span class="glyphicon glyphicon-plus"></span> Add + </button> + </div> + </div> +</div> diff --git a/inst/app/templates/content/estimators/add-estimators/descriptions/id.html b/inst/app/templates/content/estimators/add-estimators/descriptions/id.html new file mode 100644 index 0000000..b182ae5 --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators/descriptions/id.html @@ -0,0 +1 @@ +This is a short description of the ID method. diff --git a/inst/app/templates/content/estimators/add-estimators/descriptions/idea.html b/inst/app/templates/content/estimators/add-estimators/descriptions/idea.html new file mode 100644 index 0000000..edfbb79 --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators/descriptions/idea.html @@ -0,0 +1 @@ +This is a short description of the IDEA method. diff --git a/inst/app/templates/content/estimators/add-estimators/descriptions/seq_bayes.html b/inst/app/templates/content/estimators/add-estimators/descriptions/seq_bayes.html new file mode 100644 index 0000000..f6df3ee --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators/descriptions/seq_bayes.html @@ -0,0 +1 @@ +This is a short description of the seqB method. diff --git a/inst/app/templates/content/estimators/add-estimators/descriptions/wp.html b/inst/app/templates/content/estimators/add-estimators/descriptions/wp.html new file mode 100644 index 0000000..640b44d --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators/descriptions/wp.html @@ -0,0 +1 @@ +This is a short description of the WP method. diff --git a/inst/app/templates/content/estimators/add-estimators/parameters/id.html b/inst/app/templates/content/estimators/add-estimators/parameters/id.html new file mode 100644 index 0000000..a3159ca --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators/parameters/id.html @@ -0,0 +1 @@ +{{ htmlTemplate("templates/content/estimators/add-estimators/components/mu.html", id = "id") }} diff --git a/inst/app/templates/content/estimators/add-estimators/parameters/idea.html b/inst/app/templates/content/estimators/add-estimators/parameters/idea.html new file mode 100644 index 0000000..379be84 --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators/parameters/idea.html @@ -0,0 +1 @@ +{{ htmlTemplate("templates/content/estimators/add-estimators/components/mu.html", id = "idea") }} diff --git a/inst/app/templates/content/estimators/add-estimators/parameters/seq_bayes.html b/inst/app/templates/content/estimators/add-estimators/parameters/seq_bayes.html new file mode 100644 index 0000000..bcc82b7 --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators/parameters/seq_bayes.html @@ -0,0 +1,22 @@ +<div class="row"> + <!-- Serial interval (mu). --> + <div class="col-md"> + {{ htmlTemplate("templates/content/estimators/add-estimators/components/mu.html", id = "seq_bayes") }} + </div> + <!-- Maximum value of the uniform prior (kappa). --> + <div class="col-md mt-2 mt-md-0"> + <!-- Label and help tooltip. --> + <label class="form-label" for="kappa"> + Maximum prior (κ) + <sup data-bs-toggle="tooltip" data-bs-placement="right" data-bs-html="true" + data-bs-title="The initial maximum belief of <em>R<sub>0</sub></em>. The higher this value, the higher + <em>R<sub>0</sub></em> is believed to be prior to the estimation."> + [?] + </sup> + </label> + <!-- Input field. --> + <input name="kappa" class="form-control" type="text" placeholder="Default: 20"> + <!-- Warning text for incorrect values. --> + <small id="kappa_warn" class="form-text text-primary shiny-text-output"></small> + </div> +</div> diff --git a/inst/app/templates/content/estimators/add-estimators/parameters/wp.html b/inst/app/templates/content/estimators/add-estimators/parameters/wp.html new file mode 100644 index 0000000..b789a23 --- /dev/null +++ b/inst/app/templates/content/estimators/add-estimators/parameters/wp.html @@ -0,0 +1,39 @@ +<!-- Radio buttons to specify whether the serial interval is known. --> +<label class="form-label" for="wp_mu_known">Is the serial interval known?</label> +<div class="shiny-input-radiogroup" id="wp_mu_known"> + <div class="form-check form-check-inline"> + <label class="form-check-label"> + <input type="radio" class="form-check-input me-2" name="wp_mu_known" value="Yes" checked>Yes + </label> + </div> + <div class="form-check form-check-inline"> + <label class="form-check-label"> + <input type="radio" class="form-check-input me-2" name="wp_mu_known" value="No">No + </label> + </div> +</div> +<!-- Show the input field for the serial interval if it is known. --> +<div data-display-if="input.wp_mu_known == 'Yes'" class="mt-2 mt-md-0"> + {{ htmlTemplate("templates/content/estimators/add-estimators/components/mu.html", id = "wp") }} +</div> +<!-- Show the input fields for the grid search parameters if the serial interval is unknown. --> +<div data-display-if="input.wp_mu_known == 'No'" class="row"> + <!-- Grid length. --> + <div class="col-md mt-2 mt-md-0"> + <label class="form-label" for="grid_length">Grid length</label> + <input name="grid_length" class="form-control" type="text" placeholder="Default: 100"> + <small id="grid_length_warn" class="form-text text-primary shiny-text-output"></small> + </div> + <!-- Maximum shape. --> + <div class="col-md mt-2 mt-md-0"> + <label class="form-label" for="max_shape">Maximum shape</label> + <input name="max_shape" class="form-control" type="text" placeholder="Default: 10"> + <small id="max_shape_warn" class="form-text text-primary shiny-text-output"></small> + </div> + <!-- Grid length. --> + <div class="col-md mt-2 mt-md-0"> + <label class="form-label" for="max_scale">Maximum scale</label> + <input name="max_scale" class="form-control" type="text" placeholder="Default: 10"> + <small id="max_scale_warn" class="form-text text-primary shiny-text-output"></small> + </div> +</div> diff --git a/inst/app/templates/content/estimators/view-estimates.html b/inst/app/templates/content/estimators/view-estimates.html new file mode 100644 index 0000000..e81fff6 --- /dev/null +++ b/inst/app/templates/content/estimators/view-estimates.html @@ -0,0 +1,21 @@ +<h4>Estimates table</h4> +<!-- Estimates table. --> +<div class="my-3"> + {{ DT::dataTableOutput(outputId = "estimates_table") }} +</div> +<!-- Display inactive delete button when no columns are selected. --> +<button type="button" class="btn btn-primary btn-sm text-white" disabled + data-display-if="'estimates_table_columns_selected' in input && + input.estimates_table_columns_selected.length == 0"> + <span class="glyphicon glyphicon-remove"></span> Delete column(s) +</button> +<!-- Display active delete button when at least one column is selected. --> +<button id="estimators_delete" type="button" class="btn btn-primary btn-sm action-button text-white" + data-display-if="'estimates_table_columns_selected' in input && + input.estimates_table_columns_selected.length != 0"> + <span class="glyphicon glyphicon-remove"></span> Delete column(s) +</button> +<!-- Button to export estimates table as a CSV file. --> +<a id="estimates_export" type="button" class="btn btn-outline-primary btn-sm shiny-download-link"> + <span class="glyphicon glyphicon-download-alt"></span> Export table +</a> diff --git a/inst/app/templates/content/help.html b/inst/app/templates/content/help.html new file mode 100644 index 0000000..388afb1 --- /dev/null +++ b/inst/app/templates/content/help.html @@ -0,0 +1,14 @@ +<div class="accordion accordion-flush" id="help-accordion"> + {{ + htmlTemplate("templates/content/help/panel.html", + id = "example-help-1", + header = "Example help 1" + ) + }} + {{ + htmlTemplate("templates/content/help/panel.html", + id = "example-help-2", + header = "Example help 2" + ) + }} +</div> diff --git a/inst/app/templates/content/help/example-help-1.html b/inst/app/templates/content/help/example-help-1.html new file mode 100644 index 0000000..245b9b6 --- /dev/null +++ b/inst/app/templates/content/help/example-help-1.html @@ -0,0 +1 @@ +Example help 1 diff --git a/inst/app/templates/content/help/example-help-2.html b/inst/app/templates/content/help/example-help-2.html new file mode 100644 index 0000000..a4817b5 --- /dev/null +++ b/inst/app/templates/content/help/example-help-2.html @@ -0,0 +1 @@ +Example help 2 diff --git a/inst/app/templates/content/help/panel.html b/inst/app/templates/content/help/panel.html new file mode 100644 index 0000000..9eb6e2e --- /dev/null +++ b/inst/app/templates/content/help/panel.html @@ -0,0 +1,12 @@ +<div class="accordion-item"> + <h2 class="accordion-header"> + <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#{{ id }}"> + {{ header }} + </button> + </h2> + <div id="{{ id }}" class="accordion-collapse collapse" data-bs-parent="#help-accordion"> + <div class="accordion-body"> + {{ htmlTemplate(paste0("templates/content/help/", id, ".html")) }} + </div> + </div> +</div> diff --git a/inst/app/templates/footer.html b/inst/app/templates/footer.html new file mode 100644 index 0000000..19d4b0c --- /dev/null +++ b/inst/app/templates/footer.html @@ -0,0 +1,7 @@ +<footer class="container-fluid mt-auto text-center"> + <em> + Released under the + <a href="https://www.gnu.org/licenses/agpl-3.0.html" target="_blank">AGPLv3</a> + or later. + </em> +</footer> diff --git a/inst/app/templates/navbar.html b/inst/app/templates/navbar.html new file mode 100644 index 0000000..1f86953 --- /dev/null +++ b/inst/app/templates/navbar.html @@ -0,0 +1,27 @@ +<nav class="navbar navbar-expand-sm"> + <div class="container-fluid"> + <!-- Project name and description. --> + <a class="navbar-brand text-primary" href="/">Rnaught Web</a> + <span class="navbar-text d-none d-md-block"> + An estimation suite for <em>R<sub>0</sub></em> + </span> + <!-- Navigation toggler for smaller screens. --> + <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#nav-toggle"> + <span class="glyphicon glyphicon-menu-hamburger text-primary"></span> + </button> + <!-- Navigation links. --> + <div class="collapse navbar-collapse justify-content-end" id="nav-toggle"> + <div class="navbar-nav"> + <a class="nav-link text-primary" href="https://MI2YorkU.github.io/Rnaught" target="_blank"> + <span class="glyphicon glyphicon-book"></span> Documentation + </a> + <a class="nav-link text-primary" href="https://github.com/MI2Yorku/Rnaught" target="_blank"> + <span class="glyphicon glyphicon-console"></span> Source + </a> + <a class="nav-link text-primary" href="https://doi.org/10.1371/journal.pone.0269306" target="_blank"> + <span class="glyphicon glyphicon-education"></span> Article + </a> + </div> + </div> + </div> +</nav> diff --git a/inst/app/templates/tabs.html b/inst/app/templates/tabs.html new file mode 100644 index 0000000..bd07df9 --- /dev/null +++ b/inst/app/templates/tabs.html @@ -0,0 +1,14 @@ +<nav class="nav nav-pills nav-fill"> + <a class="nav-link rounded-0 active" data-bs-toggle="pill" href="#about"> + About <span class="glyphicon glyphicon-info-sign"></span> + </a> + <a class="nav-link rounded-0" data-bs-toggle="pill" href="#data"> + Data <span class="glyphicon glyphicon-list-alt"></span> + </a> + <a class="nav-link rounded-0" data-bs-toggle="pill" href="#estimators"> + Estimators <span class="glyphicon glyphicon-random"></span> + </a> + <a class="nav-link rounded-0" data-bs-toggle="pill" href="#help"> + Help <span class="glyphicon glyphicon-question-sign"></span> + </a> +</nav> diff --git a/inst/app/www/styles.css b/inst/app/www/styles.css new file mode 100644 index 0000000..a3533d3 --- /dev/null +++ b/inst/app/www/styles.css @@ -0,0 +1,26 @@ +body { + min-height: 100vh; + height: 100%; + width: 100%; +} + +noscript { + text-align: center; +} + +.nav-pills .active { + color: white !important; +} + +.action-button:hover, #bulk-help-toggle:hover, #data_export:hover { + color: white !important; +} + +#data_plot { + margin-top: -0.5rem; +} + +td.selected { + background-color: red; + color: white; +} |