Показать сообщение отдельно
  #4 (permalink)  
Старый 15.11.2019, 15:04
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,714

Сообщение от рони
var Timer=new timer(canvasW/2,canvasH/2);
Это где так учат?!

рони, Jimy, а если разные таймеры?

<canvas id="canvas" width=300 height="300"></canvas>
<script>
	function Timer(canvas) {
		this.canvas = canvas;
		this.context = canvas.getContext("2d");
		this.x = canvas.width / 2;
		this.y = canvas.height / 2;
		this.counter = 90;
		this.lastTime = performance.now();
		this.animate();
	}

	Timer.prototype.draw = function draw() {
		var color = "blue";
		var ctx = this.context;
		ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
		ctx.fillStyle = "black";
		ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);
		ctx.fill();
		ctx.font = "40px Times New Roman";
		ctx.textAlign = 'center';
		ctx.textBaseline = "middle";
		ctx.fillStyle = color;
		ctx.fillText(this.counter, this.x, this.y);
		ctx.strokeStyle = color;
		ctx.lineWidth = 3;
		ctx.beginPath();
		ctx.arc(this.canvas.width / 2, this.canvas.height / 2, 30, 0, Math.PI * 2, false);
		ctx.stroke();
	};

	Timer.prototype.animate = function animate(time) {
		requestAnimationFrame(this.animate.bind(this));
		
		if(time - this.lastTime >= 1000 && this.counter > 0) {
			this.counter--;
			this.lastTime = time;
			
			if(this.counter === 0 && "counterendCallback" in this)
				requestAnimationFrame(this.counterendCallback.bind(this));
		}
		
		this.draw();
	};
	
	var timer = new Timer(document.getElementById("canvas"));
</script>
Ответить с цитированием