You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

235 lines
9.4 KiB
HTML

3 years ago
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
3 years ago
<title>canteen</title>
3 years ago
<link rel="icon" href="imgs/canteen/kitchen1.gif">
3 years ago
<link rel="stylesheet" href="canteen.css">
</head>
3 years ago
<body>
3 years ago
<div id="ground"class="invert"></div>
3 years ago
3 years ago
<svg class="invert">
3 years ago
<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="130" x2="150%" y2="100%" style="stroke:black;stroke: width 1px;"/>
3 years ago
</svg>
<!--characters-->
3 years ago
<div class ="moving_duo" id="player_img"></div>
<img class ="moving_duo" id="pill" src="imgs/canteen/pill.png" height="40px"style="display: none;" >
3 years ago
3 years ago
<img id="ned" src="imgs/canteen/ned1.gif" height="120px">
3 years ago
<img id="ned_flame" src="imgs/canteen/fire_ned.gif" height="120px" style="display: none;">
3 years ago
<img id="table" src="imgs/canteen/table1.gif" height="110px">
3 years ago
<img id="column" src="imgs/canteen/fire_5.gif" height="130px" style="display: none;">
3 years ago
<div class="figure1">
3 years ago
<img id="cooking1" class="cooking" src="imgs/canteen/woman_cooking_1.gif" height="110px">
<img id="satan1" class="satan" src="imgs/canteen/woman_rites_1.gif" height="130px" style="display: none;">
3 years ago
</div>
<div class="figure2">
3 years ago
<img id="cooking2" class="cooking" src="imgs/canteen/woman_cooking_2.gif" height="120px">
<img id="satan2" class="satan" src="imgs/canteen/devil_rites_4.gif" height="140px" style="display: none;">
3 years ago
</div>
<div class="figure3">
3 years ago
<img id="cooking3" class="cooking" src="imgs/canteen/woman_cooking_3.gif" height="120px">
<img id="satan3" class="satan" src="imgs/canteen/woman_rites_3.gif" height="180px" style="display: none;">
3 years ago
</div>
<div class="figure4">
3 years ago
<img id="cooking4" class="cooking" src="imgs/canteen/woman_cooking_4.gif" height="140px">
<img id="satan4" class="satan" src="imgs/canteen/woman_rites_2.gif" height="180px" style="display: none;">
3 years ago
</div>
<div class="figure5">
3 years ago
<img id="cooking5" class="cooking" src="imgs/canteen/woman_cooking_5.gif" height="140px">
3 years ago
<img id="satan5" class="satan" src="imgs/canteen/woman_rites_5.gif" height="160px" style="display: none;">
3 years ago
</div>
3 years ago
<!--baloons-->
3 years ago
<div class="ned_bubble1" style="display: none;" >I think this is the end for me. Please, promise me that you are going to put an end to this! Children are endangered and you are now the only one who can save them! </div>
<div class="ned_bubble2" style="display: none;">Follow the chemtrails whenever you'll find yourself in doubt. </div>
<div class="staff_bubble" style="display: none;"></div>
3 years ago
<!--bottom text-->
<div class="text_container">
<div class="message1">
3 years ago
You are now in the school canteen. The staff is there as well: your plan might be getting complicated. <br>
3 years ago
<span class="instructions">Click on the corn cobs on the table to take them with you.</span>
3 years ago
</div>
3 years ago
<div class="message2 invert" style="display: none;" >
Oh jeez! The school's cooking staff turned into what appears to be a devil-worshippers gang!<br>
3 years ago
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>
</div>
<div class="message3" style="display: none;">
You managed to neutralize the enemy! Sadly, Ned was hit during the fight.
<button onclick="location.href='square_satanism.html';"><span class="button_text">Go to the village square</span></button> to inform the children's parents of your discovery: you need to rescue them from the trip.
If you are still in doubt, <button onclick="location.href='pleiadians_satanism.html';"><span class="button_text">look for the chemtrails</span></button> .
</div>
</div>
<!--game bar-->
3 years ago
<div class="game_bar invert" >
3 years ago
fluoride: <span class="cobs_collected"></span> / 5
</div>
<script src="jquery.min.js"></script>
<script>
3 years ago
var fluoride = 5;
3 years ago
// saves game step in the local storage
window.onload = function() {
window.localStorage.setItem("school_canteen","opened");
console.log ("school canteen:",localStorage.school_canteen);
3 years ago
$('.cobs_collected').html(fluoride);
3 years ago
3 years ago
}
//get player avatar from local storage
console.log (localStorage.myavatar)
var img = document.createElement("img");
img.src = localStorage.myavatar;
var player_img = document.querySelector("#player_img");
player_img.appendChild(img);
3 years ago
//change characters + invert
$("#table").click (function(){
$(".cooking, #table, .message1 ").hide();
$(".satan, #column, .message2").show();
$(".invert").addClass("invert_style");
});
//fight
3 years ago
var duo = $(".moving_duo");
3 years ago
var avatar = $("#player_img");
var weapon = $("#pill");
3 years ago
$(".figure1").click (function(){
--fluoride;
console.log(fluoride);
weapon.hide();
3 years ago
$('.cobs_collected').html(fluoride);
3 years ago
duo.animate({top:'18%'}, 500, function() {
3 years ago
weapon.show();
weapon.animate({ left: "30%" }, 150,function(){
3 years ago
$("#satan1").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide();
3 years ago
weapon.animate({ left: "11%" }, function(){
setTimeout(stop_game(), 6000);
});
3 years ago
});
});
3 years ago
hit_ned();
3 years ago
});
$(".figure2").click (function(){
--fluoride;
console.log(fluoride);
weapon.hide();
3 years ago
$('.cobs_collected').html(fluoride);
3 years ago
duo.animate({top:'12%' }, 500, function() {
3 years ago
weapon.show();
weapon.animate({ left: "60%" }, 150,function(){
3 years ago
$("#satan2").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide();
3 years ago
weapon.animate({ left: "11%" }, function(){
setTimeout(stop_game(), 6000);
});
3 years ago
});
});
3 years ago
hit_ned();
3 years ago
});
$(".figure3").click (function(){
--fluoride;
console.log(fluoride);
3 years ago
$('.cobs_collected').html(fluoride);
3 years ago
duo.animate({top:'22%'}, 500, function() {
3 years ago
weapon.show();
weapon.animate({ left: "80%" }, 150,function(){
3 years ago
$("#satan3").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide();
3 years ago
weapon.animate({ left: "11%" }, function(){
setTimeout(stop_game(), 6000);
});
3 years ago
});
});
3 years ago
hit_ned();
3 years ago
});
$(".figure4").click (function(){
--fluoride;
console.log(fluoride);
3 years ago
$('.cobs_collected').html(fluoride);
3 years ago
duo.animate({top:'50%'}, 500, function() {
3 years ago
weapon.show();
weapon.animate({ left: "46%" }, 150,function(){
3 years ago
$("#satan4").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide();
3 years ago
weapon.animate({ left: "11%" }, function(){
setTimeout(stop_game(), 6000);
});
3 years ago
});
});
3 years ago
hit_ned();
3 years ago
});
$(".figure5").click (function(){
--fluoride;
console.log(fluoride);
3 years ago
$('.cobs_collected').html(fluoride);
3 years ago
duo.animate({top:'40%'}, 500, function() {
3 years ago
weapon.show();
weapon.animate({ left: "80%" }, 150,function(){
3 years ago
$("#satan5").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide();
3 years ago
weapon.animate({ left: "11%" }, {step: function(){
setTimeout(stop_game(), 6000);
}
});
3 years ago
});
});
3 years ago
hit_ned();
3 years ago
});
3 years ago
function hit_ned() {
if (fluoride == 3) {
$("#ned_flame").show();
//$("#ned_flame").delay(1000).hide();
$("#ned").attr("src", "imgs/canteen/ned_wounded.gif");
}
};
3 years ago
var figures_all = $(".figure1, .figure2, .figure3, .figure4, .figure5");
function stop_game() {
if (fluoride == 0) {
figures_all.detach();
3 years ago
$("#column").hide();
3 years ago
console.log("hei");
3 years ago
setTimeout($(".invert").removeClass("invert_style"), 3000);
$(".message2").hide();
$(".message3").show();
//setTimeout(avatar.animate ({top:"50%"}), 2000);
3 years ago
};
};
3 years ago
</script>
<script type="text/javascript" src="index.js" ></script>
</body>