<!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" / >
< title > Monteferro< / title >
< link rel = "icon" href = "imgs/monteferro/corn.gif" >
< link rel = "stylesheet" href = "monteferro.css" >
< / head >
< body >
< audio loop = "loop" id = "theme2" preload = "auto" > < source src = "sound/theme2.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 = "comic_ned" > < source src = "sound/ned_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 = "anger" > < source src = "sound/anger.wav" type = "audio/wav" > < / audio >
< audio id = "chicken" > < source src = "sound/chicken.wav" type = "audio/wav" > < / audio >
< audio id = "smoke" > < source src = "sound/smoke.wav" type = "audio/wav" > < / audio >
< img id = "mulino" src = "imgs/monteferro/mulino.gif" height = "140px" >
< img id = "tree1" src = "imgs/monteferro/tree.gif" height = "220px" >
< img id = "gallina1" src = "imgs/monteferro/gallina2.gif" height = "60px" >
< img id = "gallina2" src = "imgs/monteferro/gallina2.2.gif" height = "60px" >
< img id = "gallina3" src = "imgs/monteferro/gallina2.2.gif" height = "60px" >
< img class = "farmer" id = "farmer_figure" src = "imgs/monteferro/farmer_replace.gif" style = "display: none;" height = "105px" >
< div class = "farmer" id = "farmer_baloon" style = "display: none;" > What are you guys doing here?< / div >
< div id = "chicken1_baloon" style = "display: none;" > I won't eat that corn if I were you ■< / div >
< div class = "baloons" >
< div class = "ned_baloon1" style = "display: none;" > I have reasons to suspect that the Monteferro Enterprise is poisoning the children's food with a substance called Fluoride. The drug is able to reduce an individual's power to resist domination by slowly calcifying the pineal gland. The school is using it to make children submissive and docile ✜< / div >
< div class = "ned_baloon2" style = "display: none;" > The food coming from these fields has already been contaminated with the chemical: we should collect it and confront it with the one at the school canteen ■< / div >
< / div >
< div id = "ground" >
< div id = "player_img" > < / div >
< img id = "ned" src = "imgs/monteferro/ned2.gif" height = "110px" >
< div class = "field_cover" > < / div >
< div class = "field no_touch" >
< img id = "corn1" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn2" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn3" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn4" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn5" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn6" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn7" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn8" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn9" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn10" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn11" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn12" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn13" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn14" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn15" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn16" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn17" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn18" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn19" class = "corn" src = "imgs/monteferro/corn.gif" >
< img id = "corn20" class = "corn" src = "imgs/monteferro/corn.gif" >
< / div >
< / div >
< div class = "text_container" >
< div class = "message1" >
You are at one of the fields of the Monteferro Food Enterprise.
< / div >
< div class = "message2 instructions" style = "display: none;" >
< span class = "instructions_arrow" > →< / span > Click on the veggies to get the proofs you need: you must collect at least 5 poisoned corn cobs before the Monteferro's employees see you!
< button id = "start_button" > < span class = "button_text" > Start now!< / span > < / button >
< / div >
< div class = "message_won" style = "display: none;" >
You managed to collect enough fluoride! < button onclick = "location.href='canteen.html';" > < span class = "button_text" > Go to the school canteen< / span > < / button > to confront the substances.
< / div >
< div class = "message_lost" style = "display: none;" >
On no! You got busted by the farmer! You should < button id = "try_again" > < span class = "button_text" > try again< / span > < / button > .
< / div >
< div class = "game_bar" style = "display: none;" >
fluoride: < span class = "cobs_collected" > < / span > / 5
< / div >
< script src = "jquery.min.js" > < / script >
< script >
// audio
var theme = document.querySelector("#theme2");
var click = document.querySelector("#click");
var comic = document.querySelector("#comic");
var comic_ned = document.querySelector("#comic_ned");
var no = document.querySelector("#no");
var yes = document.querySelector("#yes");
var anger = document.querySelector("#anger");
var chicken = document.querySelector("#chicken");
var smoke = document.querySelector("#smoke");
$("body").hover( function() {
theme.play();
theme.addEventListener('paused',function() {
theme.play();
},false);
})
// saves game step in the local storage + onload functions
window.onload = function() {
theme.play();
window.localStorage.setItem("monteferro","opened");
console.log ("monteferro:",localStorage.monteferro);
$('.cobs_collected').html("0");
setTimeout (function () {
comic_ned.play();
$(".ned_baloon1").show();
},1000);
}
//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);
/*ned baloons */
$("#gallina1").click (function () {
chicken.play();
$("#chicken1_baloon").show();
});
$("#gallina2").click (function () {
smoke.play();
$("#gallina2").attr("src","imgs/monteferro/roasted.gif");
});
$("#gallina3").click (function () {
smoke.play();
$("#gallina3").attr("src","imgs/monteferro/roasted.gif");
});
$("#chicken1_baloon").click (function () {
click.play();
$("#chicken1_baloon").toggle();
});
$(".ned_baloon1").click (function () {
comic_ned.play();
$(".ned_baloon1").toggle();
$(".ned_baloon2").show();
});
$(".ned_baloon2").click (function () {
click.play();
$(".message1").hide();
$(".message2").show();
$(".ned_baloon2").toggle();
});
$("#start_button").click (function () {
click.play();
$(".ned_baloon2,.ned_baloon1, .message1, .message2 ").hide();
$(".game_bar").show();
$(".field_cover").css("z-index",-10);
});
// fluoride game
var fluoride_counter = 0;
var loose_counter = 0;
$("#corn1").click (function () {
$("#corn1").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn2").click (function () {
$("#corn2").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn3").click (function () {
no.play();
loose_counter ++;
check_counters();
});
$("#corn4").click (function () {
no.play();
loose_counter ++;
check_counters();
});
$("#corn5").click (function () {
no.play();
loose_counter ++;
check_counters();
});
$("#corn6").click (function () {
$("#corn6").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn7").click (function () {
yes.play();
loose_counter ++;
check_counters();
});
$("#corn8").click (function () {
$("#corn8").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn9").click (function () {
$("#corn9").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn10").click (function () {
$("#corn10").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn11").click (function () {
$("#corn11").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn12").click (function () {
no.play();
loose_counter ++;
check_counters();
});
$("#corn13").click (function () {
no.play();
loose_counter ++;
check_counters();
});
$("#corn14").click (function () {
$("#corn14").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn15").click (function () {
$("#corn15").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn16").click (function () {
$("#corn1").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn17").click (function () {
no.play();
loose_counter ++;
check_counters();
});
$("#corn18").click (function () {
no.play();
loose_counter ++;
check_counters();
});
$("#corn19").click (function () {
$("#corn19").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
$("#corn20").click (function () {
$("#corn20").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter);
check_counters();
});
function check_counters() {
if (fluoride_counter == 5) {
click.play();
$(".game_bar").addClass("game_bar_glow");
$(".field_cover").css("z-index",10);
console.log ("you won!");
fluoride_counter = 0;
loose_counter = 0;
$(".ned_baloon2,.ned_baloon1, .message1, .message2 ").hide();
$(".message_won").show();
$('.cobs_collected').html("5");
}
if (loose_counter == 3) {
anger.play();
$(".field_cover").css("z-index",10);
console.log ("you lost!");
fluoride_counter = 0;
loose_counter = 0;
$("#chicken1_baloon").hide();
$(".message_won").hide();
$(".message_lost, .farmer").show();
}
}
$("#try_again").click (function () {
click.play();
$(".field_cover").css("z-index",-10);
$(".corn").attr('src', "imgs/monteferro/corn.gif");
$('.cobs_collected').html(fluoride_counter);
$(".message_lost, .farmer").hide();
});
< / script >
< script type = "text/javascript" src = "index.js" > < / script >
< / body >
