diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000..f41430e Binary files /dev/null and b/.DS_Store differ diff --git a/CODEOWNERS b/CODEOWNERS new file mode 100644 index 0000000..c93450d --- /dev/null +++ b/CODEOWNERS @@ -0,0 +1,2 @@ +* @KYOWUJIUJIU +*.js @GITHUBTEACHER diff --git a/README.md b/README.md index fd8da0a..d93efff 100644 --- a/README.md +++ b/README.md @@ -2,8 +2,10 @@ A project based learning activity for people who are getting started with Git and GitHub. -You can play the game at: https://githubschool.github.io/github-games/ +You can play the game at: https://github.com/KyoWuJiuJiu/github-games >> _*SUPPORTED BROWSERS*: Chrome, Firefox, Safari, Opera and IE9+_ This fun open source game was cloned from: https://github.com/jakesgordon/javascript-tetris + +this is 为了测试 Git bisect新建一个commit diff --git a/texture.jpg b/images/texture.jpg similarity index 100% rename from texture.jpg rename to images/texture.jpg diff --git a/inde.html b/index.html similarity index 53% rename from inde.html rename to index.html index 87e71f8..bb05046 100644 --- a/inde.html +++ b/index.html @@ -1,26 +1,235 @@ + Javascript Tetris @@ -45,57 +254,57 @@ // base helper methods //------------------------------------------------------------------------- - function get(id) { return document.getElementById(id); } - function hide(id) { get(id).style.visibility = 'hidden'; } - function show(id) { get(id).style.visibility = null; } - function html(id, html) { get(id).innerHTML = html; } + function get(id) { return document.getElementById(id); } + function hide(id) { get(id).style.visibility = 'hidden'; } + function show(id) { get(id).style.visibility = null; } + function html(id, html) { get(id).innerHTML = html; } - function timestamp() { return new Date().getTime(); } - function random(min, max) { return (min + (Math.random() * (max - min))); } - function randomChoice(choices) { return choices[Math.round(random(0, choices.length-1))]; } + function timestamp() { return new Date().getTime(); } + function random(min, max) { return (min + (Math.random() * (max - min))); } + function randomChoice(choices) { return choices[Math.round(random(0, choices.length - 1))]; } if (!window.requestAnimationFrame) { // http://paulirish.com/2011/requestanimationframe-for-smart-animating/ window.requestAnimationFrame = window.webkitRequestAnimationFrame || - window.mozRequestAnimationFrame || - window.oRequestAnimationFrame || - window.msRequestAnimationFrame || - function(callback, element) { - window.setTimeout(callback, 1000 / 60); - } + window.mozRequestAnimationFrame || + window.oRequestAnimationFrame || + window.msRequestAnimationFrame || + function (callback, element) { + window.setTimeout(callback, 1000 / 60); + } } //------------------------------------------------------------------------- // game constants //------------------------------------------------------------------------- - var KEY = { ESC: 27, SPACE: 32, LEFT: 37, UP: 38, RIGHT: 39, DOWN: 40 }, - DIR = { UP: 0, RIGHT: 1, DOWN: 2, LEFT: 3, MIN: 0, MAX: 3 }, - stats = new Stats(), - canvas = get('canvas'), - ctx = canvas.getContext('2d'), - ucanvas = get('upcoming'), - uctx = ucanvas.getContext('2d'), - speed = { start: 0.6, decrement: 0.005, min: 0.1 }, // how long before piece drops by 1 row (seconds) - nx = 10, // width of tetris court (in blocks) - ny = 20, // height of tetris court (in blocks) - nu = 5; // width/height of upcoming preview (in blocks) + var KEY = { ESC: 27, SPACE: 32, LEFT: 37, UP: 38, RIGHT: 39, DOWN: 40 }, + DIR = { UP: 0, RIGHT: 1, DOWN: 2, LEFT: 3, MIN: 0, MAX: 3 }, + stats = new Stats(), + canvas = get('canvas'), + ctx = canvas.getContext('2d'), + ucanvas = get('upcoming'), + uctx = ucanvas.getContext('2d'), + speed = { start: 0.8, decrement: 0.005, min: 0.1 }, // how long before piece drops by 1 row (seconds) + nx = 10, // width of tetris court (in blocks) + ny = 20, // height of tetris court (in blocks) + nu = 5; // width/height of upcoming preview (in blocks) //------------------------------------------------------------------------- // game variables (initialized during reset) //------------------------------------------------------------------------- var dx, dy, // pixel size of a single tetris block - blocks, // 2 dimensional array (nx*ny) representing tetris court - either empty block or occupied by a 'piece' - actions, // queue of user actions (inputs) - playing, // true|false - game is in progress - paused, // true|false - game is currently paued (to differentiate need for reset) - dt, // time since starting this game - current, // the current piece - next, // the next piece - score, // the current score - vscore, // the currently displayed score (it catches up to score in small chunks - like a spinning slot machine) - rows, // number of completed rows in the current game - step; // how long before current piece drops by 1 row + blocks, // 2 dimensional array (nx*ny) representing tetris court - either empty block or occupied by a 'piece' + actions, // queue of user actions (inputs) + playing, // true|false - game is in progress + paused, // true|false - game is currently paued (to differentiate need for reset) + dt, // time since starting this game + current, // the current piece + next, // the next piece + score, // the current score + vscore, // the currently displayed score (it catches up to score in small chunks - like a spinning slot machine) + rows, // number of completed rows in the current game + step; // how long before current piece drops by 1 row //------------------------------------------------------------------------- // tetris pieces @@ -113,13 +322,13 @@ // //------------------------------------------------------------------------- - var i = { size: 4, blocks: [0x0F00, 0x2222, 0x00F0, 0x4444], color: 'purple' }; - var j = { size: 3, blocks: [0x44C0, 0x8E00, 0x6440, 0x0E20], color: 'pink' }; + var i = { size: 4, blocks: [0x0F00, 0x2222, 0x00F0, 0x4444], color: 'yellow' }; + var j = { size: 3, blocks: [0x44C0, 0x8E00, 0x6440, 0x0E20], color: 'pink' }; var l = { size: 3, blocks: [0x4460, 0x0E80, 0xC440, 0x2E00], color: 'salmon' }; var o = { size: 2, blocks: [0xCC00, 0xCC00, 0xCC00, 0xCC00], color: 'lime' }; - var s = { size: 3, blocks: [0x06C0, 0x8C40, 0x6C00, 0x4620], color: 'teal' }; + var s = { size: 3, blocks: [0x06C0, 0x8C40, 0x6C00, 0x4620], color: 'teal' }; var t = { size: 3, blocks: [0x0E40, 0x4C40, 0x4E00, 0x4640], color: 'coral' }; - var z = { size: 3, blocks: [0x0C60, 0x4C80, 0xC600, 0x2640], color: 'olive' }; + var z = { size: 3, blocks: [0x0C60, 0x4C80, 0xC600, 0x2640], color: 'olive' }; //------------------------------------------------ // do the bit manipulation and iterate through each @@ -127,7 +336,7 @@ //------------------------------------------------ function eachblock(type, x, y, dir, fn) { var bit, result, row = 0, col = 0, blocks = type.blocks[dir]; - for(bit = 0x8000 ; bit > 0 ; bit = bit >> 1) { + for (bit = 0x8000; bit > 0; bit = bit >> 1) { if (blocks & bit) { fn(x + col, y + row); } @@ -143,8 +352,8 @@ //----------------------------------------------------- function occupied(type, x, y, dir) { var result = false - eachblock(type, x, y, dir, function(x, y) { - if ((x < 0) || (x >= nx) || (y < 0) || (y >= ny) || getBlock(x,y)) + eachblock(type, x, y, dir, function (x, y) { + if ((x < 0) || (x >= nx) || (y < 0) || (y >= ny) || getBlock(x, y)) result = true; }); return result; @@ -161,8 +370,8 @@ var pieces = []; function randomPiece() { if (pieces.length == 0) - pieces = [i,i,i,i,j,j,j,j,l,l,l,l,o,o,o,o,s,s,s,s,t,t,t,t,z,z,z,z]; - var type = pieces.splice(random(0, pieces.length-1), 1)[0]; + pieces = [i, i, i, i, j, j, j, j, l, l, l, l, o, o, o, o, s, s, s, s, t, t, t, t, z, z, z, z]; + var type = pieces.splice(random(0, pieces.length - 1), 1)[0]; return { type: type, dir: DIR.UP, x: Math.round(random(0, nx - type.size)), y: 0 }; } @@ -203,11 +412,11 @@ } function resize(event) { - canvas.width = canvas.clientWidth; // set canvas logical size equal to its physical size - canvas.height = canvas.clientHeight; // (ditto) - ucanvas.width = ucanvas.clientWidth; + canvas.width = canvas.clientWidth; // set canvas logical size equal to its physical size + canvas.height = canvas.clientHeight; // (ditto) + ucanvas.width = ucanvas.clientWidth; ucanvas.height = ucanvas.clientHeight; - dx = canvas.width / nx; // pixel size of a single tetris block + dx = canvas.width / nx; // pixel size of a single tetris block dy = canvas.height / ny; // (ditto) invalidate(); invalidateNext(); @@ -216,23 +425,23 @@ function keydown(ev) { var handled = false; if (playing) { - switch(ev.keyCode) { - case KEY.LEFT: actions.push(DIR.LEFT); handled = true; break; - case KEY.RIGHT: actions.push(DIR.RIGHT); handled = true; break; - case KEY.UP: actions.push(DIR.UP); handled = true; break; - case KEY.DOWN: actions.push(DIR.DOWN); handled = true; break; - case KEY.ESC: lose(); handled = true; break; - case KEY.SPACE: pause(); handled = true; break; + switch (ev.keyCode) { + case KEY.LEFT: actions.push(DIR.LEFT); handled = true; break; + case KEY.RIGHT: actions.push(DIR.RIGHT); handled = true; break; + case KEY.UP: actions.push(DIR.UP); handled = true; break; + case KEY.DOWN: actions.push(DIR.DOWN); handled = true; break; + case KEY.ESC: lose(); handled = true; break; + case KEY.SPACE: pause(); handled = true; break; } } else if (ev.keyCode == KEY.SPACE) { - if(paused) { - restart(); - handled = true; - }else{ - play(); - handled = true; - } + if (paused) { + restart(); + handled = true; + } else { + play(); + handled = true; + } } if (handled) ev.preventDefault(); // prevent arrow keys from scrolling the page (supported in IE9+ and all other browsers) @@ -242,24 +451,24 @@ // GAME LOGIC //------------------------------------------------------------------------- - function play() { hide('start'); reset(); paused = false; playing = true; } - function pause() {show('start'); paused = true; playing = false;} - function restart() {hide('start'); paused = false; playing = true;} + function play() { hide('start'); reset(); paused = false; playing = true; } + function pause() { show('start'); paused = true; playing = false; } + function restart() { hide('start'); paused = false; playing = true; } function lose() { show('start'); setVisualScore(); playing = false; } - function setVisualScore(n) { vscore = n || score; invalidateScore(); } - function setScore(n) { score = n; setVisualScore(n); } - function addScore(n) { score = score + n; } - function clearScore() { setScore(0); } - function clearRows() { setRows(0); } - function setRows(n) { rows = n; step = Math.max(speed.min, speed.start - (speed.decrement*rows)); invalidateRows(); } - function addRows(n) { setRows(rows + n); } - function getBlock(x,y) { return (blocks && blocks[x] ? blocks[x][y] : null); } - function setBlock(x,y,type) { blocks[x] = blocks[x] || []; blocks[x][y] = type; invalidate(); } - function clearBlocks() { blocks = []; invalidate(); } - function clearActions() { actions = []; } - function setCurrentPiece(piece) { current = piece || randomPiece(); invalidate(); } - function setNextPiece(piece) { next = piece || randomPiece(); invalidateNext(); } + function setVisualScore(n) { vscore = n || score; invalidateScore(); } + function setScore(n) { score = n; setVisualScore(n); } + function addScore(n) { score = score + n; } + function clearScore() { setScore(0); } + function clearRows() { setRows(0); } + function setRows(n) { rows = n; step = Math.max(speed.min, speed.start - (speed.decrement * rows)); invalidateRows(); } + function addRows(n) { setRows(rows + n); } + function getBlock(x, y) { return (blocks && blocks[x] ? blocks[x][y] : null); } + function setBlock(x, y, type) { blocks[x] = blocks[x] || []; blocks[x][y] = type; invalidate(); } + function clearBlocks() { blocks = []; invalidate(); } + function clearActions() { actions = []; } + function setCurrentPiece(piece) { current = piece || randomPiece(); invalidate(); } + function setNextPiece(piece) { next = piece || randomPiece(); invalidateNext(); } function reset() { dt = 0; @@ -285,20 +494,20 @@ } function handle(action) { - switch(action) { - case DIR.LEFT: move(DIR.LEFT); break; + switch (action) { + case DIR.LEFT: move(DIR.LEFT); break; case DIR.RIGHT: move(DIR.RIGHT); break; - case DIR.UP: rotate(); break; - case DIR.DOWN: drop(); break; + case DIR.UP: rotate(); break; + case DIR.DOWN: drop(); break; } } function move(dir) { var x = current.x, y = current.y; - switch(dir) { + switch (dir) { case DIR.RIGHT: x = x + 1; break; - case DIR.LEFT: x = x - 1; break; - case DIR.DOWN: y = y + 1; break; + case DIR.LEFT: x = x - 1; break; + case DIR.DOWN: y = y + 1; break; } if (unoccupied(current.type, x, y, current.dir)) { current.x = x; @@ -334,16 +543,16 @@ } function dropPiece() { - eachblock(current.type, current.x, current.y, current.dir, function(x, y) { + eachblock(current.type, current.x, current.y, current.dir, function (x, y) { setBlock(x, y, current.type); }); } function removeLines() { var x, y, complete, n = 0; - for(y = ny ; y > 0 ; --y) { + for (y = ny; y > 0; --y) { complete = true; - for(x = 0 ; x < nx ; ++x) { + for (x = 0; x < nx; ++x) { if (!getBlock(x, y)) complete = false; } @@ -355,15 +564,15 @@ } if (n > 0) { addRows(n); - addScore(100*Math.pow(2,n-1)); // 1: 100, 2: 200, 3: 400, 4: 800 + addScore(100 * Math.pow(2, n - 1)); // 1: 100, 2: 200, 3: 400, 4: 800 } } function removeLine(n) { var x, y; - for(y = n ; y >= 0 ; --y) { - for(x = 0 ; x < nx ; ++x) - setBlock(x, y, (y == 0) ? null : getBlock(x, y-1)); + for (y = n; y >= 0; --y) { + for (x = 0; x < nx; ++x) + setBlock(x, y, (y == 0) ? null : getBlock(x, y - 1)); } } @@ -373,10 +582,10 @@ var invalid = {}; - function invalidate() { invalid.court = true; } - function invalidateNext() { invalid.next = true; } - function invalidateScore() { invalid.score = true; } - function invalidateRows() { invalid.rows = true; } + function invalidate() { invalid.court = true; } + function invalidateNext() { invalid.next = true; } + function invalidateScore() { invalid.score = true; } + function invalidateRows() { invalid.rows = true; } function draw() { ctx.save(); @@ -395,13 +604,13 @@ if (playing) drawPiece(ctx, current.type, current.x, current.y, current.dir); var x, y, block; - for(y = 0 ; y < ny ; y++) { - for (x = 0 ; x < nx ; x++) { - if (block = getBlock(x,y)) + for (y = 0; y < ny; y++) { + for (x = 0; x < nx; x++) { + if (block = getBlock(x, y)) drawBlock(ctx, x, y, block.color); } } - ctx.strokeRect(0, 0, nx*dx - 1, ny*dy - 1); // court boundary + ctx.strokeRect(0, 0, nx * dx - 1, ny * dy - 1); // court boundary invalid.court = false; } } @@ -411,10 +620,10 @@ var padding = (nu - next.type.size) / 2; // half-arsed attempt at centering next piece display uctx.save(); uctx.translate(0.5, 0.5); - uctx.clearRect(0, 0, nu*dx, nu*dy); + uctx.clearRect(0, 0, nu * dx, nu * dy); drawPiece(uctx, next.type, padding, padding, next.dir); uctx.strokeStyle = 'black'; - uctx.strokeRect(0, 0, nu*dx - 1, nu*dy - 1); + uctx.strokeRect(0, 0, nu * dx - 1, nu * dy - 1); uctx.restore(); invalid.next = false; } @@ -435,15 +644,15 @@ } function drawPiece(ctx, type, x, y, dir) { - eachblock(type, x, y, dir, function(x, y) { + eachblock(type, x, y, dir, function (x, y) { drawBlock(ctx, x, y, type.color); }); } function drawBlock(ctx, x, y, color) { ctx.fillStyle = color; - ctx.fillRect(x*dx, y*dy, dx, dy); - ctx.strokeRect(x*dx, y*dy, dx, dy) + ctx.fillRect(x * dx, y * dy, dx, dy); + ctx.strokeRect(x * dx, y * dy, dx, dy) } //------------------------------------------------------------------------- @@ -455,4 +664,5 @@ - + + \ No newline at end of file