From e6dda03b392e7d751416ae8cced22ed776b4751c Mon Sep 17 00:00:00 2001
From: Rutuja Pimpalgaonkar <89966183+ruutu@users.noreply.github.com>
Date: Sat, 22 Oct 2022 09:13:27 +0530
Subject: [PATCH] Add files via upload

---
 Fronted Projects/Analog Clock.html | 90 ++++++++++++++++++++++++++++++
 1 file changed, 90 insertions(+)
 create mode 100644 Fronted Projects/Analog Clock.html
diff --git a/Fronted Projects/Analog Clock.html b/Fronted Projects/Analog Clock.html
new file mode 100644
index 00000000..72391f1c
--- /dev/null
+++ b/Fronted Projects/Analog Clock.html	
@@ -0,0 +1,90 @@
+	<!DOCTYPE html>
+<html>
+<body>
+
+<canvas id="c" width="600" height="600" style="background-color:black">
+</canvas>
+<script>
+var canvas = document.getElementById("c");
+var ctx = canvas.getContext("2d");
+var radius = canvas.height / 2;
+ctx.translate(radius, radius);
+radius = radius * 0.90
+setInterval(drawClock, 1000);
+function drawClock()
+ {
+  	drawFace(ctx, radius);
+  	drawNumbers(ctx, radius);
+  	drawTime(ctx, radius);
+  }
+  function drawFace(ctx, radius) 
+{
+  var grad;
+  ctx.beginPath();
+         ctx.arc(0,0, radius, 0, 2 * Math.PI);
+         ctx.fillStyle = 'black';
+         ctx.fill();
+
+        grad = ctx.createRadialGradient(0, 0 ,radius *   0.75, 0, 0, radius * 1.05);
+        grad.addColorStop(0, 'red');
+        grad.addColorStop(0.5, 'red');
+        grad.addColorStop(1, 'black');
+        ctx.strokeStyle = grad;
+        ctx.lineWidth = radius*0.1;
+        ctx.stroke();
+
+        ctx.beginPath();
+        ctx.arc(0,0, radius * 0.1, 0, 2 * Math.PI);
+        ctx.fillStyle = 'red';
+        ctx.fill();
+}
+function drawNumbers(ctx, radius) 
+{
+  var ang;
+ 	  var num;
+  	  ctx.font = radius * 0.15 + "px arial";
+         ctx.textBaseline = "middle";
+         ctx.textAlign = "center";
+         for(num = 1; num < 13; num++)
+         {
+         	     ang = num * Math.PI / 6;
+                   ctx.rotate(ang);
+                   ctx.translate(0, -radius * 0.85);
+                   ctx.rotate(-ang);
+                   ctx.fillText(num.toString(),0,0);
+                   ctx.rotate(ang);
+                   ctx.translate(0, radius * 0.85);
+                   ctx.rotate(-ang);
+          }
+}
+       function drawTime(ctx, radius)
+       {
+  	var now = new Date();
+ 	 var hour = now.getHours();
+  	var minute = now.getMinutes();
+  	var second = now.getSeconds();
+       //hour
+       hour = hour%12;
+      hour =    (hour*Math.PI/6)+(minute*Math.PI/(6*60))+(second*                 Math.PI/(360*60));
+    drawHand(ctx, hour, radius*0.5, radius*0.05);
+     //minute
+     minute =     (minute*Math.PI/30)+(second*Math.PI/(30*60));
+  drawHand(ctx, minute, radius*0.7, radius*0.05);
+  // second
+  second = (second*Math.PI/30);
+  drawHand(ctx, second, radius*0.9, radius*0.02);
+}
+function drawHand(ctx, pos, length, width) 
+{
+  ctx.beginPath();
+  ctx.lineWidth = width;
+  ctx.lineCap = "round";
+  ctx.moveTo(0,0);
+  ctx.rotate(pos);
+  ctx.lineTo(0, -length);
+  ctx.stroke();
+  ctx.rotate(-pos);
+}
+</script>
+</html>
+</body>
