From 9cf25e707fbd49d357cf295ad62f83d805c59c2c Mon Sep 17 00:00:00 2001
From: Naeem Model <me@nmode.ca>
Date: Sun, 26 May 2024 02:38:19 +0000
Subject: Update Shiny app

- Refactor data upload and sample data
- Create custom data upload button
- Create script.js
- Change Shiny notification colour
- Bug fix: ensure the case counts in bulk data that have only one row are treated as a data frame, by wrapping them in 'data.frame' before passing to 'apply'
---
 data.R                                             | 363 ---------------------
 enter-data.html                                    |  20 --
 inst/app/index.html                                |   7 +-
 inst/app/scripts/data.R                            | 183 +++++++----
 inst/app/templates/content/data/enter-data.html    |   6 +-
 .../content/data/enter-data/bulk-entry.html        |  33 +-
 .../content/data/enter-data/load-samples.html      |  17 +
 inst/app/www/script.js                             |  21 ++
 inst/app/www/styles.css                            |   6 +-
 sample-entry.html                                  |  40 ---
 uploadData-entry.html                              |  16 -
 11 files changed, 195 insertions(+), 517 deletions(-)
 delete mode 100644 data.R
 delete mode 100644 enter-data.html
 create mode 100644 inst/app/templates/content/data/enter-data/load-samples.html
 create mode 100644 inst/app/www/script.js
 delete mode 100644 sample-entry.html
 delete mode 100644 uploadData-entry.html

