skrabanek
/
JavaScript-vsehochut
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

First Commit

master
Jakub Škrabánek 3 years ago
parent
7831be770b
commit
b22a46cef2
17 changed files with 633 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 16
      alert.html
  2. 0
      eval.html
  3. 19
      hodkostkou.html
  4. 28
      hra.html
  5. 89
      hra.js
  6. 40
      mapa.html
  7. 21
      pc.html
  8. 36
      pocitadlo.html
  9. 30
      pocitadlo.js
  10. 76
      pribeh.html
  11. 23
      promenne.html
  12. 57
      seznamy.html
  13. 62
      seznamy_V2.html
  14. 4
      style.css
  15. 35
      uvod.html
  16. 55
      zmenapisma.html
  17. 42
      zvetsovadlo.html

16
alert.html
View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Vytvaření Alertu</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<textarea name="" id="alertfield">Zkouška Alertu</textarea>
<button onclick='createAlert(document.getElementById("alertfield").value)'>Vyvtořit Alert</button>
<script src="pocitadlo.js"></script>
</body>
</html>

0
eval.html
View File

19
hodkostkou.html
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Hod Kostkou</h1>
<textarea name="" id="steny" placeholder="Kolik stěn chceš?"></textarea>
<button onclick='hodkostkou(document.getElementById("steny").value)'>HOD KOSTKOU</button>
<div id="vysledek"></div>
<script src="pocitadlo.js"></script>
</body>
</html>

28
hra.html
View File

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Mini Hra</title>
<link rel="stylesheet" href="style.css">
</head>
<body id="game" onload="init()">
<h1>Mini hra</h1>
<ul id="enemy">
<li>Nepřítel: <b><div id="enemyName" style="display:inline-block;"></div></b></li>
<li>Životy <div id="enemyHp" style="display:inline-block;" ></div></li>
<li>Útočné číslo <div id="enemyDamage" style="display:inline-block;"></div></li>
</ul>
<ul id="hero">
<li><button onclick="heal()">Vyléčit</button> - Máš <div id="heroHp" style="display:inline-block;"></div> životů</li>
<li><button onclick="attack()">Útočit</button> - Zaútoč se svojí zbraní</li>
<li><button onclick="defend()">Bránit</button> - Ubraň se</li>
<li><button onclick="luck()">Náhoda</button> - Zkus své štěstí</li>
</ul>
<div id="battlelog">Historie boje: <br> </div>
<script src="hra.js"></script>
</body>
</html>

89
hra.js
View File

@ -0,0 +1,89 @@
//nastavení proměných
var enemyName = ['Duch', 'Vlk', 'Učitel', "Lebka", "Kostlivec"];
var enemyHp = hodkostkou(50);
var enemyDamage = hodkostkou(10);
var heroHp = 40;
var heroDamage = 6;
let heroDefend = false;
function init() {
nameChoise = Math.floor(Math.random() * enemyName.length)
document.getElementById("enemyName").innerText = enemyName[nameChoise];
document.getElementById("enemyHp").innerText = enemyHp;
document.getElementById("enemyDamage").innerText = enemyDamage;
document.getElementById("heroHp").innerText = heroHp;
}
//FUNKCE
function heal() {
heroHp = parseInt(heroHp) + parseInt(hodkostkou(10));
battlelog("Výlečil ses <br>");
document.getElementById("heroHp").innerText = heroHp;
enemyAttack();
gameover();
}
function attack() {
enemyHp = parseInt(enemyHp) - parseInt(heroDamage);
battlelog("Zautočil jsi<br>");
document.getElementById("enemyHp").innerText = enemyHp;
enemyAttack();
gameover();
}
function defend() {
heroDefend = true;
battlelog("Použil jsi obranu <br>");
gameover();
}
function luck() {
let luck = hodkostkou(10)
if (luck < 5){
heroHp = 0;
} else {
enemyHp = 0;
}
gameover()
}
function enemyAttack() {
if (!heroDefend) {
battlelog("nepřítel zaútočil <br>");
heroHp = parseInt(heroHp) - parseInt(enemyDamage);
document.getElementById("heroHp").innerText = heroHp;
heroDefend = false;
} else {
battlelog("vykryl jsi protiútok <br>");
heroDefend = false;
}
gameover()
}
//Globalní funkce
function hodkostkou(stena) {
//alert(stena);
let x = 1 + Math.floor(Math.random() * stena);
console.log("x:"+x);
return x;
}
function gameover() {
console.log("zjistuji stav -Enemy"+enemyHp + ",hero"+heroHp);
console.log()
if(enemyHp <= 0){
document.getElementById("game").innerHTML = "<h1> Vyhrál jsi </h1>"
} else if (heroHp <= 0) {
document.getElementById("game").innerHTML = "<h1> Prohrál jsi </h1>"
}
}
function battlelog(text2log) {
document.getElementById("battlelog").innerHTML += text2log;
}

