diff --git a/lock.js b/lock.js
new file mode 100644
index 0000000..deecf58
--- /dev/null
+++ b/lock.js
@@ -0,0 +1,52 @@
+var context;
+ var main = function () {
+ 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";
+ var num = 32;
+ for (var i = 0; i < num; i++) {
+ context.beginPath();
+ context.fillText(i, 72 * Math.cos(2 * Math.PI / num * i) - 7, 72 * Math.sin(2 * Math.PI / num * i) + 3);
+ context.closePath();
+ context.fill();
+ }
+ context.restore();
+}
+
+window.onload = main;
\ No newline at end of file
diff --git a/test/index.html b/test/index.html
new file mode 100644
index 0000000..8f042d8
--- /dev/null
+++ b/test/index.html
@@ -0,0 +1,9 @@
+
+
+
+
+
+
+
+
\ No newline at end of file