You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

46 lines
1.3 KiB

2 years ago
class Loader{
constructor(pos, radius){
this.pos = pos;
this.c = p.createGraphics(radius * 2, radius * 2);
this.radius = radius;
this.center = p.createVector(radius, radius);
this.message = 'Loading...';
this.progress = 0;
this.angle = 0;
}
update(){
this.angle += Math.PI / 10;
}
display(){
let c = this.c;
c.clear();
c.noFill();
c.stroke(20, 100, 200);
c.strokeWeight(this.radius * 0.025);
//c.arc(this.center.x, this.center.y, this.radius * 2, this.radius * 2, this.angle, this.angle + Math.PI * 1.5);
c.strokeWeight(2);
c.rect(this.center.x - this.radius + 5, this.center.y - 25, this.radius * 2 - 50, 50);
c.fill(50, 150, 255);
c.rect(this.center.x - this.radius + 5, this.center.y - 25, (this.radius - 50) * this.progress, 50);
c.textAlign(p.CENTER, p.CENTER);
c.textSize(25);
c.fill(220);
c.strokeWeight(4);
c.text(this.message, this.radius, this.radius * 1.5);
c.textSize(40);
c.text(Math.floor(this.progress * 100) + '%', this.radius, this.radius / 2);
p.imageMode(p.CENTER);
p.image(c, this.pos.x, this.pos.y);
}
destroy(){
this.c.remove();
}
}