combinationLockPG/lock.js

60 lines
1.4 KiB
JavaScript
Raw Normal View History

2014-03-11 08:11:56 +00:00
var context;
2014-03-25 07:06:01 +00:00
const countOfNumbers = 32;
2014-03-11 08:24:07 +00:00
var lockinit = function () {
2014-03-11 08:11:56 +00:00
var canvas = document.getElementById("canvas");
context = canvas.getContext('2d');
drawLock();
drawDial(0);
}
var drawLock = function() {
context.save();
context.translate(100, 100);
context.fillStyle = "#999";
context.beginPath();
context.arc(0, 0, 100, 0, 2 * Math.PI);
context.closePath();
context.fill();
context.beginPath();
context.moveTo(0, - 82);
context.lineTo(- 6, - 95);
context.lineTo(+ 6, - 95);
context.closePath();
context.stroke();
context.restore();
}
var drawDial = function(rot) {
context.save();
context.translate(100, 100);
context.rotate(rot)
context.fillStyle = "#555";
context.beginPath();
context.arc(0, 0, 80, 0, 2 * Math.PI);
context.closePath();
context.fill();
context.fillStyle = "#111";
context.beginPath();
context.arc(0, 0, 7, 0, 2 * Math.PI);
context.closePath();
context.fill();
context.fillStyle = "#fff";
2014-03-25 07:06:01 +00:00
for (var i = 0; i < countOfNumbers; i++) {
2014-03-11 08:11:56 +00:00
context.beginPath();
2014-03-25 07:06:01 +00:00
context.fillText(i + 1, 72 * Math.cos(2 * Math.PI / countOfNumbers * i - Math.PI / 2) - 4, 72 * Math.sin(2 * Math.PI / countOfNumbers * i - Math.PI / 2) + 3);
2014-03-11 08:11:56 +00:00
context.closePath();
context.fill();
}
context.restore();
2014-03-25 07:06:01 +00:00
}
2014-03-16 11:30:15 +00:00
2014-03-25 07:06:01 +00:00
var angleToNum = function(angle) {
var tmp = parseInt(angle / Math.PI / 2 * countOfNumbers) % countOfNumbers;
if (tmp < 0)
tmp += countOfNumbers;
return tmp + 1;
2014-03-16 11:30:15 +00:00
}