68 lines
No EOL
3.4 KiB
HTML
68 lines
No EOL
3.4 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Cards's Game</title>
|
|
<meta name="description" content="">
|
|
<link rel="stylesheet prefetch" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
|
|
<link rel="stylesheet prefetch" href="https://fonts.googleapis.com/css?family=Coda">
|
|
<link rel="stylesheet" href="../static/css/new-g.css">
|
|
<style>
|
|
body {
|
|
background: #ffffff url('../static/images/geometry2.png'); /* Background pattern from Subtle Patterns */
|
|
font-family: 'Coda', cursive;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<header>
|
|
<h1>Fast Detection Game</h1>
|
|
</header>
|
|
<section class="score-panel">
|
|
<ul class="stars">
|
|
<li>
|
|
<i class="fa fa-star gold-star"></i>
|
|
</li>
|
|
</ul>
|
|
<span class="moves">Score :</span><span id="score"> 0</span>
|
|
<div class="restart">
|
|
<i class="fa fa-repeat" onclick="restartGame()"></i> Restart game
|
|
</div>
|
|
</section>
|
|
<div id="basicUsage" style="text-align: center;"><i style="display: inline-block; margin-right: 6px;" class="fa fa-clock-o"></i><h5 style="display: inline-block;" ><time></time></h5></div>
|
|
<ul class="deck1" style="justify-content: center; display: flex; position: relative;">
|
|
<h4 style="position: absolute; color: white; top: -15px; left: 32%; width: 100%;">Click on the common object here</h4>
|
|
<img src="../static/images/card11.png" alt="simple card" id="clickme" style="cursor: pointer; margin-top: 10px;" onclick="clickEvent(event)">
|
|
<!-- <img src="../static/images/card1.png" alt="simple card" id="clickme" style="cursor: pointer; margin-top: 10px;" onclick="clickEvent(event)">
|
|
<img src="../static/images/card3.png" alt="simple card" id="card2" style="cursor: pointer; margin-top: 10px; display: none;" onclick="clickEvent2(event)"> -->
|
|
<!-- <img src="../static/images/icon.png" alt="simple card" class="gcard diapo" onclick="boutons(-1)"> -->
|
|
</ul>
|
|
|
|
<hr style="border: #44464778 dashed 1px; width: 80%; margin: 19px 0 9px;">
|
|
|
|
<ul class="deck2" style="justify-content: center; display: flex; position: relative;">
|
|
<h4 style="position: absolute; color: white; top: -8px; left: 42%; width: 100%;">Central Card</h4>
|
|
<img src="../static/images/card22.png" alt="simple card" id="clickme" style="cursor: pointer; margin-top: 10px;" onclick="clickEvent(event)">
|
|
<!-- <img src="../static/images/card2.png" id="card3" alt="simple card" style="margin-top: 10px;">
|
|
<img src="../static/images/card1.png" alt="simple card" id="card4" style="cursor: pointer; margin-top: 10px; display: none;" onclick="clickEvent(event)"> -->
|
|
</ul>
|
|
|
|
</div>
|
|
<div class="popup">
|
|
<div class="content">
|
|
<span class="close">×</span>
|
|
<h1>Congratulations,</h1>
|
|
<p>You completed the game in time
|
|
<span id="timer"> 00:00:00 </span> with total number of moves:
|
|
<span id="moves">0</span>
|
|
<br/> your star rating:
|
|
<span id="rating">0</span> out of 3</p>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript" src="../static/js/new-g.js"></script>
|
|
|
|
</body>
|
|
|
|
</html> |