39 lines
903 B
JavaScript
39 lines
903 B
JavaScript
|
class Clock {
|
||
|
|
constructor(name, color, numWedges, radius, x, y) {
|
||
|
|
this.name = name
|
||
|
|
this.color = color
|
||
|
|
this.numWedges = numWedges
|
||
|
|
this.filledWedges = numWedges / 2
|
||
|
|
this.radius = radius
|
||
|
|
this.x = x
|
||
|
|
this.y = y
|
||
|
|
this.splitRadius = 10
|
||
|
|
}
|
||
|
|
|
||
|
|
draw(ctx) {
|
||
|
|
ctx.lineWidth = 3
|
||
|
|
for (let i = 0; i < this.numWedges; i++) this.drawWedge(ctx, i)
|
||
|
|
}
|
||
|
|
|
||
|
|
drawWedge(ctx, i) {
|
||
|
|
const width = ((2 * Math.PI) / this.numWedges)
|
||
|
|
const angle = width * i
|
||
|
|
const x = this.x + (Math.cos(angle) * this.splitRadius)
|
||
|
|
const y = this.y + (Math.sin(angle) * this.splitRadius)
|
||
|
|
|
||
|
|
ctx.beginPath()
|
||
|
|
ctx.strokeStyle = this.color
|
||
|
|
ctx.moveTo(x, y)
|
||
|
|
ctx.arc(x, y, this.radius, (angle - (width / 2)), (angle + width / 2))
|
||
|
|
ctx.lineTo(x, y)
|
||
|
|
ctx.stroke()
|
||
|
|
|
||
|
|
if (i < this.filledWedges) {
|
||
|
|
ctx.fillStyle = this.color
|
||
|
|
ctx.fill()
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export default Clock
|