IoT Controlled Snow Machine

<!-- Website to control IoT Snow Machine.
MKR1000 looks at switchState.txt if 0 off, if anything else on 
Opening on.php writes 1 to switchState.txt
Opening off.php writes 0 to switchState.txt -->


<?php 
//Include index file so basic styling is consitant 
include 'index.php';

//Var to open file
$myfile = fopen("switchState.txt", "w") or die("Unable to open file!");

//Text to be written to file. 0 means off. anything else means on
$txt = "1";

//Write to file (file thats been opened, data written to file)
fwrite($myfile, $txt);

//Close file
fclose($myfile);
?>

<footer style="margin-top: 300px">
<div class="container-fluid text-center ">
	<h2>It's snowing!</h2>
</div>
</footer>

</body>
</html> 

<style type="text/css">
/*When the arduino is turned on, the web page will start snowing*/
/*Cheers pal for the snow http://codepen.io/NickyCDK/pen/AIonk*/
#snow{
	background: none;
	background-image: url('https://www.wearewebstars.dk/codepen/img/s1.png'), url('https://www.wearewebstars.dk/codepen/img//s2.png'), url('https://www.wearewebstars.dk/codepen/img//s3.png');
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index:1;
	-webkit-animation: snow 10s linear infinite;
	-moz-animation: snow 10s linear infinite;
	-ms-animation: snow 10s linear infinite;
	animation: snow 10s linear infinite;
}
@keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
@-moz-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 400px 1000px, 200px 400px, 100px 300px;}
}
@-webkit-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}
@-ms-keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}	

	
</style>

<!-- Website to control IoT Snow Machine.
MKR1000 looks at switchState.txt if 0 off, if anything else on 
Opening on.php writes 1 to switchState.txt
Opening off.php writes 0 to switchState.txt -->

<?php 
//Include index file so basic styling is consitant 
include 'index.php';

//Var to open file
$myfile = fopen("switchState.txt", "w") or die("Unable to open file!");

//Text to be written to file. 0 means off. anything else means on
$txt = "0";

//Write to file (file thats been opened, data written to file)
fwrite($myfile, $txt);

//Close file
fclose($myfile);
?>

<footer style="margin-top: 300px">
<div class="container-fluid text-center ">
	<h2>It's not snowing</h2>
</div>
</footer>

</body>
</html>