-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
139 lines (114 loc) · 5.17 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- Import of Font Awesome library -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script type="text/javascript" src="js/three.js"></script>
<title>LittleAI</title>
<link rel="stylesheet" type="text/css" href="css/master.css">
<link rel="stylesheet" type="text/css" href="css/feedback.css">
<link rel="stylesheet" type="text/css" href="css/commands.css">
<link rel="stylesheet" type="text/css" href="css/informations.css">
<link rel="stylesheet" type="text/css" href="css/levels.css">
<link rel="stylesheet" type="text/css" href="css/replayMode.css">
<link rel="icon" type="image/png" href="img/icon.png" />
</head>
<body>
<!-- The full page background image -->
<div class="bg">
</div>
<!-- The level menu's overlay -->
<div id="levelMenu" class="overlay">
<!-- Button to close the overlay navigation -->
<a onclick="closeNav()" class="closebtn">×</a>
<!-- Overlay content -->
<div class="overlay-content">
<div id="menuTab">
<div id="menuTabIndex" class="tab">
</div>
</div>
<div id="menuActions">
<input type="file" id="fileinput"/>
<a id="importbtn" onclick="loadFile()" class="fa fa-upload fa-3x"></a>
<a id="exportbtn" onclick="exportSave()" class="exportbtn fa fa-download fa-3x"></a>
<a id="downloadAnchorElem" style="display:none"></a>
</div>
</div>
</div>
<!-- The "game's field" -->
<div class="container">
<!-- The link to open the level menu -->
<div onclick="openNav()" class="openbtn">
<span id="menuLink"></span>
</div>
<div class="feedback">
<!-- Display of the player's score -->
<div id="scorePositionner">
<div id="score" class="score center">
0
</div>
</div>
<!-- The trace, i.e where will pop the obsels -->
<div id="tracePositionner">
<div id="traceContainer" class="traceContainer">
</div>
</div>
<!-- Tips for the trace -->
<span class="fa fa-question-circle tooltip tracetip">
<span class="tooltiptext">Clic droit pour changer la couleur des obsels</span>
</span>
</div>
<!-- Place of the commands
Level's buttons will be create here -->
<div class="commands" id="commands">
<!-- Tips for the commands -->
<span id="commandtip" class="fa fa-question-circle tooltip commandtip">
<span class="tooltiptext">Clic droit pour changer la forme du bouton</span>
</span>
</div>
<div id="levelOptions">
<div id="robotBtn">
</div>
<div id="infoBtn">
<span onclick="openInfoPanel()" class="fa fa-info-circle fa-3x" style="color:yellow"></span>
</div>
<div id="replayModeBtn">
<span onclick="openReplayMode()" class="fa fa-info-circle fa-3x" style="color:blue"></span>
</div>
</div>
<!-- Toggleable panel displaying informations about a level -->
<div id="infoPanel">
<div class="header">
<span class="logo fa fa-info-circle fa-2x"></span>
<span onclick="closeInfoPanel()" class="close fa fa-close fa-2x"></span>
</div>
<div id="infoContent" class="content">
Informations : Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sit amet posuere ligula, eget auctor odio. Aenean ut risus in eros condimentum luctus at non tellus. Nam auctor neque turpis, a efficitur massa consequat sed. Ut quis volutpat nunc, eu luctus quam. Vivamus a libero rutrum, fringilla nisl cursus, semper nulla. Sed nisi ante, semper a erat in, vehicula luctus quam. Aliquam tempor sed dolor ut ultrices. Nullam mauris nunc, aliquam et arcu vel, dictum interdum magna. Praesent condimentum, eros sit amet tristique dictum, lectus felis cursus quam, non rhoncus ipsum augue eget leo. Sed semper egestas pellentesque. Nullam in metus enim. Sed non iaculis tellus, sit amet fermentum odio.
</div>
<div id="replayModeContent" class="content">
</div>
</div>
</div>
<!-- Loaded at the end to load the page quicker -->
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="js/variables.js"></script>
<script type="text/javascript" src="js/utility.js"></script>
<script type="text/javascript" src="js/game.js"></script>
<script type="text/javascript" src="js/loader.js"></script>
<script type="text/javascript" src="js/levelMenu.js"></script>
<script type="text/javascript" src="js/UI.js"></script>
<script type="text/javascript" src="js/replayMode.js"></script>
<script type="text/javascript" src="js/OrbitControls.js"></script>
<script type="text/javascript" src="js/stateMachine.js"></script>
<script type="text/javascript" src="js/i18n.js"></script>
</body>
</html>