-
Notifications
You must be signed in to change notification settings - Fork 3
/
index.html
138 lines (117 loc) · 7.64 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
<!DOCTYPE HTML>
<html>
<head>
<title>Dream Dash</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1, IE=9">
<meta name="format-detection" content="telephone=no">
<meta name="HandheldFriendly" content="true" />
<meta name="robots" content="noindex,nofollow" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="apple-mobile-web-app-title" content="Phaser App">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, minimal-ui" />
<link rel="apple-touch-icon" href="icons/app_icon_144x144.png">
<!-- non-retina iPhone pre iOS 7 -->
<link rel="apple-touch-icon" sizes="57x57" href="icons/app_icon_57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="icons/app_icon_60x60.png">
<!-- non-retina iPad pre iOS 7 -->
<link rel="apple-touch-icon" sizes="72x72" href="icons/app_icon_72x72.png">
<!-- non-retina iPad iOS 7 -->
<link rel="apple-touch-icon" sizes="76x76" href="icons/app_icon_76x76.png">
<!-- retina iPhone pre iOS 7 -->
<link rel="apple-touch-icon" sizes="114x114" href="icons/app_icon_114x114.png">
<!-- retina iPhone iOS 7 -->
<link rel="apple-touch-icon" sizes="120x120" href="icons/app_icon_120x120.png">
<!-- retina iPad pre iOS 7 -->
<link rel="apple-touch-icon" sizes="144x144" href="icons/app_icon_144x144.png">
<!-- retina iPad iOS 7 -->
<link rel="apple-touch-icon" sizes="152x152" href="icons/app_icon_152x152.png">
<link rel="apple-touch-icon" sizes="256x256" href="icons/app_icon_256x256.png">
<link rel="apple-touch-icon" sizes="512x512" href="icons/app_icon_512x512.png">
<link rel="apple-touch-icon" sizes="1024x1024" href="icons/app_icon_1024x1024.png">
<link rel="stylesheet" href="minified/stylesheet.min.css" type="text/css" charset="utf-8" />
</head>
<body>
<!-- Non-Minified Script Tags Below -->
<script src="vendor/phaser.js"></script>
<script src="vendor/webfontloader.js"></script>
<script src="lib/phaser-state-transition-plugin.min.js"></script>
<script src="lib/polyfill.js"></script>
<script src="lib/utils.js"></script>
<script src="lib/style.js"></script>
<script src="lib/mixins.js"></script>
<script src="src/Preloader.js"></script>
<script src="src/Boot.js"></script>
<script src="src/Directions.js"></script>
<script src="src/MainMenu.js"></script>
<script src="src/Game.js"></script>
<script src="src/Gameover.js"></script>
<script src="src/Credits.js"></script>
<script src="src/Options.js"></script>
<script src="src/LevelUp.js"></script>
<!-- Minified Scripts Below -->
<!-- // <script src="minified/allfiles.min.js"></script> -->
<div id="game"></div>
<div id="orientation"></div>
<script type="text/javascript">
(function() {
// Creates Phaser game and injects it into the game div
// scaling etc
//============================================================
// function to see if user is on desktop or mobile (from detectmobilebrowsers.com) returns true if mobile, false if desktop
window.mobilecheck = function() {
var check = false;
//check for mobile and tablets
(function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino|android|ipad|playbook|silk/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4)))check = true})(navigator.userAgent||navigator.vendor||window.opera);
return check;
}
/*
scale game canvas based on aspect ratios
5 possible aspect ratios: (width:height)
4:3, 1024 x 768 --> 4/3 = 1.3333
3:2, 960 x 640 --> 3/2 = 1.5
16:10, 1280 x 800 --> 16/10 = 1.6
17:10, 1024 x 600 --> 17/10 = 1.7
16:9, 1408 x 792 --> 16/9 = 1.77778
*/
var windowWidth = window.innerWidth * window.devicePixelRatio;
var windowHeight = window.innerHeight * window.devicePixelRatio;
var ratio = windowWidth / windowHeight;
// if user is on desktop, use 800x600 game. else use size based on aspect ratio
if (window.mobilecheck() === false) {
var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'game');
window.deviceAssetSize = 'desktop';
} else if (ratio < 1.4) {
var game = new Phaser.Game(1024, 768, Phaser.CANVAS, 'game');
window.deviceAssetSize = '1024x768';
} else if (ratio <= 1.5) {
var game = new Phaser.Game(960, 640, Phaser.CANVAS, 'game');
window.deviceAssetSize = '960x640';
} else if (ratio <= 1.6) {
var game = new Phaser.Game(1280, 800, Phaser.CANVAS, 'game');
window.deviceAssetSize = '1280x800';
} else if (ratio <= 1.7) {
var game = new Phaser.Game(1024, 600, Phaser.CANVAS, 'game');
window.deviceAssetSize = '1024x600';
} else {
var game = new Phaser.Game(1408, 792, Phaser.CANVAS, 'game');
window.deviceAssetSize = '1408x792';
}
console.log("window.deviceAssetSize", window.deviceAssetSize);
//============================================================
WebFontConfig = {
custom: {
families: ['TheMinion'],
urls: ['assets/style/theminion.css']
}
}
// Loads States for Game
game.state.add('Boot', Boot);
game.state.add('Preloader', Preloader);
// Starts the Boot state
game.state.start('Boot');
})();
</script>
</body>
</html>