40
mapa.html
View File

@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
#mapa{
}
#prvek{
float:left;
}
</style>
</head>
<body>
<div id="mapa">
</div>
<script>
let x = 5;
let y = 4;
for (let sirka = 0; sirka < x; sirka++) {
//const element = array[sirka];
for (let vyska = 0; vyska < y; vyska++) {
//const element = array[vyska];
document.getElementById("mapa").innerHTML += '<div id="prvek">X</div>';
}
document.getElementById("mapa").innerHTML += "<br>";
}
</script>
</body>
</html>

21
pc.html
View File

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Pocitadlo v2</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<button onclick="pridat()">Pridat</button>
<button onclick="odebrat()">Odebrat</button>
<button onclick="vynulovat()">Vynulovat</button>
<hr>
<div id="cislo">5</div>
<script src="pocitadlo.js"></script>
</body>
</html>

36
pocitadlo.html
View File

@ -0,0 +1,36 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Pocitadlo</title>
</head>
<body>
<button onclick="pridat()">Pridat</button>
<br>
<button onclick="odebrat()">odebrat</button>
<br>
<button onclick="vynulovat()">vynulovat</button>
<div id="cislo">0</div>
<script>
function pridat() {
var x = document.getElementById("cislo").innerHTML;
x = parseInt(x)+1;
document.getElementById("cislo").innerHTML = x;
}
function odebrat() {
var x = document.getElementById("cislo").innerHTML;
x = parseInt(x)-1;
document.getElementById("cislo").innerHTML = x;
}
function vynulovat() {
document.getElementById("cislo").innerHTML = 0;
}
</script>
</body>
</html>

30
pocitadlo.js
View File

@ -0,0 +1,30 @@
function vynulovat() {
document.getElementById("cislo").innerText = 0;
}
function pridat() {
let x = document.getElementById("cislo").innerText;
x = parseInt(x)+1;
document.getElementById("cislo").innerText = x;
}
function odebrat() {
var x = document.getElementById("cislo").innerText;
x = parseInt(x)-1;
document.getElementById("cislo").innerHTML = x;
}
function createAlert(textAlertu) {
alert(textAlertu)
}
function hodkostkou(stena) {
//alert(stena);
let x = 1 + Math.floor(Math.random() * stena);
console.log(x);
var y = document.getElementById("vysledek");
if (y != null){
document.getElementById("vysledek").innerText = "Při hodu " + stena + " stěnnou kostkou si hodil " + x;
}
}

76
pribeh.html
View File

@ -0,0 +1,76 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Jednoduchy Pribeh</title>
</head>
<body onload="storybegin()">
<h1>Příběh</h1>
<div id="mainstory" >
</div>
<textarea name="" id="player"></textarea>
<button onclick="storyline()">Potvrdit</button>
<script>
//ZACATEK PRIBEHU
function storybegin() {
storytell(scenar.zacatek.first);
storytell(scenar.zacatek.second);
storytell(scenar.zacatek.third);
}
function storyline() {
var text = document.getElementById("player").value;
//storytell(text);
if (text == "rozhlizet"){
storytell(scenar.mistnost1.rozhlizet);
}
else if (text == "sebrat"){
if (checkinv("klic1")){
storytell(scenar.mistnost1.sebrat2);
}else{
storytell(scenar.mistnost1.sebrat);
playerinv.push("klic1");
}
} else {
storytell("Neznám")
}
}
//Inventar
let playerinv = [];
//SCENAR
var scenar = {
zacatek: {
first: "Začal si žít",
second: "Probudil ses v prázné místnosti",
third: "Co budeš dělat?"
},
mistnost1:{
rozhlizet: "Jsi v bíle místnosti a něco se leskne",
sebrat: "Sebral si klic a objevili se dvere",
sebrat2: "Klič už si sebral"
}
}
//FUNKCE
function storytell(story) {
document.getElementById("mainstory").innerHTML += "<p>"+story+"</p>";
}
function checkinv(item) {
for (let k in playerinv) {
if (playerinv[k] === item) {
return true;
}
return false;
}
}
</script>
</body>
</html>

