master
*anna* 4 years ago
parent 806ca3ea72
commit eb11a0e4a4

BIN
.DS_Store vendored

Binary file not shown.

BIN
tree/.DS_Store vendored

Binary file not shown.

@ -54,14 +54,17 @@
height: 100%;
position:fixed;
z-index: -10;
}
.instructions{
font-family:jolyregularitalic;
}
span.instructions_arrow{
padding-left:40px;
font-size: 2.4vw;
font-family:jolybolditalic;
}
@ -226,7 +229,7 @@ div.figure5 {
.ned_bubble1 {
left: 23%;
bottom: 41%;
bottom: 43%;
position: absolute;
background: #ffffff;
color: #000000;

@ -63,19 +63,19 @@
<div class="text_container">
<div class="message1">
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"><span class="instructions_arrow"></span> Click on the corn cobs on the table to take them with you.</span>
</div>
<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>
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"><span class="instructions_arrow"></span> 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.
</div>
<div class="message4 " style="display: none;">
<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.
If you are still in doubt, follow Ned's advice and <button onclick="location.href='pleiadians_satanism.html';"><span class="button_text">look for the chemtrails</span></button> .
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.
If you are still in doubt, follow his advice and <button onclick="location.href='pleiadians_satanism.html';"><span class="button_text">look for the chemtrails</span></button> .
</div>
</div>

BIN
tree/imgs/.DS_Store vendored

Binary file not shown.

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 57 KiB

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 6.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 10 KiB

After

Width:  |  Height:  |  Size: 7.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 9.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 9.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

@ -41,11 +41,16 @@
}
.instructions{
font-family:jolyregularitalic
font-family:jolyregularitalic;
}
span.instructions_arrow{
padding-left:40px;
font-size: 2.4vw;
font-family:jolybolditalic;
}
#ground {
position: fixed;

@ -28,7 +28,7 @@
<div id="ground">
<div id="player_img"></div>
<img id="ned" src="imgs/monteferro/ned2.gif" height="120px">
<img id="ned" src="imgs/monteferro/ned2.gif" height="110px">
<div class="field no_touch">
@ -62,7 +62,7 @@
Oh lord, it's horrible! What can you do to <button id="ned_more"><span class="button_text">stop this terrible abuse</span></button> ?
</div>
<div class="message2 instructions" style="display: none;">
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!
<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;">
@ -256,17 +256,14 @@ var loose_counter = 0;
$(".ned_baloon2,.ned_baloon1, .message1, .message2 ").hide();
$(".message_won").show();
$('.cobs_collected').html("5");
$(".field").addClass(".stop_touch");
}
if (loose_counter == 6) {
console.log ("you lost!");
fluoride_counter = 0;
loose_counter = 0;
$(".message_won").hide();
$(".message_lost, .farmer").show();
$(".field").addClass(".stop_touch");
}
}
@ -274,7 +271,6 @@ var loose_counter = 0;
$(".corn").attr('src', "imgs/monteferro/corn.gif");
$('.cobs_collected').html(fluoride_counter);
$(".message_lost, .farmer").hide();
$(".field").removeClass(".stop_touch");
});

