cmoscardi/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
  <title>Hangman Starter</title>
</head>
<body>
  <div id="container">
    <p id="message"></p>
    <img id="hangman" src="https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-0.png?raw=true"/>
    <div id="word"></div>
    <button id="newgame">New Game</button>
  </div>
</body>
</html>

## popcode.json
{"enabledLibraries":["jquery"],"hiddenUIComponents":["editor.html","editor.css"]}

## script.js


var secretWord = null;
var correctGuesses = [];
var wrongGuesses = [];

var images = [
    "https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-0.png?raw=true",
    "https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-1.png?raw=true",
    "https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-2.png?raw=true",
    "https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-3.png?raw=true",
    "https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-4.png?raw=true",
    "https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-5.png?raw=true",
    "https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-6.png?raw=true",
];


function prepareGame() {
  secretWord = ['J','A','V','A','S','C','R', 'I', 'P', 'T'];

  secretWord = secretWord.map(function(x){return x.toUpperCase();});
  drawWord();
  drawHangman();


}

// in this onWin() function below
// 1. alert "You won!"
function onWin() {

}

// in this onLose() function below
// 1. alert "You lost!"
function onLose() {

}


function checkIfWon() {
    var hasAll = true;
    for(var i=0; i<secretWord.length; i++){
        if(!correctGuesses.includes(secretWord[i])){
            hasAll = false;
        }
    }
    return hasAll;

}

// in this checkIfLost() function below
// 1. declare a variable misses and set it equal to the length of wrongGuesses array
// 2. if misses is less than 6 return false else return true
function checkIfLost() {
  var misses = wrongGuesses.length;
  if(misses < 6){
      return false;
  }
  else {
      return true;
  }
}


function onCorrectGuess(letter) {
    correctGuesses.push(letter);
    drawWord();
    if(checkIfWon()){
        onWin();
    }

}


function onWrongGuess(letter) {
    wrongGuesses.push(letter);
    drawHangman();
    if(checkIfLost()){
        onLose();
    }
}

// in the judgeGuess function below
// 1. if the letter is included in secretWord, call the onCorrectGuess(letter) function
//    otherwise call onWrongGuess(letter) function
function judgeGuess(letter) {

}


function drawWord() {
  $("#word").empty();
  for(var i=0; i<secretWord.length; i++){
      if(correctGuesses.includes(secretWord[i])){
          $("#word").append(secretWord[i]);
      }
      else{
          $("#word").append("_");
      }
  }


}

function drawHangman() {
  var misses = wrongGuesses.length;
  $("#hangman").attr('src', images[misses]);

}

// in the onKeyDown function below
// 1. define a variable letter an set it equal to the correct letter
// 2. set letter equal to the upperCase of itself
// 3. call the judgeGuess function with letter as an argument

function onKeyDown(event) {

}

// Call the prepare game function
// Initialize a jQuery keydown event handler
//       (Keydown function should take onKeyDown function as an argument)
$(document).ready(function() {
  prepareGame();
});

## styles.css
body {
  font-family: Arial, Helvetica, sans-serif;
}

#container {
  width:40em;
  margin:auto;
  text-align:center;
}

#word {
  font-size:5em;
  letter-spacing:0.25em;
}

#message {
  font-size:1.5em;
  background-color:grey;
  border-radius:2em;
  padding:1em;
  display:none;
}

#newgame {
  display:none;
  font-size:1.5em;
  padding:0.5em;
  margin:1em;
}
	<!DOCTYPE html>
	<html>
	<head>
	<title>Hangman Starter</title>
	</head>
	<body>
	<div id="container">
	<p id="message"></p>
	<img id="hangman" src="https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-0.png?raw=true"/>
	<div id="word"></div>
	<button id="newgame">New Game</button>
	</div>
	</body>
	</html>


	var secretWord = null;
	var correctGuesses = [];
	var wrongGuesses = [];

	var images = [
	"https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-0.png?raw=true",
	"https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-1.png?raw=true",
	"https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-2.png?raw=true",
	"https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-3.png?raw=true",
	"https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-4.png?raw=true",
	"https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-5.png?raw=true",
	"https://github.com/ScriptEdcurriculum/unit13HangmanStarterCode/blob/master/images/Hangman-6.png?raw=true",
	];





	function prepareGame() {
	secretWord = ['J','A','V','A','S','C','R', 'I', 'P', 'T'];

	secretWord = secretWord.map(function(x){return x.toUpperCase();});
	drawWord();
	drawHangman();


	}

	// in this onWin() function below
	// 1. alert "You won!"
	function onWin() {

	}

	// in this onLose() function below
	// 1. alert "You lost!"
	function onLose() {

	}


	function checkIfWon() {
	var hasAll = true;
	for(var i=0; i<secretWord.length; i++){
	if(!correctGuesses.includes(secretWord[i])){
	hasAll = false;
	}
	}
	return hasAll;

	}

	// in this checkIfLost() function below
	// 1. declare a variable misses and set it equal to the length of wrongGuesses array
	// 2. if misses is less than 6 return false else return true
	function checkIfLost() {
	var misses = wrongGuesses.length;
	if(misses < 6){
	return false;
	}
	else {
	return true;
	}
	}


	function onCorrectGuess(letter) {
	correctGuesses.push(letter);
	drawWord();
	if(checkIfWon()){
	onWin();
	}

	}


	function onWrongGuess(letter) {
	wrongGuesses.push(letter);
	drawHangman();
	if(checkIfLost()){
	onLose();
	}
	}

	// in the judgeGuess function below
	// 1. if the letter is included in secretWord, call the onCorrectGuess(letter) function
	// otherwise call onWrongGuess(letter) function
	function judgeGuess(letter) {

	}


	function drawWord() {
	$("#word").empty();
	for(var i=0; i<secretWord.length; i++){
	if(correctGuesses.includes(secretWord[i])){
	$("#word").append(secretWord[i]);
	}
	else{
	$("#word").append("_");
	}
	}


	}

	function drawHangman() {
	var misses = wrongGuesses.length;
	$("#hangman").attr('src', images[misses]);

	}

	// in the onKeyDown function below
	// 1. define a variable letter an set it equal to the correct letter
	// 2. set letter equal to the upperCase of itself
	// 3. call the judgeGuess function with letter as an argument

	function onKeyDown(event) {

	}

	// Call the prepare game function
	// Initialize a jQuery keydown event handler
	// (Keydown function should take onKeyDown function as an argument)
	$(document).ready(function() {
	prepareGame();
	});
	body {
	font-family: Arial, Helvetica, sans-serif;
	}

	#container {
	width:40em;
	margin:auto;
	text-align:center;
	}

	#word {
	font-size:5em;
	letter-spacing:0.25em;
	}

	#message {
	font-size:1.5em;
	background-color:grey;
	border-radius:2em;
	padding:1em;
	display:none;
	}

	#newgame {
	display:none;
	font-size:1.5em;
	padding:0.5em;
	margin:1em;
	}