JSFiddle - React, Tailwind, and code Playground

by mvasko

HTML

<div id=clock">
<canvas id="myCanvas" width="500" height="500" style="border:1px solid #blue;">
Your browser does not support the HTML5 canvas tag.</canvas>

CSS

#myCanvas { 
background:url(http://www.deificink.com/app/download/7113660246/face.png);
}

JavaScript

setInterval(function () {
     var c=document.getElementById("myCanvas");
    var ctx=c.getContext("2d");var d = new Date();
    
    var o = new Date();
  var n = o.toString().split(' ');
  var p = n[4].split(':');
  console.log(p[0]);
  //if (p[0] === "14") { 
    //alert("Move hour hand to hour 2"); 
  //}
  
  if (p[1] === "01") {
    alert("Move minute hand to 1st minute");
  }
  
  if (p[0] === "16" || "15") {
	ctx.moveTo(480,250);
	ctx.lineTo(250,250);
    ctx.stroke(); 
  }

}, 60000);