Anonymous Anonymous - 1 month ago
126 0

No description

HTML

Project

<html>

<head>

<script>

var wolfSide = document.getElementById("frm1").elements[1].value;
var farmerSide = document.getElementById("frm1").elements[0].value;
var goatSide = document.getElementById("frm1").elements[2].value;
var cabbageSide = document.getElementById("frm1").elements[3].value;


var danger = false;
function sideChange(){
var x =  document.getElementById("frm1");
for (i=0; i < x.length; i++){
	if(x.elements[i].value == 0){
		dangerCheck();
		if(i=0)
		{
			document.getElementById("farmerL").style.display="none";
			document.getElementById("farmerR").style.display="block";
		}
		else if(i=1)
		{
			document.getElementById("wolfL").style.display="none";
			document.getElementById("wolfR").style.display="block";
		}
		else if(i=2)
		{
			document.getElementById("goatL").style.display="none";
			document.getElementById("goatR").style.display="block";
		}
		else
		{
			document.getElementById("cabbageL").style.display="none";
			document.getElementById("cabbageR").style.display="block";
		}
		x.elements[i].value = 1;
	}
	else
	{
		dangerCheck();
		if(i=0)
		{
			document.getElementById("farmerL").style.display="block";
			document.getElementById("farmerR").style.display="none";
		}
		else if(i=1)
		{
			document.getElementById("wolfL").style.display="block";
			document.getElementById("wolfR").style.display="none";
		}
		else if(i=2)
		{
			document.getElementById("goatR").style.display="none";
			document.getElementById("goatL").style.display="block";
		}
		else
		{
			document.getElementById("cabbageR").style.display="none";
			document.getElementById("cabbageL").style.display="block";
		}
		x.elements[i].value = 0;
	}
}
}
function dangerCheck(){
if(wolfSide === goatSide && farmerSide !== wolfSide)
{
	danger = true;
}
else if(goatSide === cabbageSide && farmerSide !== goatSide)
{
	danger = true;
}
else
{
	danger = false;
}
if (danger == true)
{
	window.alert(DANGER! Can't do this move.);
}
}

</script>



 
</head>
<title> The River Problem </title>
<body>
<center><h2>The Farmer, Wolf, Goat and Cabbage</h2></center>
<p> To solve this problem, you must safely navigate the farmer,
 the wolf, the goat and the cabbage across the river. The farmer has
 a leaky boat, so he can only take one thing at a time. The goat cannot be 
 left alone with the wolf or the cabbage. The wolf will eat the goat, and the goat will eat the cabbage.

 

<form id="frm1">
<table>
	<tr>
		<td>
			<input type="checkbox" name="farmer" value="0">Farmer</input>
			<br>
			<input type="checkbox" name="wolf" value="0">Wolf</input>
			<br>
			<input type="checkbox" name="goat" value="0">Goat</input>
			<br>
			<input type="checkbox" name="cabbage" value="0">Cabbage</input>
		</td>
		<td>
			<table>
				<tr>
					<td><img id="farmerL" src="http://i.imgur.com/xF0pXTx.jpg" height="64" width="64"></td>
					<td rowspan="4"><img id="river" src="http://i.imgur.com/ipfqWX3.jpg" height="406" width="300" ></td>
					<td> <img id="farmerR" src="http://i.imgur.com/xF0pXTx.jpg" height="64" width="64" style="display:none"> </td>
				</tr>
				<tr>
					<td><img id="wolfL" src="http://i.imgur.com/1dhI9t9.png" height="64" width="64" ></td>
					<td></td>
					<td><img id="wolfR" src="http://i.imgur.com/1dhI9t9.png" height="64" width="64" style="display:none"></td>
				</tr>
				<tr>
					<td><img id="goatL" src="http://i.imgur.com/WOyPqNz.png" height="64" width="64" ></td>
					<td></td>
					<td><img id="goatR" src="http://i.imgur.com/WOyPqNz.png" height="64" width="64" style="display:none"></td>
				</tr>
				<tr>
					<td><img id="cabbageL" src="http://i.imgur.com/XuusT8j.jpg" height="64" width="64" ></td>
					<td></td>
					<td><img id="cabbageR" src="http://i.imgur.com/XuusT8j.jpg" height="64" width="64" style="display:none"></td>
				</tr>
			</table>
		</td>
	</tr>
	<tr>
		<td><button onClick="sideChange()">Move</button></td>
	</tr>
</table>
</form>
<hr>
Coded by Hunter Gamble
</body>
</html>