23
promenne.html
View File

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div id="vysledek"></div>
<script>
const x = 5;
let y = 6;
let z = x + y;
let h = 5;
let h2 = h*2;
console.log(h2);
</script>
</body>
</html>

57
seznamy.html
View File

@ -0,0 +1,57 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Změna všeho</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Změna textu</h1>
<p id="textik">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptas, eligendi itaque. Quasi, ut? Iure quasi laborum minima quam magni nulla autem architecto, esse nisi error corrupti adipisci velit facilis. Hic.</p>
<button onclick="changetext()">ZMĚNIT TEXT</button>
<hr>
<select id="seznamFontu" size="5">
<option>Impact</option>
<option>Comforter</option>
<option>Roboto</option>
<option>Arial</option>
<option>Arial Black</option>
</select>
<select id="Velikost" size="5">
<option>10px</option>
<option>20px</option>
<option>30px</option>
<option>40px</option>
<option>50px</option>
</select>
<select id="Barva" size="5">
<option value="black">Černá</option>
<option value="blue">Modrá</option>
<option value="red">Červená</option>
<option value="green">zelená</option>
</select>
<script>
function changetext() {
let fontlist = document.getElementById("seznamFontu");
let futureFont = fontlist.options[fontlist.selectedIndex].text;
let sizelist = document.getElementById("Velikost");
let futureSize = sizelist.options[sizelist.selectedIndex].text;
let colorlist = document.getElementById("Barva");
let futureColor = colorlist.options[colorlist.selectedIndex].value;
document.getElementById("textik").style.fontFamily = futureFont;
document.getElementById("textik").style.fontSize = futureSize;
document.getElementById("textik").style.color = futureColor;
}
</script>
</body>
</html>

62
seznamy_V2.html
View File

@ -0,0 +1,62 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Změna všeho</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Změna textu</h1>
<p id="textik">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Voluptas, eligendi itaque. Quasi, ut? Iure quasi laborum minima quam magni nulla autem architecto, esse nisi error corrupti adipisci velit facilis. Hic.</p>
<hr>
<select id="seznamFontu" onchange="changetext()">
<option>Impact</option>
<option>Comforter</option>
<option>Roboto</option>
<option>Arial</option>
<option>Arial Black</option>
</select>
<select id="Velikost" onchange="changeSize()">
<option>10px</option>
<option>20px</option>
<option>30px</option>
<option>40px</option>
<option>50px</option>
</select>
<select id="Barva" onchange="changeColor()">
<option value="black">Černá</option>
<option value="blue">Modrá</option>
<option value="red">Červená</option>
<option value="green">Zelená</option>
<option value="purple">Fialová</option>
</select>
<script>
function changetext() {
let fontlist = document.getElementById("seznamFontu");
let futureFont = fontlist.options[fontlist.selectedIndex].text;
document.getElementById("textik").style.fontFamily = futureFont;
}
function changeSize(params) {
let sizelist = document.getElementById("Velikost");
let futureSize = sizelist.options[sizelist.selectedIndex].text;
document.getElementById("textik").style.fontSize = futureSize;
}
function changeColor() {
let colorlist = document.getElementById("Barva");
let futureColor = colorlist.options[colorlist.selectedIndex].value;
document.getElementById("textik").style.color = futureColor;
}
</script>
</body>
</html>

4
style.css
View File

@ -0,0 +1,4 @@
@import url('https://fonts.googleapis.com/css2?family=Comforter&family=Roboto:wght@300&family=Rubik+Beastly&display=swap');
#cislo {
font-size: 100px;
}

