diff --git a/.DS_Store b/.DS_Store index 7ebafe9..b466f3c 100644 Binary files a/.DS_Store and b/.DS_Store differ diff --git a/tree/cat_shelter.css b/tree/cat_shelter.css index 89abf91..99b7120 100644 --- a/tree/cat_shelter.css +++ b/tree/cat_shelter.css @@ -373,11 +373,12 @@ span.button_text{ line-height: 17px; text-align: center; width: 160px; - height: 35px; + height: 50px; border-radius: 10px; padding: 18px; border: #000000 solid 1px; z-index: 10; + cursor: pointer; } .bubble4:after { content: ''; @@ -406,6 +407,93 @@ span.button_text{ display: block; } +.bubble5 { + bottom: 65%; + left: 24%; + position: absolute; + background: #ffffff; + color: #000000; + font-family: sinistre; + font-size: 16px; + line-height: 17px; + text-align: center; + width: 250px; + height: 105px; + border-radius: 10px; + padding: 18px; + border: 1px black solid; + z-index: 20; +} +.bubble5:after { + content: ''; + position: absolute; + display: block; + width: 0; + z-index: 1; + border-style: solid; + border-width: 0 30px 24px 0; + border-color: transparent #ffffff transparent transparent; + bottom: -24px; + left: 83%; + margin-left: -15px; +} +.bubble5:before { + content: ''; + position: absolute; + width: 0; + z-index: 0; + border-style: solid; + border-width: 0 31px 25px 0; + border-color: transparent #000000 transparent transparent; + bottom: -26px; + left: 83%; + margin-left: -15px; + display: block; +} +.bubble6 { + bottom: 64%; + left: 50%; + position: absolute; + background: #ffffff; + color: #000000; + font-family:sinistre; + font-size: 16px; + line-height: 17px; + text-align: center; + width: 160px; + height: 55px; + border-radius: 10px; + padding: 18px; + border: #000000 solid 1px; + z-index: 10; +} +.bubble6:after { + content: ''; + position: absolute; + display: block; + width: 0; + z-index: 2; + border-style: solid; + border-width: 24px 30px 0 0; + border-color: #ffffff transparent transparent transparent; + bottom: -24px; + left: 17%; + margin-left: -15px; +} +.bubble6:before { + content: ''; + position: absolute; + width: 0; + z-index: 0; + border-style: solid; + border-width: 25px 31px 0 0; + border-color: #000000 transparent transparent transparent; + bottom: -26px; + left: 17%; + margin-left: -16px; + display: block; +} + @keyframes touch { 0% {transform: rotate(0deg);} 50% {transform: rotate(-10deg);} diff --git a/tree/cat_shelter.html b/tree/cat_shelter.html index 471a5a0..6b04c0f 100644 --- a/tree/cat_shelter.html +++ b/tree/cat_shelter.html @@ -37,13 +37,17 @@ - +
- + + + +
@@ -58,7 +62,7 @@ Ask Pat if she has seen Amanda @@ -167,6 +171,14 @@ $(".bubble3").show(); setTimeout(function(){ $(".bubble4").show(); + }, 1000); + }); + + $(".bubble4").click(function(){ + $(".bubble3, .bubble4").hide(); + $(".bubble5").show(); + setTimeout(function(){ + $(".bubble6").show(); setTimeout(function(){ $(".message3").show(); }, 1000); diff --git a/tree/imgs/.DS_Store b/tree/imgs/.DS_Store index 7cc2ddb..910c654 100644 Binary files a/tree/imgs/.DS_Store and b/tree/imgs/.DS_Store differ diff --git a/tree/imgs/major_house/.DS_Store b/tree/imgs/major_house/.DS_Store new file mode 100644 index 0000000..5babb23 Binary files /dev/null and b/tree/imgs/major_house/.DS_Store differ diff --git a/tree/imgs/major_house/ball.gif b/tree/imgs/major_house/ball.gif new file mode 100644 index 0000000..6d6607d Binary files /dev/null and b/tree/imgs/major_house/ball.gif differ diff --git a/tree/imgs/major_house/barbecue.gif b/tree/imgs/major_house/barbecue.gif new file mode 100644 index 0000000..02b5d49 Binary files /dev/null and b/tree/imgs/major_house/barbecue.gif differ diff --git a/tree/imgs/major_house/barbecue2.gif b/tree/imgs/major_house/barbecue2.gif new file mode 100644 index 0000000..ebf5cf8 Binary files /dev/null and b/tree/imgs/major_house/barbecue2.gif differ diff --git a/tree/imgs/major_house/barbecue4.gif b/tree/imgs/major_house/barbecue4.gif new file mode 100644 index 0000000..0e4170f Binary files /dev/null and b/tree/imgs/major_house/barbecue4.gif differ diff --git a/tree/imgs/major_house/butterfly.gif b/tree/imgs/major_house/butterfly.gif new file mode 100644 index 0000000..6a58c92 Binary files /dev/null and b/tree/imgs/major_house/butterfly.gif differ diff --git a/tree/imgs/major_house/cat.gif b/tree/imgs/major_house/cat.gif new file mode 100644 index 0000000..ea8ebd8 Binary files /dev/null and b/tree/imgs/major_house/cat.gif differ diff --git a/tree/imgs/major_house/dog.gif b/tree/imgs/major_house/dog.gif new file mode 100644 index 0000000..28035f2 Binary files /dev/null and b/tree/imgs/major_house/dog.gif differ diff --git a/tree/imgs/major_house/house1.gif b/tree/imgs/major_house/house1.gif new file mode 100644 index 0000000..1e84d6c Binary files /dev/null and b/tree/imgs/major_house/house1.gif differ diff --git a/tree/imgs/major_house/house2.gif b/tree/imgs/major_house/house2.gif new file mode 100644 index 0000000..bc580a1 Binary files /dev/null and b/tree/imgs/major_house/house2.gif differ diff --git a/tree/imgs/major_house/person1.gif b/tree/imgs/major_house/person1.gif new file mode 100644 index 0000000..52c0968 Binary files /dev/null and b/tree/imgs/major_house/person1.gif differ diff --git a/tree/imgs/major_house/person2.gif b/tree/imgs/major_house/person2.gif new file mode 100644 index 0000000..16aff58 Binary files /dev/null and b/tree/imgs/major_house/person2.gif differ diff --git a/tree/imgs/major_house/person3.gif b/tree/imgs/major_house/person3.gif new file mode 100644 index 0000000..ce18a13 Binary files /dev/null and b/tree/imgs/major_house/person3.gif differ diff --git a/tree/imgs/major_house/person4.gif b/tree/imgs/major_house/person4.gif new file mode 100644 index 0000000..0632b49 Binary files /dev/null and b/tree/imgs/major_house/person4.gif differ diff --git a/tree/imgs/major_house/person5.gif b/tree/imgs/major_house/person5.gif new file mode 100644 index 0000000..681a019 Binary files /dev/null and b/tree/imgs/major_house/person5.gif differ diff --git a/tree/imgs/major_house/person6.gif b/tree/imgs/major_house/person6.gif new file mode 100644 index 0000000..ab76ee8 Binary files /dev/null and b/tree/imgs/major_house/person6.gif differ diff --git a/tree/imgs/major_house/rept1.gif b/tree/imgs/major_house/rept1.gif new file mode 100644 index 0000000..45d64b5 Binary files /dev/null and b/tree/imgs/major_house/rept1.gif differ diff --git a/tree/imgs/major_house/rept2.gif b/tree/imgs/major_house/rept2.gif new file mode 100644 index 0000000..f1267b0 Binary files /dev/null and b/tree/imgs/major_house/rept2.gif differ diff --git a/tree/imgs/major_house/rept3.gif b/tree/imgs/major_house/rept3.gif new file mode 100644 index 0000000..4e6433a Binary files /dev/null and b/tree/imgs/major_house/rept3.gif differ diff --git a/tree/imgs/major_house/rept4.gif b/tree/imgs/major_house/rept4.gif new file mode 100644 index 0000000..a6ab457 Binary files /dev/null and b/tree/imgs/major_house/rept4.gif differ diff --git a/tree/imgs/major_house/rept5.gif b/tree/imgs/major_house/rept5.gif new file mode 100644 index 0000000..7ef7679 Binary files /dev/null and b/tree/imgs/major_house/rept5.gif differ diff --git a/tree/imgs/major_house/rept6.gif b/tree/imgs/major_house/rept6.gif new file mode 100644 index 0000000..f5e02c4 Binary files /dev/null and b/tree/imgs/major_house/rept6.gif differ diff --git a/tree/imgs/major_house/rept7.gif b/tree/imgs/major_house/rept7.gif new file mode 100644 index 0000000..1d1aa39 Binary files /dev/null and b/tree/imgs/major_house/rept7.gif differ diff --git a/tree/imgs/major_house/volcano.gif b/tree/imgs/major_house/volcano.gif new file mode 100644 index 0000000..60d7967 Binary files /dev/null and b/tree/imgs/major_house/volcano.gif differ diff --git a/tree/imgs/river_bank/house1.gif b/tree/imgs/river_bank/house1.gif deleted file mode 100644 index 5663486..0000000 Binary files a/tree/imgs/river_bank/house1.gif and /dev/null differ diff --git a/tree/imgs/river_bank/house2.gif b/tree/imgs/river_bank/house2.gif deleted file mode 100644 index a1ed601..0000000 Binary files a/tree/imgs/river_bank/house2.gif and /dev/null differ diff --git a/tree/imgs/river_bank/house3.gif b/tree/imgs/river_bank/house3.gif deleted file mode 100644 index 7eb8e6b..0000000 Binary files a/tree/imgs/river_bank/house3.gif and /dev/null differ diff --git a/tree/imgs/river_bank/house4.gif b/tree/imgs/river_bank/house4.gif deleted file mode 100644 index 154c128..0000000 Binary files a/tree/imgs/river_bank/house4.gif and /dev/null differ diff --git a/tree/imgs/river_bank/house5.gif b/tree/imgs/river_bank/house5.gif deleted file mode 100644 index 12ac2f2..0000000 Binary files a/tree/imgs/river_bank/house5.gif and /dev/null differ diff --git a/tree/major_house.css b/tree/major_house.css index 3ff47c5..e817c18 100644 --- a/tree/major_house.css +++ b/tree/major_house.css @@ -40,16 +40,14 @@ .instructions{ font-family:jolyregularitalic; - } - span.instructions_arrow{ + +span.instructions_arrow{ padding-left:40px; font-size: 2.4vw; font-family:jolybolditalic; } - - ::-moz-selection { /* Code for Firefox */ background: transparent; } @@ -58,7 +56,7 @@ } #ground_color { - width: 5100px; + width: 3600px; height: 120%; position:fixed; margin:-100px; @@ -75,12 +73,12 @@ #groundline { position: fixed; top:130px; + height:0%; width: 100%; border-top: 1px solid; z-index:-10; } - div.text_container { bottom: 40px; left:40px; @@ -101,10 +99,12 @@ button{ } button:hover{ -border: 0.1em transparent solid; --webkit-box-shadow: 0px 0px 8px 1px black; --moz-box-shadow: 0px 0px 8px 1px black; + border: 0.1em transparent solid; + -webkit-box-shadow: 0px 0px 8px 1px black; + -moz-box-shadow: 0px 0px 8px 1px black; + box-shadow: 0px 0px 8px 1px black; box-shadow: 0px 0px 8px 1px black; + box-shadow: 0px 0px 8px 1px black; } .flipped { @@ -116,7 +116,6 @@ box-shadow: 0px 0px 8px 1px black; -ms-transform: scale(-1, 1); } - span.button_text{ font-size: 1.6vw; padding: 8px; @@ -126,135 +125,184 @@ span.button_text{ font-family: jolybolditalic; } - .duo{ position: absolute; - bottom: 25%; - left: 5%; + bottom: 35%; + left: 13%; width: 200px; height: 100px; + z-index: 2; +} +.glasses_bar { + top:40px; + right:80px; + position:fixed; + border-radius: 25vw; + padding-left: 10px; + padding-right: 10px; + padding-top: 3px; + padding-bottom: 5px; + font-family: sinistre; + background-color: white; + border: 0.11vw black solid; + border-radius: 25vw; + color:black; + cursor:pointer; + font-size: 1.4vw; + animation-name: appear; + animation-duration: 0.2s; +} + +@keyframes appear { + 0% {top: 80px;} + 25% {top: 90px;} + 50% {top: 80px;} + 75% {top: 90px;} + 100% {top: 80px;} + } + +.glasses_bar:hover{ + border: 0.11vw transparent solid; + 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 ; +} +.glasses_bar_black{ + border: 0.11vw transparent solid; + color:#c94dff; + background-color: #000000; + -webkit-box-shadow: 0px 0px 8px 1px #c94dff ; + -moz-box-shadow: 0px 0px 8px 1px #c94dff ; + box-shadow: 0px 0px 8px 1px #c94dff ; } /*images*/ #tree1 { - bottom:30%; - left: 8%; + bottom:50%; + left: 7%; position: absolute; - z-index:-1; + z-index:0; } #tree2 { - bottom:15%; - left: 22%; + bottom:25%; + left: 18%; position: absolute; z-index:5; } #tree3 { - bottom:30%; - left: 40%; + bottom:60%; + left: 35%; position: absolute; z-index:-1; } #tree4 { - bottom:15%; - left: 60%; + bottom:50%; + left: 50%; + position: absolute; + z-index:1; +} +#tree5 { + bottom:25%; + left: 75%; position: absolute; z-index:5; } - - - -/* amanda baloons*/ - -.bubble1 { - right: 25%; - top:34%; +#tree6 { + bottom:55%; + right: 4%; position: absolute; - background: #ffffff; - color: #000000; - font-family: sinistre; - font-size: 16px; - line-height: 17px; - text-align: center; - width: 190px; - height: 50px; - border-radius: 10px; - padding: 18px; - border: #000000 solid 1px; - + z-index:0; } -.bubble1:after { - content: ''; +#tree7 { + bottom:65%; + right: 27%; position: absolute; - display: block; - width: 0; - z-index: 1; - border-style: solid; - border-color: #ffffff transparent; - border-width: 0 20px 20px; - top: -20px; - left: 76%; - margin-left: -20px; + z-index:0; } -.bubble1:before { - content: ''; +#fur1 { + bottom:55%; + left: 12%; position: absolute; - width: 0; - z-index: 0; - border-style: solid; - border-color: #000000 transparent; - border-width: 0 21px 21px; - top: -21.5px; - left: 76%; - margin-left: -21px; - display: block; + z-index:0; } -.bubble2{ - right: 11%; - top:35%; +#fur2 { + bottom:72%; + left: 20%; position: absolute; - background: #ffffff; - color: #000000; - font-family: sinistre; - font-size: 16px; - line-height: 17px; - text-align: center; - width: 220px; - height: 75px; - border-radius: 10px; - padding: 18px; - border: #000000 solid 1px; + z-index:0; } -.bubble2:after { - content: ''; +#fur3 { + bottom:25%; + left: 23%; position: absolute; - display: block; - width: 0; - z-index: 1; - border-style: solid; - border-color: transparent #ffffff; - border-width: 20px 20px 20px 0; - top: 34%; - left: -20px; - margin-top: -20px; + z-index:5; } -.bubble2:before { - content: ''; +#fur4 { + bottom:65%; + left: 38%; position: absolute; - width: 0; - z-index: 0; - border-style: solid; - border-color: transparent #000000; - border-width: 21px 21px 21px 0; - top: 34%; - left: -21.5px; - margin-top: -21px; - display: block; + z-index:-2; +} +#fur5 { + bottom:20%; + left: 55%; + position: absolute; + z-index:-2; +} +.house { + top:15%; + right: 8%; + position: absolute; + z-index:-2; +} +.figure5{ + bottom:50%; + right: 15%; + position: absolute; + z-index:2; } -.bubble3 { - right: 20%; - top:53%; +.figure2{ + bottom:70%; + right: 21%; + position: absolute; + z-index:-2; +} +.figure1{ + bottom:26%; + right: 8%; + position: absolute; + z-index:-2; +} +.figure4{ + bottom:35%; + right: 18%; + position: absolute; + z-index:-2; +} +.figure3{ + top:32%; + right: 8%; + position: absolute; + z-index:2; +} +.figure6{ + bottom:30%; + right: 4%; + position: absolute; + z-index:3; +} +.figure7{ + bottom:35%; + right: 12%; + position: absolute; + z-index:-2; +} +.bubble1 { + right: 24%; + top:18%; position: absolute; background: #ffffff; color: #000000; @@ -262,13 +310,13 @@ span.button_text{ font-size: 16px; line-height: 17px; text-align: center; - width: 200px; - height: 55px; + width: 180px; + height: 120px; border-radius: 10px; padding: 18px; border: #000000 solid 1px; } -.bubble3:after { +.bubble1:after { content: ''; position: absolute; display: block; @@ -276,27 +324,28 @@ span.button_text{ z-index: 1; border-style: solid; border-color: #ffffff transparent; - border-width: 0 20px 20px; - top: -20px; - left: 73%; + border-width: 20px 20px 0; + bottom: -20px; + left: 66%; margin-left: -20px; } -.bubble3:before { +.bubble1:before { content: ''; position: absolute; width: 0; z-index: 0; border-style: solid; border-color: #000000 transparent; - border-width: 0 21px 21px; - top: -21.5px; - left: 73%; + border-width: 21px 21px 0; + bottom: -21.5px; + left: 66%; margin-left: -21px; display: block; } -.bubble4{ - right: 8%; - top:6%; + +.bubble2 { + right: 24%; + top:18%; position: absolute; background: #ffffff; color: #000000; @@ -304,36 +353,36 @@ span.button_text{ font-size: 16px; line-height: 17px; text-align: center; - width: 190px; - height: 90px; + width: 180px; + height: 120px; border-radius: 10px; padding: 18px; border: #000000 solid 1px; } -.bubble4:after { +.bubble2:after { content: ''; position: absolute; display: block; width: 0; z-index: 1; border-style: solid; - border-color: transparent #ffffff; - border-width: 20px 20px 20px 0; - top: 34%; - left: -20px; - margin-top: -20px; + border-color: #ffffff transparent; + border-width: 20px 20px 0; + bottom: -20px; + left: 66%; + margin-left: -20px; } -.bubble4:before { +.bubble2:before { content: ''; position: absolute; width: 0; z-index: 0; border-style: solid; - border-color: transparent #000000; - border-width: 21px 21px 21px 0; - top: 34%; - left: -21.5px; - margin-top: -21px; + border-color: #000000 transparent; + border-width: 21px 21px 0; + bottom: -21.5px; + left: 66%; + margin-left: -21px; display: block; } @@ -341,22 +390,22 @@ span.button_text{ /* hide scroll bar */ /* width */ ::-webkit-scrollbar { - color:white; + color: transparent; } /* Track */ ::-webkit-scrollbar-track { - background: white; + background: transparent; } /* Handle */ ::-webkit-scrollbar-thumb { - background: white; + background: transparent; } /* Handle on hover */ ::-webkit-scrollbar-thumb:hover { - background: white; + background: transparent; } diff --git a/tree/major_house.html b/tree/major_house.html index 0231a03..48c488e 100644 --- a/tree/major_house.html +++ b/tree/major_house.html @@ -3,48 +3,95 @@ - chemtrails - + follow Pat + -
+
-
- +
+ +
+ + +
+
-
-
- - -
+ + + + + - - - - - + + + + + + + - - - - - +
+ + + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+ + -
+ +
- -
+ Follow the hairballs +
@@ -54,8 +101,20 @@ // saves game step in the local storage window.onload = function() { - window.localStorage.setItem("pleiadians","opened"); - console.log ("pleiadians:",localStorage.pleiadians); + window.localStorage.setItem("major_house","opened"); + 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 @@ -65,13 +124,11 @@ var player_img = document.querySelector("#player_img"); player_img.appendChild(img); -//get player name from local storage - document.querySelector('#player_name').innerHTML = localStorage.playerName; //adjust camera scroll var $div = $('.duo'); var screenLeftMin = 50; - var screenLeftMax = 700; + var screenLeftMax = 170; function adjustScroll() { var playerLeft = parseInt($div.css("left")); @@ -113,14 +170,19 @@ $(document).keydown(function(e) { offset.left = 80; } - if (offset.left > $("#ground").width() - 700) { + if (offset.left > $("#ground").width() - 1000) { + offset.left = $("#ground").width() - 1000; + $(document).scrollLeft(3500); $(".message1").hide(); $(".message2").show(); + setTimeout( function() { + $('.bubble1').show(); + setTimeout( function() { + $('.glasses_bar').show(); + }, 3000); + }, 2000); } - if (offset.left > $("#ground").width() - 80) { - offset.left = $("#ground").width() - 80; - } $div.css("left", offset.left); $div.css("top", offset.top); @@ -128,6 +190,16 @@ $(document).keydown(function(e) { adjustScroll(); }) + $('.glasses_bar').click ( function(){ + $('.to_invert').toggleClass("invert"); + $('.glasses_bar').toggleClass("glasses_bar_black"); + $('.good').toggle(); + $('.bad').toggle(); + $('.bubble1, .message2').hide(); + $('.bubble2, .message3').show(); + $("body").css("overflow", "hidden"); + + })