-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
157 lines (141 loc) · 7.32 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
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
<!DOCTYPE html>
<!-- Maine Campus Crush
*
* A Bejewled clone for public higher education in Maine.
* Client based on http://www.emanueleferonato.com/2011/10/07/complete-bejeweled-prototype-made-wiht-jquery/
* Server based on https://mashe.hawksey.info/2014/07/google-sheets-as-a-database-insert-with-apps-script-using-postget-methods-with-ajax-example/
*
* February 1, 2015 - Stephen Houser
*
* Copyright (C) 2015 Stephen Houser
* This work is licensed inder a Creative Commons Attribution-Noncommercial-Share
* Alike 3.0 United States License (CC BY-NC-SA 3.0 US)
* http://creativecommons.org/licenses/by-nc-sa/3.0/us/
*
* "THE BEER-WARE LICENSE" (Revision 42):
* As long as you retain this notice you can do whatever you want with this stuff.
* If we meet some day, and you think this stuff is worth it, you can buy me a beer
* in return.
*
-->
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Maine Campus Crush</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimal-ui">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="apple-touch-icon" href="icon.png">
<link rel="apple-touch-startup-image" href="splash.png">
<link rel="image_src" href="splash.png" />
<meta name="format-detection" content="telephone=no">
<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-2571363-8', 'auto');
ga('set', {
'appName': 'Maine Campus Crush',
'appVersion': '1.0-20150204',
});
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script type="application/x-javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="application/x-javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<script type="application/x-javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/howler/1.1.17/howler.min.js"></script>
<script type="application/x-javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/jquery.touchswipe/1.6.4/jquery.touchSwipe.js"></script>
<script type="application/x-javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/jquery.transit/0.9.12/jquery.transit.min.js"></script>
<script type="application/x-javascript" src="threematch.js"></script>
<link rel="stylesheet" href="threematch.css">
</head>
<body>
<div id="header">
<div class="left"><a href="#" type="button" onClick="showAbout();">About</a></div>
<div class="center"><a href="#" id="score" onClick="showLeaderboard();">0</a></div>
<div class="right"><a href="#" type="button" onClick="restartGame();">Replay</a></div>
</div>
<div id="gamefield">
<div id="marker" class="gem"></div>
</div>
<div id="footer">
<div class="center"><span id="moves">0</span></div>
</div>
<div id="gameover" title="Game Over">
<span class="ui-helper-hidden-accessible"><input type="button"/></span>
<p>Score: <span id="lastscore" class="score">0</span></p>
<p>High score: <span id="highscore" class="score">0</span></p>
</div>
<div id="playfor" title="Choose your team">
<span class="ui-helper-hidden-accessible"><input type="button"/></span>
<ul>
<li class="jeweltype5" onClick="playFor(5);"><img alt="UMaine" src="umaine.png" /><br/>Black Bears</li>
<li class="jeweltype6" onClick="playFor(6);"><img alt="USM" src="usm.png" /><br/>Huskies</li>
<li class="jeweltype1" onClick="playFor(1);"><img alt="UMA" src="uma.png" /><br/>Moose</li>
<li class="jeweltype7" onClick="playFor(7);"><img alt="UMPI" src="umpi.png" /><br/>Owls</li>
<li class="jeweltype2" onClick="playFor(2);"><img alt="UMF" src="umf.png" /><br/>Beavers</li>
<li class="jeweltype4" onClick="playFor(4);"><img alt="UMM" src="umm.png" /><br/>Clippers</li>
<li class="jeweltype3" onClick="playFor(3);"><img alt="UMFK" src="umfk.png" /><br/>Bengals</li>
<li class="jeweltype8" onClick="playFor(8);"><img alt="UMS" src="ums.png" /><br/>System</li>
<li class="jeweltype0" onClick="playFor(0);"><img alt="" src="" /><br/>Undeclared</li>
</ul>
</div>
<div id="about" title="Maine Campus Crush">
<span class="ui-helper-hidden-accessible"><input type="button"/></span>
<p>Score points by swapping two adjacent tiles to make chains
of three or more. Swap tiles by clicking, tapping, or swiping them.</p>
<br/>
<p>The campuses and mascots of the University of Maine System campuses are:</p>
<ul>
<li class="jeweltype1"><a href="http://uma.edu">UMA<br/><img alt="UMA" src="uma.png" /><br/>Moose</a></li>
<li class="jeweltype2"><a href="http://umf.maine.edu">UMF<br/><img alt="UMF" src="umf.png" /><br/>Beavers</a></li>
<li class="jeweltype3"><a href="http://umfk.edu">UMFK<br/><img alt="UMFK" src="umfk.png" /><br/>Bengals</a></li>
<li class="jeweltype4"><a href="http://machias.edu">UMM<br/><img alt="UMM" src="umm.png" /><br/>Clippers</a></li>
<li class="jeweltype5"><a href="http://umaine.edu">UMaine<br/><img alt="UMaine" src="umaine.png" /><br/>Black Bears</a></li>
<li class="jeweltype6"><a href="http://usm.maine.edu">USM<br/><img alt="USM" src="usm.png" /><br/>Huskies</a></li>
<li class="jeweltype7"><a href="http://umpi.edu">UMPI<br/><img alt="UMPI" src="umpi.png" /><br/>Owls</a></li>
<li class="jeweltype8"><a href="http://maine.edu">UMS<br/><img alt="UMS" src="ums.png" /><br/>System</a></li>
</ul>
<br/>
<p>The base code was adapted from
<a href="http://www.emanueleferonato.com/2011/10/07/complete-bejeweled-prototype-made-wiht-jquery/">Emanuele Feronato</a>'s
blog article on a JavaScript Bejeweled Game. The mascot images were used from each
campuses website -- taking the one that best matched the style of the game.</p>
<br/>
<p>Each tile in a chain scores fibonacci(x)*10 points.</p>
<br/>
<p>Developed by:<br/><i><a href="http://about.me/stephenhouser">Stephen Houser</a></i></p>
<p>v1.0-20150204</p>
</div>
<div id="leaderboard" title="Leaderboard">
<span class="ui-helper-hidden-accessible"><input type="button"/></span>
<ul id="myscores">
<li><p>Your High Score</p> <span class="score">0</span></li>
</ul>
<hr/>
<ul id="teamscores">
<li class="loading"><p>Updating...</p></li>
<li class="jeweltype0"><p>Undeclared</p> <span class="score">0</span></li>
<li class="jeweltype1"><p>Moose</p> <span class="score">0</span></li>
<li class="jeweltype2"><p>Beavers</p> <span class="score">0</span></li>
<li class="jeweltype3"><p>Bengals</p> <span class="score">0</span></li>
<li class="jeweltype4"><p>Owls</p> <span class="score">0</span></li>
<li class="jeweltype5"><p>Black Bears</p> <span class="score">0</span></li>
<li class="jeweltype6"><p>Huskies</p> <span class="score">0</span></li>
<li class="jeweltype7"><p>Clippers</p> <span class="score">0</span></li>
<li class="jeweltype8"><p>System</p> <span class="score">0</span></li>
</ul>
</div>
<div id="splash"><img src="splash.png"/>
</div>
</body>
</html>