35
uvod.html
View File

@ -0,0 +1,35 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Welcome</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quaerat vitae quasi fugit vero saepe sit hic laudantium repellat. Quaerat provident odio aut aspernatur quidem ipsum ducimus, similique ipsam quam est?</p>
<hr>
<div id="first"><b>TENTO TEXT SE BUDE MENIT</b></div>
<button onclick="pozdrav()">Klikni pro pozdrav</button>
<button onclick="rozlouceni()">Klikni pro rozloučení</button>
<button onclick="vycisteni()">Klikni pro vyčištění</button>
<script>
function pozdrav() {
document.getElementById("first").innerText = "<i>AHOJ</i>";
}
function rozlouceni() {
document.getElementById("first").innerHTML = "<b>Nasledanou</b>";
}
function vycisteni() {
document.getElementById("first").innerHTML = "";
alert("Text byl vyčištěn")
}
</script>
</body>
</html>

55
zmenapisma.html
View File

@ -0,0 +1,55 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Změna písmen</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Testovač písmen</h1>
<div id="first">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Sapiente veniam commodi, eius natus adipisci illo ipsa maiores explicabo debitis magnam itaque perspiciatis quae, voluptatum quasi hic delectus dolorem ad optio.</div><br>
<div id="second">Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure fugit nulla ea assumenda voluptates, eaque id laudantium qui voluptatem ducimus perferendis adipisci fugiat aliquam, rem asperiores commodi ratione culpa quo.</div><br>
<div id="third">Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure fugit nulla ea assumenda voluptates, eaque id laudantium qui voluptatem ducimus perferendis adipisci fugiat aliquam, rem asperiores commodi ratione culpa quo.</div><br>
<hr>
<button onclick="buttonNumber(1)">div č.1</button>
<button onclick="buttonNumber(2)">div č.2</button>
<button onclick="buttonNumber(3)">div č.3</button>
<button onclick="buttonNumber(4)">vše</button>
<br>
<select id="fontSeznam" size="5">
<option>Impact</option>
<option>Comforter</option>
<option>Roboto</option>
<option>Arial</option>
<option>Arial Black</option>
</select>
<script>
function buttonNumber(divNum) {
let fontlist = document.getElementById("fontSeznam");
//e.options[e.selectedIndex].text
let futureFont = fontlist.options[fontlist.selectedIndex].text;
//alert(futureFont)
if (divNum == 1){
document.getElementById("first").style.fontFamily = futureFont;
} else if (divNum == 2){
document.getElementById("second").style.fontFamily = futureFont;
} else if (divNum == 3){
document.getElementById("third").style.fontFamily = futureFont;
} else if (divNum == 4){
document.getElementById("first").style.fontFamily = futureFont;
document.getElementById("second").style.fontFamily = futureFont;
document.getElementById("third").style.fontFamily = futureFont;
} else {
alert("Stiskl si špatně");
}
}
</script>
</body>
</html>

42
zvetsovadlo.html
View File

@ -0,0 +1,42 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Pocitadlo</title>
</head>
<body>
<button onclick="pridat()">Pridat</button>
<br>
<button onclick="odebrat()">odebrat</button>
<br>
<button onclick="vynulovat()">vynulovat</button>
<p><div id="cislo">50</div>px</p>
<p id="bigtext" style="font-size: 50px">Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum, veniam est aliquid quia fugit officiis error ratione? Repellat quam magnam maxime, quo dolorem, ab neque illum tempora natus sed blanditiis!</p>
<script>
function pridat() {
var x = document.getElementById("cislo").innerHTML;
x = parseInt(x)+1;
document.getElementById("cislo").innerHTML = x;
document.getElementById("bigtext") = x+"px";
}
function odebrat() {
var x = document.getElementById("cislo").innerHTML;
x = parseInt(x)-1;
document.getElementById("cislo").innerHTML = x;
document.getElementById("bigtext").style.fontSize = x+"px";
}
function vynulovat() {
document.getElementById("cislo").innerHTML = "100px";
document.getElementById("bigtext").style.fontSize ="50px";
}
</script>
</body>
</html>
Write Preview
Loading…
Cancel
Save