Playing with dates

by Arnaud Buchholz

HTML

<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date">MDN Date</a>

CSS

.small {
  padding-left: 32px;
  font-size: small;
}

.small:before {
  content: "UTC: "
}

JavaScript

// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

function outputDate (date) {
	function zero (n) {
  	if (n < 10) {
    	return "0" + n;
    }
    return n;
  }
  var line = document.createElement("div");
  line.appendChild(document.createTextNode([
  	date.getFullYear(),
    "-",
    zero(date.getMonth() + 1),
    "-",
    zero(date.getDate()),
    " ",
    zero(date.getHours()),
    ":",
    zero(date.getMinutes())
  ].join("")));
  var small = document.createElement("span");
  small.className = "small";
  line.appendChild(small);
  small.appendChild(document.createTextNode([
  	date.getUTCFullYear(),
    "-",
    zero(date.getUTCMonth() + 1),
    "-",
    zero(date.getUTCDate()),
    " ",
    zero(date.getUTCHours()),
    ":",
    zero(date.getUTCMinutes())
  ].join("")));
  document.body.appendChild(line);
}

outputDate(new Date(2017, 0, 1));
outputDate(new Date(Date.UTC(2017, 0, 1)));
outputDate(new Date("2017-01-01T00:00:00.000Z"));

outputDate(new Date(Date.UTC(2017, 0, 1, 0, new Date().getTimezoneOffset())));