@ -34,11 +34,16 @@
}
.instructions{
font-family:jolyregularitalic;
}
span.instructions_arrow{
padding-left:40px;
font-size: 2.4vw;
font-family:jolybolditalic;
}
::-moz-selection { /* Code for Firefox */
background: transparent;

@ -140,7 +140,7 @@
There is a nice kiosk close by: <button id="fries"><span class="button_text">go there to get fries</span></button> . You can still <button class="open_newspaper_index"><span class="button_text">have a look at the news</span></button> or <button onclick="location.href='park_dream.html';"><span class="button_text">go for a walk</span></button> .
</div>
<div class="message5 instructions" style="display:none;">
Click on the kiosk to get the fries.
<span class="instructions_arrow"></span> Click on the kiosk to get the fries.
</div>
<div class="message6" style="display:none;">
Pity! It looks like you are left with no option but to <button onclick="location.href='park_dream.html';"><span class="button_text">go for a walk</span></button> .

@ -33,11 +33,11 @@
<img id="tree5" src="imgs/park/tree1.gif" height="230px">
<img id="sport1" src="imgs/park/fitness1.gif" height="70px">
<img id="sport2" src="imgs/park/fitness2.gif" height="70px">
<img id="newspaper_seller" src="imgs/park/newspaper_seller.gif" height="120px">
<img id="woman" src="imgs/park/woman.gif" height="140px">
<img id="newspaper_seller" src="imgs/park/newspaper_seller.gif" height="110px">
<img id="woman" src="imgs/park/woman.gif" height="120px">
<img id="flower9" src="imgs/park/flower1.1.gif" height="30px">
<img id="dog" src="imgs/park/dog1.gif" height="90px">
<img id="ned" src="imgs/park/ned2.gif" height="120px">
<img id="dog" src="imgs/park/dog1.gif" height="80px">
<img id="ned" src="imgs/park/ned2.gif" height="110px">
<img id="grass2" src="imgs/park/grass1.gif" height="90px">
<div class="woman_bubble" style="display: none;">I don't know, you should try to ask the news vendor.</div>
@ -53,7 +53,7 @@
<div class="text_container">
<div class="message1 instructions">
Move around the park with the arrows ←↑↓→ and click on the people to ask them if they saw the newspaper's owner.
<span class="instructions_arrow"></span> Move around the park with the arrows ←↑↓→ and click on the people to ask them if they saw the newspaper's owner.
</div>
<div class="message2" style="display: none;">
You found him! <button class="ned_more"><span class="button_text">Hear more from Ned</span></button> .

@ -38,6 +38,11 @@
font-family:jolyregularitalic;
}
span.instructions_arrow{
padding-left:40px;
font-size: 2.4vw;
font-family:jolybolditalic;
}

