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.

376 lines
13 KiB
HTML

4 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" />
4 years ago
<title>canteen</title>
4 years ago
<link rel="icon" href="imgs/canteen/kitchen1.gif">
4 years ago
<link rel="stylesheet" href="canteen.css">
</head>
4 years ago
<body>
4 years ago
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
4 years ago
<audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio>
<audio loop="loop" id="theme4" preload="auto"><source src="sound/theme4_scary.wav" type="audio/wav"></audio>
<audio id="click"><source src="sound/click.wav" type="audio/wav"></audio>
<audio id="comic"><source src="sound/speech.wav" type="audio/wav"></audio>
<audio id="yes"><source src="sound/yes.wav" type="audio/wav"></audio>
<audio id="no"><source src="sound/no.wav" type="audio/wav"></audio>
<audio id="shot"><source src="sound/shot.wav" type="audio/wav"></audio>
4 years ago
<div id="ground"class="invert"></div>
<svg class="invert">
4 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;"/>
4 years ago
</svg>
4 years ago
4 years ago
<!--characters-->
4 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;" >
4 years ago
4 years ago
<img id="ned" src="imgs/canteen/ned1.gif" height="120px">
<img id="ned_flame" src="imgs/canteen/fire_ned.gif" height="120px" style="display: none;">
4 years ago
<img id="table" src="imgs/canteen/table1.gif" height="110px">
4 years ago
<img id="column" src="imgs/canteen/fire_5.gif" height="130px" style="display: none;">
4 years ago
<div class="figure1">
4 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;">
4 years ago
</div>
<div class="figure2">
4 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;">
4 years ago
</div>
<div class="figure3">
4 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;">
4 years ago
</div>
<div class="figure4">
4 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;">
4 years ago
</div>
<div class="figure5">
4 years ago
<img id="cooking5" class="cooking" src="imgs/canteen/woman_cooking_5.gif" height="140px">
4 years ago
<img id="satan5" class="satan" src="imgs/canteen/woman_rites_5.gif" height="160px" style="display: none;">
4 years ago
</div>
4 years ago
<!--baloons-->
4 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>
4 years ago
<!--bottom text-->
<div class="text_container">
<div class="message1">
4 years ago
You are now in the school canteen. The staff is there as well: your plan might be getting complicated. <br>
4 years ago
<span class="instructions"><span class="instructions_arrow"></span> Click on the corn cobs on the table to take them with you.</span>
4 years ago
</div>
4 years ago
<div class="message2 invert" style="display: none;" >
4 years ago
Oh jeez! The school's cooking staff turned into what appears to be a devil-worshippers gang!<br>
4 years ago
You still have fluoride with you though: use it to fight them back!<br>
4 years ago
<span class="instructions"><span class="instructions_arrow"></span> Click on the school's staff to neutralize them with the poisonous chemical.</span>
4 years ago
</div>
4 years ago
<div class="message3 " style="display: none;">
4 years ago
You managed to neutralize the enemy! Sadly, Ned was hit during the fight.
</div>
4 years ago
<div class="message4 " style="display: none;">
4 years ago
Ned passed ( ͡❛ ︹ ͡❛) , but you can still save the children. <button onclick="location.href='square_satanism.html';"><span class="button_text">Go to the village square</span></button> to inform the citizens of your discovery: you need to rescue the children from the trip.
4 years ago
If you are still in doubt, follow his advice and <button onclick="location.href='pleiadians_satanism.html';"><span class="button_text">follow the chemtrails</span></button> .
4 years ago
</div>
4 years ago
</div>
<!--game bar-->
4 years ago
<div class="game_bar invert" >
4 years ago
fluoride: <span class="cobs_collected"></span> / 5
</div>
<script src="jquery.min.js"></script>
<script>
4 years ago
4 years ago
//audio
var theme = document.querySelector("#theme2");
var scary = document.querySelector("#theme4");
var click = document.querySelector("#click");
var comic = document.querySelector("#comic");
var no = document.querySelector("#no");
var yes = document.querySelector("#yes");
4 years ago
var shot = document.querySelector("#shot");
theme.volume = 1;
4 years ago
shot.volume = 0.5;
4 years ago
scary.volume = 0.4;
click.volume=0.5;
4 years ago
$("body").hover( function() {
4 years ago
if (stop_autoplay = 0) {
theme.play();
4 years ago
theme.addEventListener('paused',function() {
theme.play();
4 years ago
},false);
}
4 years ago
})
4 years ago
//go back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
if ($('.invert').hasClass("invert_style") == true) {
$('.back').css("background-color","black");
}
else{
$('.back').css("background-color","white");
}
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
4 years ago
4 years ago
var fluoride = 5;
4 years ago
// saves game step in the local storage
window.onload = function() {
4 years ago
theme.play();
4 years ago
window.localStorage.setItem("school_canteen","opened");
console.log ("school canteen:",localStorage.school_canteen);
4 years ago
$('.cobs_collected').html(fluoride);
4 years ago
4 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);
4 years ago
//change characters + invert
4 years ago
var stop_autoplay = 0;
4 years ago
$("#table").click (function(){
4 years ago
stop_autoplay ++;
4 years ago
theme.pause();
scary.play();
4 years ago
$(".cooking, #table, .message1 ").hide();
$(".satan, #column, .message2").show();
$(".invert").addClass("invert_style");
});
4 years ago
4 years ago
//fight
4 years ago
var duo = $(".moving_duo");
4 years ago
var avatar = $("#player_img");
var weapon = $("#pill");
4 years ago
$("#satan1").click (function(){
4 years ago
--fluoride;
console.log("fluoride:", fluoride);
weapon.hide();
$('.cobs_collected').html(fluoride);
4 years ago
duo.animate({top:'18%'}, {
duration : 300
}).promise().done(function () {
4 years ago
weapon.show();
console.log("weapon show");
weapon.animate({ left: "30%" }, {
4 years ago
duration: 300
}).promise().done(function(){
4 years ago
shot.play();
4 years ago
$("#satan1").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide();
console.log("weapon hide");
weapon.css({ left: "11%" });
4 years ago
check_end_game();
4 years ago
});
4 years ago
});
hit_ned();
});
4 years ago
$("#satan2").click (function(){
4 years ago
--fluoride;
console.log("fluoride:", fluoride);
weapon.hide();
$('.cobs_collected').html(fluoride);
duo.animate({top:'12%'}, {
duration : 300
4 years ago
}).promise().done(function () {
weapon.show();
console.log("weapon show");
4 years ago
weapon.animate({ left: "60%" }, {
duration: 300
4 years ago
}).promise().done(function(){
4 years ago
shot.play();
$("#satan2").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide();
console.log("weapon hide");
weapon.css({ left: "11%" });
check_end_game();
4 years ago
});
});
hit_ned();
4 years ago
});
4 years ago
$("#satan3").click (function(){
4 years ago
--fluoride;
console.log("fluoride:", fluoride);
weapon.hide();
$('.cobs_collected').html(fluoride);
duo.animate({top:'22%'}, {
duration : 300
}).promise().done(function () {
weapon.show();
console.log("weapon show");
weapon.animate({ left: "80%" }, {
duration: 300
}).promise().done(function(){
4 years ago
shot.play();
$("#satan3").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide();
console.log("weapon hide");
weapon.css({ left: "11%" });
check_end_game();
4 years ago
});
});
hit_ned();
4 years ago
});
4 years ago
$("#satan4").click (function(){
4 years ago
shot.play();
4 years ago
--fluoride;
console.log("fluoride:", fluoride);
weapon.hide();
$('.cobs_collected').html(fluoride);
duo.animate({top:'55%'}, {
duration : 300
}).promise().done(function () {
weapon.show();
console.log("weapon show");
weapon.animate({ left: "46%" }, {
duration: 300
}).promise().done(function(){
4 years ago
shot.play();
$("#satan4").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide();
console.log("weapon hide");
weapon.css({ left: "11%" });
check_end_game();
});
4 years ago
});
hit_ned();
4 years ago
});
4 years ago
$("#satan5").click (function(){
4 years ago
--fluoride;
console.log("fluoride:", fluoride);
weapon.hide();
$('.cobs_collected').html(fluoride);
duo.animate({top:'40%'}, {
duration : 300
}).promise().done(function () {
weapon.show();
console.log("weapon show");
weapon.animate({ left: "80%" }, {
duration: 300
}).promise().done(function(){
4 years ago
shot.play();
$("#satan5").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide();
console.log("weapon hide");
weapon.css({ left: "11%" });
check_end_game();
4 years ago
});
});
hit_ned();
4 years ago
});
4 years ago
4 years ago
function hit_ned() {
4 years ago
if (fluoride == 2) {
4 years ago
$("#ned_flame").show();
4 years ago
setTimeout( function() {
shot.play();
}, 200);
4 years ago
//$("#ned_flame").delay(1000).hide();
$("#ned").attr("src", "imgs/canteen/ned_wounded.gif");
}
};
4 years ago
var figures_all = $(".figure1, .figure2, .figure3, .figure4, .figure5");
4 years ago
function check_end_game() {
console.log("check end game");
4 years ago
if (fluoride == 0) {
4 years ago
console.log("game over!");
4 years ago
$(".game_bar").addClass("game_bar_glow");
4 years ago
click.play();
4 years ago
setTimeout( function (){
4 years ago
figures_all.detach();
$(".game_bar").hide();
4 years ago
setTimeout( function () {
$("#column").hide();
$(".message2").hide();
$(".message3").show();
$(".invert").removeClass("invert_style");
4 years ago
scary.pause();
theme.play();
4 years ago
setTimeout (function () {
$(".game_bar").hide();
$(".ned_bubble1").show();
},1500);
4 years ago
}, 1000);
}, 1000);
4 years ago
4 years ago
};
};
4 years ago
4 years ago
$(".ned_bubble1").click( function(){
4 years ago
comic.play();
4 years ago
$(".ned_bubble1").hide();
$(".ned_bubble2").show();
setTimeout (function () {
4 years ago
click.play();
4 years ago
$(".message3").hide();
$(".message4").show();
$("#ned").attr("src", "imgs/canteen/ned_wounded.png");
},3000);
});
$(".ned_bubble2").click( function(){
4 years ago
click.play();
4 years ago
$(".ned_bubble2").hide();
});
4 years ago
</script>
4 years ago
4 years ago
</body>