github-mirrors/cloud-workshop
1
0
Fork 0
mirror of https://github.com/ysoftdevs/cloud-workshop.git synced 2026-03-26 02:51:23 +01:00
Code Issues Packages Projects Releases Wiki Activity

add exercise 18

Browse Source
This commit is contained in:
Juraj Michálek
2016-12-15 12:27:11 +00:00
parent 2772a8eb4c
commit d04f2ee001
8 changed files with 513 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
exercise-11/index.html Normal file
View File

@@ -0,0 +1,51 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script type="text/javascript">
/* global $ */
var czechWords = [ "dům", "auto", "slovo", "škola", "den", "strom", "sopka"];
var englishWords = [ "house", "car", "word", "school", "day", "tree", "vulcan"];
function buttonClickHandler(event) {
var message;
if (event.target.textContent == "slovo") {
message = "Congratulation! Correct answer.";
$("#statusIcon").addClass("glyphicon-ok").removeClass("glyphicon-remove");
} else {
message = "Incorrect answer. Try again.";
$("#statusIcon").addClass("glyphicon-remove").removeClass("glyphicon-ok");
}
$("#status").text(message);
}
function documentReady() {
$(".btn").click(buttonClickHandler);
}
$( document ).ready(documentReady);
</script>
</head>
<body>
<h1>Word catcher</h1>
<div>word</div>
<div>
<button type="button" class="btn btn-default">dům</button>
<button type="button" class="btn btn-default">auto</button>
<button type="button" class="btn btn-default">slovo</button>
<button type="button" class="btn btn-default">škola</button>
</div>
<div>
<span id="statusIcon" class="glyphicon" ></span>
<span id="status">...select word...</span>
</div>
</body>
</html>

54
exercise-12/index.html Normal file
View File

@@ -0,0 +1,54 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script type="text/javascript">
/* global $ */
var czechWords = [ "dům", "auto", "slovo", "škola", "den", "strom", "sopka"];
var englishWords = [ "house", "car", "word", "school", "day", "tree", "vulcan"];
var primaryWordIndex = 0;
function buttonClickHandler(event) {
var message;
if (event.target.textContent == "slovo") {
message = "Congratulation! Correct answer.";
$("#statusIcon").addClass("glyphicon-ok").removeClass("glyphicon-remove");
} else {
message = "Incorrect answer. Try again.";
$("#statusIcon").addClass("glyphicon-remove").removeClass("glyphicon-ok");
}
$("#status").text(message);
}
function documentReady() {
$(".btn").click(buttonClickHandler);
primaryWordIndex = Math.floor(Math.random() * englishWords.length);
$("#primaryWord").text(englishWords[primaryWordIndex]);
}
$( document ).ready(documentReady);
</script>
</head>
<body>
<h1>Word catcher</h1>
<div id="primaryWord">word</div>
<div>
<button type="button" class="btn btn-default">dům</button>
<button type="button" class="btn btn-default">auto</button>
<button type="button" class="btn btn-default">slovo</button>
<button type="button" class="btn btn-default">škola</button>
</div>
<div>
<span id="statusIcon" class="glyphicon" ></span>
<span id="status">...select word...</span>
</div>
</body>
</html>

56
exercise-13/index.html Normal file
View File

@@ -0,0 +1,56 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script type="text/javascript">
/* global $ */
var czechWords = [ "dům", "auto", "slovo", "škola", "den", "strom", "sopka"];
var englishWords = [ "house", "car", "word", "school", "day", "tree", "vulcan"];
var primaryWordIndex = 0;
var secondaryWord = "";
function buttonClickHandler(event) {
var message;
if (event.target.textContent == secondaryWord) {
message = "Congratulation! Correct answer.";
$("#statusIcon").addClass("glyphicon-ok").removeClass("glyphicon-remove");
} else {
message = "Incorrect answer. Try again.";
$("#statusIcon").addClass("glyphicon-remove").removeClass("glyphicon-ok");
}
$("#status").text(message);
}
function documentReady() {
$(".btn").click(buttonClickHandler);
primaryWordIndex = Math.floor(Math.random() * englishWords.length);
$("#primaryWord").text(englishWords[primaryWordIndex]);
secondaryWord = czechWords[primaryWordIndex];
}
$( document ).ready(documentReady);
</script>
</head>
<body>
<h1>Word catcher</h1>
<div id="primaryWord">word</div>
<div>
<button type="button" class="btn btn-default">dům</button>
<button type="button" class="btn btn-default">auto</button>
<button type="button" class="btn btn-default">slovo</button>
<button type="button" class="btn btn-default">škola</button>
</div>
<div>
<span id="statusIcon" class="glyphicon" ></span>
<span id="status">...select word...</span>
</div>
</body>
</html>

69
exercise-14/index.html Normal file
View File

