master
*anna* 4 years ago
parent a57974b3a9
commit eb8b62635e

@ -105,6 +105,21 @@ div.text_container {
cursor:pointer;
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 ;
}
svg {
width: 100%;
height: 100%;
position:absolute;
z-index: -10;
stroke:black;
stroke-width:1px;
}
button{
-webkit-appearance: none;
@ -206,65 +221,79 @@ div#player_img {
z-index:3;
}
.children1 {
top:5%;
right: 6%;
.figure1{
bottom: 47%;
left: 89%;
position: absolute;
z-index: 3;
}
.children2 {
top:40%;
right: 2%;
.figure2{
bottom:60%;
left: 87.5%;
position: absolute;
z-index:3;
z-index: 3;
}
.decoration {
top:35%;
right: 10%;
.figure3{
bottom:30%;
left: 95%;
position: absolute;
z-index: 3;
}
.figure4{
bottom:25%;
left: 88%;
position: absolute;
z-index: 3;
}
.people{
cursor:pointer;
}
.figure1{
#meat1{
bottom: 50%;
right: 9%;
right: 14%;
position: absolute;
z-index: 3;
cursor: pointer;
}
.figure2{
bottom:60%;
right: 12%;
#meat2{
bottom:62%;
right: 14%;
position: absolute;
z-index: 3;
cursor: pointer;
}
.figure3{
bottom:30%;
right: 2%;
#meat3{
bottom:33%;
right: 14%;
position: absolute;
z-index: 3;
cursor: pointer;
}
.figure4{
bottom:25%;
right: 10%;
#meat4{
bottom:26%;
right: 14%;
position: absolute;
z-index: 3;
cursor: pointer;
}
.tunnel_people{
left: 94%;
bottom:40%;
position: absolute;
display: none;
}
/*images*/
.bus1 {
top:9%;
left: 17%;
position: absolute;
z-index:-1;
}
.bus2 {
top:47%;
@ -319,7 +348,7 @@ div#player_img {
/* amanda baloons*/
.bubble1 {
right: 8%;
left: 90%;
top:12%;
position: absolute;
background: #ffffff;
@ -363,7 +392,7 @@ div#player_img {
}
.bubble2 {
right: 14%;
left: 84%;
top:5%;
position: absolute;
background: #ffffff;

@ -31,6 +31,25 @@
</div>
<div id="ground">
<svg class="tunnel invert" style="display: none;">
<line x1="93%" y1="40%" x2="93%" y2="110%"/>
<line x1="97.4%" y1="40%" x2="97.4%" y2="110%"/>
</svg>
<div id="player_img" class="tunnel_people"></div>
<img id="tunnel1" class="tunnel_people" src="imgs/spring_river/fighter1.gif" height="120px" >
<img id="tunnel2" class="tunnel_people" src="imgs/spring_river/fighter2.gif" height="120px">
<img id="tunnel3" class="tunnel_people" src="imgs/spring_river/fighter3.gif" height="120px">
<img id="tunnel4" class="tunnel_people" src="imgs/spring_river/fighter4.gif" height="120px">
<img id="tunnel5" class="tunnel_people" src="imgs/spring_river/fighter5.gif" height="120px">
<img id="tunnel6" class="tunnel_people" src="imgs/spring_river/fighter6.gif" height="110px">
<img id="tunnel7" class="tunnel_people" src="imgs/spring_river/fighter7.gif" height="120px">
<img id="tunnel8" class="tunnel_people" src="imgs/spring_river/fighter8.gif" height="120px">
<img id="meat1" class="meat" src="imgs/bus_station/meat.gif" height="50px" style="display: none;">
<img id="meat2" class="meat" src="imgs/bus_station/meat.gif" height="50px" style="display: none;">
<img id="meat3" class="meat" src="imgs/bus_station/meat.gif" height="50px" style="display: none;">
<img id="meat4" class="meat" src="imgs/bus_station/meat.gif" height="50px" style="display: none;">
<div class="bus1">
<img id="bus1" src="imgs/bus_station/car2.gif" height="90px">
@ -65,27 +84,23 @@
<img id="bus_fire8" src="imgs/bus_station/bus2_fire.gif" height="130px"style="display: none;">
</div>
<img id="warehouse" src="imgs/bus_station/warehouse4.png" height="260px">
<div class="figure1">
<img id="person1" src="imgs/bus_station/guard_human1.gif" height="80px">
<img id="saurian1" src="imgs/bus_station/guard_rept1.gif" height="100px" style="display: none;">
<img id="person1" class="people" src="imgs/bus_station/guard_human1.gif" height="80px">
<img id="saurian1" class="saurians" src="imgs/bus_station/guard_rept1.gif" height="100px" style="display: none;">
</div>
<div class="figure2">
<img id="person2" src="imgs/bus_station/guard_human2.gif" height="130px">
<img id="saurian2" src="imgs/bus_station/guard_rept2.gif" height="110px" style="display: none;">
<img id="person2" class="people" src="imgs/bus_station/guard_human2.gif" height="130px">
<img id="saurian2" class="saurians" src="imgs/bus_station/guard_rept2.gif" height="110px" style="display: none;">
</div>
<div class="figure3">
<img id="person3" src="imgs/bus_station/guard_human3.gif" height="110px">
<img id="saurian3" src="imgs/bus_station/guard_rept3.gif" height="115px" style="display: none;">
<img id="person3" class="people" src="imgs/bus_station/guard_human3.gif" height="110px">
<img id="saurian3" class="saurians" src="imgs/bus_station/guard_rept3.gif" height="115px" style="display: none;">
</div>
<div class="figure4">
<img id="person4" src="imgs/bus_station/guard_human4.gif" height="100px">
<img id="saurian4" src="imgs/bus_station/guard_rept4.gif" height="120px" style="display: none;">
<img id="person4" class="people" src="imgs/bus_station/guard_human4.gif" height="100px">
<img id="saurian4" class="saurians" src="imgs/bus_station/guard_rept4.gif" height="120px" style="display: none;">
</div>
@ -104,11 +119,11 @@
These people look suspicious. They seem to be guarding the entrance of that warehouse.
</div>
<div class="message3" style="display: none;">
The situation is getting dangerous. But remember, you still have the kitten steaks with you. <br>
The situation is getting dangerous. But remember, you still have the cat steaks with you. <br>
<span class="instructions"><span class="instructions_arrow"></span> Use them to pay the entry fee for you and your buddies</span>
</div>
<div class="message4" style="display: none;">
Your pawn has been accepted by the saurian guards. You are now able to enter the headquarter.
Your pawn has been accepted. You are now able to enter the saurians' headquarter.
</div>
</div>
@ -223,28 +238,28 @@ $(document).keydown(function(e) {
var click_counter = 0;
$(".figure1").click(function () {
$("#person1").click(function () {
click_counter ++;
$("#person1").hide();
$("#saurian1").show();
reach_counter()
});
$(".figure2").click(function () {
$("#person2").click(function () {
click_counter ++;
$("#person2").hide();
$("#saurian2").show();
reach_counter()
});
$(".figure3").click(function () {
$("#person3").click(function () {
click_counter ++;
$("#person3").hide();
$("#saurian3").show();
reach_counter()
});
$(".figure4").click(function () {
$("#person4").click(function () {
click_counter ++;
$("#person4").hide();
$("#saurian4").show();
@ -261,12 +276,177 @@ $(document).keydown(function(e) {
$(".bubble2").show();
setTimeout( function () {
$(".message2,.message1").hide();
$(".message3, .game_bar").show();
$(".message3, .game_bar, .meat").show();
}, 2000);
}, 2000);
};
}
$("#meat1").click(function () {
console.log ("ora!")
$("#meat1").animate({ left: "89%"}, {
duration: 300
}).promise().done(function(){
$("#meat1").hide();
-- cat_meat;
$('.cat_meat_bar').html(cat_meat);
check_meat();
});
});
$("#meat2").click(function () {
console.log ("ora!")
$("#meat2").animate({ left: "87%"}, {
duration: 300
}).promise().done(function(){
$("#meat2").hide();
-- cat_meat;
$('.cat_meat_bar').html(cat_meat);
check_meat();
});
});
$("#meat3").click(function () {
console.log ("ora!")
$("#meat3").animate({ left: "95%"}, {
duration: 300
}).promise().done(function(){
$("#meat3").hide();
-- cat_meat;
$('.cat_meat_bar').html(cat_meat);
check_meat();
});
});
$("#meat4").click(function () {
console.log ("ora!")
$("#meat4").animate({ left: "88%"}, {
duration: 300
}).promise().done(function(){
$("#meat4").hide();
-- cat_meat;
$('.cat_meat_bar').html(cat_meat);
check_meat();
});
});
function check_meat() {
if (cat_meat == 3) {
$(".bubble1, .bubble2").hide();
} if (cat_meat == 0) {
console.log("carne finita");
$(".game_bar").addClass("game_bar_glow");
setTimeout( function() {
$(".game_bar").hide();
$(".figure3").animate({ left: "90%"}, {
duration: 500
}).promise().done(function(){
$(".message3").hide();
$(".tunnel, .message4").show();
setTimeout (enter, 2000);
});
}, 1000);
}
};
function enter() {
$("#fighter1").hide();
$("#tunnel1").show();
$("#tunnel1").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#tunnel1").hide();
$("#fighter2").hide();
$("#tunnel2").show();
$("#tunnel2").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#tunnel2").hide();
$("#fighter3").hide();
$("#tunnel3").show();
$("#tunnel3").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#tunnel3").hide();
$("#fighter4").hide();
$("#tunnel4").show();
$("#tunnel4").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#tunnel4").hide();
$("#fighter5").hide();
$("#tunnel5").show();
$("#tunnel5").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#tunnel5").hide();
$("#fighter6").hide();
$("#tunnel6").show();
$("#tunnel6").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#tunnel6").hide();
$("#fighter7").hide();
$("#tunnel7").show();
$("#tunnel7").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#tunnel7").hide();
$("#fighter8").hide();
$("#tunnel8").show();
$("#tunnel8").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#tunnel8").hide();
$("#fighter9").hide();
$("#tunnel9").show();
$("#tunnel9").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#tunnel9").hide();
$(".army").hide();
$("#player_img").show();
$("#player_img").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#player_img").hide();
$(".tunnel").hide();
setTimeout( function (){
location.href='saurians_head.html';
}, 1000);
});
});
});
});
});
});
});
});
});
});
}
/*
function enter() {
$("#fighter1").hide();
document.getElementById("fighter1").style.position = "fixed";
$("#fighter1").css({ left: "82%", top:"40%"});
setTimeout ( function (){
$("#fighter1").show();
$("#fighter1").animate({ top: "100%"}, {
duration: 1000
}).promise().done(function(){
$("#fighter1").hide();
});
}, 500);
}
*/

BIN
tree/imgs/.DS_Store vendored

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.4 KiB

Loading…
Cancel
Save