poJGRbK

index.html

<div class="container">
  <div class="col" style="margin-top: 20px;">
    <div class="row">
      <div class="col border">
        <h1 class="display-1 text-center" id="cases_val">#</h1>
        <h1 class="display-4 text-center">Cases Reported</h1>
      </div>
      <div class="col border">
        <h1 class="display-1 text-center" id="deaths_val">#</h1>
        <h1 class="display-4 text-center">Deaths</h1>
      </div>
    </div>
    <div class="row">
      <div class="col border">
        <h1 class="text-center">Last Updated</h1>
        <h1 class="display-4 text-center" id="last_updated">#</h1>
      </div>
    </div>
    <div class="row">
      <div class="col border">
        <p class="text-center"><strong>Disclaimer</strong>: <strong>All data are provisional and subject to change.This dashboard will be updated daily by 12 Noon. Data displayed are current as of <span style="text-decoration: underline;">8pm</span> for the prior day.</strong>Data
          produced by the Texas Department of State Health Services, Laboratory and Infectious Disease Services.</p>
      </div>
    </div>
  </div>
</div>

pojgrbk.markdown

poJGRbK

A Pen by forgot on CodePen.

License.

script.js

var reported =
  "https://services5.arcgis.com/ACaLB9ifngzawspq/arcgis/rest/services/COVID19County_ViewLayer/FeatureServer/0/query?f=json&where=OBJECTID%3D170&returnGeometry=false&spatialRel=esriSpatialRelIntersects&outFields=*&cacheHint=true";
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
  if (this.readyState == 4 && this.status == 200) {
    var attributes = JSON.parse(this.responseText).features[0].attributes;
    var total = attributes.Count_;
    var deaths = attributes.Deaths;
    var lastUpdate = new Date(attributes.LastUpdate);
    const foo = moment(attributes.LastUpdate).format("M/D/YYYY LT");
    console.log(lastUpdate.toLocaleString());
    console.log(foo);
    document.getElementById("cases_val").innerHTML = attributes.Count_;
    document.getElementById("deaths_val").innerHTML =
      deaths == null ? 0 : deaths;
    document.getElementById("last_updated").innerHTML = foo;
  }
};
xmlhttp.open("GET", reported, true);
xmlhttp.send();

scripts

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>

styles

<link href="https://maxcdn.bootstrapcdn.com/bootswatch/4.4.1/darkly/bootstrap.min.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic" rel="stylesheet" />