Skip to content

Commit 79938b9

Browse files
ZebinGaoZebinGao
committed
add 2048 game
1 parent 3d85ba5 commit 79938b9

35 files changed

+4545
-1
lines changed

‎source/smallgame/2048/.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
.sass-cache/

‎source/smallgame/2048/.jshintrc‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
{
2+
"esnext": true,
3+
"indent": 2,
4+
"maxlen": 80,
5+
"freeze": true,
6+
"camelcase": true,
7+
"unused": true,
8+
"eqnull": true,
9+
"proto": true,
10+
"supernew": true,
11+
"noyield": true,
12+
"evil": true,
13+
"node": true,
14+
"boss": true,
15+
"expr": true,
16+
"loopfunc": true,
17+
"white": true,
18+
"maxdepth": 4
19+
}

‎source/smallgame/2048/CONTRIBUTING.md‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
# Contributing
2+
Changes and improvements are more than welcome! Feel free to fork and open a pull request.
3+
4+
Please follow the house rules to have a bigger chance of your contribution being merged.
5+
6+
## House rules
7+
8+
### How to make changes
9+
- To make changes, create a new branch based on `master` (do not create one from `gh-pages` unless strictly necessary) and make them there, then create a Pull Request to master.
10+
`gh-pages` is different from master in that it contains sharing features, analytics and other things that have no direct bearing with the game. `master` is the "pure" version of the game.
11+
- If you want to modify the CSS, please edit the SCSS files present in `style/`: `main.scss` and others. Don't edit the `main.css`, because it's supposed to be generated.
12+
In order to compile your SCSS modifications, you need to use the `sass` gem (install it by running `gem install sass` once Ruby is installed).
13+
To run SASS, simply use the following command:
14+
`sass --unix-newlines --watch style/main.scss`
15+
SASS will automatically recompile your css when changed.
16+
- `Rakefile` contains some tasks that help during development. Feel free to add useful tasks if needed.
17+
- Please use 2-space indentation when editing the JavaScript. A `.jshintrc` file is present, which will help your code to follow the guidelines if you install and run `jshint`.
18+
- Please test your modification thoroughly before submitting your Pull Request.
19+
20+
### Changes that might not be accepted
21+
We have to be conservative with the core game. This means that some modifications won't be merged, or will have to be evaluated carefully before being merged:
22+
23+
- Undo/redo features
24+
- Save/reload features
25+
- Changes to how the tiles look or their contents
26+
- Changes to the layout
27+
- Changes to the grid size
28+
29+
### Changes that are welcome
30+
- Bug fixes
31+
- Compatibility improvements
32+
- "Under the hood" enhancements
33+
- Small changes that don't have an impact on the core gameplay

‎source/smallgame/2048/LICENSE.txt‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2014 Gabriele Cirulli
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in
13+
all copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21+
THE SOFTWARE.

