Browse Source

mod 17_minigame for bootstrap

master
Jakub Škrabánek 3 months ago
parent
commit
841eef8752
  1. 16
      17_minihra/game.js
  2. 62
      17_minihra/index.html

16
17_minihra/game.js

@ -34,18 +34,18 @@ function enemyAttack() {
heroHp -= enemyDmg;
document.getElementById("heroHp").innerText = heroHp;
gameOver();
battlelog("Zaútočil na tebe nepřítel");
battlelog('<li class="list-group-item list-group-item-dark">Zaútočil na tebe nepřítel</li>');
} else {
heroDefense = false;
document.getElementById("heroDefense").innerText = heroDefense;
battlelog("Vykryl jsi útok nepřítele")
battlelog('<li class="list-group-item list-group-item-light">Vykryl jsi útok nepřítele</li>')
}
}
function heal() {
heroHp += hodkoustkou(10);
document.getElementById("heroHp").innerText = heroHp;
battlelog("Vyléčil ses");
battlelog('<li class="list-group-item list-group-item-danger">Vyléčil ses</li>');
gameOver();
enemyAttack();
}
@ -53,7 +53,7 @@ function heal() {
function attack() {
enemyHp -= hodkoustkou(10);
document.getElementById("enemyHp").innerText = enemyHp;
battlelog("Zaútočil jsi");
battlelog(' <li class="list-group-item list-group-item-primary">Zaútočil jsi</li>');
gameOver();
enemyAttack();
}
@ -61,7 +61,7 @@ function attack() {
function defense() {
heroDefense = true;
document.getElementById("heroDefense").innerText = heroDefense;
battlelog("Aktivoval si štít");
battlelog('<li class="list-group-item list-group-item-secondary">Aktivoval si štít</li>');
}
function luck(){
@ -77,14 +77,14 @@ function luck(){
function gameOver() {
console.log("Zjistuji stav-> Enemy:"+enemyHp+" Hero:"+heroHp);
if (enemyHp <= 0) {
document.getElementById("game").innerHTML = "<h1>VYHRÁL JSI</h1>";
document.getElementById("game").innerHTML = '<div class="display-1 h-100 my-auto">VYHRÁL JSI</div>';
} else if ( heroHp <= 0) {
document.getElementById("game").innerHTML = "<h1>PROHRÁL JSI</h1>"
document.getElementById("game").innerHTML = '<div class="display-1 h-100 my-auto">PROHRÁL JSI</div>';
}
}
function battlelog(text2log) {
document.getElementById("battlelog").innerHTML += text2log+ "<br>";
document.getElementById("battlelog").innerHTML += text2log;
}

62
17_minihra/index.html

@ -4,25 +4,55 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="css/bootstrap.css">
</head>
<body onload="initGame()" id="game">
<h1> Mini hra</h1>
<body onload="initGame()" >
<div class="container text-center" id="game">
<ul id="enemy">
<li>Nepřítel: <span id="enemyName">enemyName</span></li>
<li>HP: <span id="enemyHp">enemyHp</span></li>
<li>Útočné číslo: <span id="enemyDmg">enemyDmg</span></li>
</ul>
<ul id="hero">
<li><button onclick="heal()">Vylečit</button> - máš <span id="heroHp">heroHp</span> HP</li>
<li><button onclick="attack()">Útočit</button> - Zaútoč se svou zbraní. tvoje ÚČ je <span id="heroDmg">heroDmg</span></li>
<li><button onclick="defense()">Bránit se</button> - Ubraň se. <span id="heroDefense">heroDefense</span></li>
<li><button onclick="luck()">Náhoda</button> - zkus své štěstí</li>
</ul>
<div id="battlelog">Historie boje: <br> </div>
<h1 class="m-1"> Simple Battle Page</h1>
<ul id="enemy" class="list-group my-5">
<li class="list-group-item display-1 list-group-item-info">Nepřítel: <span id="enemyName">enemyName</span></li>
<li class="list-group-item display-3 list-group-item-danger">HP: <span id="enemyHp">enemyHp</span></li>
<li class="list-group-item display-5 list-group-item-primary">Útočné číslo: <span id="enemyDmg">enemyDmg</span></li>
</ul>
<div class="row ">
<div class="col-md-3">
<button onclick="heal()" class="btn btn-danger w-100 mb-2 btn-lg">Vylečit</button>
<br>
Máš <b class="bg-danger rounded text-white p-1"><span id="heroHp">heroHp</span> HP</b>
</div>
<div class="col-md-3">
<button onclick="attack()" class="btn btn-primary w-100 mb-2 btn-lg">Útočit</button>
<br>
Zaútoč se svou zbraní. Tvoje ÚČ je <span id="heroDmg" class="bg-primary rounded text-white p-1">heroDmg</span>
</div>
<div class="col-md-3">
<button onclick="defense()" class="btn btn-secondary w-100 mb-2 btn-lg">Bránit se</button>
<br>
Ubraň se. <span id="heroDefense" class="bg-secondary rounded text-white p-1">heroDefense</span>
</div>
<div class="col-md-3">
<button onclick="luck()" class="btn btn-success w-100 mb-2 btn-lg">Náhoda</button>
<span class="bg-dark text-white">zkus své štěstí</span>
</div>
</div>
<!-- <ul id="hero">
<li><button onclick="heal()">Vylečit</button> - máš <span id="heroHp">heroHp</span> HP</li>
<li><button onclick="attack()">Útočit</button> - Zaútoč se svou zbraní. tvoje ÚČ je <span id="heroDmg">heroDmg</span></li>
<li><button onclick="defense()">Bránit se</button> - Ubraň se. <span id="heroDefense">heroDefense</span></li>
<li><button onclick="luck()">Náhoda</button> - zkus své štěstí</li>
</ul> -->
<h3 class="mt-5">Historie boje:</h3>
<ul id="battlelog" class="list-group">
</ul>
</div>
<script src="game.js"></script>
<script src="js/bootstrap.bundle.js"></script>
</body>
</html>
Loading…
Cancel
Save