diff --git a/data.R b/data.R
deleted file mode 100644
index a07372a..0000000
--- a/data.R
+++ /dev/null
@@ -1,363 +0,0 @@
-# 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)
-  upload_entry(input, output, react_values)
-  sample_entry(input, output, react_values)
-  render_data(output, react_values)
-  delete_data(input, react_values)
-  export_data(output, react_values)
-}
-
-warnings <- function(df, df_elems) {
-  
-  warning_text <- ''
-  
-  # Ensure the dataset names are neither blank nor duplicates.
-  if (anyNA(df_elems[[1]]) || any(df_elems[[1]] == "")) {
-    warning_text <- paste0(warning_text, sep = "<br>",
-                           "Each row must begin with a non-blank dataset name."
-    )
-  } 
-  
-  if (length(unique(df_elems[[1]])) != length(df_elems[[1]])) {
-    warning_text <- paste0(warning_text, sep = "<br>",
-                           "The rows contain duplicate dataset names."
-    )
-  }
-  
-  if (any(df_elems[[1]] %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(df_elems[[2]] %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(df_elems[[3]] == "")) {
-    warning_text <- paste0(warning_text, sep = "<br>",
-                           "Each row must contain at least one non-negative integer."
-    )
-  }
-  return(warning_text)
-}
-
-
-# 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 = "black",
-             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])
-                        }
-        )
-        output$data_area_warn <- renderText("")
-        warning_text <- warnings(datasets, list(names, units, counts))
-        
-        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"
-          )
-        } else {
-          output$data_area_warn <- renderUI(HTML(warning_text))
-        }
-      },
-      error = function(e) {
-        output$data_area_warn <- renderText(
-          "The input does not match the required format."
-        )
-      }
-    )
-  })
-}
-
-# Upload datasets to the existing table.
-upload_entry <- function(input, output, react_values) {
-  observeEvent(input$data_load, {
-    tryCatch(
-      {
-        df <- read.csv(file = input$upload_csv$datapath)
-        names <- trimws(df[, 1])
-        units <- trimws(df[, 2])
-        counts <- sapply(tokenize_counts(df[, 3:ncol(df)]),
-                         function(row) {
-                           row <- suppressWarnings(as.integer(row))
-                           toString(row[!is.na(row) & row >= 0])
-                         }
-        )
-        output$data_load_warn <- renderText("")
-        warning_text <- ''
-        warning_text <- warnings(df, list(names, units, counts))
-        
-        if (warning_text == "") {
-          
-          # Add the new datasets to the data table.
-          new_rows <- read.csv(file = input$upload_csv$datapath)
-          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")
-          
-          
-        } else {
-          output$data_load_warn <- renderUI(HTML(warning_text))        
-        }
-      },
-      error = function(e) {
-        output$data_load_warn <- renderText(
-          "The input does not match the required format."
-        )
-      }
-    )
-  })
-}
-
-# Add sample datasets to the existing table.
-sample_entry <- function(input, output, react_values) {
-  observeEvent(input$sample_entry, {
-    tryCatch(
-      {
-        # datasets <- read.csv(text = input$sample, header = FALSE, sep = ",")
-        
-        names <- c()
-        units <- c()
-        counts <-c()
-        
-        if (input$march){
-          names <- append(names, c("Covid-19 March 2020"))
-          units<-append(units, c("Daily"))
-          counts<-append(counts,c(covid_cases[1]))}
-        if (input$april){ names <- append(names, c("Covid-19 April 2020"))
-        units<-append(units, c("Daily"))
-        counts<-append(counts,c(covid_cases[2]))}
-        if (input$may){ names <- append(names, c("Covid-19 May 2020"))
-        units<-append(units, c("Daily"))
-        counts<-append(counts,c(covid_cases[3]))}
-        
-        
-        if (input$june){ names <- append(names, c("Covid-19 June 2020"))
-        units<-append(units, c("Daily"))
-        counts<-append(counts,c(covid_cases[4]))}
-        
-        if (input$july){ names <- append(names, c("Covid-19 July 2020"))
-        units<-append(units, c("Daily"))
-        counts<-append(counts,c(covid_cases[5]))}
-        
-        warning_text <- ""
-        
-        # Ensure the dataset names are not duplicates.
-        
-        
-        if (any(names %in% react_values$data_table[, 1])) {
-          warning_text <- paste0(warning_text, sep = "<br>",
-                                 "The rows contain dataset names which already exist."
-          )
-          
-        }
-        
-        
-        output$sample_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"
-          )
-        }
-      }
-    )
-  })
-}
-
-# 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
-  )
-}
-#Sample datasets case counts
-covid_cases = c("7,1,13,10,6,10,13,28,47,53,62,90,88,130,143,150,186,276,279,350,458,604,570,667,878,883,785,1085,1252",
-                "1469,1278,1346,1119,1109,1120,1202,1429,1178,1337,1165,1312,1551,1633,1870,1688,1888,1702,1535,1549,1563,1583,1777,1511,1482,1298,1350,1422,1502,1546",
-                "1499,1330,1232,1205,1101,1306,1317,1187,1115,997,953,903,1086,1101,1198,1133,1219,1057,954,1061,1056,1094,922,884,963,660,762,781,1038,763,827",
-                "678,656,602,545,557,497,464,411,391,481,402,427,380,322,309,345,358,375,373,300,315,340,288,297,280,330,344,358,242,267",
-                "315,291,267,284,244,220,269,313,359,343,348,351,277,362,451,443,517,490,457,472,507,509,573,497,425,408,344,493,405,466,455")
-
diff --git a/enter-data.html b/enter-data.html
deleted file mode 100644
index 0ff82f2..0000000
--- a/enter-data.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<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>
-<hr>
-<form>
-  {{ htmlTemplate("templates/content/data/enter-data/uploadData-entry.html") }}
-</form>
-<form>
-  {{ htmlTemplate("templates/content/data/enter-data/sample-entry.html") }}
-</form>
\ No newline at end of file
diff --git a/inst/app/index.html b/inst/app/index.html
index b0f1245..504918d 100644
--- a/inst/app/index.html
+++ b/inst/app/index.html
@@ -5,12 +5,7 @@
     {{ 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>
+    <script src="script.js"></script>
   </head>
   <body class="d-flex flex-column h-100">
     <noscript>
diff --git a/inst/app/scripts/data.R b/inst/app/scripts/data.R
index eebd14f..02b57c5 100644
--- a/inst/app/scripts/data.R
+++ b/inst/app/scripts/data.R
@@ -10,7 +10,9 @@ data_logic <- function(input, output, react_values) {
 
   render_plot(input, output)
   single_entry(input, output, react_values)
-  bulk_entry(input, output, react_values)
+  manual_bulk_entry(input, output, react_values)
+  upload_data(input, output, react_values)
+  load_samples(input, output, react_values)
   render_data(output, react_values)
   delete_data(input, react_values)
   export_data(output, react_values)
@@ -93,80 +95,143 @@ single_entry <- function(input, output, react_values) {
   })
 }
 
-# Add multiple datasets to the existing table.
-bulk_entry <- function(input, output, react_values) {
+manual_bulk_entry <- function(input, output, react_values) {
   observeEvent(input$data_bulk, {
-    tryCatch(
-      {
-        datasets <- read.csv(text = input$data_area, header = FALSE, sep = ",")
+    validate_bulk_data(input, output, react_values, "data_area")
+  })
+}
 
-        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])
-          }
-        )
+upload_data <- function(input, output, react_values) {
+  observeEvent(input$data_upload, {
+    validate_bulk_data(input, output, react_values, "data_upload")
+  })
+}
 
