<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>testhtml</title>
</head>
<body>
<script type="text/javascript">
var Words =
[
"cute","pretty","handsome","ugly","fat","short","sweet","sexy","beautiful","lovely","lovable",
];
var score, fails, createdKeyword, displayedKeyword;
score = 0;
function Hangman()
{
fails = 0;
var num = Math.floor(Math.random() * keywords.length);
selectedKeyword = keywords[num];
selectedKeyword = selectedKeyword.toUpperCase();
displayedKeyword = "";
for( i = 0; i < selectedKeyword.length; i++)
{
if (selectedKeyword.charAt(i) == " " || selectedKeyword.charAt(i) == "-")
{
displayedKeyword += " ";
}
else
{
displayedKeyword += "_";
}
}
document.getElementById("hangman").value = displayedKeyword;
document.getElementById("msg").value = "A word had been select, click button below to play game.";
document.getElementById("score").value = score;
document.getElementById("fails").value = fails;
}
function find(x)
{
var found = false;
for( i = 0; i < selectedKeyword.length; i++)
{
if (selectedKeyword.charAt(i) == x)
{
displayedKeyword = displayedKeyword.substr(0,i) + x + displayedKeyword.substr(i+1)
found = true;
}
}
if (found)
{
if (displayedKeyword == selectedKeyword)
{
alert("Well Done")
score++;
}
}
else
{
fails++;
if (fails == 6)
{
alert("You lose")
fails = 0;
var num = Math.floor(Math.random() * keywords.length);
selectedKeyword = keywords[num];
selectedKeyword = selectedKeyword.toUpperCase();
displayedKeyword = "";
for( i = 0; i < selectedKeyword.length; i++)
{
if (selectedKeyword.charAt(i) == " " || selectedKeyword.charAt(i) == "-")
{
displayedKeyword += " ";
}
else
{
displayedKeyword += "_";
}
}
}
}
document.getElementById("hangman").value = displayedKeyword;
document.getElementById("score").value = score;
document.getElementById("fails").value = fails;
}
function setCharAt(str,index,chr)
{
if (index > str.length-1) return str;
return str.substr(0, index) + chr + str.substr(index+1);
}
</script>
</head>
<body>
<table width="45%" border="1" bgcolor = "#808080" align="center">
<tr>
<td colspan="4" align="right" width="28%" height="63">
Score: <input type="text" value="" size="4" readonly>
<br/>
<br/>
Fails(6): <input type="text" value="" size="4" readonly>
</td>
<td colspan="7" align="center" width="51%">
<input type="text" id="hangman" size="30" value=" --- Hangman --- " disabled>
<br/>
<br/>
<input type="text" id="getword" size="30" value=" Click Start to get a word. " disabled>
</td>
<td colspan="2" align="center" width="13%"><button id ="reset">Start</button></td>
</tr>
</table>
<table width="45%" border="1" bgcolor = "#808080" align="center">
<tr>
<td align="center" width="7.69%">
<input type="button" value="A" onClick="observe('A')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="B" onClick="observe('B')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="C" onClick="observe('C')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="D" onClick="observe('D')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="E" onClick="observe('E')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="F" onClick="observe('F')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="G" onClick="observe('G')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="H" onClick="observe('H')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="I" onClick="observe('I')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="J" onClick="observe('J')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="K" onClick="observe('K')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="L" onClick="observe('L')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="M" onClick="observe('M')" />
</td>
</tr>
<tr>
<td align="center" width="7.69%">
<input type="button" value="N" onClick="observe('N')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="O" onClick="observe('O')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="P" onClick="observe('P')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="Q" onClick="observe('Q')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="R" onClick="observe('R')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="S" onClick="observe('S')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="T" onClick="observe('T')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="U" onClick="observe('U')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="V" onClick="observe('V')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="W" onClick="observe('W')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="X" onClick="observe('X')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="Y" onClick="observe('Y')" />
</td>
<td align="center" width="7.69%">
<input type="button" value="Z" onClick="observe('Z')" />
</td>
</tr>
</table>
</body>
</html>