0.3.0

fixed ： 1）web canvas 获取焦点问题 2）restart 失效，因为方向没有重置。 add： 1）设计制作了一个 favicon 😃
Rxdrea · Jul 16, 2014 · c96e867 · c96e867
1 parent c42afd2
commit c96e867
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 9 deletions.
diff --git a/README.md b/README.md
@@ -8,11 +8,7 @@ snake game by processing
 几年前写过DOM版本的贪吃蛇，这次使用processing来写，
 又是另外一种感觉。很棒，很不错！
 
-再加上 [processing-js](https://github.com/jeresig/processing-js) 的支持，使得pde文件可以运行在web上，编译成js代码在canvas上运行。虽然效果如果很复杂的话，web上会比较吃力，但随着机器和浏览器性能的提升，这以后都不是问题。
-
-### 说明
-
-web版本，需要鼠标点击一下游戏窗口才能运行。
+再加上 [processing-js](https://github.com/jeresig/processing-js) 的支持，使得pde文件可以运行在web上，编译成 js 代码在 canvas 上运行。虽然效果如果酷炫狂拽吊炸天的话，web上会比较吃力，但随着机器和浏览器性能的提升，这以后都不是问题。
 
 ### 其他
 

diff --git a/images/favicon.ico b/images/favicon.ico
diff --git a/images/favicon.png b/images/favicon.png
diff --git a/snake.html b/snake.html
@@ -2,15 +2,22 @@
 <html>
 <head>
   <meta charset="UTF-8">
-  <title>snake</title>
+  <title>Snake</title>
+  <link rel="shortcut icon" href="./images/favicon.ico">
   <style>
-    body,html{background:#000;}
-    canvas{background-color:#fff;display:block;margin-left:auto;margin-right:auto;}
+    html,body{overflow:hidden; background:#000;}
+    canvas{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);}
   </style>
 
   <script src="https://raw.githubusercontent.com/processing-js/processing-js/v1.4.8/processing.min.js"></script>
 </head>
 <body>
-  <canvas data-processing-sources="snake/snake.pde"></canvas>
+  <canvas id="J-canvas" tabindex="-1" data-processing-sources="snake/snake.pde"></canvas>
+
+  <script>
+    var canvas = document.getElementById("J-canvas");
+    canvas.focus();
+    document.documentElement.onclick = function(){ canvas.focus(); }
+  </script>
 </body>
 </html>
diff --git a/snake/snake.pde b/snake/snake.pde
@@ -109,6 +109,7 @@ void snakeInit(){
   gameOverKey = false;
   snakeHeadX = 0;
   snakeHeadY = 0;
+  snakeDirection = 'R';
 }
 
 void drawFood(int maxWidth, int maxHeight) {