-        warning_text <- ""
+validate_bulk_data <- function(input, output, react_values, data_source) {
+  tryCatch(
+    {
+      if (data_source == "data_area") {
+        datasets <- read.csv(text = input$data_area, header = FALSE, sep = ",")
+      } else if (data_source == "data_upload") {
+        datasets <- read.csv(
+          file = input$data_upload$datapath, header = FALSE, sep = ","
+        )
+      }
 
-        # 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."
-            )
-          }
+      names <- trimws(datasets[, 1])
+      units <- trimws(datasets[, 2])
+      counts <- apply(data.frame(datasets[, 3:ncol(datasets)]), 1,
+        function(row) {
+          row <- suppressWarnings(as.integer(row))
+          toString(row[!is.na(row) & row >= 0])
         }
+      )
 
-        # 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'."
+      warning_text <- ""
+
+      # Ensure the dataset names are neither blank nor duplicates.
+      if (anyNA(names) || any(names == "")) {
+        warning_text <- paste0(warning_text,
+          "Each row must begin with a non-blank dataset name.<br>"
+        )
+      } else {
+        if (length(unique(names)) != length(names)) {
+          warning_text <- paste0(warning_text,
+            "The rows contain duplicate dataset names.<br>"
           )
         }
-
-        # 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."
+        if (any(names %in% react_values$data_table[, 1])) {
+          warning_text <- paste0(warning_text,
+            "The rows contain dataset names which already exist.<br>"
           )
         }
+      }
 
-        output$data_area_warn <- renderUI(HTML(warning_text))
+      # 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,
+          "The second entry in each row must be either 'Days' or 'Weeks'.<br>"
+        )
+      }
 
-        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)
+      # Ensure the counts in each row have at least one non-negative integer.
+      if (any(counts == "")) {
+        warning_text <- paste0(warning_text,
+          "Each row must contain at least one non-negative integer.<br>"
+        )
+      }
 
-          # Evaluate all existing estimators on the new dataset and update the
-          # corresponding row in the estimates table.
-          update_estimates_rows(new_rows, react_values)
+      output[[paste0(data_source, "_warn")]] <- renderUI(HTML(warning_text))
 
-          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."
+      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 datasets and update the
+        # corresponding rows in the estimates table.
+        update_estimates_rows(new_rows, react_values)
+
+        showNotification("Datasets added successfully.",
+          duration = 3, id = "notify-success"
         )
       }
