diff options
Diffstat (limited to 'inst/web/templates/content/data')
8 files changed, 104 insertions, 0 deletions
diff --git a/inst/web/templates/content/data/enter-data.html b/inst/web/templates/content/data/enter-data.html new file mode 100644 index 0000000..254f1d7 --- /dev/null +++ b/inst/web/templates/content/data/enter-data.html @@ -0,0 +1,9 @@ +<form class="mb-5"> + {{ htmlTemplate("templates/content/data/enter-data/required-format.html") }} + {{ htmlTemplate("templates/content/data/enter-data/manual-entry.html") }} + {{ htmlTemplate("templates/content/data/enter-data/upload-data.html") }} +</form> +<hr> +<form> + {{ htmlTemplate("templates/content/data/enter-data/load-samples.html") }} +</form> diff --git a/inst/web/templates/content/data/enter-data/load-samples.html b/inst/web/templates/content/data/enter-data/load-samples.html new file mode 100644 index 0000000..2a4f013 --- /dev/null +++ b/inst/web/templates/content/data/enter-data/load-samples.html @@ -0,0 +1,19 @@ +<h4 class="mb-3">Load samples</h4> +<!-- Checkboxes for sample data. --> +{{ + 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%" + ) +}} +<!-- Warning text. --> +<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/web/templates/content/data/enter-data/manual-entry.html b/inst/web/templates/content/data/enter-data/manual-entry.html new file mode 100644 index 0000000..a6319d9 --- /dev/null +++ b/inst/web/templates/content/data/enter-data/manual-entry.html @@ -0,0 +1,11 @@ +<!-- Data input area (manual entry). --> +<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> diff --git a/inst/web/templates/content/data/enter-data/required-format.html b/inst/web/templates/content/data/enter-data/required-format.html new file mode 100644 index 0000000..724dd83 --- /dev/null +++ b/inst/web/templates/content/data/enter-data/required-format.html @@ -0,0 +1,25 @@ +<!-- Button to toggle help text. --> +<button type="button" class="btn btn-outline-primary btn-sm" id="data-format-toggle" + data-bs-toggle="collapse" data-bs-target="#data-format">Show required format</button> +<!-- Help text for data input format. --> +<div class="collapse mt-2" id="data-format"> + <div class="card card-body border-primary"> + <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> + <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"> + Disease A,Days,1,2,3,4,5,6,7,8,9<br> + Disease B,Weeks,3,1,4,1,5,2,9<br> + Disease C,Days,2,3,5,7,11,13,17,19 + </p> + </div> +</div> diff --git a/inst/web/templates/content/data/enter-data/upload-data.html b/inst/web/templates/content/data/enter-data/upload-data.html new file mode 100644 index 0000000..740047b --- /dev/null +++ b/inst/web/templates/content/data/enter-data/upload-data.html @@ -0,0 +1,12 @@ +<!-- 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> +<!-- Warning text. --> +<small id="data_upload_warn" class="form-text text-primary shiny-html-output"></small> diff --git a/inst/web/templates/content/data/view-data.html b/inst/web/templates/content/data/view-data.html new file mode 100644 index 0000000..880cf7f --- /dev/null +++ b/inst/web/templates/content/data/view-data.html @@ -0,0 +1,3 @@ +{{ htmlTemplate("templates/content/data/view-data/data-table.html") }} +<hr> +{{ htmlTemplate("templates/content/data/view-data/data-plots.html") }} diff --git a/inst/web/templates/content/data/view-data/data-plots.html b/inst/web/templates/content/data/view-data/data-plots.html new file mode 100644 index 0000000..5019088 --- /dev/null +++ b/inst/web/templates/content/data/view-data/data-plots.html @@ -0,0 +1,7 @@ +<h4>Data plots</h4> +<div class="container my-5"> + {{ plotly::plotlyOutput(outputId = "data_plot_days") }} +</div> +<div class="container"> + {{ plotly::plotlyOutput(outputId = "data_plot_weeks") }} +</div> diff --git a/inst/web/templates/content/data/view-data/data-table.html b/inst/web/templates/content/data/view-data/data-table.html new file mode 100644 index 0000000..590a5b9 --- /dev/null +++ b/inst/web/templates/content/data/view-data/data-table.html @@ -0,0 +1,18 @@ +<h4>Data table</h4> +<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> |