master
*anna* 3 years ago
parent 77dc032346
commit c9bebd8352

BIN
.DS_Store vendored

Binary file not shown.

BIN
tree/.DS_Store vendored

Binary file not shown.

@ -90,6 +90,9 @@
$("#house1").click(function(){ $("#house1").click(function(){
$("#house1").addClass("touch_animation"); $("#house1").addClass("touch_animation");
setTimeout( function(){
$("#house5").removeClass("touch_animation");
},500);
house_counter ++; house_counter ++;
console.log(house_counter); console.log(house_counter);
pat_appear() pat_appear()
@ -97,6 +100,9 @@
$("#house2").click(function(){ $("#house2").click(function(){
$("#house2").addClass("touch_animation"); $("#house2").addClass("touch_animation");
setTimeout( function(){
$("#house2").removeClass("touch_animation");
},500);
house_counter ++; house_counter ++;
console.log(house_counter); console.log(house_counter);
$("#snake").show(); $("#snake").show();
@ -110,6 +116,9 @@
$("#house3").click(function(){ $("#house3").click(function(){
$("#house3").addClass("touch_animation"); $("#house3").addClass("touch_animation");
setTimeout( function(){
$("#house3").removeClass("touch_animation");
},500);
house_counter ++; house_counter ++;
console.log(house_counter); console.log(house_counter);
$("#dog").show(); $("#dog").show();
@ -123,6 +132,9 @@
$("#house4").click(function(){ $("#house4").click(function(){
$("#house4").addClass("touch_animation"); $("#house4").addClass("touch_animation");
setTimeout( function(){
$("#house4").removeClass("touch_animation");
},500);
house_counter ++; house_counter ++;
console.log(house_counter); console.log(house_counter);
pat_appear() pat_appear()
@ -130,6 +142,9 @@
$("#house5").click(function(){ $("#house5").click(function(){
$("#house5").addClass("touch_animation"); $("#house5").addClass("touch_animation");
setTimeout( function(){
$("#house5").removeClass("touch_animation");
},500);
house_counter ++; house_counter ++;
console.log(house_counter); console.log(house_counter);
pat_appear() pat_appear()
@ -137,6 +152,9 @@
$("#house6").click(function(){ $("#house6").click(function(){
$("#house6").addClass("touch_animation"); $("#house6").addClass("touch_animation");
setTimeout( function(){
$("#house6").removeClass("touch_animation");
},500);
house_counter ++; house_counter ++;
console.log(house_counter); console.log(house_counter);
$("#lizard").show(); $("#lizard").show();
@ -157,7 +175,6 @@
$(".bubble1").show(); $(".bubble1").show();
setTimeout(function(){ setTimeout(function(){
$(".message1").hide(); $(".message1").hide();
$(".message2").show();
}, 1000); }, 1000);
}, 1000); }, 1000);
}, 1000); }, 1000);
@ -166,6 +183,7 @@
$(".bubble1").click(function(){ $(".bubble1").click(function(){
$(".bubble1").hide(); $(".bubble1").hide();
$(".bubble2").show(); $(".bubble2").show();
$(".message2").show();
}); });
$(".bubble2").click(function(){ $(".bubble2").click(function(){

@ -87,7 +87,7 @@ img.inText{
border-radius: 10px; border-radius: 10px;
z-index: 0; z-index: 0;
font-size: 22px; font-size: 22px;
line-height: 20px; line-height: 22px;
padding: 20px; padding: 20px;
z-index: 1; z-index: 1;

@ -122,7 +122,7 @@ span.button_text{
bottom:7%; bottom:7%;
right:4%; right:4%;
font-size: 22px; font-size: 22px;
line-height: 25px; line-height: 22px;
color: #c94dff; color: #c94dff;
background: #ffffff; background: #ffffff;
font-family: jolyregular; font-family: jolyregular;

@ -10,6 +10,17 @@
</head> </head>
<body> <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="mulino" src="imgs/monteferro/mulino.gif" height="140px">
<img id="tree1" src="imgs/monteferro/tree.gif" height="220px"> <img id="tree1" src="imgs/monteferro/tree.gif" height="220px">
@ -81,14 +92,33 @@
<script src="jquery.min.js"></script> <script src="jquery.min.js"></script>
<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 // saves game step in the local storage + onload functions
window.onload = function() { window.onload = function() {
theme.play();
window.localStorage.setItem("monteferro","opened"); window.localStorage.setItem("monteferro","opened");
console.log ("monteferro:",localStorage.monteferro); console.log ("monteferro:",localStorage.monteferro);
$('.cobs_collected').html("0"); $('.cobs_collected').html("0");
setTimeout (function () { setTimeout (function () {
comic_ned.play();
$(".ned_baloon1").show(); $(".ned_baloon1").show();
},1000); },1000);
@ -105,27 +135,33 @@
/*ned baloons */ /*ned baloons */
$("#gallina1").click (function () { $("#gallina1").click (function () {
chicken.play();
$("#chicken1_baloon").show(); $("#chicken1_baloon").show();
}); });
$("#gallina2").click (function () { $("#gallina2").click (function () {
smoke.play();
$("#gallina2").attr("src","imgs/monteferro/roasted.gif"); $("#gallina2").attr("src","imgs/monteferro/roasted.gif");
}); });
$("#gallina3").click (function () { $("#gallina3").click (function () {
smoke.play();
$("#gallina3").attr("src","imgs/monteferro/roasted.gif"); $("#gallina3").attr("src","imgs/monteferro/roasted.gif");
}); });
$("#chicken1_baloon").click (function () { $("#chicken1_baloon").click (function () {
click.play();
$("#chicken1_baloon").toggle(); $("#chicken1_baloon").toggle();
}); });
$(".ned_baloon1").click (function () { $(".ned_baloon1").click (function () {
comic_ned.play();
$(".ned_baloon1").toggle(); $(".ned_baloon1").toggle();
$(".ned_baloon2").show(); $(".ned_baloon2").show();
}); });
$(".ned_baloon2").click (function () { $(".ned_baloon2").click (function () {
click.play();
$(".message1").hide(); $(".message1").hide();
$(".message2").show(); $(".message2").show();
$(".ned_baloon2").toggle(); $(".ned_baloon2").toggle();
@ -133,6 +169,7 @@
$("#start_button").click (function () { $("#start_button").click (function () {
click.play();
$(".ned_baloon2,.ned_baloon1, .message1, .message2 ").hide(); $(".ned_baloon2,.ned_baloon1, .message1, .message2 ").hide();
$(".game_bar").show(); $(".game_bar").show();
$(".field_cover").css("z-index",-10); $(".field_cover").css("z-index",-10);
@ -145,6 +182,7 @@ var loose_counter = 0;
$("#corn1").click (function () { $("#corn1").click (function () {
$("#corn1").attr('src', "imgs/monteferro/pill.gif"); $("#corn1").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
@ -152,40 +190,47 @@ var loose_counter = 0;
$("#corn2").click (function () { $("#corn2").click (function () {
$("#corn2").attr('src', "imgs/monteferro/pill.gif"); $("#corn2").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
}); });
$("#corn3").click (function () { $("#corn3").click (function () {
no.play();
loose_counter ++; loose_counter ++;
check_counters(); check_counters();
}); });
$("#corn4").click (function () { $("#corn4").click (function () {
no.play();
loose_counter ++; loose_counter ++;
check_counters(); check_counters();
}); });
$("#corn5").click (function () { $("#corn5").click (function () {
no.play();
loose_counter ++; loose_counter ++;
check_counters(); check_counters();
}); });
$("#corn6").click (function () { $("#corn6").click (function () {
$("#corn6").attr('src', "imgs/monteferro/pill.gif"); $("#corn6").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
}); });
$("#corn7").click (function () { $("#corn7").click (function () {
yes.play();
loose_counter ++; loose_counter ++;
check_counters(); check_counters();
}); });
$("#corn8").click (function () { $("#corn8").click (function () {
$("#corn8").attr('src', "imgs/monteferro/pill.gif"); $("#corn8").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
@ -193,6 +238,7 @@ var loose_counter = 0;
$("#corn9").click (function () { $("#corn9").click (function () {
$("#corn9").attr('src', "imgs/monteferro/pill.gif"); $("#corn9").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
@ -200,6 +246,7 @@ var loose_counter = 0;
$("#corn10").click (function () { $("#corn10").click (function () {
$("#corn10").attr('src', "imgs/monteferro/pill.gif"); $("#corn10").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
@ -207,23 +254,27 @@ var loose_counter = 0;
$("#corn11").click (function () { $("#corn11").click (function () {
$("#corn11").attr('src', "imgs/monteferro/pill.gif"); $("#corn11").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
}); });
$("#corn12").click (function () { $("#corn12").click (function () {
no.play();
loose_counter ++; loose_counter ++;
check_counters(); check_counters();
}); });
$("#corn13").click (function () { $("#corn13").click (function () {
no.play();
loose_counter ++; loose_counter ++;
check_counters(); check_counters();
}); });
$("#corn14").click (function () { $("#corn14").click (function () {
$("#corn14").attr('src', "imgs/monteferro/pill.gif"); $("#corn14").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
@ -231,6 +282,7 @@ var loose_counter = 0;
$("#corn15").click (function () { $("#corn15").click (function () {
$("#corn15").attr('src', "imgs/monteferro/pill.gif"); $("#corn15").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
@ -238,23 +290,27 @@ var loose_counter = 0;
$("#corn16").click (function () { $("#corn16").click (function () {
$("#corn1").attr('src', "imgs/monteferro/pill.gif"); $("#corn1").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
}); });
$("#corn17").click (function () { $("#corn17").click (function () {
no.play();
loose_counter ++; loose_counter ++;
check_counters(); check_counters();
}); });
$("#corn18").click (function () { $("#corn18").click (function () {
no.play();
loose_counter ++; loose_counter ++;
check_counters(); check_counters();
}); });
$("#corn19").click (function () { $("#corn19").click (function () {
$("#corn19").attr('src', "imgs/monteferro/pill.gif"); $("#corn19").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
@ -262,6 +318,7 @@ var loose_counter = 0;
$("#corn20").click (function () { $("#corn20").click (function () {
$("#corn20").attr('src', "imgs/monteferro/pill.gif"); $("#corn20").attr('src', "imgs/monteferro/pill.gif");
yes.play();
fluoride_counter ++; fluoride_counter ++;
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);
check_counters(); check_counters();
@ -270,6 +327,7 @@ var loose_counter = 0;
function check_counters() { function check_counters() {
if (fluoride_counter == 5) { if (fluoride_counter == 5) {
click.play();
$(".game_bar").addClass("game_bar_glow"); $(".game_bar").addClass("game_bar_glow");
$(".field_cover").css("z-index",10); $(".field_cover").css("z-index",10);
console.log ("you won!"); console.log ("you won!");
@ -281,6 +339,7 @@ var loose_counter = 0;
} }
if (loose_counter == 3) { if (loose_counter == 3) {
anger.play();
$(".field_cover").css("z-index",10); $(".field_cover").css("z-index",10);
console.log ("you lost!"); console.log ("you lost!");
fluoride_counter = 0; fluoride_counter = 0;
@ -292,6 +351,7 @@ var loose_counter = 0;
} }
$("#try_again").click (function () { $("#try_again").click (function () {
click.play();
$(".field_cover").css("z-index",-10); $(".field_cover").css("z-index",-10);
$(".corn").attr('src', "imgs/monteferro/corn.gif"); $(".corn").attr('src', "imgs/monteferro/corn.gif");
$('.cobs_collected').html(fluoride_counter); $('.cobs_collected').html(fluoride_counter);

@ -127,6 +127,7 @@ span.button_text{
-webkit-box-shadow: 10px 10px 0px 0px rgba(0,0,0,1); -webkit-box-shadow: 10px 10px 0px 0px rgba(0,0,0,1);
-moz-box-shadow: 10px 10px 0px 0px rgba(0,0,0,1); -moz-box-shadow: 10px 10px 0px 0px rgba(0,0,0,1);
box-shadow: 10px 10px 0px 0px rgba(0,0,0,1); box-shadow: 10px 10px 0px 0px rgba(0,0,0,1);
text-align: justify;
} }
.news_title_index{ .news_title_index{
@ -156,9 +157,24 @@ span.button_text{
} }
.index, .school1 , .school2, .school3,.school4, .school5 { .index, .school1 , .school2, .school3,.school4, .school5 {
padding: 5%; padding: 5%;
/*
margin-top: 10%;
column-count: 2;
column-fill: auto;
column-span: all;*/
}
div.index{
column-count: 1;
column-fill: auto;
column-span: all;
width: 50%;
} }
.right_page{ .right_page{
float:right; float:right;
max-width: 50%; max-width: 50%;
@ -475,9 +491,9 @@ text-decoration: underline solid 3px;
right:4%; right:4%;
border:1px #c94dff solid; border:1px #c94dff solid;
font-size: 22px; font-size: 22px;
/*line-height: 30px;*/ line-height: 22px;
width: 800px; width: 800px;
height: 135px; height: 120px;
border-radius: 10px; border-radius: 10px;
padding: 20px; padding: 20px;
z-index: 100; z-index: 100;
@ -526,9 +542,9 @@ text-decoration: underline solid 3px;
right:4%; right:4%;
border:1px #c94dff solid; border:1px #c94dff solid;
font-size: 22px; font-size: 22px;
/*line-height: 30px;*/ line-height: 22px;
width: 600px; width: 600px;
height: 160px; height: 135px;
border-radius: 10px; border-radius: 10px;
padding: 20px; padding: 20px;
z-index: 100; z-index: 100;

@ -8,6 +8,14 @@
<link rel="stylesheet" href="park.css"> <link rel="stylesheet" href="park.css">
</head> </head>
<audio loop="loop" id="theme1" preload="auto"><source src="sound/theme1.wav" type="audio/wav"></audio>
<audio id="page"><source src="sound/page.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>
<body class="park_body"> <body class="park_body">
<span id="info_button" class="blur_button" ></span> <span id="info_button" class="blur_button" ></span>
<div class="info_text" style="display: none;"> <div class="info_text" style="display: none;">
@ -59,8 +67,8 @@
<div class="left_page"> <div class="left_page">
<div class="index" > <div class="index" >
<p class="news_title_index"> </p> <!--<p class="news_title_index"> </p>
<br><br> <br><br>-->
<p class="news_index"> <p class="news_index">
From the Pleasant Valley Elementary School: An educational trip surrounded by nature From the Pleasant Valley Elementary School: An educational trip surrounded by nature
<br>by the School Administration <br> <br>by the School Administration <br>
@ -143,16 +151,16 @@
<div class="text_container"> <div class="text_container">
<div class="message1"> <div class="message1">
It's Saturday morning. You are at the park waiting for your friend Amanda. She seems to be really late. It's Saturday morning. You are at the park waiting for your friend Amanda. She seems to be really late.
You spot a copy of today's newspaper on the bench close to you: maybe you want to give it a read. You can also <button onclick="location.href='park_N_clues.html';"><span class="button_text">go for a little walk</span></button> or just <button class="wait_for_amanda"><span class="button_text">wait for Amanda</span></button>. You spot a copy of today's newspaper on the bench close to you: maybe you want to give it a read. You can also <button onclick="location.href='park_N_clues.html';click.play();"><span class="button_text">go for a little walk</span></button> or just <button class="wait_for_amanda"><span class="button_text">wait for Amanda</span></button>.
</div> </div>
<div class="message4" style="display:none;"> <div class="message4" style="display:none;">
It looks like Amanda is not able to join you ( ͡❛ ︹ ͡❛). It looks like Amanda is not able to join you ( ͡❛ ︹ ͡❛).
There is a nice kiosk close by: go there to get fries. You can still have a look at the news or <button onclick="location.href='park_N_clues.html';"><span class="button_text">go for a walk</span></button> . There is a nice kiosk close by: go there to get fries. You can still have a look at the news or <button onclick="location.href='park_N_clues.html';click.play();"><span class="button_text">go for a walk</span></button> .
</div> </div>
<div class="message5 " style="display:none;"> <div class="message5 " style="display:none;">
Amanda often volunteers for the cat shelter, maybe she went there to help. Amanda often volunteers for the cat shelter, maybe she went there to help.
Can this be the reason why she is late? <button onclick="location.href='cat_shelter.html';"><span class="button_text">Look for her at the cat shelter!</span></button> Can this be the reason why she is late? <button onclick="location.href='cat_shelter.html';click.play(); "><span class="button_text">Look for her at the cat shelter!</span></button>
</div> </div>
</div> </div>
@ -162,6 +170,11 @@
<script src="jquery.min.js"></script> <script src="jquery.min.js"></script>
<script> <script>
// audio
var theme = document.querySelector("#theme1");
var page = document.querySelector("#page");
var click = document.querySelector("#click");
var comic = document.querySelector("#comic");
//get player avatar from local storage //get player avatar from local storage
console.log (localStorage.myavatar) console.log (localStorage.myavatar)
@ -170,10 +183,21 @@
var player_img = document.querySelector("#player_img"); var player_img = document.querySelector("#player_img");
player_img.appendChild(img); player_img.appendChild(img);
$("body").hover( function() {
theme.play();
theme.addEventListener('paused',function() {
theme.play();
},false);
})
//get player name from local storage //get player name from local storage
//store that you've been in the park //store that you've been in the park
window.onload = function() { window.onload = function() {
theme.play();
theme.addEventListener('paused',function() {
theme.play();
},false);
window.localStorage.setItem("park","opened") window.localStorage.setItem("park","opened")
console.log ("park:",localStorage.park) console.log ("park:",localStorage.park)
document.querySelector('#player_name').innerHTML = localStorage.playerName; document.querySelector('#player_name').innerHTML = localStorage.playerName;
@ -183,11 +207,13 @@
$(".text_container").hide(); $(".text_container").hide();
$(".blur, .blur_button ").addClass("blur_background"); $(".blur, .blur_button ").addClass("blur_background");
$("#no_delete").click (function(){ $("#no_delete").click (function(){
click.play();
$(".memory").hide(); $(".memory").hide();
$(".text_container").show(); $(".text_container").show();
$(".blur, .blur_button").removeClass("blur_background"); $(".blur, .blur_button").removeClass("blur_background");
}); });
$("#delete").click (function(){ $("#delete").click (function(){
click.play();
var avatar_image = localStorage.getItem('myavatar'); var avatar_image = localStorage.getItem('myavatar');
console.log(avatar_image); console.log(avatar_image);
var avatar_name = localStorage.getItem('playerName'); var avatar_name = localStorage.getItem('playerName');
@ -207,7 +233,8 @@
// open newspaper // open newspaper
$("#bench").click (function(){ $("#bench").click (function(){
$(".message1, .message4, .bubble1, .bubble2").hide(); click.play();
$(".message1, .message4, .message5, .bubble1, .bubble2").hide();
$("#newspaper, .close").show(); $("#newspaper, .close").show();
$(".blur, .blur_button"). addClass("blur_background"); $(".blur, .blur_button"). addClass("blur_background");
//saves that u opened the newspaper in the local storage //saves that u opened the newspaper in the local storage
@ -218,17 +245,20 @@
//newspaper pages //newspaper pages
$("#arrow_go1").click (function(){ $("#arrow_go1").click (function(){
page.play();
$(".index, .school1, .message1, .message4 ").hide(); $(".index, .school1, .message1, .message4 ").hide();
$(".school2, .school3, #baloon1, #baloon2").show(); $(".school2, .school3, #baloon1, #baloon2").show();
}); });
$("#arrow_back1").click (function(){ $("#arrow_back1").click (function(){
page.play();
$("#baloon1, #baloon2, #baloon3, #baloon4, .school2,.school3").hide(); $("#baloon1, #baloon2, #baloon3, #baloon4, .school2,.school3").hide();
$(".index, .school1").show(); $(".index, .school1").show();
}); });
$("#arrow_go2").click (function(){ $("#arrow_go2").click (function(){
page.play();
$(".school2").hide(); $(".school2").hide();
$(".school3").hide(); $(".school3").hide();
$("#baloon1").hide(); $("#baloon1").hide();
@ -240,6 +270,7 @@
}); });
$("#arrow_back2").click (function(){ $("#arrow_back2").click (function(){
page.play();
$(".school4").hide(); $(".school4").hide();
$(".school5").hide(); $(".school5").hide();
$("#baloon3").hide(); $("#baloon3").hide();
@ -251,6 +282,7 @@
}); });
$(".wait_for_amanda").click (function(){ $(".wait_for_amanda").click (function(){
click.play();
$(".message1").hide(); $(".message1").hide();
$("#newspaper,#baloon1, #baloon2, #baloon3, #baloon4, .close").hide(); $("#newspaper,#baloon1, #baloon2, #baloon3, #baloon4, .close").hide();
$(".message4").show(); $(".message4").show();
@ -259,6 +291,7 @@
}); });
$(".close").click (function(){ $(".close").click (function(){
click.play();
$("#newspaper").hide(); $("#newspaper").hide();
$(".close").hide(); $(".close").hide();
$("#baloon1").hide(); $("#baloon1").hide();
@ -272,16 +305,19 @@
}); });
$("#fries").click (function(){ $("#fries").click (function(){
click.play();
$("#newspaper, .message4").hide(); $("#newspaper, .message4").hide();
$(".message5, #kiosk ").show(); $(".message5, #kiosk ").show();
}); });
$("#kiosk").click (function(){ $("#kiosk").click (function(){
comic.play();
$(".bubble1").show(); $(".bubble1").show();
}); });
$(".bubble1").click (function (){ $(".bubble1").click (function (){
comic.play();
$(".bubble1").hide(); $(".bubble1").hide();
$(".bubble2").show(); $(".bubble2").show();
setTimeout (function () { setTimeout (function () {
@ -291,10 +327,12 @@
}); });
$(".bubble2").click (function (){ $(".bubble2").click (function (){
click.play();
$(".bubble2").toggle(); $(".bubble2").toggle();
}); });
$("#info_button").click (function (){ $("#info_button").click (function (){
click.play();
$(".info_text").toggle(); $(".info_text").toggle();
$(".blur"). toggleClass("blur_background"); $(".blur"). toggleClass("blur_background");
$(".text_container").toggle(); $(".text_container").toggle();
@ -302,6 +340,5 @@
</script> </script>
<script type="text/javascript" src="index.js" ></script>
</body> </body>

@ -9,6 +9,13 @@
</head> </head>
<body> <body>
<audio loop="loop" id="theme1" preload="auto"><source src="sound/theme1.wav" type="audio/wav"></audio>
<audio id="page"><source src="sound/page.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="bark"><source src="sound/bark.wav" type="audio/wav"></audio>
<div id="groundline"></div> <div id="groundline"></div>
@ -73,8 +80,21 @@
<script src="jquery.min.js"></script> <script src="jquery.min.js"></script>
<script> <script>
// audio
// player moves var theme = document.querySelector("#theme1");
var page = document.querySelector("#page");
var click = document.querySelector("#click");
var comic = document.querySelector("#comic");
var comic_ned = document.querySelector("#comic_ned");
var bark = document.querySelector("#bark");
$("body").hover( function() {
theme.play();
theme.addEventListener('paused',function() {
theme.play();
},false);
})
//adjust camera scroll //adjust camera scroll
var $div = $('#player_img'); var $div = $('#player_img');
@ -95,7 +115,6 @@
$(document).scrollLeft(playerLeft - screenLeftMin) $(document).scrollLeft(playerLeft - screenLeftMin)
} }
} }
@ -199,6 +218,7 @@ $(document).keydown(function(e) {
// saves game step in the local storage // saves game step in the local storage
window.onload = function() { window.onload = function() {
theme.play();
window.localStorage.setItem("looking_for_N","opened") window.localStorage.setItem("looking_for_N","opened")
console.log ("looking for N:",localStorage.looking_for_N) console.log ("looking for N:",localStorage.looking_for_N)
} }
@ -214,59 +234,73 @@ $(document).keydown(function(e) {
$("#woman").click (function(){ $("#woman").click (function(){
comic.play();
$(".woman_bubble").show(); $(".woman_bubble").show();
}); });
$(".woman_bubble").click (function(){ $(".woman_bubble").click (function(){
click.play();
$(".woman_bubble").toggle(); $(".woman_bubble").toggle();
}); });
$("#dog").click (function(){ $("#dog").click (function(){
bark.play();
$(".dog_bubble").toggle(); $(".dog_bubble").toggle();
}); });
$(".dog_bubble").click (function(){ $(".dog_bubble").click (function(){
bark.play();
$(".message1, .dog_bubble").hide(); $(".message1, .dog_bubble").hide();
$(".dog_bubble2, .message_dog").toggle(); $(".dog_bubble2, .message_dog").toggle();
}); });
$(".dog_bubble2").click (function(){ $(".dog_bubble2").click (function(){
click.play();
$(".message1").hide(); $(".message1").hide();
$(".message_dog, .dog_bubble2").toggle(); $(".message_dog, .dog_bubble2").toggle();
}); });
$("#newspaper_seller").click (function(){ $("#newspaper_seller").click (function(){
comic.play();
$(".vendor_bubble").show(); $(".vendor_bubble").show();
}); });
$(".vendor_bubble").click (function(){ $(".vendor_bubble").click (function(){
click.play();
$(".vendor_bubble").toggle(); $(".vendor_bubble").toggle();
}); });
$("#sport1").click (function(){ $("#sport1").click (function(){
comic.play();
$(".fit2_bubble").show(); $(".fit2_bubble").show();
}); });
$(".fit2_bubble").click (function(){ $(".fit2_bubble").click (function(){
click.play();
$(".fit2_bubble").toggle(); $(".fit2_bubble").toggle();
}); });
$("#sport2").click (function(){ $("#sport2").click (function(){
comic.play();
$(".fit1_bubble").show(); $(".fit1_bubble").show();
}); });
$(".fit1_bubble").click (function(){ $(".fit1_bubble").click (function(){
click.play();
$(".fit1_bubble").toggle(); $(".fit1_bubble").toggle();
}); });
$("#ned").click (function(){ $("#ned").click (function(){
comic_ned.play();
$(".ned_bubble1").show(); $(".ned_bubble1").show();
$(".message2").show(); $(".message2").show();
$(".message1").hide(); $(".message1").hide();
}); });
$(".ned_bubble1").click (function(){ $(".ned_bubble1").click (function(){
comic_ned.play();
$(".ned_bubble2").show(); $(".ned_bubble2").show();
$(".ned_bubble1").hide(); $(".ned_bubble1").hide();
}); });
$(".ned_bubble2").click (function(){ $(".ned_bubble2").click (function(){
comic_ned.play();
$(".ned_bubble2").toggle(); $(".ned_bubble2").toggle();
$(".ned_bubble3").show(); $(".ned_bubble3").show();
$(".message2").hide(); $(".message2").hide();
@ -274,6 +308,7 @@ $(document).keydown(function(e) {
}); });
$(".ned_bubble3").click (function(){ $(".ned_bubble3").click (function(){
click.play();
$(".ned_bubble3").toggle(); $(".ned_bubble3").toggle();
}); });

@ -9,6 +9,12 @@
</head> </head>
<body> <body>
<audio loop="loop" id="theme1" preload="auto"><source src="sound/theme1.wav" type="audio/wav"></audio>
<audio id="page"><source src="sound/page.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="bark"><source src="sound/bark.wav" type="audio/wav"></audio>
<div id="groundline"></div> <div id="groundline"></div>
@ -71,9 +77,20 @@
<script src="jquery.min.js"></script> <script src="jquery.min.js"></script>
<script> <script>
// audio
// player moves var theme = document.querySelector("#theme1");
var page = document.querySelector("#page");
var click = document.querySelector("#click");
var comic = document.querySelector("#comic");
var comic_ned = document.querySelector("#comic_ned");
var bark = document.querySelector("#bark");
$("body").hover( function() {
theme.play();
theme.addEventListener('paused',function() {
theme.play();
},false);
})
//adjust camera scroll //adjust camera scroll
var $div = $('#player_img'); var $div = $('#player_img');
var screenLeftMin = 200; var screenLeftMin = 200;
@ -194,20 +211,6 @@ $(document).keydown(function(e) {
}) })
/* manipulate the z-index of the character
var offset_percent = offset
if (offset */
// saves game step in the local storage // saves game step in the local storage
window.onload = function() { window.onload = function() {
window.localStorage.setItem("looking_for_N","opened") window.localStorage.setItem("looking_for_N","opened")
@ -225,62 +228,78 @@ $(document).keydown(function(e) {
$("#woman").click (function(){ $("#woman").click (function(){
comic.play();
$(".woman_bubble").show(); $(".woman_bubble").show();
}); });
$(".woman_bubble").click (function(){ $(".woman_bubble").click (function(){
click.play();
$(".woman_bubble").toggle(); $(".woman_bubble").toggle();
}); });
$("#woman2").click (function(){ $("#woman2").click (function(){
comic.play();
$(".woman2_bubble").show(); $(".woman2_bubble").show();
}); });
$(".woman2_bubble").click (function(){ $(".woman2_bubble").click (function(){
click.play();
$(".woman2_bubble").toggle(); $(".woman2_bubble").toggle();
}); });
$("#dog").click (function(){ $("#dog").click (function(){
bark.play();
$(".dog_bubble").show(); $(".dog_bubble").show();
}); });
$(".dog_bubble").click (function(){ $(".dog_bubble").click (function(){
click.play();
$(".dog_bubble").toggle(); $(".dog_bubble").toggle();
}); });
$("#newspaper_seller").click (function(){ $("#newspaper_seller").click (function(){
comic.play();
$(".vendor_bubble").show(); $(".vendor_bubble").show();
}); });
$(".vendor_bubble").click (function(){ $(".vendor_bubble").click (function(){
click.play();
$(".vendor_bubble").toggle(); $(".vendor_bubble").toggle();
}); });
$("#sport1").click (function(){ $("#sport1").click (function(){
comic.play();
$(".fit2_bubble").show(); $(".fit2_bubble").show();
}); });
$(".fit2_bubble").click (function(){ $(".fit2_bubble").click (function(){
click.play();
$(".fit2_bubble").toggle(); $(".fit2_bubble").toggle();
}); });
$("#sport2").click (function(){ $("#sport2").click (function(){
comic.play();
$(".fit1_bubble").show(); $(".fit1_bubble").show();
}); });
$(".fit1_bubble").click (function(){ $(".fit1_bubble").click (function(){
click.play();
$(".fit1_bubble").toggle(); $(".fit1_bubble").toggle();
}); });
$("#ned").click (function(){ $("#ned").click (function(){
comic_ned.play();
$(".ned_bubble2").show(); $(".ned_bubble2").show();
$(".message1").hide(); $(".message1").hide();
}); });
$(".ned_bubble2").click( function() { $(".ned_bubble2").click( function() {
comic_ned.play();
$(".ned_bubble2").hide(); $(".ned_bubble2").hide();
$(".ned_bubble3").show(); $(".ned_bubble3").show();
setTimeout (function () { setTimeout (function () {
$(".message3").show(); $(".message3").show();
click.play();
},1000); },1000);
}) })
$(".ned_bubble3").click( function() { $(".ned_bubble3").click( function() {
click.play();
$(".ned_bubble3").toggle(); $(".ned_bubble3").toggle();
}); });

@ -80,7 +80,7 @@
$("#player_img").removeClass("player_land"); $("#player_img").removeClass("player_land");
$("#player_img").hide(); $("#player_img").hide();
$(".boat").animate({ left: "100%" }, { $(".boat").animate({ left: "100%" }, {
duration: 2500 }) duration: 3500 })
.promise().done(function(){ .promise().done(function(){
location.href='spring_river.html'; location.href='spring_river.html';
}); });

BIN
tree/sound/.DS_Store vendored

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

@ -206,6 +206,13 @@ div#player_img {
z-index:3; z-index:3;
} }
.children3 {
bottom:18%;
right: 13%;
position: absolute;
z-index:8;
}
.decoration { .decoration {
top:35%; top:35%;
right: 10%; right: 10%;
@ -260,6 +267,33 @@ div#player_img {
z-index: 10; z-index: 10;
} }
.shooting_place4{
top:65%;
right: 15%;
position: absolute;
z-index: 20;
}
.shooting_place5{
top:32%;
right: 12%;
position: absolute;
z-index: 10;
}
.shooting_place6{
top:10%;
right: 18%;
position: absolute;
z-index: -5;
}
.shooting_place7{
top:60%;
right: 23%;
position: absolute;
z-index: 20;
}
/*images*/ /*images*/
@ -287,7 +321,7 @@ div#player_img {
.tree4{ .tree4{
bottom: 20%; bottom: 20%;
left: 60%; left: 45%;
position: absolute; position: absolute;
z-index:6; z-index:6;
} }
@ -304,6 +338,25 @@ div#player_img {
z-index:1; z-index:1;
} }
.tree7{
top: 10%;
left: 60%;
position: absolute;
z-index:1;
}
.tree8{
bottom: 20%;
left: 55%;
position: absolute;
z-index:10;
}
.tree9{
bottom: 25%;
left: 72%;
position: absolute;
z-index:10;
}
/* amanda baloons*/ /* amanda baloons*/
.bubble1 { .bubble1 {

@ -51,6 +51,18 @@
<img id="tree6" src="imgs/spring_river/tree.gif" height="160px"> <img id="tree6" src="imgs/spring_river/tree.gif" height="160px">
<img id="tree_flipped6" src="imgs/spring_river/tree_rotate.gif" height="160px"style="display: none;"> <img id="tree_flipped6" src="imgs/spring_river/tree_rotate.gif" height="160px"style="display: none;">
</div> </div>
<div class="tree7 blur">
<img id="tree7" src="imgs/spring_river/tree.gif" height="160px">
<img id="tree_flipped7" src="imgs/spring_river/tree_rotate.gif" height="160px"style="display: none;">
</div>
<div class="tree8 blur">
<img class="good" id="tree8" src="imgs/spring_river/tree.gif" height="160px">
<img class="bad" id="tree_flipped8" src="imgs/spring_river/tree_rotate.gif" height="160px"style="display: none;">
</div>
<div class="tree9 blur">
<img class="good" id="tree9" src="imgs/spring_river/tree.gif" height="160px">
<img class="bad" id="tree_flipped9" src="imgs/spring_river/tree_rotate.gif" height="160px"style="display: none;">
</div>
<div class="children1 blur"> <div class="children1 blur">
<img id="cage1" class="bad" src="imgs/spring_river/children_cage_1.gif" height="200px"> <img id="cage1" class="bad" src="imgs/spring_river/children_cage_1.gif" height="200px">
@ -60,6 +72,10 @@
<img id="cage2" class="bad" src="imgs/spring_river/children_cage_2.gif" height="250px"> <img id="cage2" class="bad" src="imgs/spring_river/children_cage_2.gif" height="250px">
<img id="free2" class="good" src="imgs/spring_river/children_free_2.gif" height="300px" style="display: none;"> <img id="free2" class="good" src="imgs/spring_river/children_free_2.gif" height="300px" style="display: none;">
</div> </div>
<div class="children3 blur">
<img id="cage3" class="bad" src="imgs/spring_river/children_cage_1.gif" height="250px">
<img id="free3" class="good" src="imgs/spring_river/children_free_1.gif" height="300px" style="display: none;">
</div>
<div class="figure1 blur"> <div class="figure1 blur">
<img id="satan1" class="bad" src="imgs/spring_river/satan1.gif" height="150px"> <img id="satan1" class="bad" src="imgs/spring_river/satan1.gif" height="150px">
@ -85,6 +101,10 @@
<img class="shooting_place1 bad blur" src="imgs/spring_river/fire2.gif" height="130px" style="display: none;"> <img class="shooting_place1 bad blur" src="imgs/spring_river/fire2.gif" height="130px" style="display: none;">
<img class="shooting_place2 bad blur" src="imgs/spring_river/fire2.gif" height="130px" style="display: none;"> <img class="shooting_place2 bad blur" src="imgs/spring_river/fire2.gif" height="130px" style="display: none;">
<img class="shooting_place3 bad blur" src="imgs/spring_river/fire2.gif" height="130px" style="display: none;"> <img class="shooting_place3 bad blur" src="imgs/spring_river/fire2.gif" height="130px" style="display: none;">
<img class="shooting_place4 bad blur" src="imgs/spring_river/fire2.gif" height="130px" style="display: none;">
<img class="shooting_place5 bad blur" src="imgs/spring_river/fire2.gif" height="130px" style="display: none;">
<img class="shooting_place6 bad blur" src="imgs/spring_river/fire2.gif" height="130px" style="display: none;">
<img class="shooting_place7 bad blur" src="imgs/spring_river/fire2.gif" height="130px" style="display: none;">
<img id="amanda" src="imgs/spring_river/amanda.gif" height="110px" style="display: none;"> <img id="amanda" src="imgs/spring_river/amanda.gif" height="110px" style="display: none;">
<div class="bubble1 invert stop_invert" style="display: none;"><span id="player_name"></span>, where have you been? ✜</div> <div class="bubble1 invert stop_invert" style="display: none;"><span id="player_name"></span>, where have you been? ✜</div>
@ -102,7 +122,7 @@
</div> </div>
<div class="message2" style="display: none;"> <div class="message2" style="display: none;">
Damn! Your premonition actually came true, Ned was right since the beginning.<br> Damn! Your premonition actually came true, Ned was right since the beginning.<br>
You need to put an end to this evil depravation now! <span class="instructions"><span class="instructions_arrow"></span> You need to put an end to this evil depravation now!</span>
</div> </div>
<div class="message3" style="display: none;"> <div class="message3" style="display: none;">
Is this... Amanda? Is this... Amanda?
@ -182,12 +202,19 @@ $(document).keydown(function(e) {
$("#tree6").hide(); $("#tree6").hide();
$("#tree_flipped6").show(); $("#tree_flipped6").show();
} }
if (left_Percentage >= 54) { if (left_Percentage >= 42) {
$("#tree4").hide(); $("#tree4").hide();
$("#tree_flipped4").show(); $("#tree_flipped4").show();
} }
if (left_Percentage >= 51) {
$("#tree7, #tree8").hide();
$("#tree_flipped7,#tree_flipped8 ").show();
}
if (left_Percentage >= 70) { if (left_Percentage >= 70) {
$("#tree9").hide();
$("#tree_flipped9").show();
$(document).scrollLeft(8000);
$(".message1").hide(); $(".message1").hide();
$(".message2").show(); $(".message2").show();
} }
@ -228,21 +255,21 @@ $(document).keydown(function(e) {
$("#figure1").click(function () { $("#figure1").click(function () {
shooting_counter ++; shooting_counter ++;
console.log(shooting_counter); console.log(shooting_counter);
$(".shooting_place1").show(); $(".shooting_place1, .shooting_place4").show();
reach_counter() reach_counter()
}); });
$(".figure2").click(function () { $(".figure2").click(function () {
shooting_counter ++; shooting_counter ++;
console.log(shooting_counter); console.log(shooting_counter);
$(".shooting_place2").show(); $(".shooting_place2, .shooting_place5").show();
reach_counter() reach_counter()
}); });
$(".figure3").click(function () { $(".figure3").click(function () {
shooting_counter ++; shooting_counter ++;
console.log(shooting_counter); console.log(shooting_counter);
$(".shooting_place3").show(); $(".shooting_place3, .shooting_place6, .shooting_place7").show();
reach_counter() reach_counter()
}); });
@ -254,7 +281,7 @@ $(document).keydown(function(e) {
}); });
function reach_counter() { function reach_counter() {
if ( shooting_counter == 3 ) { if ( shooting_counter == 8 ) {
$("#thunders").show(); $("#thunders").show();
setTimeout( function () { setTimeout( function () {
$("#cloud, #cloud2").show(); $("#cloud, #cloud2").show();
@ -276,7 +303,7 @@ $(document).keydown(function(e) {
$(".bad").hide(); $(".bad").hide();
$(".good").show(); $(".good").show();
$(".stop_invert").removeClass("invert"); $(".stop_invert").removeClass("invert");
//$('html').css({overflow: 'hidden'}); $('html').css({overflow: 'hidden'});
setTimeout( function () { setTimeout( function () {
$(".bubble2").show(); $(".bubble2").show();
$(".message3").hide(); $(".message3").hide();

@ -141,7 +141,7 @@ h1{
border-radius: 10px; border-radius: 10px;
z-index: 0; z-index: 0;
font-size: 20px; font-size: 20px;
line-height: 25px; line-height: 22px;
padding: 15px; padding: 15px;
z-index: 1; z-index: 1;

Loading…
Cancel
Save