Pomodoro clock canvas ring登録していません

Question

おはようございます。私はこのコードをいくつか問題に抱えており、数時間それをしています。あなたがthis.drawArcのコンストラクタを見てからプロトタイプを見たら、私はコンソールにいくつかのことを記録しました。 this.countは値を記録しますが、this.drawArcは値を記録しません。明らかに、this.minutesとthis.to秒の作業、またはタイマーが起動しないのですが、なぜdrawArcは値を登録しませんか？コンストラクタに配置する前にこれ（ステータスリング）を使用していましたが、なんらかの理由で値が登録されなくなりました。私はフィドルを付けました。

注：これは完全ではありません。現在、入力フィールドに新しい値を入力する場合は、再実行する必要があります。入力値（ボタンの上にある小さな円）に値を入力すると、キャンバス（大きなサークル）の上にカーソルを置くとカウントダウンが表示されます。ホバリングしている理由は、目を覚ます時計を見たくなく、ステータスリングのビジュアルだけを好む人にとってです。何か案は？？？私は数時間立ち往生した。 https://jsfiddle.net/asthewaterfalls/szn0mch1/9/

function Pomodoro(userInput) { 
    this.minutes = userInput; 
    this.toSeconds = 60 * this.minutes;//seconds - actual 
    this.cout = this.toSeconds; //for timer 
    this.seconds = 0; //display 
    this.count = 0; //for status ring 
    this.circleStart = Math.PI * 1.5; 
    this.drawArc = (2/this.toSeconds) * this.count; 
} 

Pomodoro.prototype.statusRing = function() { 
    if(this.count <= this.toSeconds) { 
     dom.canv.beginPath(); 
     dom.canv.arc(125, 125, 121, this.circleStart, Math.PI * (1.5 + this.drawArc), false); 
     dom.canv.stroke(); 
     this.count++; 
     console.log(this.count, this.drawArc); 
     const timeout = setTimeout(() => this.statusRing(), 1000); 
    } 
}; 

Answer 1

事前
にありがとう私はあなたのフィドルを見ていました。 2回の小さな変更で、私は時計の周りに青いリングにいくつかのアニメーションを得ました。私は比率や天使をチェックしなかった。私は、引数および最大値としてthis.toSecondsとして現在の値で計算し、drawArg機能作ら

：

this.drawArc = function(arg){ return (2/this.toSeconds) * arg; }; 

第二に、私はdom.conv.arc()に機能をCALLD：ここ

dom.canv.arc(/*...*/, Math.PI * (1.5 + this.drawArc(this.count)), /*...*/); 

は完了です例：

function Pomodoro(userInput) { 
    this.minutes = userInput; 
    this.toSeconds = 60 * this.minutes;//seconds - actual 
    this.cout = this.toSeconds; //for timer 
    this.seconds = 0; //display 
    this.count = 0; //for status ring 
    this.circleStart = Math.PI * 1.5; 
    this.drawArc = function(arg){ return (2/this.toSeconds) * arg; }; 
} 

Pomodoro.prototype.statusRing = function() { 
    if(this.count <= this.toSeconds) { 
     dom.canv.beginPath(); 
     dom.canv.arc(125, 125, 121, this.circleStart, Math.PI * (1.5 + this.drawArc(this.count)), false); 
     dom.canv.stroke(); 
     this.count++; 
     console.log(this.count, this.drawArc); 
     const timeout = setTimeout(() => this.statusRing(), 1000); 

    } 
};