master
*anna* 4 years ago
parent 0e9d737ffe
commit a9ffa8f873

@ -266,7 +266,7 @@ div#player_img {
cursor: pointer; cursor: pointer;
} }
#meat3{ #meat3{
bottom:33%; bottom:34%;
right: 14%; right: 14%;
position: absolute; position: absolute;
z-index: 3; z-index: 3;

@ -68,7 +68,7 @@ body {
} }
div.text_container { div.text_container {
bottom: 40px; bottom: 35px;
left:40px; left:40px;
right:40px; right:40px;
position:fixed; position:fixed;
@ -93,12 +93,14 @@ div.text_container {
cursor:pointer; cursor:pointer;
font-size: 1.4vw; font-size: 1.4vw;
} }
.game_bar_glow{ .game_bar_glow{
border: 0.11vw transparent solid; border: 0.11vw transparent solid;
background-color: transparent; background-color: transparent;
-webkit-box-shadow: 0px 0px 8px 1px black ; color:#c94dff;
-moz-box-shadow: 0px 0px 8px 1px black ; -webkit-box-shadow: 0px 0px 8px 1px #c94dff ;
box-shadow: 0px 0px 8px 1px black ; -moz-box-shadow: 0px 0px 8px 1px #c94dff ;
box-shadow: 0px 0px 8px 1px #c94dff ;
} }
.win{ .win{
animation-name: cats; animation-name: cats;
@ -336,12 +338,13 @@ span.button_text{
font-size: 16px; font-size: 16px;
line-height: 17px; line-height: 17px;
text-align: center; text-align: center;
width: 200px; width: 220px;
height: 105px; height: 105px;
border-radius: 10px; border-radius: 10px;
padding: 18px; padding: 18px;
border: #000000 solid 1px; border: #000000 solid 1px;
z-index:50; z-index:50;
cursor: pointer;
} }
.bubble2:after { .bubble2:after {
content: ''; content: '';
@ -384,6 +387,8 @@ span.button_text{
border-radius: 10px; border-radius: 10px;
padding: 18px; padding: 18px;
border: #000000 solid 1px; border: #000000 solid 1px;
cursor: pointer;
z-index:50;
} }
.bubble3:after { .bubble3:after {
content: ''; content: '';

@ -56,9 +56,9 @@
<!--baloons--> <!--baloons-->
<div class="bubble1" >I believe the butcher is also one of the saurians settlers: <div class="bubble1" >I believe the butcher is also one of the saurians settlers:
I suspect that some of the meat stored here is actually cat's meat. I suspect that some of the meat stored here is actually cat's meat.
Help me to check out these steaks!</div> Help me to check out these steaks!</div>
<div class="bubble2 invert" style="display: none;">I think this is the end for me. You need to tell people what we found out! I believe the saurians' headquarter lies below the bus station. Go there and save the survivors! </div> <div class="bubble2 invert" style="display: none;">I think this is the end for me. You need to tell people what we found out! I believe the saurians' headquarter lies below the bus station. Go there and save the survivors! </div>
<div class="bubble3 invert" style="display: none;">Follow the chemtrails whenever you'll find yourself in doubt. </div> <div class="bubble3 invert" style="display: none;">Follow the chemtrails whenever you'll find yourself in doubt</div>
<!--bottom text--> <!--bottom text-->
@ -85,7 +85,7 @@
</div> </div>
<!--game bar--> <!--game bar-->
<div class="game_bar invert" style="display: none;"> <div class="game_bar" style="display: none;">
cat steaks: <span class="cat_meat_bar"></span> / 4 cat steaks: <span class="cat_meat_bar"></span> / 4
</div> </div>
@ -117,6 +117,7 @@
$(".message2, .game_bar").show(); $(".message2, .game_bar").show();
setTimeout( function() { setTimeout( function() {
$("#cover").css('z-index',-5); $("#cover").css('z-index',-5);
$(".tables").css('cursor', 'pointer');
}, 2000); }, 2000);
}); });
@ -130,6 +131,9 @@
$("#table1").click (function(){ $("#table1").click (function(){
$("#table1").addClass("touch_animation"); $("#table1").addClass("touch_animation");
setTimeout(function(){
$("#table1").removeClass("touch_animation");
},250);
error ++; error ++;
console.log("errors:", error); console.log("errors:", error);
check_end_game (); check_end_game ();
@ -137,6 +141,9 @@
$("#table2").click (function(){ $("#table2").click (function(){
$("#table2").addClass("touch_animation"); $("#table2").addClass("touch_animation");
setTimeout(function(){
$("#table2").removeClass("touch_animation");
},250);
error ++; error ++;
console.log("errors:", error); console.log("errors:", error);
check_end_game (); check_end_game ();
@ -144,6 +151,9 @@
$("#table3").click (function(){ $("#table3").click (function(){
$("#table3").attr("src", "imgs/butchery/cat.gif"); $("#table3").attr("src", "imgs/butchery/cat.gif");
setTimeout(function(){
$("#table3").removeClass("touch_animation");
},250);
cat_meat ++; cat_meat ++;
console.log("cat meat:", cat_meat); console.log("cat meat:", cat_meat);
$('.cat_meat_bar').html(cat_meat); $('.cat_meat_bar').html(cat_meat);
@ -152,6 +162,9 @@
$("#table4").click (function(){ $("#table4").click (function(){
$("#table4").addClass("touch_animation"); $("#table4").addClass("touch_animation");
setTimeout(function(){
$("#table4").removeClass("touch_animation");
},250);
error ++; error ++;
console.log("errors:", error); console.log("errors:", error);
check_end_game (); check_end_game ();
@ -159,6 +172,9 @@
$("#table5").click (function(){ $("#table5").click (function(){
$("#table5").addClass("touch_animation"); $("#table5").addClass("touch_animation");
setTimeout(function(){
$("#table5").removeClass("touch_animation");
},250);
error ++; error ++;
console.log("errors:", error); console.log("errors:", error);
check_end_game (); check_end_game ();
@ -166,6 +182,9 @@
$("#table6").click (function(){ $("#table6").click (function(){
$("#table6").addClass("touch_animation"); $("#table6").addClass("touch_animation");
setTimeout(function(){
$("#table6").removeClass("touch_animation");
},250);
error ++; error ++;
console.log("errors:", error); console.log("errors:", error);
check_end_game (); check_end_game ();
@ -173,6 +192,9 @@
$("#table7").click (function(){ $("#table7").click (function(){
$("#table7").attr("src", "imgs/butchery/cat.gif"); $("#table7").attr("src", "imgs/butchery/cat.gif");
setTimeout(function(){
$("#table7").removeClass("touch_animation");
},250);
cat_meat ++; cat_meat ++;
console.log("cat meat:", cat_meat); console.log("cat meat:", cat_meat);
$('.cat_meat_bar').html(cat_meat); $('.cat_meat_bar').html(cat_meat);
@ -181,6 +203,9 @@
$("#table8").click (function(){ $("#table8").click (function(){
$("#table8").addClass("touch_animation"); $("#table8").addClass("touch_animation");
setTimeout(function(){
$("#table8").removeClass("touch_animation");
},250);
error ++; error ++;
console.log("errors:", error); console.log("errors:", error);
check_end_game (); check_end_game ();
@ -188,6 +213,9 @@
$("#table9").click (function(){ $("#table9").click (function(){
$("#table9").addClass("touch_animation"); $("#table9").addClass("touch_animation");
setTimeout(function(){
$("#table9").removeClass("touch_animation");
},250);
error ++; error ++;
console.log("errors:", error); console.log("errors:", error);
check_end_game (); check_end_game ();
@ -195,6 +223,9 @@
$("#table10").click (function(){ $("#table10").click (function(){
$("#table10").attr("src", "imgs/butchery/cat.gif"); $("#table10").attr("src", "imgs/butchery/cat.gif");
setTimeout(function(){
$("#table10").removeClass("touch_animation");
},250);
cat_meat ++; cat_meat ++;
console.log("cat meat:", cat_meat); console.log("cat meat:", cat_meat);
$('.cat_meat_bar').html(cat_meat); $('.cat_meat_bar').html(cat_meat);
@ -203,6 +234,9 @@
$("#table11").click (function(){ $("#table11").click (function(){
$("#table11").attr("src", "imgs/butchery/cat.gif"); $("#table11").attr("src", "imgs/butchery/cat.gif");
setTimeout(function(){
$("#table11").removeClass("touch_animation");
},250);
cat_meat ++; cat_meat ++;
console.log("cat meat:", cat_meat); console.log("cat meat:", cat_meat);
$('.cat_meat_bar').html(cat_meat); $('.cat_meat_bar').html(cat_meat);
@ -211,6 +245,9 @@
$("#table12").click (function(){ $("#table12").click (function(){
$("#table12").addClass("touch_animation"); $("#table12").addClass("touch_animation");
setTimeout(function(){
$("#table12").removeClass("touch_animation");
},250);
error ++; error ++;
console.log("errors:", error); console.log("errors:", error);
check_end_game (); check_end_game ();
@ -239,19 +276,26 @@
$(".bubble2").show(); $(".bubble2").show();
$("#butcher").hide(); $("#butcher").hide();
$(".invert").removeClass("invert_style"); $(".invert").removeClass("invert_style");
setTimeout( function (){ }, 5000)
});
}, 300);
}, 1000);
};
$(".bubble2").click(function(){
$(".bubble2").hide();
$(".bubble3").show(); $(".bubble3").show();
setTimeout( function (){ setTimeout( function (){
$("#pat").attr("src", "imgs/butchery/parrot_d.png"); $("#pat").attr("src", "imgs/butchery/parrot_d.png");
$(".message_won").hide(); $(".message_won").hide();
$(".message_final").show(); $(".message_final").show();
}, 2000) }, 2000)
}, 3000)
}, 6000)
}); });
}, 300);
}, 1000); $(".bubble3").click(function(){
}; $(".bubble3").hide();
});
if (error == 3) { if (error == 3) {
setTimeout (function() { setTimeout (function() {

@ -69,7 +69,7 @@
div.text_container { div.text_container {
bottom: 40px; bottom: 35px;
left:40px; left:40px;
right:40px; right:40px;
position:fixed; position:fixed;
@ -114,6 +114,13 @@ div.message1{
font-size: 1.4vw; font-size: 1.4vw;
} }
.game_bar_glow{
border: 0.11vw transparent solid;
background-color: transparent;
-webkit-box-shadow: 0px 0px 8px 1px black ;
-moz-box-shadow: 0px 0px 8px 1px black ;
box-shadow: 0px 0px 8px 1px black ;
}
button{ button{
-webkit-appearance: none; -webkit-appearance: none;
@ -182,7 +189,9 @@ span.button_text{
position:absolute ; position:absolute ;
} }
.satan{
cursor: pointer;
}
div.figure1 { div.figure1 {
top: 20%; top: 20%;
@ -242,6 +251,7 @@ div.figure5 {
border-radius: 10px; border-radius: 10px;
padding: 18px; padding: 18px;
border: #000000 solid 1px; border: #000000 solid 1px;
cursor: pointer;
} }
.ned_bubble1:after { .ned_bubble1:after {
content: ''; content: '';
@ -284,6 +294,7 @@ div.figure5 {
border-radius: 10px; border-radius: 10px;
padding: 18px; padding: 18px;
border: #000000 solid 1px; border: #000000 solid 1px;
cursor: pointer;
} }
.ned_bubble2:after { .ned_bubble2:after {
content: ''; content: '';

@ -54,9 +54,8 @@
<!--baloons--> <!--baloons-->
<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_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="ned_bubble2" style="display: none;">Follow the chemtrails whenever you'll find yourself in doubt ■</div>
<div class="staff_bubble" style="display: none;"></div>
<!--bottom text--> <!--bottom text-->
@ -249,30 +248,41 @@ var fluoride = 5;
console.log("check end game"); console.log("check end game");
if (fluoride == 0) { if (fluoride == 0) {
console.log("game over!"); console.log("game over!");
$(".game_bar").addClass("game_bar_glow");
setTimeout( function (){ setTimeout( function (){
figures_all.detach() figures_all.detach();
$(".game_bar").hide();
setTimeout( function () { setTimeout( function () {
$("#column").hide(); $("#column").hide();
$(".message2").hide(); $(".message2").hide();
$(".message3").show(); $(".message3").show();
$(".invert").removeClass("invert_style"); $(".invert").removeClass("invert_style");
setTimeout (function ()
{$(".ned_bubble1").show();
setTimeout (function () { setTimeout (function () {
$(".game_bar").hide();
$(".ned_bubble1").show();
},1500);
}, 1000);
}, 1000);
};
};
$(".ned_bubble1").click( function(){
$(".ned_bubble1").hide();
$(".ned_bubble2").show(); $(".ned_bubble2").show();
setTimeout (function () { setTimeout (function () {
$(".message3").hide(); $(".message3").hide();
$(".message4").show(); $(".message4").show();
$("#ned").attr("src", "imgs/canteen/ned_wounded.png"); $("#ned").attr("src", "imgs/canteen/ned_wounded.png");
},5000);
},4000);
},3000); },3000);
}, 1000); });
}, 1000);
$(".ned_bubble2").click( function(){
$(".ned_bubble2").hide();
});
//setTimeout(avatar.animate ({top:"50%"}), 2000);
};
};
</script> </script>

@ -62,7 +62,7 @@ div#player_img {
div.text_container { div.text_container {
bottom: 40px; bottom: 35px;
left:40px; left:40px;
right:40px; right:40px;
position:absolute; position:absolute;
@ -246,6 +246,7 @@ span.button_text{
padding: 18px; padding: 18px;
border: 1px black solid; border: 1px black solid;
z-index: 10; z-index: 10;
cursor: pointer;
} }
.bubble1:after { .bubble1:after {
content: ''; content: '';
@ -335,6 +336,7 @@ span.button_text{
padding: 18px; padding: 18px;
border: 1px black solid; border: 1px black solid;
z-index: 10; z-index: 10;
cursor: pointer;
} }
.bubble3:after { .bubble3:after {
content: ''; content: '';
@ -373,7 +375,7 @@ span.button_text{
line-height: 17px; line-height: 17px;
text-align: center; text-align: center;
width: 160px; width: 160px;
height: 50px; height: 40px;
border-radius: 10px; border-radius: 10px;
padding: 18px; padding: 18px;
border: #000000 solid 1px; border: #000000 solid 1px;
@ -423,6 +425,7 @@ span.button_text{
padding: 18px; padding: 18px;
border: 1px black solid; border: 1px black solid;
z-index: 20; z-index: 20;
cursor: pointer;
} }
.bubble5:after { .bubble5:after {
content: ''; content: '';
@ -466,6 +469,7 @@ span.button_text{
padding: 18px; padding: 18px;
border: #000000 solid 1px; border: #000000 solid 1px;
z-index: 10; z-index: 10;
cursor: pointer;
} }
.bubble6:after { .bubble6:after {
content: ''; content: '';

@ -40,13 +40,13 @@
<img id="pat" src="imgs/cat_shelter/parrot.gif" height="100px" style="display: none;"> <img id="pat" src="imgs/cat_shelter/parrot.gif" height="100px" style="display: none;">
<div class="comic_div"> <div class="comic_div">
<div class="bubble1"style="display: none;">Hello stranger, are you looking for something? </div> <div class="bubble1"style="display: none;">Hello stranger, are you looking for something? </div>
<div class="bubble2"style="display: none;"> My name is Pat, nice to meet you. [...] </div> <div class="bubble2"style="display: none;"> My name is Pat, nice to meet you</div>
<div class="bubble3"style="display: none;"> I don't know any Amanda. But believe me, I wouldn't be surprised if something happened to her as well. Like those poor cats. They didn't escape, someone kidnapped them. </div> <div class="bubble3"style="display: none;"> I don't know any Amanda. But believe me, I wouldn't be surprised if something happened to her as well. Like those poor cats. They didn't escape, someone kidnapped them </div>
<div class="bubble4"style="display: none;"> If you want I can tell you more about it. [...]</div> <div class="bubble4"style="display: none;"> If you want I can tell you more about it</div>
<div class="bubble5" style="display: none;">I have reasons to believe that the Major's family is not as human as we thought. You need to see this. <div class="bubble5" style="display: none;">I have reasons to believe that the Major's family is not as human as we thought. You need to see this.
They are financing the cat shelter to harvest the cubs as food: they made them disappear during the night. </div> They are financing the cat shelter to harvest the cubs as food: they made them disappear during the night </div>
<div class="bubble6"style="display: none;"> The hairballs will drive us to the Major's mansion. Follow me!</div> <div class="bubble6"style="display: none;"> The hairballs will drive us to the Major's mansion. Follow me!</div>
</div> </div>
@ -155,35 +155,47 @@
$("#pat").show(); $("#pat").show();
setTimeout(function(){ setTimeout(function(){
$(".bubble1").show(); $(".bubble1").show();
setTimeout(function(){
$(".bubble2").show();
setTimeout(function(){ setTimeout(function(){
$(".message1").hide(); $(".message1").hide();
$(".message2").show(); $(".message2").show();
}, 1000); }, 1000);
}, 1500);
}, 1000); }, 1000);
}, 1000); }, 1000);
} }
} }
$(".bubble1").click(function(){
$(".bubble1").hide();
$(".bubble2").show();
});
$(".bubble2").click(function(){ $(".bubble2").click(function(){
$(".message2, .bubble1, .bubble2").hide(); $(".bubble2").hide();
$(".bubble3").show(); $(".bubble3").show();
setTimeout(function(){ });
$(".bubble3").click(function(){
$(".bubble3").hide();
$(".bubble4").show(); $(".bubble4").show();
}, 1000);
}); });
$(".bubble4").click(function(){ $(".bubble4").click(function(){
$(".bubble3, .bubble4").hide(); $(".bubble4").hide();
$(".bubble5").show(); $(".bubble5").show();
setTimeout(function(){ });
$(".bubble5").click(function(){
$(".bubble5").hide();
$(".bubble6").show();
});
$(".bubble5").click(function(){
$(".bubble5, .message2").hide();
$(".bubble6").show(); $(".bubble6").show();
setTimeout(function(){
$(".message3").show(); $(".message3").show();
}, 1000); });
}, 1000);
$(".bubble6").click(function(){
$(".bubble6").hide();
}); });

@ -80,7 +80,7 @@ span.instructions_arrow{
} }
div.text_container { div.text_container {
bottom: 40px; bottom: 25px;
left:40px; left:40px;
right:40px; right:40px;
position:fixed; position:fixed;
@ -166,6 +166,7 @@ span.button_text{
.glasses_bar:hover{ .glasses_bar:hover{
border: 0.11vw transparent solid; border: 0.11vw transparent solid;
background-color: transparent;
color:#c94dff; color:#c94dff;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff ; -webkit-box-shadow: 0px 0px 8px 1px #c94dff ;
-moz-box-shadow: 0px 0px 8px 1px #c94dff ; -moz-box-shadow: 0px 0px 8px 1px #c94dff ;
@ -318,6 +319,7 @@ span.button_text{
border-radius: 10px; border-radius: 10px;
padding: 18px; padding: 18px;
border: #000000 solid 1px; border: #000000 solid 1px;
cursor: pointer;
} }
.bubble1:after { .bubble1:after {
content: ''; content: '';
@ -361,6 +363,7 @@ span.button_text{
border-radius: 10px; border-radius: 10px;
padding: 18px; padding: 18px;
border: #000000 solid 1px; border: #000000 solid 1px;
cursor: pointer;
} }
.bubble2:after { .bubble2:after {
content: ''; content: '';

@ -73,11 +73,11 @@
<div class="bubble1 to_invert" style="display: none;"> <div class="bubble1 to_invert" style="display: none;">
The Major and his family are actually saurian settlers who came here to invade planet earth. The Major and his family are actually saurian settlers who came here to invade planet earth.
Use my magnifying glass to see them in their real appearance. Use my magnifying glass to see them in their real appearance
</div> </div>
<div class="bubble2 to_invert" style="display: none;"> <div class="bubble2 to_invert" style="display: none;">
They are harvesting the cats to be ready for the arrival of other groups of invaders. They are harvesting the cats to be ready for the arrival of other groups of invaders.
Follow me to the butcher shop, I can show you the proof of what I'm saying. Follow me to the butcher shop, I can show you the proof of what I'm saying
</div> </div>
<button class="glasses_bar" style="display: none;"> ✜ magnifying glass </button> <button class="glasses_bar" style="display: none;"> ✜ magnifying glass </button>
@ -103,18 +103,6 @@
window.onload = function() { window.onload = function() {
window.localStorage.setItem("major_house","opened"); window.localStorage.setItem("major_house","opened");
console.log ("major house:",localStorage.major_house); console.log ("major house:",localStorage.major_house);
/*
setTimeout( function() {
$('.bubble1').show();
setTimeout( function() {
$('.bubble2').show();
setTimeout( function() {
$('.message1').hide();
$('.message2').show();
}, 2000);
}, 2000);
}, 1000);
*/
} }
//get player avatar from local storage //get player avatar from local storage
@ -202,6 +190,14 @@ $(document).keydown(function(e) {
}) })
$('.bubble1').click(function(){
$('.bubble1').hide();
});
$('.bubble2').click(function(){
$('.bubble2').hide();
});
</script> </script>

@ -69,7 +69,8 @@
#ground{ #ground{
position:absolute; position:absolute;
height:100%; height:100%;
width:3500px; width:560vh;
/* width:3500px; */
} }
#groundline { #groundline {
@ -83,7 +84,7 @@
div.text_container { div.text_container {
bottom: 40px; bottom: 20px;
left:40px; left:40px;
right:40px; right:40px;
position:fixed; position:fixed;

@ -73,11 +73,11 @@
<div class="bubble1 invert" style="display: none;">Hello <span id="player_name"></span>, your enlightened spirit guided you here.</div> <div class="bubble1 invert" style="display: none;">Hello <span id="player_name"></span>, your enlightened spirit guided you here</div>
<div class="bubble2 invert" style="display: none;">We can sense that you are looking for something beyond your habits and understanding. We are happy to meet you. </div> <div class="bubble2 invert" style="display: none;">We can sense that you are looking for something beyond your habits and understanding. We are happy to meet you </div>
<div class="bubble3 invert" style="display: none;">We are the beings of light. We don't belong to this planet.</div> <div class="bubble3 invert" style="display: none;">We are the beings of light. We don't belong to this planet</div>
<div class="bubble4 invert" style="display: none;">We can sense the other beings and planet's energetic state. A heinous crime is shaking this land's vibration.</div> <div class="bubble4 invert" style="display: none;">We can sense the other beings and planet's energetic state. A heinous crime is shaking this land's vibration</div>
<div class="bubble5 invert" style="display: none;">This darkness will soon spread to other planets. We came here as messengers, to help you elevate your soul and find the courage to fight evil.</div> <div class="bubble5 invert" style="display: none;">This darkness will soon spread to other planets. We came here as messengers, to help you elevate your soul and find the courage to fight evil</div>
<div class="text_container invert " > <div class="text_container invert " >
@ -231,6 +231,23 @@ function check_pleiadians() {
}; };
}; };
$(".bubble1").click( function(){
$(".bubble1").hide();
});
$(".bubble2").click( function(){
$(".bubble2").hide();
});
$(".bubble3").click( function(){
$(".bubble3").hide();
});
$(".bubble4").click( function(){
$(".bubble4").hide();
});
$(".bubble5").click( function(){
$(".bubble5").hide();
});
</script> </script>
<script type="text/javascript" src="index.js" ></script> <script type="text/javascript" src="index.js" ></script>

@ -73,11 +73,11 @@
<div class="bubble1 invert" style="display: none;">Hello <span id="player_name"></span>, your enlightened spirit guided you here.</div> <div class="bubble1 invert" style="display: none;">Hello <span id="player_name"></span>, your enlightened spirit guided you here</div>
<div class="bubble2 invert" style="display: none;">We can sense that you are looking for something beyond your habits and understanding. We are happy to meet you. </div> <div class="bubble2 invert" style="display: none;">We can sense that you are looking for something beyond your habits and understanding. We are happy to meet you </div>
<div class="bubble3 invert" style="display: none;">We are the beings of light. We don't belong to this planet.</div> <div class="bubble3 invert" style="display: none;">We are the beings of light. We don't belong to this planet</div>
<div class="bubble4 invert" style="display: none;">We can sense the other beings and planet's energetic state. A heinous crime is shaking this land's vibration.</div> <div class="bubble4 invert" style="display: none;">We can sense the other beings and planet's energetic state. A heinous crime is shaking this land's vibration</div>
<div class="bubble5 invert" style="display: none;">This darkness will soon spread to other planets. We came here as messengers, to help you elevate your soul and find the courage to fight evil.</div> <div class="bubble5 invert" style="display: none;">This darkness will soon spread to other planets. We came here as messengers, to help you elevate your soul and find the courage to fight evil</div>
<div class="text_container invert " > <div class="text_container invert " >
@ -230,6 +230,21 @@ function check_pleiadians() {
}, 100); }, 100);
}; };
}; };
$(".bubble1").click( function(){
$(".bubble1").hide();
});
$(".bubble2").click( function(){
$(".bubble2").hide();
});
$(".bubble3").click( function(){
$(".bubble3").hide();
});
$(".bubble4").click( function(){
$(".bubble4").hide();
});
$(".bubble5").click( function(){
$(".bubble5").hide();
});
</script> </script>

@ -78,7 +78,7 @@ svg {
} }
div.text_container { div.text_container {
bottom: 40px; bottom: 35px;
left:40px; left:40px;
right:40px; right:40px;
position:fixed; position:fixed;
@ -94,7 +94,7 @@ div.text_container {
border-radius: 25vw; border-radius: 25vw;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
padding-bottom: 4px; padding-bottom: 2px;
font-family: sinistre; font-family: sinistre;
background-color: white; background-color: white;
border: 0.11vw black solid; border: 0.11vw black solid;
@ -102,8 +102,17 @@ div.text_container {
color:black; color:black;
cursor:pointer; cursor:pointer;
font-size: 1.4vw; font-size: 1.4vw;
}
.game_bar_glow{
border: 0.11vw transparent solid;
background-color: transparent;
color:#c94dff;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff ;
-moz-box-shadow: 0px 0px 8px 1px #c94dff ;
box-shadow: 0px 0px 8px 1px #c94dff ;
} }
.flipped { .flipped {
transform: scale(-1, 1); transform: scale(-1, 1);
-moz-transform: scale(-1, 1); -moz-transform: scale(-1, 1);
@ -111,7 +120,6 @@ div.text_container {
-o-transform: scale(-1, 1); -o-transform: scale(-1, 1);
-khtml-transform: scale(-1, 1); -khtml-transform: scale(-1, 1);
-ms-transform: scale(-1, 1); -ms-transform: scale(-1, 1);
} }
@ -123,6 +131,7 @@ button{
color:black; color:black;
cursor:pointer; cursor:pointer;
font-family: jolybolditalic; font-family: jolybolditalic;
padding-bottom: 4px;
} }
button:hover{ button:hover{

@ -17,7 +17,7 @@
<!--houses--> <!--houses-->
<!--game bar--> <!--game bar-->
<div class="game_bar invert" > <div class="game_bar" >
villagers: <span class="fighters"></span> / 9 villagers: <span class="fighters"></span> / 9
</div> </div>
<img id="thunder1" src="imgs/square_s/thunder.gif" height="150px" style="display: none;"> <img id="thunder1" src="imgs/square_s/thunder.gif" height="150px" style="display: none;">
@ -266,8 +266,8 @@
function end_recluting() { function end_recluting() {
if (villagers == 9) { if (villagers == 9) {
setTimeout ( function (){ setTimeout ( function (){
$(".game_bar").addClass("game_bar_glow");
$(".message1").hide(); $(".message1").hide();
$(".message2").show(); $(".message2").show();
$(".invert").addClass("invert_style"); $(".invert").addClass("invert_style");

@ -78,7 +78,7 @@ svg {
} }
div.text_container { div.text_container {
bottom: 40px; bottom: 35px;
left:40px; left:40px;
right:40px; right:40px;
position:fixed; position:fixed;
@ -94,7 +94,7 @@ div.text_container {
border-radius: 25vw; border-radius: 25vw;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
padding-bottom: 4px; padding-bottom: 2px;
font-family: sinistre; font-family: sinistre;
background-color: white; background-color: white;
border: 0.11vw black solid; border: 0.11vw black solid;
@ -102,8 +102,17 @@ div.text_container {
color:black; color:black;
cursor:pointer; cursor:pointer;
font-size: 1.4vw; font-size: 1.4vw;
}
.game_bar_glow{
border: 0.11vw transparent solid;
background-color: transparent;
color:#c94dff;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff ;
-moz-box-shadow: 0px 0px 8px 1px #c94dff ;
box-shadow: 0px 0px 8px 1px #c94dff ;
} }
.flipped { .flipped {
transform: scale(-1, 1); transform: scale(-1, 1);
-moz-transform: scale(-1, 1); -moz-transform: scale(-1, 1);
@ -123,6 +132,7 @@ button{
color:black; color:black;
cursor:pointer; cursor:pointer;
font-family: jolybolditalic; font-family: jolybolditalic;
padding-bottom: 4px;
} }
button:hover{ button:hover{

@ -16,7 +16,7 @@
<!--houses--> <!--houses-->
<!--game bar--> <!--game bar-->
<div class="game_bar invert" > <div class="game_bar" >
villagers: <span class="fighters"></span> / 9 villagers: <span class="fighters"></span> / 9
</div> </div>
<img id="thunder1" src="imgs/square_s/thunder.gif" height="150px" style="display: none;"> <img id="thunder1" src="imgs/square_s/thunder.gif" height="150px" style="display: none;">
@ -125,7 +125,7 @@
villagers ++; villagers ++;
$(".fighters").html(villagers); $(".fighters").html(villagers);
avatar.css({ top: "16%", left: "35%" }); avatar.css({ top: "16%", left: "35%" });
baloon.css({ top: "7%", left: "37%" }) baloon.css({ top: "5%", left: "34%" })
baloon.show(); baloon.show();
setTimeout ( function (){ setTimeout ( function (){
$("#person1").hide(); $("#person1").hide();
@ -140,7 +140,7 @@
villagers ++; villagers ++;
$(".fighters").html(villagers); $(".fighters").html(villagers);
avatar.css({ top: "13%", left: "59%" }); avatar.css({ top: "13%", left: "59%" });
baloon.css({ top: "4%", left: "61%" }) baloon.css({ top: "2%", left: "61%" })
baloon.show(); baloon.show();
setTimeout ( function (){ setTimeout ( function (){
$("#person2").hide(); $("#person2").hide();
@ -151,11 +151,14 @@
}); });
$("#person3").click (function(){ $("#person3").click (function(){
check_flipping(); if (avatar.hasClass("flipped") == false) {
avatar.addClass("flipped");
}
duo.css ("zIndex", 5);
villagers ++; villagers ++;
$(".fighters").html(villagers); $(".fighters").html(villagers);
avatar.css({ top: "22%", left: "77%"}); avatar.css({ top: "32%", left: "85%"});
baloon.css({ top: "13%", left: "80%" }) baloon.css({ top: "22%", left: "78%" })
baloon.show(); baloon.show();
setTimeout ( function (){ setTimeout ( function (){
$("#person3").hide(); $("#person3").hide();
@ -172,7 +175,7 @@
villagers ++; villagers ++;
$(".fighters").html(villagers); $(".fighters").html(villagers);
avatar.css({ top: "50%", left: "62%"}); avatar.css({ top: "50%", left: "62%"});
baloon.css({ top: "41%", left: "64%" }) baloon.css({ top: "38%", left: "62%" })
baloon.show(); baloon.show();
setTimeout ( function (){ setTimeout ( function (){
$("#person4").hide(); $("#person4").hide();
@ -191,7 +194,7 @@
duo.css ("zIndex", 0); duo.css ("zIndex", 0);
avatar.addClass("flipped"); avatar.addClass("flipped");
avatar.css({ top: "14%", left: "17%" }); avatar.css({ top: "14%", left: "17%" });
baloon.css({ top: "5%", left: "21%" }); baloon.css({ top: "2%", left: "17%" });
baloon.show(); baloon.show();
setTimeout ( function (){ setTimeout ( function (){
$("#person5").hide(); $("#person5").hide();
@ -207,7 +210,7 @@
$(".fighters").html(villagers); $(".fighters").html(villagers);
duo.css ("zIndex", 1); duo.css ("zIndex", 1);
avatar.css({ top: "53%", left: "29%" }); avatar.css({ top: "53%", left: "29%" });
baloon.css({ top: "43%", left: "31%" }); baloon.css({ top: "40%", left: "29%" });
baloon.show(); baloon.show();
setTimeout ( function (){ setTimeout ( function (){
$("#person6").hide(); $("#person6").hide();
@ -218,15 +221,12 @@
}); });
$("#person7").click (function(){ $("#person7").click (function(){
if (avatar.hasClass("flipped") == false) { check_flipping();
avatar.addClass("flipped");
}
villagers ++; villagers ++;
$(".fighters").html(villagers); $(".fighters").html(villagers);
avatar.addClass("flipped");
avatar.css ("zIndex", -1); avatar.css ("zIndex", -1);
avatar.css({ top: "33%", left: "26%" }); avatar.css({ top: "50%", left: "20%" });
baloon.css({ top: "24%", left: "28%" }); baloon.css({ top: "38%", left: "20%" });
baloon.show(); baloon.show();
setTimeout ( function (){ setTimeout ( function (){
$("#person7").hide(); $("#person7").hide();
@ -242,7 +242,7 @@
$(".fighters").html(villagers); $(".fighters").html(villagers);
duo.css ("zIndex", 1); duo.css ("zIndex", 1);
avatar.css({ top: "43%", left: "72%" }); avatar.css({ top: "43%", left: "72%" });
baloon.css({ top: "35%", left: "75%" }); baloon.css({ top: "32%", left: "72%" });
baloon.show(); baloon.show();
setTimeout ( function (){ setTimeout ( function (){
$("#person8").hide(); $("#person8").hide();
@ -257,7 +257,7 @@
villagers ++; villagers ++;
$(".fighters").html(villagers); $(".fighters").html(villagers);
avatar.css({top: "29%", left: "48%"}); avatar.css({top: "29%", left: "48%"});
baloon.css({ top: "19%", left: "51%" }); baloon.css({top: "17%", left: "48%"});
baloon.show(); baloon.show();
setTimeout ( function (){ setTimeout ( function (){
$("#person9").hide(); $("#person9").hide();
@ -270,8 +270,8 @@
function end_recluting() { function end_recluting() {
if (villagers == 9) { if (villagers == 9) {
setTimeout ( function (){ setTimeout ( function (){
$(".game_bar").addClass("game_bar_glow");
$(".message1").hide(); $(".message1").hide();
$(".message2").show(); $(".message2").show();
$(".invert").addClass("invert_style"); $(".invert").addClass("invert_style");

Loading…
Cancel
Save