master
*anna* 4 years ago
parent f71c7b828f
commit cca7e38024

@ -121,6 +121,15 @@ span.button_text{
z-index: 1; z-index: 1;
} }
#ned_flame {
bottom: 25%;
left: 17%;
position:absolute ;
z-index: 2;
}
#player_img { #player_img {
bottom: 24%; bottom: 24%;
left: 8%; left: 8%;
@ -194,9 +203,9 @@ div.figure5 {
/* baloons*/ /* baloons*/
.ned_baloon1 { .ned_bubble1 {
left: 5%; left: 23%;
bottom: 47%; bottom: 41%;
position: absolute; position: absolute;
background: #ffffff; background: #ffffff;
color: #000000; color: #000000;
@ -204,42 +213,41 @@ div.figure5 {
font-size: 16px; font-size: 16px;
line-height: 17px; line-height: 17px;
text-align: center; text-align: center;
width: 285px; width: 250px;
height: 135px; height: 90px;
border-radius: 10px; border-radius: 10px;
padding: 18px; padding: 18px;
border: #000000 solid 1px; border: #000000 solid 1px;
z-index:10;
} }
.ned_baloon1:after { .ned_bubble1:after {
content: ''; content: '';
position: absolute; position: absolute;
display: block; display: block;
width: 0; width: 0;
z-index: 1; z-index: 1;
border-style: solid; border-style: solid;
border-color: #ffffff transparent; border-width: 20px 20px 0 0;
border-width: 20px 20px 0; border-color: #ffffff transparent transparent transparent;
bottom: -20px; bottom: -20px;
left: 60%; left: 14%;
margin-left: -20px; margin-left: -10px;
} }
.ned_baloon1:before { .ned_bubble1:before {
content: ''; content: '';
position: absolute; position: absolute;
width: 0; width: 0;
z-index: 0; z-index: 0;
border-style: solid; border-style: solid;
border-color: #000000 transparent; border-width: 21px 21px 0 0;
border-width: 21px 21px 0; border-color: #000000 transparent transparent transparent;
bottom: -21.5px; bottom: -22px;
left: 60%; left: 14%;
margin-left: -21px; margin-left: -11px;
display: block; display: block;
} }
.ned_baloon2 { .ned_bubble2 {
bottom:29%; left: 27%;
left: 28%; bottom: 28%;
position: absolute; position: absolute;
background: #ffffff; background: #ffffff;
color: #000000; color: #000000;
@ -247,14 +255,13 @@ div.figure5 {
font-size: 16px; font-size: 16px;
line-height: 17px; line-height: 17px;
text-align: center; text-align: center;
width: 285px; width: 250px;
height: 85px; height: 40px;
border-radius: 10px; border-radius: 10px;
padding: 18px; padding: 18px;
border: #000000 solid 1px; border: #000000 solid 1px;
z-index: 11;
} }
.ned_baloon2:after { .ned_bubble2:after {
content: ''; content: '';
position: absolute; position: absolute;
display: block; display: block;
@ -262,22 +269,22 @@ div.figure5 {
z-index: 1; z-index: 1;
border-style: solid; border-style: solid;
border-color: transparent #ffffff; border-color: transparent #ffffff;
border-width: 20px 20px 20px 0; border-width: 10px 20px 10px 0;
top: 50%; top: 39%;
left: -20px; left: -20px;
margin-top: -20px; margin-top: -10px;
} }
.ned_baloon2:before { .ned_bubble2:before {
content: ''; content: '';
position: absolute; position: absolute;
width: 0; width: 0;
z-index: 0; z-index: 0;
border-style: solid; border-style: solid;
border-color: transparent #000000; border-color: transparent #000000;
border-width: 21px 21px 21px 0; border-width: 11px 21px 11px 0;
top: 50%; top: 39%;
left: -21.5px; left: -21.5px;
margin-top: -21px; margin-top: -11px;
display: block; display: block;
} }

@ -24,6 +24,7 @@
<img id="ned" src="imgs/canteen/ned1.gif" height="120px"> <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;">
<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;"> <img id="column" src="imgs/canteen/fire_5.gif" height="130px" style="display: none;">
@ -54,15 +55,15 @@
<!--baloons--> <!--baloons-->
<div class="ned_bubble1" style="display: none;"></div> <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;"></div> <div class="ned_bubble2" style="display: none;">Follow the chemtrails whenever you'll find yourself in doubt. </div>
<div class="ned_bubble3" style="display: none;"></div> <div class="staff_bubble" style="display: none;"></div>
<!--bottom text--> <!--bottom text-->
<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: your plan might be getting complicated. <br>
<span class="instructions">Click on the corn cobs on the table to take them 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 invert" style="display: none;" > <div class="message2 invert" style="display: none;" >
@ -120,91 +121,112 @@ var fluoride = 5;
--fluoride; --fluoride;
console.log(fluoride); console.log(fluoride);
weapon.hide(); weapon.hide();
$('.cobs_collected').html(fluoride);
duo.animate({top:'18%'}, 500, function() { duo.animate({top:'18%'}, 500, function() {
weapon.delay(100).show().animate({ left: "30%" }, 150,function(){ weapon.show();
weapon.animate({ left: "30%" }, 150,function(){
$("#satan1").attr("src", "imgs/canteen/fire_once.gif"); $("#satan1").attr("src", "imgs/canteen/fire_once.gif");
//$("#satan1").detach().delay(500);
weapon.hide(); weapon.hide();
weapon.animate({ left: "11%" }); weapon.animate({ left: "11%" }, function(){
setTimeout(stop_game(), 6000);
}); });
}); });
$('.cobs_collected').html(fluoride); });
setTimeout(stop_game(), 3000); hit_ned();
}); });
$(".figure2").click (function(){ $(".figure2").click (function(){
--fluoride; --fluoride;
console.log(fluoride); console.log(fluoride);
weapon.hide(); weapon.hide();
$('.cobs_collected').html(fluoride);
duo.animate({top:'12%' }, 500, function() { duo.animate({top:'12%' }, 500, function() {
weapon.delay(100).show().animate({ left: "60%" }, 150,function(){ weapon.show();
weapon.animate({ left: "60%" }, 150,function(){
$("#satan2").attr("src", "imgs/canteen/fire_once.gif"); $("#satan2").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide(); weapon.hide();
weapon.animate({ left: "11%" }); weapon.animate({ left: "11%" }, function(){
setTimeout(stop_game(), 6000);
}); });
}); });
$('.cobs_collected').html(fluoride); });
setTimeout(stop_game(), 3000); hit_ned();
}); });
$(".figure3").click (function(){ $(".figure3").click (function(){
--fluoride; --fluoride;
console.log(fluoride); console.log(fluoride);
$('.cobs_collected').html(fluoride);
duo.animate({top:'22%'}, 500, function() { duo.animate({top:'22%'}, 500, function() {
weapon.delay(100).show().animate({ left: "80%" }, 150,function(){ weapon.show();
weapon.animate({ left: "80%" }, 150,function(){
$("#satan3").attr("src", "imgs/canteen/fire_once.gif"); $("#satan3").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide(); weapon.hide();
weapon.animate({ left: "11%" }); weapon.animate({ left: "11%" }, function(){
setTimeout(stop_game(), 6000);
}); });
}); });
$('.cobs_collected').html(fluoride); });
setTimeout(stop_game(), 3000); hit_ned();
}); });
$(".figure4").click (function(){ $(".figure4").click (function(){
--fluoride; --fluoride;
console.log(fluoride); console.log(fluoride);
$('.cobs_collected').html(fluoride);
duo.animate({top:'50%'}, 500, function() { duo.animate({top:'50%'}, 500, function() {
weapon.delay(100).show().animate({ left: "46%" }, 150,function(){ weapon.show();
weapon.animate({ left: "46%" }, 150,function(){
$("#satan4").attr("src", "imgs/canteen/fire_once.gif"); $("#satan4").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide(); weapon.hide();
weapon.animate({ left: "11%" }); weapon.animate({ left: "11%" }, function(){
setTimeout(stop_game(), 6000);
}); });
}); });
$('.cobs_collected').html(fluoride); });
setTimeout(stop_game(), 3000); hit_ned();
}); });
$(".figure5").click (function(){ $(".figure5").click (function(){
--fluoride; --fluoride;
console.log(fluoride); console.log(fluoride);
$('.cobs_collected').html(fluoride);
duo.animate({top:'40%'}, 500, function() { duo.animate({top:'40%'}, 500, function() {
weapon.delay(100).show().animate({ left: "80%" }, 150,function(){ weapon.show();
weapon.animate({ left: "80%" }, 150,function(){
$("#satan5").attr("src", "imgs/canteen/fire_once.gif"); $("#satan5").attr("src", "imgs/canteen/fire_once.gif");
weapon.hide(); weapon.hide();
weapon.animate({ left: "11%" }); weapon.animate({ left: "11%" }, {step: function(){
setTimeout(stop_game(), 6000);
}
}); });
}); });
$('.cobs_collected').html(fluoride); });
setTimeout(stop_game(), 3000); hit_ned();
}); });
function hit_ned() {
if (fluoride == 3) {
$("#ned_flame").show();
//$("#ned_flame").delay(1000).hide();
$("#ned").attr("src", "imgs/canteen/ned_wounded.gif");
}
};
var figures_all = $(".figure1, .figure2, .figure3, .figure4, .figure5"); var figures_all = $(".figure1, .figure2, .figure3, .figure4, .figure5");
function stop_game() { function stop_game() {
if (fluoride == 0) { if (fluoride == 0) {
figures_all.detach(); figures_all.detach();
$("#column").hide();
console.log("hei"); console.log("hei");
setTimeout($(".invert").removeClass("invert_style"), 3000);
$(".message2").hide();
$(".message3").show();
//setTimeout(avatar.animate ({top:"50%"}), 2000);
}; };
}; };
</script> </script>
<script type="text/javascript" src="index.js" ></script> <script type="text/javascript" src="index.js" ></script>

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