-    )
+    },
+    error = function(e) {
+      output[[paste0(data_source, "_warn")]] <- renderText(
+        "The input does not match the required format."
+      )
+    }
+  )
+}
+
+# Load sample datasets.
+load_samples <- function(input, output, react_values) {
+  observeEvent(input$data_samples, {
+    names <- c()
+    units <- c()
+    counts <- c()
+
+    # COVID-19 Canada, March 2020 (weekly).
+    if (input$covid_canada) {
+      names <- c(names, "COVID-19 Canada 2020/03/03 - 2020/03/31")
+      units <- c(units, "Weeks")
+      counts <- c(counts, toString(Rnaught::COVIDCanada[seq(41, 69, 7), 2]))
+    }
+    # COVID-19 Ontario, March 2020 (weekly).
+    if (input$covid_ontario) {
+      names <- c(names, "COVID-19 Ontario 2020/03/03 - 2020/03/31")
+      units <- c(units, "Weeks")
+      counts <- c(counts,
+        toString(Rnaught::COVIDCanadaPT[seq(10176, 10204, 7), 3])
+      )
+    }
+
+    if (length(names) == 0) {
+      output$data_samples_warn <- renderText(
+        "At least one sample dataset must be selected."
+      )
+    } else if (any(names %in% react_values$data_table[, 1])) {
+      output$data_samples_warn <- renderText(
+        "At least one of the selected dataset names already exist."
+      )
+    } else {
+      output$data_samples_warn <- renderText("")
+
+      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 sample datasets and update the
+      # corresponding rows in the estimates table.
+      update_estimates_rows(new_rows, react_values)
+
+      showNotification("Datasets added successfully.",
+        duration = 3, id = "notify-success"
+      )
+    }
   })
 }
 
diff --git a/inst/app/templates/content/data/enter-data.html b/inst/app/templates/content/data/enter-data.html
index 621c785..f4d5e75 100644
--- a/inst/app/templates/content/data/enter-data.html
+++ b/inst/app/templates/content/data/enter-data.html
@@ -8,6 +8,10 @@
   </div>
 </div>
 <hr>
-<form>
+<form class="mb-5">
   {{ htmlTemplate("templates/content/data/enter-data/bulk-entry.html") }}
 </form>
