- <!DOCTYPE html>
- <canvas id="1" width="400" height="400" style="border: 1px solid " ></canvas>
- <script>
- ctx = document.getElementById("1").getContext("2d")
- let Len = 10, dir = 2, dirNow ;food = [3, 0]; Snake = [[0, 0], [1, 0]]
- Map = {'0,0':'fff', '1,0':'fff'}
- dirMat = [[-1, 0], [0, -1], [1, 0], [0, 1]]
- pairEq = ((p1, p2) => p1[0] == p2[0] && p1[1] == p2[1])
- document.onkeydown = e =>{
- if (37 <= e.keyCode == e.keyCode < 41 && dirNow != ( (e.keyCode - 35) % 4) ) dir = e.keyCode -37
- }
- !function () {
- Head = Snake[Snake.length-1].map((x, i) => x + dirMat[dirNow=dir][i]);
- if (!pairEq(Head, food)) Map[Snake.shift()]='0'
- if (Snake.some(x=>pairEq(x,Head)) || !Head.every(x => 0<=x == x < Len))
- return document.write("Game Over")
- Snake.push(Head);
- while (Snake.some(x => pairEq(x, food))) food = [0|Math.random() * Len, 0|Math.random() * Len];
- Map[Head] = Map[food] = 'fff'
- for( k in Map){
- ctx.fillStyle='#'+(0xfff- (0|parseInt(Map[k],16)*Math.random())).toString(16)
- ctx.fillRect(parseInt(k[0])*40,parseInt(k[2])*40,46,43)
- }
- setTimeout(arguments.callee, 100);
- }()
- </script>
|
- <!doctype html>
- <canvas id="can" width="400" height="400" style="background: Black"></canvas>
- <script>
- var sn = [ 42, 41 ], dz = 43, fx = 1, n, ctx = document.getElementById("can").getContext("2d");
- function draw(t, c) {
- ctx.fillStyle = c;
- ctx.fillRect(t % 20 * 20 + 1, ~~(t / 20) * 20 + 1, 18, 18);
- }
- document.onkeydown = function(e) {
- fx = sn[1] - sn[0] == (n = [ -1, -20, 1, 20 ][(e || event).keyCode - 37] || fx) ? fx : n
- };
- !function() {
- sn.unshift(n = sn[0] + fx);
- if (sn.indexOf(n, 1) > 0 || n<0||n>399 || fx == 1 && n % 20 == 0 || fx == -1 && n % 20 == 19)
- return alert("GAME OVER");
- draw(n, "Lime");
- if (n == dz) {
- while (sn.indexOf(dz = ~~(Math.random() * 400)) >= 0);
- draw(dz, "Yellow");
- } else draw(sn.pop(), "Black");
- setTimeout(arguments.callee, 130);
- }();
- </script>
|