|
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119 |
- 'use strict';
-
- /**
- * Expose `Progress`.
- */
-
- module.exports = Progress;
-
- /**
- * Initialize a new `Progress` indicator.
- */
- function Progress() {
- this.percent = 0;
- this.size(0);
- this.fontSize(11);
- this.font('helvetica, arial, sans-serif');
- }
-
- /**
- * Set progress size to `size`.
- *
- * @public
- * @param {number} size
- * @return {Progress} Progress instance.
- */
- Progress.prototype.size = function(size) {
- this._size = size;
- return this;
- };
-
- /**
- * Set text to `text`.
- *
- * @public
- * @param {string} text
- * @return {Progress} Progress instance.
- */
- Progress.prototype.text = function(text) {
- this._text = text;
- return this;
- };
-
- /**
- * Set font size to `size`.
- *
- * @public
- * @param {number} size
- * @return {Progress} Progress instance.
- */
- Progress.prototype.fontSize = function(size) {
- this._fontSize = size;
- return this;
- };
-
- /**
- * Set font to `family`.
- *
- * @param {string} family
- * @return {Progress} Progress instance.
- */
- Progress.prototype.font = function(family) {
- this._font = family;
- return this;
- };
-
- /**
- * Update percentage to `n`.
- *
- * @param {number} n
- * @return {Progress} Progress instance.
- */
- Progress.prototype.update = function(n) {
- this.percent = n;
- return this;
- };
-
- /**
- * Draw on `ctx`.
- *
- * @param {CanvasRenderingContext2d} ctx
- * @return {Progress} Progress instance.
- */
- Progress.prototype.draw = function(ctx) {
- try {
- var percent = Math.min(this.percent, 100);
- var size = this._size;
- var half = size / 2;
- var x = half;
- var y = half;
- var rad = half - 1;
- var fontSize = this._fontSize;
-
- ctx.font = fontSize + 'px ' + this._font;
-
- var angle = Math.PI * 2 * (percent / 100);
- ctx.clearRect(0, 0, size, size);
-
- // outer circle
- ctx.strokeStyle = '#9f9f9f';
- ctx.beginPath();
- ctx.arc(x, y, rad, 0, angle, false);
- ctx.stroke();
-
- // inner circle
- ctx.strokeStyle = '#eee';
- ctx.beginPath();
- ctx.arc(x, y, rad - 1, 0, angle, true);
- ctx.stroke();
-
- // text
- var text = this._text || (percent | 0) + '%';
- var w = ctx.measureText(text).width;
-
- ctx.fillText(text, x - w / 2 + 1, y + fontSize / 2 - 1);
- } catch (ignore) {
- // don't fail if we can't render progress
- }
- return this;
- };
|