@@ -0,0 +1,69 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script type="text/javascript">
/* global $ */
var czechWords = [ "dům", "auto", "slovo", "škola", "den", "strom", "sopka"];
var englishWords = [ "house", "car", "word", "school", "day", "tree", "vulcan"];
var primaryWordIndex = 0;
var secondaryWord = "";
function buttonClickHandler(event) {
var message;
if (event.target.textContent == secondaryWord) {
message = "Congratulation! Correct answer.";
$("#statusIcon").addClass("glyphicon-ok").removeClass("glyphicon-remove");
} else {
message = "Incorrect answer. Try again.";
$("#statusIcon").addClass("glyphicon-remove").removeClass("glyphicon-ok");
}
$("#status").text(message);
}
function generateWord() {
primaryWordIndex = Math.floor(Math.random() * englishWords.length);
$("#primaryWord").text(englishWords[primaryWordIndex]);
secondaryWord = czechWords[primaryWordIndex];
var wordIndex;
var index;
for (index = 0; index < 4; index++) {
wordIndex = Math.floor(Math.random() * englishWords.length);
$("#button" + index).text(czechWords[wordIndex]);
}
index = Math.floor(Math.random() * 4);
$("#button" + index).text(secondaryWord);
}
function documentReady() {
$(".btn").click(buttonClickHandler);
generateWord();
}
$( document ).ready(documentReady);
</script>
</head>
<body>
<h1>Word catcher</h1>
<div id="primaryWord">word</div>
<div>
<button id="button0" type="button" class="btn btn-default">dům</button>
<button id="button1" type="button" class="btn btn-default">auto</button>
<button id="button2" type="button" class="btn btn-default">slovo</button>
<button id="button3" type="button" class="btn btn-default">škola</button>
</div>
<div>
<span id="statusIcon" class="glyphicon" ></span>
<span id="status">...select word...</span>
</div>
</body>
</html>

70
exercise-15/index.html Normal file
View File

@@ -0,0 +1,70 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script type="text/javascript">
/* global $ */
var czechWords = [ "dům", "auto", "slovo", "škola", "den", "strom", "sopka"];
var englishWords = [ "house", "car", "word", "school", "day", "tree", "vulcan"];
var primaryWordIndex = 0;
var secondaryWord = "";
function buttonClickHandler(event) {
var message;
if (event.target.textContent == secondaryWord) {
message = "Congratulation! Correct answer.";
$("#statusIcon").addClass("glyphicon-ok").removeClass("glyphicon-remove");
generateWord();
} else {
message = "Incorrect answer. Try again.";
$("#statusIcon").addClass("glyphicon-remove").removeClass("glyphicon-ok");
}
$("#status").text(message);
}
function generateWord() {
primaryWordIndex = Math.floor(Math.random() * englishWords.length);
$("#primaryWord").text(englishWords[primaryWordIndex]);
secondaryWord = czechWords[primaryWordIndex];
var wordIndex;
var index;
for (index = 0; index < 4; index++) {
wordIndex = Math.floor(Math.random() * englishWords.length);
$("#button" + index).text(czechWords[wordIndex]);
}
index = Math.floor(Math.random() * 4);
$("#button" + index).text(secondaryWord);
}
function documentReady() {
$(".btn").click(buttonClickHandler);
generateWord();
}
$( document ).ready(documentReady);
</script>
</head>
<body>
<h1>Word catcher</h1>
<div id="primaryWord">word</div>
<div>
<button id="button0" type="button" class="btn btn-default">dům</button>
<button id="button1" type="button" class="btn btn-default">auto</button>
<button id="button2" type="button" class="btn btn-default">slovo</button>
<button id="button3" type="button" class="btn btn-default">škola</button>
</div>
<div>
<span id="statusIcon" class="glyphicon" ></span>
<span id="status">...select word...</span>
</div>
</body>
</html>

70
exercise-16/index.html Normal file
View File

@@ -0,0 +1,70 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script type="text/javascript">
/* global $ */
var czechWords = [ "dům", "auto", "slovo", "škola", "den", "strom", "sopka"];
var englishWords = [ "house", "car", "word", "school", "day", "tree", "vulcan"];
var primaryWordIndex = 0;
var secondaryWord = "";
function buttonClickHandler(event) {
var message;
if (event.target.textContent == secondaryWord) {
message = "Congratulation! Correct answer.";
$("#statusIcon").addClass("glyphicon-ok").removeClass("glyphicon-remove");
setTimeout(generateWord, 3000);
} else {
message = "Incorrect answer. Try again.";
$("#statusIcon").addClass("glyphicon-remove").removeClass("glyphicon-ok");
}
$("#status").text(message);
}
function generateWord() {
primaryWordIndex = Math.floor(Math.random() * englishWords.length);
$("#primaryWord").text(englishWords[primaryWordIndex]);
secondaryWord = czechWords[primaryWordIndex];
var wordIndex;
var index;
for (index = 0; index < 4; index++) {
wordIndex = Math.floor(Math.random() * englishWords.length);
$("#button" + index).text(czechWords[wordIndex]);
}
index = Math.floor(Math.random() * 4);
$("#button" + index).text(secondaryWord);
}
function documentReady() {
$(".btn").click(buttonClickHandler);
generateWord();
}
$( document ).ready(documentReady);
</script>
</head>
<body>
<h1>Word catcher</h1>
<div id="primaryWord">word</div>
<div>
<button id="button0" type="button" class="btn btn-default">dům</button>
<button id="button1" type="button" class="btn btn-default">auto</button>
<button id="button2" type="button" class="btn btn-default">slovo</button>
<button id="button3" type="button" class="btn btn-default">škola</button>
</div>
<div>
<span id="statusIcon" class="glyphicon" ></span>
<span id="status">...select word...</span>
</div>
</body>
</html>

