rcconsult/index.html

## index.html
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>A Pen by Radovan Chytracek</title>


    <link rel="stylesheet" href="css/style.css">


</head>

<body>

    <!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>STEP HANGMAN</title>
    </head>

    <body onload="init_hangman()">
        <div id="logoasciiart">
            <img height="100px" src='https://s3-us-west-2.amazonaws.com/s.cdpn.io/198246/hangman.png' alt=''>
        </div>
        <div id="clicked_letters">
            <!-- The Text will be entered by clicking buttons -->
        </div>
        <form id="hangman-input" onsubmit="validate(this); return false">
            <div id="alphabet">
                <!-- <button onclick="checkLetter()">Click me</button> -->
            </div>
        </form>
    </body>

    </html>


    <script src="js/index.js"></script>


</body>

</html>

## rpgamx.markdown

      
    Raw
  

              rpgamx.markdown
            
          
    rPGaMx

A Pen by Radovan Chytracek on CodePen.
License.

  
## script.js
var clickedData = "";
var clickedButton = "";
var clicked_letters = "";

function validate(form) {
    var clicked = document.getElementById("clicked_letters");
    clicked_letters = clicked_letters + " " + clickedData;
    clicked.innerText = clicked_letters;
    console.log("Update: " + clicked_letters);
    return true;
}

function clickedme(button) {
    clickedData = button.value;
    clickedButton = button.id;
    console.log("Clicked: " + String(button.id) + " data: " + String(clickedData));
    return true;
}

function init_hangman() {
    var buttonsList = document.getElementById("alphabet");

    var abcd = "abcdefghijklmnopqrstuvwxyz";
    var i = 0;
    var newletc = "";
    while (i < abcd.length) {
        newlet = "<button value=\"" + String(abcd.charAt(i));
        newlet = newlet + "\" type=\"text\" onclick=\"clickedme(this)\">";
        newlet = newlet + String(abcd.charAt(i));
        newlet = newlet + "</button>";
        ///
        i = i + 1;
        // console.log(newlet);
        newletc += newlet;
    }
    // console.log(newletc);
    buttonsList.innerHTML = newletc;

    console.log("STEP HANGMAN STARTED");
}

## style.css
body {
    background: black;
}

#logoasciiart {
    font: 4px/2px monospace;
    padding: 5px;
    border: 2px solid orangered;
    width: 90%;
    text-align: center;
}

#clicked_letters {
    background: orangered;
    border: 2px solid orange;
    width: 90%;
    height: 1em;
    padding: 5px;
    text-align: center;
    color: black;
}

#alphabet {
    background: orangered;
    border: 2px solid orange;
    width: 90%;
    padding: 5px;
    text-align: center;
}
	<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset="UTF-8">
	<title>A Pen by Radovan Chytracek</title>



	<link rel="stylesheet" href="css/style.css">


	</head>

	<body>

	<!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>STEP HANGMAN</title>
	</head>

	<body onload="init_hangman()">
	<div id="logoasciiart">
	<img height="100px" src='https://s3-us-west-2.amazonaws.com/s.cdpn.io/198246/hangman.png' alt=''>
	</div>
	<div id="clicked_letters">
	<!-- The Text will be entered by clicking buttons -->
	</div>
	<form id="hangman-input" onsubmit="validate(this); return false">
	<div id="alphabet">
	<!-- <button onclick="checkLetter()">Click me</button> -->
	</div>
	</form>
	</body>

	</html>



	<script src="js/index.js"></script>




	</body>

	</html>
	var clickedData = "";
	var clickedButton = "";
	var clicked_letters = "";

	function validate(form) {
	var clicked = document.getElementById("clicked_letters");
	clicked_letters = clicked_letters + " " + clickedData;
	clicked.innerText = clicked_letters;
	console.log("Update: " + clicked_letters);
	return true;
	}

	function clickedme(button) {
	clickedData = button.value;
	clickedButton = button.id;
	console.log("Clicked: " + String(button.id) + " data: " + String(clickedData));
	return true;
	}

	function init_hangman() {
	var buttonsList = document.getElementById("alphabet");

	var abcd = "abcdefghijklmnopqrstuvwxyz";
	var i = 0;
	var newletc = "";
	while (i < abcd.length) {
	newlet = "<button value=\"" + String(abcd.charAt(i));
	newlet = newlet + "\" type=\"text\" onclick=\"clickedme(this)\">";
	newlet = newlet + String(abcd.charAt(i));
	newlet = newlet + "</button>";
	///
	i = i + 1;
	// console.log(newlet);
	newletc += newlet;
	}
	// console.log(newletc);
	buttonsList.innerHTML = newletc;

	console.log("STEP HANGMAN STARTED");
	}
	body {
	background: black;
	}

	#logoasciiart {
	font: 4px/2px monospace;
	padding: 5px;
	border: 2px solid orangered;
	width: 90%;
	text-align: center;
	}

	#clicked_letters {
	background: orangered;
	border: 2px solid orange;
	width: 90%;
	height: 1em;
	padding: 5px;
	text-align: center;
	color: black;
	}

	#alphabet {
	background: orangered;
	border: 2px solid orange;
	width: 90%;
	padding: 5px;
	text-align: center;
	}