@ -43,6 +43,14 @@
}
#ground {
width: 120%;
height: 120%;
position:fixed;
margin:-100px;
background-color: white;
z-index:-10;
}
.ground_line{
position: fixed;
top: 130px;
bottom: 0px;
@ -52,10 +60,22 @@
z-index: -1;
}
.instructions{
svg {
width: 100%;
height: 100%;
position:fixed;
}
.instructions{
font-family:jolyregularitalic;
}
span.instructions_arrow{
padding-left:40px;
font-size: 2.4vw;
font-family:jolybolditalic;
}
div.text_container {
bottom: 40px;
@ -84,6 +104,15 @@ div.text_container {
font-size: 1.4vw;
}
.flipped {
transform: scale(-1, 1);
-moz-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
-khtml-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
}
button{
@ -115,7 +144,9 @@ span.button_text{
position:absolute;
}
.invert_style{
filter: invert(100%);
}
/*figures*/
@ -143,6 +174,7 @@ div.figure4 {
left: 54%;
position:absolute ;
cursor:pointer;
z-index: 3;
}
div.figure5 {
@ -180,6 +212,23 @@ div.figure9 {
cursor:pointer;
}
/*thunders*/
#thunder1{
top: -20px;;
left:-20px;
position: fixed;
}
#thunder2{
top:0%;
right:0%;
position: fixed;
z-index: -1;
}
/*baloon*/
.bubble {

@ -9,23 +9,28 @@
</head>
<body>
<div id="ground"></div>
<div id="ground" class="invert"></div>
<div class="ground_line invert"></div>
<!--houses-->
<!--game bar-->
<div class="game_bar" >
<div class="game_bar invert" >
villagers: <span class="fighters"></span> / 9
</div>
<img id="thunder1" src="imgs/square_s/thunder.gif" height="150px" style="display: none;">
<img id="thunder2" src="imgs/square_s/thunder2.gif" height="200px" style="display: none;">
<!--characters-->
<div id="player_img" class="moving_duo"></div>
<div class="bubble moving_duo">!!!</div>
<div class="bubble moving_duo" style="display: none;">!!!</div>
<div class="figure1 figures">
<img id="person1" class="people" src="imgs/square_s/person1.gif" height="120px">
<img id="person1" class="people" src="imgs/square_s/person1.gif" height="110px">
<img id="fighter1" class="fighters" src="imgs/square_s/fighter1.gif" height="120px" style="display: none;">
</div>
<div class="figure2 figures">
@ -36,29 +41,29 @@
<img id="person3" class="people" src="imgs/square_s/person3.gif" height="110px">
<img id="fighter3" class="fighters" src="imgs/square_s/fighter3.gif" height="120px" style="display: none;">
</div>
<div class="figure4 figures">
<div class="figure4 figures to_flip">
<img id="person4" class="people" src="imgs/square_s/person4.gif" height="110px">
<img id="fighter4" class="fighters" src="imgs/square_s/fighter4.gif" height="120px" style="display: none;">
</div>
<div class="figure5 figures">
<div class="figure5 figures to_flip">
<img id="person5" class="people" src="imgs/square_s/person5.gif" height="90px">
<img id="fighter5" class="fighters" src="imgs/square_s/fighter5.gif" height="110px" style="display: none;">
</div>
<div class="figure6 figures">
<img id="person6" class="people" src="imgs/square_s/person6.gif" height="120px">
<img id="fighter6" class="fighters" src="imgs/square_s/fighter6.gif" height="120px" style="display: none;">
<img id="person6" class="people" src="imgs/square_s/person6.gif" height="110px">
<img id="fighter6" class="fighters" src="imgs/square_s/fighter6.gif" height="160px" style="display: none;">
</div>
<div class="figure7 figures">
<img id="person7" class="people" src="imgs/square_s/person7.gif" height="120px">
<img id="fighter7" class="fighters" src="imgs/square_s/fighter7.gif" height="140px" style="display: none;">
<div class="figure7 figures to_flip">
<img id="person7" class="people" src="imgs/square_s/person7.gif" height="110px">
<img id="fighter7" class="fighters" src="imgs/square_s/fighter7.gif" height="120px" style="display: none;">
</div>
<div class="figure8 figures">
<img id="person8" class="people" src="imgs/square_s/person8.gif" height="120px">
<img id="fighter8" class="fighters" src="imgs/square_s/fighter8.gif" height="180px" style="display: none;">
<img id="person8" class="people" src="imgs/square_s/person8.gif" height="110px">
<img id="fighter8" class="fighters" src="imgs/square_s/fighter8.gif" height="120px" style="display: none;">
</div>
<div class="figure9 figures">
<img id="person9" class="people" src="imgs/square_s/person9.gif" height="100px">
<img id="fighter9" class="fighters" src="imgs/square_s/fighter9.gif" height="180px" style="display: none;">
<img id="person9" class="people" src="imgs/square_s/person9.gif" height="110px">
<img id="fighter9" class="fighters" src="imgs/square_s/fighter9.gif" height="130px" style="display: none;">
</div>
@ -69,10 +74,10 @@
<!--bottom text-->
<div class="text_container">
<div class="text_container invert">
<div class="message1">
You are in the village square. You must inform the villagers of what is going on in the school: the kids need to be rescued from the evil staff. <br>
<span class="instructions">Click on the villagers to share with them your findings!</span>
<span class="instructions"><span class="instructions_arrow"></span> Click on the villagers to share with them your findings!</span>
</div>
<div class="message2" style="display: none;" >
It looks like you managed to reclute an impressive army: <button onclick="location.href='river_bank.html';"><span class="button_text"> Guide them to the river bank</span></button> and raise anchor to Spring River.
@ -113,142 +118,174 @@
var baloon = $(".bubble");
$(".figure1").click (function(){
check_flipping();
villagers ++;
$(".fighters").html(villagers);
avatar.css({ top: "15%", left: "34%" });
baloon.css({ top: "5%", left: "38%" })
avatar.css({ top: "16%", left: "35%" });
baloon.css({ top: "7%", left: "37%" })
baloon.show();
setTimeout ( function (){
$("#person1").hide();
$("#fighter1").show();
baloon.hide();
}, 1000);
}, 600);
end_recluting();
});
$(".figure2").click (function(){
check_flipping();
villagers ++;
$(".fighters").html(villagers);
avatar.css({ top: "12%", left: "57%" });
baloon.css({ top: "3%", left: "61%" })
avatar.css({ top: "13%", left: "59%" });
baloon.css({ top: "4%", left: "61%" })
baloon.show();
setTimeout ( function (){
$("#person2").hide();
$("#fighter2").show();
baloon.hide();
}, 1000);
}, 600);
end_recluting();
});
$(".figure3").click (function(){
check_flipping();
villagers ++;
$(".fighters").html(villagers);
duo.css ("zIndex", 5);
avatar.css({ top: "26%", left: "84%"});
baloon.css({ top: "15%", left: "88%" })
avatar.css({ top: "22%", left: "77%"});
baloon.css({ top: "13%", left: "80%" })
baloon.show();
setTimeout ( function (){
$("#person3").hide();
$("#fighter3").show();
baloon.hide();
}, 1000);
}, 600);
end_recluting();
});
$(".figure4").click (function(){
if (avatar.hasClass("flipped") == false) {
avatar.addClass("flipped");
}
villagers ++;
$(".fighters").html(villagers);
avatar.css({ top: "50%", left: "60%"});
avatar.css({ top: "50%", left: "62%"});
baloon.css({ top: "41%", left: "64%" })
baloon.show();
setTimeout ( function (){
$("#person4").hide();
$("#fighter4").show();
baloon.hide();
}, 1000);
}, 600);
end_recluting();
});
$(".figure5").click (function(){
if (avatar.hasClass("flipped") == false) {
avatar.addClass("flipped");
}
villagers ++;
$(".fighters").html(villagers);
duo.css ("zIndex", 5);
avatar.css({ top: "17%", left: "16%" });
baloon.css({ top: "8%", left: "20%" });
duo.css ("zIndex", 0);
avatar.addClass("flipped");
avatar.css({ top: "14%", left: "17%" });
baloon.css({ top: "5%", left: "21%" });
baloon.show();
setTimeout ( function (){
$("#person5").hide();
$("#fighter5").show();
baloon.hide();
}, 1000);
}, 600);
end_recluting();
});
$(".figure6").click (function(){
check_flipping();
villagers ++;
$(".fighters").html(villagers);
duo.css({ top: "15%", left: "34%" });
duo.css ("zIndex", 1);
avatar.css({ top: "53%", left: "29%" });
baloon.css({ top: "43%", left: "31%" });
baloon.show();
setTimeout ( function (){
$("#person6").hide();
$("#fighter6").show();
baloon.hide();
}, 2000);
}, 600);
end_recluting();
});
$(".figure7").click (function(){
if (avatar.hasClass("flipped") == false) {
avatar.addClass("flipped");
}
villagers ++;
$(".fighters").html(villagers);
duo.css({ top: "15%", left: "34%" });
avatar.addClass("flipped");
avatar.css({ top: "33%", left: "26%" });
baloon.css({ top: "24%", left: "28%" });
baloon.show();
setTimeout ( function (){
$("#person7").hide();
$("#fighter7").show();
baloon.hide();
}, 2000);
}, 600);
end_recluting();
});
$(".figure8").click (function(){
check_flipping();
villagers ++;
$(".fighters").html(villagers);
duo.css({ top: "15%", left: "34%" });
duo.css ("zIndex", 1);
avatar.css({ top: "43%", left: "72%" });
baloon.css({ top: "35%", left: "75%" });
baloon.show();
setTimeout ( function (){
$("#person8").hide();
$("#fighter8").show();
baloon.hide();
}, 2000);
}, 600);
end_recluting();
});
$(".figure9").click (function(){
check_flipping();
villagers ++;
$(".fighters").html(villagers);
duo.css({ top: "15%", left: "34%" });
avatar.css({ top: "29%", left: "48%" });
baloon.css({ top: "19%", left: "51%" });
baloon.show();
setTimeout ( function (){
$("#person9").hide();
$("#fighter9").show();
baloon.hide();
}, 2000);
}, 600);
end_recluting();
});
function end_recluting(){
function end_recluting() {
if (villagers == 9) {
$(".message1").hide();
$(".message2").show();
setTimeout ( function (){
figures.detach();
$(".invert").addClass("invert_style");
$("#thunder1, #thunder2 ").show();
check_flipping();
avatar.css({ top: "55%", left: "8%" })
}, 1000);
}
}
function check_flipping() {
if (avatar.hasClass("flipped") == true) {
avatar.removeClass("flipped");
}
}
</script>
<script type="text/javascript" src="index.js" ></script>

Loading…
Cancel
Save