This repository has been archived by the owner on Feb 18, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
game-puzzle.html
130 lines (111 loc) · 5.24 KB
/
game-puzzle.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
<!DOCTYPE html>
<html lang="sk">
<head>
<meta charset="UTF-8">
<meta name="author" content="Adam Maskulka">
<title>Puzzle</title>
<!-- bootstrap css -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- main css file -->
<link rel="stylesheet" type="text/css" href="css/puzzle.css">
<!-- jquery -->
<script src="js/vendor/jquery-3.1.1.min.js"></script>
<!-- bootstrap javascript -->
<script src="js/vendor/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/jquery-ui.css">
<script src="js/vendor/jquery-ui.js"></script>
<script src="js/vendor/sweetalert.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/sweetalert.css">
<script src="js/puzzle.js"></script>
<script src="js/counter.js"></script>
<!--Menu-->
<script src="js/menu.js"></script>
<script type="text/javascript" src="js/meniny_nav.js"></script>
<link rel="stylesheet" href="css/menu.css">
</head>
<body onload="meniny_onload()">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" aria-expanded="false" data-target="#main_navbar" aria-controls="main_navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand glyphicon glyphicon-home" href="index.html"></a>
</div>
<div id="main_navbar" role="navigation" class="navbar-collapse collapse" aria-expanded="false" style="height: 1px;">
</div>
</div>
<div id="breadcrumbs"></div>
<div id="meniny_nav"></div>
</nav>
<div id="counter"></div>
<div class="jumbotron">
<section id="puzzle-hra">
<h2>Puzzle</h2>
<hr>
<div class="row">
<div id="individualneZadanie1" class="col-sm-6">
<div id="divMapa">
<img src="img/SVK.png" id="imgSVK" alt="Slovensko">
<div id="divBA" class="drop"></div>
<div id="divTT" class="drop"></div>
<div id="divNR" class="drop"></div>
<div id="divTN" class="drop"></div>
<div id="divBB" class="drop"></div>
<div id="divZA" class="drop"></div>
<div id="divPO" class="drop"></div>
<div id="divKE" class="drop"></div>
</div>
<script>
var totalScore = 0;
var droppedRegions = 0;
</script>
</div>
<div class="col-sm-6">
<div id="divPuzzle">
<div class="row">
<img src="img/TT.png" id="imgTT" class="drag" alt="Trnava">
<img src="img/PO.png" id="imgPO" class="drag" alt="Prešov">
<img src="img/ZA.png" id="imgZA" class="drag" alt="Žilina">
<img src="img/BB.png" id="imgBB" class="drag" alt="Banská Bystrica">
</div>
<div class="row">
<img src="img/BA.png" id="imgBA" class="drag" alt="Bratislava">
<img src="img/TN.png" id="imgTN" class="drag" alt="Trenčín">
<img src="img/NR.png" id="imgNR" class="drag" alt="Nitra">
<img src="img/KE.png" id="imgKE" class="drag" alt="Košice">
</div>
</div>
</div>
</div>
<div class="row">
<div id="divScore" class="col-sm-12">
<div id="youWon" class="alert alert-success inDivScore">
<strong>Vyhrali ste!</strong>
</div>
<p id="pScore">Aktuálny počet bodov: 0</p>
<div class="row">
<div class="col-sm-4">
<button id="bNovaHra" class="inDivScore btn btn-primary form-control">Nová hra</button><br>
</div>
<div class="col-sm-4">
<button class="inDivScore btn btn-success form-control" data-toggle="popover" data-placement="top" data-content="Hra je ako klasické puzzle. Pomocou myši uchopte kraj slovenska a snažte sa ho umiestniť na správne miesto na mape slovenska. Ak budete blízko správneho miesta, kraj sa sám prichytí. Hra končí ak na mapu umiestnite všetkých 8 krajov.">Nápoveda</button><br>
</div>
<div class="col-sm-4">
<button id="bBodovanie" class="inDivScore btn btn-danger form-control" data-toggle="popover" data-placement="top" data-content="Ak vybraný kraj umiestnite na správne miesto na prvý krát, dostanete 1 bod. Ak kraj umiestnite na druhý krát dostanete 0,5 bodu. Inak nezískate žiaden bod. Maximálny počet bodov je 8, minimálny 0.">Bodovanie</button><br>
</div>
</div>
</div>
</div>
</section>
</div>
<script>
$(window).resize(function() {
$("#divMapa").height($("#divPuzzle").height());
});
</script>
</body>
</html>