‎source/smallgame/2048/README.md‎

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
# 2048
2+
A small clone of [1024](https://play.google.com/store/apps/details?id=com.veewo.a1024), based on [Saming's 2048](http://saming.fr/p/2048/) (also a clone). 2048 was indirectly inspired by [Threes](https://asherv.com/threes/).
3+
4+
Made just for fun. [Play it here!](http://gabrielecirulli.github.io/2048/)
5+
6+
The official app can also be found on the [Play Store](https://play.google.com/store/apps/details?id=com.gabrielecirulli.app2048) and [App Store!](https://itunes.apple.com/us/app/2048-by-gabriele-cirulli/id868076805)
7+
8+
### Contributions
9+
10+
[Anna Harren](https://github.com/iirelu/) and [sigod](https://github.com/sigod) are maintainers for this repository.
11+
12+
Other notable contributors:
13+
14+
- [TimPetricola](https://github.com/TimPetricola) added best score storage
15+
- [chrisprice](https://github.com/chrisprice) added custom code for swipe handling on mobile
16+
- [marcingajda](https://github.com/marcingajda) made swipes work on Windows Phone
17+
- [mgarciaisaia](https://github.com/mgarciaisaia) added support for Android 2.3
18+
19+
Many thanks to [rayhaanj](https://github.com/rayhaanj), [Mechazawa](https://github.com/Mechazawa), [grant](https://github.com/grant), [remram44](https://github.com/remram44) and [ghoullier](https://github.com/ghoullier) for the many other good contributions.
20+
21+
### Screenshot
22+
23+
<p align="center">
24+
<img src="https://cloud.githubusercontent.com/assets/1175750/8614312/280e5dc2-26f1-11e5-9f1f-5891c3ca8b26.png" alt="Screenshot"/>
25+
</p>
26+
27+
That screenshot is fake, by the way. I never reached 2048 :smile:
28+
29+
## Contributing
30+
Changes and improvements are more than welcome! Feel free to fork and open a pull request. Please make your changes in a specific branch and request to pull into `master`! If you can, please make sure the game fully works before sending the PR, as that will help speed up the process.
31+
32+
You can find the same information in the [contributing guide.](https://github.com/gabrielecirulli/2048/blob/master/CONTRIBUTING.md)
33+
34+
## License
35+
2048 is licensed under the [MIT license.](https://github.com/gabrielecirulli/2048/blob/master/LICENSE.txt)
36+
37+
## Donations
38+
I made this in my spare time, and it's hosted on GitHub (which means I don't have any hosting costs), but if you enjoyed the game and feel like buying me coffee, you can donate at my BTC address: `1Ec6onfsQmoP9kkL3zkpB6c5sA4PVcXU2i`. Thank you very much!
39+
40+
---
41+
42+
## 文件分析：2048 游戏
43+
44+
以下是对 2048-master 文件夹中文件进行的分析，以区分运行游戏所必需的文件和多余的文件。
45+
46+
### 运行游戏所必需的文件：
47+
48+
* `index.html`：游戏的入口点，加载所有其他资源。
49+
* `favicon.ico`：网站在浏览器标签页或收藏夹中显示的图标。
50+
* `style/main.css`：主样式表，定义了游戏界面的视觉呈现。
51+
* `style/fonts/clear-sans.css`：由 `main.css` 导入的字体样式表，定义了游戏使用的 Clear Sans 字体。
52+
* `style/fonts/ClearSans-Bold-webfont.eot`：Clear Sans 粗体字体的 EOT 格式（用于旧版 IE 浏览器）。
53+
* `style/fonts/ClearSans-Bold-webfont.svg`：Clear Sans 粗体字体的 SVG 格式（用于旧版 iOS）。
54+
* `style/fonts/ClearSans-Bold-webfont.woff`：Clear Sans 粗体字体的 WOFF 格式（现代浏览器）。
55+
* `style/fonts/ClearSans-Light-webfont.eot`：Clear Sans 细体字体的 EOT 格式。
56+
* `style/fonts/ClearSans-Light-webfont.svg`：Clear Sans 细体字体的 SVG 格式。
57+
* `style/fonts/ClearSans-Light-webfont.woff`：Clear Sans 细体字体的 WOFF 格式。
58+
* `style/fonts/ClearSans-Regular-webfont.eot`：Clear Sans 常规字体的 EOT 格式。
59+
* `style/fonts/ClearSans-Regular-webfont.svg`：Clear Sans 常规字体的 SVG 格式。
60+
* `style/fonts/ClearSans-Regular-webfont.woff`：Clear Sans 常规字体的 WOFF 格式。
61+
* `js/animframe_polyfill.js`：提供 `requestAnimationFrame` 的兼容性填充，用于平滑动画。
62+
* `js/application.js`：游戏的初始化和主应用程序逻辑。
63+
* `js/bind_polyfill.js`：提供 `Function.prototype.bind` 的兼容性填充。
64+
* `js/classlist_polyfill.js`：提供 `Element.prototype.classList` 的兼容性填充。
65+
* `js/game_manager.js`：管理游戏的核心逻辑，如移动、合并和分数。
66+
* `js/grid.js`：处理游戏网格的结构和方块位置。
67+
* `js/html_actuator.js`：负责将游戏状态（如方块移动、分数更新）渲染到 HTML 界面。
68+
* `js/keyboard_input_manager.js`：处理用户的键盘输入，将其转换为游戏操作。
69+
* `js/local_storage_manager.js`：管理游戏数据（如最高分、当前游戏状态）在浏览器本地存储中的保存和加载。
70+
* `js/tile.js`：定义游戏中的单个数字方块对象及其属性。
71+
* `meta/apple-touch-icon.png`：用于 Apple 设备主屏幕图标。
72+
* `meta/apple-touch-startup-image-640x920.png`：用于 Apple 设备启动屏幕图像（640x920 分辨率）。
73+
* `meta/apple-touch-startup-image-640x1096.png`：用于 Apple 设备启动屏幕图像（640x1096 分辨率）。
74+
75+
### 多余文件（非运行游戏所必需）：
76+
77+
* `.gitignore`：Git 版本控制系统使用的文件，指定哪些文件或目录应被忽略。
78+
* `.jshintrc`：JSHint 的配置文件，一个 JavaScript 代码质量工具，用于在开发过程中检查代码。
79+
* `CONTRIBUTING.md`：包含项目贡献指南的 Markdown 文件。
80+
* `LICENSE.txt`：项目的许可证信息。
81+
* `Rakefile`：Ruby Rake 构建自动化工具的配置文件，用于自动化开发任务。
82+
* `README.md`：项目的说明文件，您正在阅读的这个文件。
83+
* `style/helpers.scss`：Sass 辅助样式文件，通常包含可重用的 mixin 或变量，用于开发 `main.scss`。
84+
* `style/main.scss`：Sass 源文件，`style/main.css` 是其编译后的结果。

‎source/smallgame/2048/Rakefile‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
require "date"
2+
3+
namespace :appcache do
4+
desc "update the date in the appcache file (in the gh-pages branch)"
5+
task :update do
6+
appcache = File.read("cache.appcache")
7+
updated = "# Updated: #{DateTime.now}"
8+
9+
File.write("cache.appcache", appcache.sub(/^# Updated:.*$/, updated))
10+
end
11+
end

‎source/smallgame/2048/favicon.ico‎

4.19 KB
Binary file not shown.

‎source/smallgame/2048/index.html‎

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
---
2+
layout: false
3+
---
4+
<!DOCTYPE html>
5+
<html>
6+
<head>
7+
<meta charset="utf-8">
8+
<title>2048</title>
9+
10+
<link href="style/main.css" rel="stylesheet" type="text/css">
11+
<link rel="shortcut icon" href="favicon.ico">
12+
<link rel="apple-touch-icon" href="meta/apple-touch-icon.png">
13+
<link rel="apple-touch-startup-image" href="meta/apple-touch-startup-image-640x1096.png" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)"> <!-- iPhone 5+ -->
14+
<link rel="apple-touch-startup-image" href="meta/apple-touch-startup-image-640x920.png" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)"> <!-- iPhone, retina -->
15+
<meta name="apple-mobile-web-app-capable" content="yes">
16+
<meta name="apple-mobile-web-app-status-bar-style" content="black">
17+
18+
<meta name="HandheldFriendly" content="True">
19+
<meta name="MobileOptimized" content="320">
20+
<meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0, maximum-scale=1, user-scalable=no, minimal-ui">
21+
</head>
22+
<body>
23+
<div class="container">
24+
<div class="heading">
25+
<h1 class="title">2048</h1>
26+
<div class="scores-container">
27+
<div class="score-container">0</div>
28+
<div class="best-container">0</div>
29+
</div>
30+
</div>
31+
32+
<div class="above-game">
33+
<p class="game-intro">Join the numbers and get to the <strong>2048 tile!</strong></p>
34+
<a class="restart-button">New Game</a>
35+
</div>
36+
37+
<div class="game-container">
38+
<div class="game-message">
39+
<p></p>
40+
<div class="lower">
41+
<a class="keep-playing-button">Keep going</a>
42+
<a class="retry-button">Try again</a>
43+
</div>
44+
</div>
45+
46+
<div class="grid-container">
47+
<div class="grid-row">
48+
<div class="grid-cell"></div>
49+
<div class="grid-cell"></div>
50+
<div class="grid-cell"></div>
51+
<div class="grid-cell"></div>
52+
</div>
53+
<div class="grid-row">
54+
<div class="grid-cell"></div>
55+
<div class="grid-cell"></div>
56+
<div class="grid-cell"></div>
57+
<div class="grid-cell"></div>
58+
</div>
59+
<div class="grid-row">
60+
<div class="grid-cell"></div>
61+
<div class="grid-cell"></div>
62+
<div class="grid-cell"></div>
63+
<div class="grid-cell"></div>
64+
</div>
65+
<div class="grid-row">
66+
<div class="grid-cell"></div>
67+
<div class="grid-cell"></div>
68+
<div class="grid-cell"></div>
69+
<div class="grid-cell"></div>
70+
</div>
71+
</div>
72+
73+
<div class="tile-container">
74+
75+
</div>
76+
</div>
77+
78+
<p class="game-explanation">
79+
<strong class="important">How to play:</strong> Use your <strong>arrow keys</strong> to move the tiles. When two tiles with the same number touch, they <strong>merge into one!</strong>
80+
</p>
81+
<hr>
82+
<p>
83+
<strong class="important">Note:</strong> This site is the official version of 2048. You can play it on your phone via <a href="http://git.io/2048">http://git.io/2048.</a> All other apps or sites are derivatives or fakes, and should be used with caution.
84+
</p>
85+
<hr>
86+
<p>
87+
Created by <a href="http://gabrielecirulli.com" target="_blank">Gabriele Cirulli.</a> Based on <a href="https://itunes.apple.com/us/app/1024!/id823499224" target="_blank">1024 by Veewo Studio</a> and conceptually similar to <a href="http://asherv.com/threes/" target="_blank">Threes by Asher Vollmer.</a>
88+
</p>
89+
</div>
90+
91+
<script src="js/bind_polyfill.js"></script>
92+
<script src="js/classlist_polyfill.js"></script>
93+
<script src="js/animframe_polyfill.js"></script>
94+
<script src="js/keyboard_input_manager.js"></script>
95+
<script src="js/html_actuator.js"></script>
96+
<script src="js/grid.js"></script>
97+
<script src="js/tile.js"></script>
98+
<script src="js/local_storage_manager.js"></script>
99+
<script src="js/game_manager.js"></script>
100+
<script src="js/application.js"></script>
101+
</body>
102+
</html>

‎source/smallgame/2048/js/animframe_polyfill.js‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
(function () {
2+
var lastTime = 0;
3+
var vendors = ['webkit', 'moz'];
4+
for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
5+
window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame'];
6+
window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] ||
7+
window[vendors[x] + 'CancelRequestAnimationFrame'];
8+
}
9+
10+
if (!window.requestAnimationFrame) {
11+
window.requestAnimationFrame = function (callback) {
12+
var currTime = new Date().getTime();
13+
var timeToCall = Math.max(0, 16 - (currTime - lastTime));
14+
var id = window.setTimeout(function () {
15+
callback(currTime + timeToCall);
16+
},
17+
timeToCall);
18+
lastTime = currTime + timeToCall;
19+
return id;
20+
};
21+
}
22+
23+
if (!window.cancelAnimationFrame) {
24+
window.cancelAnimationFrame = function (id) {
25+
clearTimeout(id);
26+
};
27+
}
28+
}());

‎source/smallgame/2048/js/application.js‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
// Wait till the browser is ready to render the game (avoids glitches)
2+
window.requestAnimationFrame(function () {
3+
new GameManager(4, KeyboardInputManager, HTMLActuator, LocalStorageManager);
4+
});

0 commit comments

Comments
 (0)