|
|
@ -4,13 +4,14 @@
|
|
|
|
<meta charset="utf-8" />
|
|
|
|
<meta charset="utf-8" />
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
|
|
|
|
<title>canteen</title>
|
|
|
|
<title>canteen</title>
|
|
|
|
<link rel="icon" href="imgs/park/flower2.gif">
|
|
|
|
<link rel="icon" href="imgs/canteen/kitchen1.gif">
|
|
|
|
<link rel="stylesheet" href="canteen.css">
|
|
|
|
<link rel="stylesheet" href="canteen.css">
|
|
|
|
|
|
|
|
|
|
|
|
</head>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<body >
|
|
|
|
|
|
|
|
<div id="ground"class="invert"></div>
|
|
|
|
|
|
|
|
|
|
|
|
<svg >
|
|
|
|
<svg class="invert">
|
|
|
|
<line x1="10" y1="130" x2="80%" y2="130" style="stroke:black;stroke-width:1" />
|
|
|
|
<line x1="10" y1="130" x2="80%" y2="130" style="stroke:black;stroke-width:1" />
|
|
|
|
<line x1="80%" y1="0" x2="80%" y2="130" style="stroke:black;stroke: width 1px;"/>
|
|
|
|
<line x1="80%" y1="0" x2="80%" y2="130" style="stroke:black;stroke: width 1px;"/>
|
|
|
|
<line x1="80%" y1="130" x2="150%" y2="100%" style="stroke:black;stroke: width 1px;"/>
|
|
|
|
<line x1="80%" y1="130" x2="150%" y2="100%" style="stroke:black;stroke: width 1px;"/>
|
|
|
@ -19,28 +20,33 @@
|
|
|
|
<!--characters-->
|
|
|
|
<!--characters-->
|
|
|
|
|
|
|
|
|
|
|
|
<div id="player_img"></div>
|
|
|
|
<div id="player_img"></div>
|
|
|
|
|
|
|
|
<img id="pill" src="imgs/canteen/pill.png" height="30px" style="display: none;">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<img id="ned" src="imgs/canteen/ned1.gif" height="120px">
|
|
|
|
<img id="ned" src="imgs/canteen/ned1.gif" height="120px">
|
|
|
|
|
|
|
|
|
|
|
|
<img id="table" src="imgs/canteen/table1.gif" height="110px">
|
|
|
|
<img id="table" src="imgs/canteen/table1.gif" height="110px">
|
|
|
|
|
|
|
|
<img id="column" src="imgs/canteen/fire_5.gif" height="130px" style="display: none;">
|
|
|
|
|
|
|
|
|
|
|
|
<div class="figure1">
|
|
|
|
<div class="figure1">
|
|
|
|
<img id="cooking1" src="imgs/canteen/woman_cooking_1.gif" height="110px">
|
|
|
|
<img id="cooking1" class="cooking" src="imgs/canteen/woman_cooking_1.gif" height="110px">
|
|
|
|
<img id="satan1" src="imgs/canteen/woman_rites_1.gif" height="110px" style="display: none;">
|
|
|
|
<img id="satan1" class="satan" src="imgs/canteen/woman_rites_1.gif" height="130px" style="display: none;">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="figure2">
|
|
|
|
<div class="figure2">
|
|
|
|
<img id="cooking2" src="imgs/canteen/woman_cooking_2.gif" height="120px">
|
|
|
|
<img id="cooking2" class="cooking" src="imgs/canteen/woman_cooking_2.gif" height="120px">
|
|
|
|
<img id="satan2" src="imgs/canteen/woman_rites_2.gif" height="130px" style="display: none;">
|
|
|
|
<img id="satan2" class="satan" src="imgs/canteen/devil_rites_4.gif" height="140px" style="display: none;">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="figure3">
|
|
|
|
<div class="figure3">
|
|
|
|
<img id="cooking3" src="imgs/canteen/woman_cooking_3.gif" height="120px">
|
|
|
|
<img id="cooking3" class="cooking" src="imgs/canteen/woman_cooking_3.gif" height="120px">
|
|
|
|
<img id="satan3" src="imgs/canteen/woman_rites_3.gif" height="110px" style="display: none;">
|
|
|
|
<img id="satan3" class="satan" src="imgs/canteen/woman_rites_3.gif" height="180px" style="display: none;">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="figure4">
|
|
|
|
<div class="figure4">
|
|
|
|
<img id="cooking4" src="imgs/canteen/woman_cooking_4.gif" height="140px">
|
|
|
|
<img id="cooking4" class="cooking" src="imgs/canteen/woman_cooking_4.gif" height="140px">
|
|
|
|
<img id="satan4" src="imgs/canteen/woman_rites_4.gif" height="110px" style="display: none;">
|
|
|
|
<img id="satan4" class="satan" src="imgs/canteen/woman_rites_2.gif" height="180px" style="display: none;">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="figure5">
|
|
|
|
<div class="figure5">
|
|
|
|
<img id="cooking5" src="imgs/canteen/woman_cooking_5.gif" height="140px">
|
|
|
|
<img id="cooking5" class="cooking" src="imgs/canteen/woman_cooking_5.gif" height="140px">
|
|
|
|
<img id="satan4" src="imgs/canteen/woman_rites_4.gif" height="130px" style="display: none;">
|
|
|
|
<img id="satan4" class="satan" src="imgs/canteen/woman_rites_5.gif" height="160px" style="display: none;">
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -57,10 +63,10 @@
|
|
|
|
<div class="text_container">
|
|
|
|
<div class="text_container">
|
|
|
|
<div class="message1">
|
|
|
|
<div class="message1">
|
|
|
|
You are now in the school canteen. The staff is there as well: the plan might get more complicated. <br>
|
|
|
|
You are now in the school canteen. The staff is there as well: the plan might get more complicated. <br>
|
|
|
|
<span class="instructions">Click on the corn on the table to take it with you.</span>
|
|
|
|
<span class="instructions">Click on the corn cobs on the table to take them with you.</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="message2" style="display: none;">
|
|
|
|
<div class="message2 invert" style="display: none;" >
|
|
|
|
Oh jeez! The school cooking staff turned into what appears to be a devil-worshippers gang!<br>
|
|
|
|
Oh jeez! The school's cooking staff turned into what appears to be a devil-worshippers gang!<br>
|
|
|
|
You still have fluoride with you though: use it to fight them back!<br>
|
|
|
|
You still have fluoride with you though: use it to fight them back!<br>
|
|
|
|
<span class="instructions">Click on the school's staff to neutralize them with the poisonous chemical.</span>
|
|
|
|
<span class="instructions">Click on the school's staff to neutralize them with the poisonous chemical.</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
@ -72,7 +78,7 @@
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!--game bar-->
|
|
|
|
<!--game bar-->
|
|
|
|
<div class="game_bar" >
|
|
|
|
<div class="game_bar invert" >
|
|
|
|
fluoride: <span class="cobs_collected"></span> / 5
|
|
|
|
fluoride: <span class="cobs_collected"></span> / 5
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
@ -85,7 +91,7 @@
|
|
|
|
window.onload = function() {
|
|
|
|
window.onload = function() {
|
|
|
|
window.localStorage.setItem("school_canteen","opened");
|
|
|
|
window.localStorage.setItem("school_canteen","opened");
|
|
|
|
console.log ("school canteen:",localStorage.school_canteen);
|
|
|
|
console.log ("school canteen:",localStorage.school_canteen);
|
|
|
|
$('.cobs_collected').html("0");
|
|
|
|
$('.cobs_collected').html(fluoride);
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
@ -96,8 +102,24 @@
|
|
|
|
var player_img = document.querySelector("#player_img");
|
|
|
|
var player_img = document.querySelector("#player_img");
|
|
|
|
player_img.appendChild(img);
|
|
|
|
player_img.appendChild(img);
|
|
|
|
|
|
|
|
|
|
|
|
//get player name from local storage
|
|
|
|
//change characters + invert
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$("#table").click (function(){
|
|
|
|
|
|
|
|
$(".cooking, #table, .message1 ").hide();
|
|
|
|
|
|
|
|
$(".satan, #column, .message2").show();
|
|
|
|
|
|
|
|
$(".invert").addClass("invert_style");
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//fight
|
|
|
|
|
|
|
|
var avatar = $("#player_img");
|
|
|
|
|
|
|
|
var weapon = $("#pill");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$(".figure1").click (function(){
|
|
|
|
|
|
|
|
avatar.animate({top:'16%'}, "slow");
|
|
|
|
|
|
|
|
weapon.animate({top:'16%'}, "slow");
|
|
|
|
|
|
|
|
weapon.show();
|
|
|
|
|
|
|
|
fluoride -- ;
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|