71
exercise-17/index.html Normal file
View File

@@ -0,0 +1,71 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script type="text/javascript">
/* global $ */
var czechWords = [ "dům", "auto", "slovo", "škola", "den", "strom", "sopka"];
var englishWords = [ "house", "car", "word", "school", "day", "tree", "vulcan"];
var primaryWordIndex = 0;
var secondaryWord = "";
function buttonClickHandler(event) {
var message;
if (event.target.textContent == secondaryWord) {
message = "Congratulation! Correct answer.";
$("#statusIcon").addClass("glyphicon-ok").removeClass("glyphicon-remove");
$("#status").fadeOut(3000);
setTimeout(generateWord, 3000);
} else {
message = "Incorrect answer. Try again.";
$("#statusIcon").addClass("glyphicon-remove").removeClass("glyphicon-ok");
}
$("#status").text(message);
}
function generateWord() {
primaryWordIndex = Math.floor(Math.random() * englishWords.length);
$("#primaryWord").text(englishWords[primaryWordIndex]);
secondaryWord = czechWords[primaryWordIndex];
var wordIndex;
var index;
for (index = 0; index < 4; index++) {
wordIndex = Math.floor(Math.random() * englishWords.length);
$("#button" + index).text(czechWords[wordIndex]);
}
index = Math.floor(Math.random() * 4);
$("#button" + index).text(secondaryWord);
}
function documentReady() {
$(".btn").click(buttonClickHandler);
generateWord();
}
$( document ).ready(documentReady);
</script>
</head>
<body>
<h1>Word catcher</h1>
<div id="primaryWord">word</div>
<div>
<button id="button0" type="button" class="btn btn-default">dům</button>
<button id="button1" type="button" class="btn btn-default">auto</button>
<button id="button2" type="button" class="btn btn-default">slovo</button>
<button id="button3" type="button" class="btn btn-default">škola</button>
</div>
<div>
<span id="statusIcon" class="glyphicon" ></span>
<span id="status">...select word...</span>
</div>
</body>
</html>

72
exercise-18/index.html Normal file
View File

@@ -0,0 +1,72 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script type="text/javascript">
/* global $ */
var czechWords = [ "dům", "auto", "slovo", "škola", "den", "strom", "sopka"];
var englishWords = [ "house", "car", "word", "school", "day", "tree", "vulcan"];
var primaryWordIndex = 0;
var secondaryWord = "";
function buttonClickHandler(event) {
var message;
$("#status").show();
if (event.target.textContent == secondaryWord) {
message = "Congratulation! Correct answer.";
$("#statusIcon").addClass("glyphicon-ok").removeClass("glyphicon-remove");
$("#status").fadeOut(3000);
setTimeout(generateWord, 3000);
} else {
message = "Incorrect answer. Try again.";
$("#statusIcon").addClass("glyphicon-remove").removeClass("glyphicon-ok");
}
$("#status").text(message);
}
function generateWord() {
primaryWordIndex = Math.floor(Math.random() * englishWords.length);
$("#primaryWord").text(englishWords[primaryWordIndex]);
secondaryWord = czechWords[primaryWordIndex];
var wordIndex;
var index;
for (index = 0; index < 4; index++) {
wordIndex = Math.floor(Math.random() * englishWords.length);
$("#button" + index).text(czechWords[wordIndex]);
}
index = Math.floor(Math.random() * 4);
$("#button" + index).text(secondaryWord);
}
function documentReady() {
$(".btn").click(buttonClickHandler);
generateWord();
}
$( document ).ready(documentReady);
</script>
</head>
<body>
<h1>Word catcher</h1>
<div id="primaryWord">word</div>
<div>
<button id="button0" type="button" class="btn btn-default">dům</button>
<button id="button1" type="button" class="btn btn-default">auto</button>
<button id="button2" type="button" class="btn btn-default">slovo</button>
<button id="button3" type="button" class="btn btn-default">škola</button>
</div>
<div>
<span id="statusIcon" class="glyphicon" ></span>
<span id="status">...select word...</span>
</div>
</body>
</html>