annasandri
/
pizzagate
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
master
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'fd0efef39d'
${ noResults }
pizzagate/tree/cat_shelter.html

182 lines
6.6 KiB
HTML
Raw Normal View History Unescape Escape

parrot
4 years ago
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<title>cat shelter</title>
<link rel="icon" href="imgs/cat_shelter/kennel5.png">
<link rel="stylesheet" href="cat_shelter.css">
</head>
<body>
<div id="groundline"></div>
<div id="ground">
<div id="player_img"></div>
<img id="tree1" src="imgs/cat_shelter/tree.gif" height="140px">
<img id="tree2" src="imgs/cat_shelter/tree.gif" height="140px">
<img id="tree3" src="imgs/cat_shelter/tree.gif" height="140px">
<img id="grass1" src="imgs/park/grass1.gif" height="80px">
<img id="grass2" src="imgs/park/grass1.gif" height="70px">
<img id="house1" src="imgs/cat_shelter/kennel1.png" height="90px">
<img id="house2" src="imgs/cat_shelter/kennel2.gif" height="100px">
<img id="house3" src="imgs/cat_shelter/kennel3.png" height="130px">
<img id="house4" src="imgs/cat_shelter/kennel4.png" height="90px">
<img id="house5" src="imgs/cat_shelter/kennel5.png" height="80px">
<img id="house6" src="imgs/cat_shelter/kennel6.png" height="100px">
<!--<img id="shed1" src="imgs/cat_shelter/shed.gif" height="120px">
<img id="fence1" src="imgs/cat_shelter/fence1.gif" height="130px">
<img id="fence2" src="imgs/cat_shelter/fence2.gif" height="100px">-->
<img id="toy" src="imgs/cat_shelter/toy.gif" height="100px">
<img id="fly1" src="imgs/cat_shelter/butterfly.gif" height="40px">
<img id="fly2" src="imgs/cat_shelter/butterfly.gif" height="40px">
<img id="snake" src="imgs/cat_shelter/snake.gif" height="40px" style="display: none;">
<img id="lizard" src="imgs/cat_shelter/lizard.gif" height="25px"style="display: none;">
<img id="dog" src="imgs/cat_shelter/dog2.gif" height="50px"style="display: none;">
<img id="pat" src="imgs/cat_shelter/parrot.gif" height="100px"style="display: none;">
<div class="comic_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="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;"> Follow me, I can tell you more about it.</div>
</div>
</div>
<div class="text_container">
<div class="message1">
You are at the cat shelter: it looks so empty. What could have happened here?<br>
<span class="instructions_arrow">→</span><span class="instructions"> Look closer to see if there are any tracks of Amanda</span>
</div>
<div class="message2" style="display:none;">
<span class="instructions_arrow">→</span><span class="instructions"> Ask Pat if she has seen Amanda</span>
</div>
<div class="message3" style="display:none;">
I hope Amanda did not get involved in this. <button onclick="location.href='major_house.html';"><span class="button_text">Follow Pat</span></button> to hear more about it.
</div>
</div>
</div>
<script src="jquery.min.js"></script>
<script>
//get player avatar from local storage
console.log (localStorage.myavatar)
var img = document.createElement("img");
img.src = localStorage.myavatar;
var player_img = document.querySelector("#player_img");
player_img.appendChild(img);
//store that you've been in the park
window.onload = function() {
window.localStorage.setItem("cat_shelter","opened")
console.log ("cat shelter:",localStorage.cat_shelter)
}
// look in the houses game
var house_counter = 0;
$("#house1").click(function(){
$("#house1").addClass("touch_animation");
house_counter ++;
console.log(house_counter);
pat_appear()
});
$("#house2").click(function(){
$("#house2").addClass("touch_animation");
house_counter ++;
console.log(house_counter);
$("#snake").show();
$("#snake").animate({ left: "120%", top:"120%"}, {
duration: 3000
}).promise().done(function(){
$("#snake").hide();
});
pat_appear()
});
$("#house3").click(function(){
$("#house3").addClass("touch_animation");
house_counter ++;
console.log(house_counter);
$("#dog").show();
$("#dog").animate({ left: "-20%"}, {
duration: 1000
}).promise().done(function(){
$("#dog").hide();
});
pat_appear()
});
$("#house4").click(function(){
$("#house4").addClass("touch_animation");
house_counter ++;
console.log(house_counter);
pat_appear()
});
$("#house5").click(function(){
$("#house5").addClass("touch_animation");
house_counter ++;
console.log(house_counter);
pat_appear()
});
$("#house6").click(function(){
$("#house6").addClass("touch_animation");
house_counter ++;
console.log(house_counter);
$("#lizard").show();
$("#lizard").animate({ left: "-20%"}, {
duration: 5000
}).promise().done(function(){
$("#lizard").hide();
});
pat_appear()
});
function pat_appear(){
if (house_counter == 6){
setTimeout(function(){
console.log("hei");
$("#pat").show();
setTimeout(function(){
$(".bubble1").show();
setTimeout(function(){
$(".bubble2").show();
setTimeout(function(){
$(".message1").hide();
$(".message2").show();
}, 1000);
}, 1500);
}, 1000);
}, 1000);
}
}
$(".bubble2").click(function(){
$(".message2, .bubble1, .bubble2").hide();
$(".bubble3").show();
setTimeout(function(){
$(".bubble4").show();
setTimeout(function(){
$(".message3").show();
}, 1000);
}, 1000);
});
</script>
<script type="text/javascript" src="index.js" ></script>
</body>