index.Rmd

---
title: "Covid-19 Crowd Forecast Ensemble and Evaluation Reports"
output:
  html_document:
    theme: journal
    toc: false
    toc_float: false
---

This is an overall evaluation of all crowd forecasts.
**Find the leaderboard for the UK Crowd Forecasting Challenge [here](https://epiforecasts.io/uk-challenge).** 

Choose the date and type of report you wish do view using the dropdown menu. The _Ensemble_ report shows the recent forecasts and performance of the crowd ensemble, whereas the _Evaluation_ report shows performance and forecasts for individual forecasters, overall and by country. The reports get updated every Tuesday.

```{r load, include = FALSE}
library(vroom)
library(covid.ecdc.forecasts)
locations_url <-
  paste("https://raw.githubusercontent.com",
        "epiforecasts",
        "covid19-forecast-hub-europe",
        "main",
        "data-locations",
        "locations_eu.csv",
        sep = "/")
countries <- sort(vroom(locations_url)$location_name)
date <- latest_weekday()
```

<script>
function getMonday(d) {
  d = new Date();
  var day = d.getDay(),
      diff = d.getDate() - day + (day == 0 ? -6:1); // adjust when day is sunday
  return new Date(d.setDate(diff));
}


``` {r results = 'asis', echo = FALSE} 

latest_date <- as.character(date)

cat(paste0("function getURL(report, country) { \n",
           "var str = 'reports/'; \n", 
           "str = str.concat(report, '-report-', '", latest_date, "'); \n", 
           "if (!(report === 'ensemble')) { \n", 
           "  str = str.concat('-', country); \n", 
           "} \n", 
           "str = str.concat('.html'); \n", 
           "return(str); \n",
           "}"))

``` 

function updateIframe() {
  var report = report_options.options[report_options.selectedIndex].value;
  var country = country_options.options[country_options.selectedIndex].value;
  if (report == "evaluation") {
    country_options.style.visibility = "visible";
  } else {
    country_options.style.visibility = "hidden";
  }
  
  reportframe = document.getElementById('reportFrame');
  reportframe.src = getURL(report, country);
  reportframe.onload = function(){
        reportframe.style.height = reportframe.contentWindow.document.body.scrollHeight + 'px';
    }
  
}

function resizeIframe(obj) {
    obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px';
}

</script>

<select id="report_options" name="report_options" onchange="updateIframe()" onchange="updateIframe()">
  <option value="ensemble">Ensemble</option>
  <option value="evaluation">Evaluation</option>
</select>
  
```{r countries, results = 'asis', echo = FALSE}
cat("<select id=\"country_options\" name=\"country_options\" ",
    "onchange=\"updateIframe()\" style=\"visibility: hidden\">\n")
cat("<option value=\"Overall\">Overall</option>\n")
for (country in countries) {
  cat(paste0("<option value=\"", country, "\">", country, "</option>\n"))
}
cat("</select>\n")
```
<style>
div.main-container {
    max-width: none;
  }
body{
  padding-bottom: 0px;
}
</style>
  
  
<hr>

<!-- "style=\"height: calc(100vh - 205px);\" ", -->
  
```{r iframe, results='asis', echo = FALSE}
cat(paste0("<iframe width=\"100%\" ",
           "id=\"reportFrame\" src=\"reports/ensemble-report-",
           date, ".html\"\n ", 
           "style=\"height: calc(100vh - 245px);\" ",
           "onload=\"resizeIframe(this)\""))
cat("  frameborder=\"0\">\n")
cat("</iframe>\n")
```