forked from huonw/2048-4D
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
142 lines (131 loc) · 6.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>2048 ND</title>
<link href="style/main.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="favicon.ico">
<link rel="apple-touch-icon" href="meta/apple-touch-icon.png">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0, maximum-scale=1, user-scalable=no, minimal-ui">
<meta property="og:title" content="2048 ND game"/>
<meta property="og:site_name" content="2048 ND game"/>
<meta property="og:description" content="Play the 2048 game in ANY dimension you like!"/>
<meta property="og:image" content="http://hpmv.github.io/2048-4D/meta/og_image.png"/>
</head>
<body>
<div class="container">
<div class="heading">
<h1 class="title">2048 ND</h1>
<div class="scores-container">
<div class="score-container">0</div>
<div class="best-container">0</div>
</div>
</div>
<p class="game-intro">Join the numbers and get to the <strong>2048 tile!</strong></p>
<div class="game-container">
<div class="game-message-wrapper">
<div class="game-message">
<p></p>
<div class="lower">
<a class="keep-playing-button">Keep going</a>
<a class="retry-button">Try again</a>
<!--<div class="score-sharing"></div>-->
</div>
</div>
</div>
<div class="grid-container">
<div class="start-game-panel">
<p>Choose your game dimensions:</p>
<div class="row-of-dimensions">
<div class="dimension-button" onclick="chooseSize([4,4], this)">
<p>2D</p>
<p>4 x 4</p>
</div>
<div class="dimension-button" onclick="chooseSize([5,5], this)">
<p>2D</p>
<p>5 x 5</p>
</div>
<div class="dimension-button" onclick="chooseSize([3,3,3], this)">
<p>3D</p>
<p>3 x 3 x 3</p>
</div>
<div class="dimension-button button-selected" onclick="chooseSize([2,2,2,2], this)">
<p>4D</p>
<p>2 x 2 x 2 x 2</p>
</div>
<div class="dimension-button" onclick="chooseSize([2,2,2,2,2], this)">
<p>5D</p>
<p>2 x 2 x 2 x 2 x 2</p>
</div>
<div class="dimension-button" onclick="chooseSize([2,2,2,2,2,2], this)">
<p>6D</p>
<p>2 x 2 x ... x 2</p>
</div>
<div class="dimension-button" onclick="chooseSize([2,2,2,2,2,2,2], this)">
<p>7D</p>
<p>2 x 2 x ... x 2</p>
</div>
<div class="dimension-button" onclick="chooseSize([2,2,2,2,2,2,2,2], this)">
<p>8D</p>
<p>2 x 2 x ... x 2</p>
</div>
</div>
<div class="custom-dimension-button" onclick="chooseSize(undefined, this)">
<p>Custom dimensions (ex. [2, 2, 2, 2]):</p>
<input id="custom-dimension-input" type="text"/>
</div>
<div class="start-game-button" onclick="startGame()">Start!</div>
</div>
</div>
<div class="tile-container">
</div>
</div>
<p class="game-explanation">
<strong class="important">How to play:</strong> Use your <strong>arrow keys</strong> for the first two dimensions, <strong>WASD</strong> for the third and fourth dimensions, and for higher dimensions, hold SHIFT to add four dimensions. When two tiles with the same number touch, they <strong>merge into one!</strong>
</p>
<hr>
<p>
<strong class="important">Note:</strong> N-dimensional version created by <a href="https://github.com/hpmv">Robin Cheng</a>, based on <a href="https://github.com/huonw">Huon Wilson's</a> 4-dimensional one.
</p>
<hr>
<p>
<a href="http://gabrielecirulli.github.io/2048/">Original</a> 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>
</p>
<!--<div class="sharing">-->
<!--<a href="https://twitter.com/share" class="twitter-share-button" data-text="Check out 2048, a game where you join numbers to score high! #2048game" data-via="gabrielecirulli" data-url="http://git.io/2048" data-counturl="http://gabrielecirulli.github.io/2048/">Tweet</a>-->
<!--<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>-->
<!--</div>-->
</div>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="js/vector.js"></script>
<script src="js/animframe_polyfill.js"></script>
<script src="js/keyboard_input_manager.js"></script>
<script src="js/html_actuator.js"></script>
<script src="js/grid.js"></script>
<script src="js/tile.js"></script>
<script src="js/local_score_manager.js"></script>
<script src="js/game_manager.js"></script>
<script src="js/application.js"></script>
<!--<!– Start of StatCounter Code for Default Guide –>-->
<!--<script type="text/javascript">-->
<!--var sc_project=9681186;-->
<!--var sc_invisible=1;-->
<!--var sc_security="9c00be85";-->
<!--var scJsHost = (("https:" == document.location.protocol) ?-->
<!--"https://secure." : "http://www.");-->
<!--document.write("<sc"+"ript type='text/javascript' src='" +-->
<!--scJsHost+-->
<!--"statcounter.com/counter/counter.js'></"+"script>");-->
<!--</script>-->
<!--<noscript><div class="statcounter"><a title="web analytics"-->
<!--href="http://statcounter.com/" target="_blank"><img-->
<!--class="statcounter"-->
<!--src="http://c.statcounter.com/9681186/0/9c00be85/0/"-->
<!--alt="web analytics"></a></div></noscript>-->
<!--<!– End of StatCounter Code for Default Guide –>-->
</body>
</html>