+<hr>
+<form>
+  {{ htmlTemplate("templates/content/data/enter-data/load-samples.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
index 82a3ccf..30fab06 100644
--- a/inst/app/templates/content/data/enter-data/bulk-entry.html
+++ b/inst/app/templates/content/data/enter-data/bulk-entry.html
@@ -1,13 +1,11 @@
 <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>
+        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>Manually enter rows or upload a CSV file 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>
@@ -27,11 +25,24 @@
   </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 class="my-4">
+  <label class="form-label" for="data_area">Enter manually</label>
+  <textarea id="data_area" class="form-control" rows="3" wrap="off"></textarea>
+  <div>
+    <small id="data_area_warn" class="form-text text-primary shiny-html-output"></small>
+  </div>
+  <button id="data_bulk" type="button" class="btn btn-outline-primary btn-sm action-button mt-3">
+    <span class="glyphicon glyphicon-plus"></span> Add
+  </button>
+</div>
+<!-- File input for data upload (hidden). -->
+<input class="form-control" type="file" id="data_upload" accept="text/csv,text/comma-separated-values,text/plain,.csv">
+<!-- Custom button to trigger file selector for data upload (visible). -->
+<label class="form-label" for="data-upload-select">Upload a CSV file</label>
+<div class="input-group">
+  <button id="data-upload-select" type="button" class="btn btn-outline-primary btn-sm">
+    <span class="glyphicon glyphicon-file"></span> Select file
+  </button>
+  <input type="text" id="data-upload-name" class="form-control" placeholder="No file selected" disabled>
 </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>
+<small id="data_upload_warn" class="form-text text-primary shiny-html-output"></small>
diff --git a/inst/app/templates/content/data/enter-data/load-samples.html b/inst/app/templates/content/data/enter-data/load-samples.html
new file mode 100644
index 0000000..a42a8c8
--- /dev/null
+++ b/inst/app/templates/content/data/enter-data/load-samples.html
@@ -0,0 +1,17 @@
+<h4 class="mb-3">Load samples</h4>
+{{
+  checkboxInput(inputId = "covid_canada", label = "COVID-19 Canada, 2020/03/03 - 2020/03/31 (Weekly)",
+    value = FALSE, width = "100%"
+  )
+}}
+{{
+  checkboxInput(inputId = "covid_ontario", label = "COVID-19 Ontario, 2020/03/03 - 2020/03/31 (Weekly)",
+    value = FALSE, width = "100%"
+  )
+}}
+<div>
+  <small id="data_samples_warn" class="form-text text-primary shiny-text-output"></small>
+</div>
+<button id="data_samples" type="button" class="btn btn-outline-primary btn-sm action-button mt-3">
+  <span class="glyphicon glyphicon-plus"></span> Add
+</button>
diff --git a/inst/app/www/script.js b/inst/app/www/script.js
new file mode 100644
index 0000000..c31584f
--- /dev/null
+++ b/inst/app/www/script.js
@@ -0,0 +1,21 @@
+$(document).ready(() => {
+  // Enable tooltips.
+  $('[data-bs-toggle="tooltip"]').tooltip();
+
+  // Toggle the text in the bulk data help button.
+  $('#bulk-help-toggle').on('click', event => {
+    btn = $(event.target);
+    show_format = 'Show required format';
+    btn.text(btn.text() === show_format ? 'Hide required format' : show_format);
+  });
+
+  // Trigger the file selector via a custom button.
+  $('#data-upload-select').on('click', () => {
+    $('#data_upload').trigger('click');
+  });
+
+  // Display the name of the uploaded file.
+  $('#data_upload').on('change', event => {
+    $('#data-upload-name').attr('placeholder', event.target.files[0].name);
+  });
+});
diff --git a/inst/app/www/styles.css b/inst/app/www/styles.css
index f6c4407..d53a387 100644
--- a/inst/app/www/styles.css
+++ b/inst/app/www/styles.css
@@ -20,7 +20,11 @@ noscript {
   margin-top: -0.5rem;
 }
 
-td.selected {
+td.selected, .shiny-notification {
   background-color: black;
   color: white;
 }
+
+#data_upload {
+  display: none;
+}
diff --git a/sample-entry.html b/sample-entry.html
deleted file mode 100644
index 92b9131..0000000
--- a/sample-entry.html
+++ /dev/null
@@ -1,40 +0,0 @@
-<h4 class="mb-3">Sample entry</h4>
-<!-- Checkboxes -->
-
-<div>
-  
-<input type="checkbox" id="march" name="myCheckbox" value="isChecked">
-<label for="myCheckbox">Covid-19 March 2020</label>
-
-</div>
-<div>
-  
-<input type="checkbox" id="april" name="myCheckbox" value="isChecked">
-<label for="myCheckbox">Covid-19 April 2020</label>
-
-</div>
-<div>
-  
-<input type="checkbox" id="may" name="myCheckbox" value="isChecked">
-<label for="myCheckbox">Covid-19 May 2020</label>
-</div>
-
-<div>
-  
-<input type="checkbox" id="june" name="myCheckbox" value="isChecked">
-<label for="myCheckbox">Covid-19 June 2020</label></div>
-<div><input type="checkbox" id="july" name="myCheckbox" value="isChecked">
-<label for="myCheckbox">Covid-19 July 2020</label></div>
-
-
-<div>
-
-<!-- Submit button -->
-<button id="sample_entry" type="button" class="btn btn-outline-primary btn-sm action-button">
-  <span class="glyphicon glyphicon-plus"></span> Add
-</button>
-</div>
-<!-- Warning area. -->
-<div>
-  <small id="sample_area_warn" class="form-text text-primary shiny-html-output"></small>
-</div>
diff --git a/uploadData-entry.html b/uploadData-entry.html
deleted file mode 100644
index c1b05c8..0000000
--- a/uploadData-entry.html
+++ /dev/null
@@ -1,16 +0,0 @@
-<h4>Upload Data</h4>
-<div class="my-3">
-  <div id="fileInput" class="col-md mt-5 mt-md-0 d-flex flex-column align-items-left">
-    {{ fileInput('upload_csv', 'Choose CSV File', multiple = F, accept= '.csv') }}
-  </div>
-    <small id="data_load_warn" class="form-text text-primary shiny-html-output"></small>
-</div>
-<!-- Submit button -->
-<button id="data_load" type="button" class="btn btn-outline-primary btn-sm action-button">
-  <span class="glyphicon glyphicon-plus"></span> Add
-</button>
-
-<!-- Output message -->
-<div class="my-3">
-  <p id="output_message"></p>
-</div>
\ No newline at end of file
-- 
cgit v1.2.3