@ -321,6 +321,10 @@ img.corn{
display: block; display: block;
} }
.stop_touch{
z-index: -10;
}
/* hide scroll bar */ /* hide scroll bar */
/* width */ /* width */

@ -31,7 +31,7 @@
<img id="ned" src="imgs/monteferro/ned2.gif" height="120px"> <img id="ned" src="imgs/monteferro/ned2.gif" height="120px">
<div class="field"> <div class="field no_touch">
<img id="corn1" class="corn" src="imgs/monteferro/corn.gif" > <img id="corn1" class="corn" src="imgs/monteferro/corn.gif" >
<img id="corn2" 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="corn3" class="corn" src="imgs/monteferro/corn.gif" >
@ -246,6 +246,8 @@ var loose_counter = 0;
$(".ned_baloon2,.ned_baloon1, .message1, .message2 ").hide(); $(".ned_baloon2,.ned_baloon1, .message1, .message2 ").hide();
$(".message_won").show(); $(".message_won").show();
$('.cobs_collected').html("5"); $('.cobs_collected').html("5");
$(".field").addClass(".stop_touch");
} }
if (loose_counter == 6) { if (loose_counter == 6) {
@ -254,6 +256,7 @@ var loose_counter = 0;
loose_counter = 0; loose_counter = 0;
$(".message_won").hide(); $(".message_won").hide();
$(".message_lost, .farmer").show(); $(".message_lost, .farmer").show();
$(".field").addClass(".stop_touch");
} }
} }
@ -261,6 +264,7 @@ var loose_counter = 0;
$(".corn").attr('src', "imgs/monteferro/corn.gif"); $(".corn").attr('src', "imgs/monteferro/corn.gif");
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
$(".message_lost, .farmer").hide(); $(".message_lost, .farmer").hide();
$(".field").removeClass(".stop_touch");
}); });

Loading…
Cancel
Save