master
*anna* 3 years ago
parent 032d16261e
commit cf46d97d45

BIN
.DS_Store vendored

Binary file not shown.

BIN
wymga/.DS_Store vendored

Binary file not shown.

@ -37,6 +37,44 @@
overflow-y: hidden; overflow-y: hidden;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: black;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 100;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color:transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
.instructions{ .instructions{
font-family:jolyregularitalic; font-family:jolyregularitalic;

@ -17,6 +17,10 @@
<audio id="shot"><source src="sound/shot.wav" type="audio/wav"></audio> <audio id="shot"><source src="sound/shot.wav" type="audio/wav"></audio>
<audio id="explosion"><source src="sound/explosion.wav" type="audio/wav"></audio> <audio id="explosion"><source src="sound/explosion.wav" type="audio/wav"></audio>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<div class="game_bar invert" style="display: none;"> <div class="game_bar invert" style="display: none;">
cat steaks: <span class="cat_meat_bar"></span> / 4 cat steaks: <span class="cat_meat_bar"></span> / 4
@ -139,15 +143,17 @@
<script> <script>
var theme = document.querySelector("#theme"); var theme = document.querySelector("#theme");
theme.volume= 0.2;
var click = document.querySelector("#click"); var click = document.querySelector("#click");
var comic = document.querySelector("#comic"); var comic = document.querySelector("#comic");
comic.volume= 0.5;
var yes = document.querySelector("#yes"); var yes = document.querySelector("#yes");
var shot = document.querySelector("#shot"); var shot = document.querySelector("#shot");
var smoke = document.querySelector("#smoke"); var smoke = document.querySelector("#smoke");
var explosion = document.querySelector("#explosion"); var explosion = document.querySelector("#explosion");
theme.volume= 0.3;
click.volume=0.5;
comic.volume= 0.5;
$("body").hover( function() { $("body").hover( function() {
theme.play(); theme.play();
theme.addEventListener('paused',function() { theme.addEventListener('paused',function() {
@ -158,6 +164,9 @@ $("body").hover( function() {
// saves game step in the local storage // saves game step in the local storage
window.onload = function() { window.onload = function() {
theme.play(); theme.play();
theme.addEventListener('paused',function() {
theme.play();
},false);
window.localStorage.setItem("bus_station","opened"); window.localStorage.setItem("bus_station","opened");
console.log ("bus station:",localStorage.bus_station); console.log ("bus station:",localStorage.bus_station);
} }
@ -232,8 +241,9 @@ $(document).keydown(function(e) {
$("#bus_fire7, #bus_fire8").show(); $("#bus_fire7, #bus_fire8").show();
} }
switch (e.which) { switch (e.which) {
case 83:
$(".back").show();
case 37: case 37:
offset.left -= 20; offset.left -= 20;
console.log("left"); console.log("left");
@ -245,6 +255,18 @@ $(document).keydown(function(e) {
break; break;
} }
//go back to start
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
//check the offset and prevent the character to exceed the screen dimension //check the offset and prevent the character to exceed the screen dimension
if (offset.left < 80) { if (offset.left < 80) {
offset.left = 80; offset.left = 80;
@ -266,7 +288,7 @@ $(document).keydown(function(e) {
var click_counter = 0; var click_counter = 0;
$("#person1").click(function () { $("#person1").click(function () {
click.play(); smoke.play();
click_counter ++; click_counter ++;
$("#person1").hide(); $("#person1").hide();
$("#saurian1").show(); $("#saurian1").show();
@ -274,7 +296,7 @@ $(document).keydown(function(e) {
}); });
$("#person2").click(function () { $("#person2").click(function () {
click.play(); smoke.play();
click_counter ++; click_counter ++;
$("#person2").hide(); $("#person2").hide();
$("#saurian2").show(); $("#saurian2").show();
@ -282,7 +304,7 @@ $(document).keydown(function(e) {
}); });
$("#person3").click(function () { $("#person3").click(function () {
click.play(); smoke.play();
click_counter ++; click_counter ++;
$("#person3").hide(); $("#person3").hide();
$("#saurian3").show(); $("#saurian3").show();
@ -290,7 +312,7 @@ $(document).keydown(function(e) {
}); });
$("#person4").click(function () { $("#person4").click(function () {
click.play(); smoke.play();
click_counter ++; click_counter ++;
$("#person4").hide(); $("#person4").hide();
$("#saurian4").show(); $("#saurian4").show();

@ -38,6 +38,43 @@ body {
font-family: jolyregular; font-family: jolyregular;
font-size: 1.8vw; font-size: 1.8vw;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 100;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color: white;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
#ground{ #ground{
width: 120%; width: 120%;

@ -17,6 +17,11 @@
<audio id="no"><source src="sound/no.wav" type="audio/wav"></audio> <audio id="no"><source src="sound/no.wav" type="audio/wav"></audio>
<audio id="shot"><source src="sound/shot.wav" type="audio/wav"></audio> <audio id="shot"><source src="sound/shot.wav" type="audio/wav"></audio>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<div id="cover"></div> <div id="cover"></div>
<div id="ground"class="invert"></div> <div id="ground"class="invert"></div>
<svg class="invert"> <svg class="invert">
@ -109,6 +114,10 @@ var no = document.querySelector("#no");
var yes = document.querySelector("#yes"); var yes = document.querySelector("#yes");
var shot = document.querySelector("#shot"); var shot = document.querySelector("#shot");
click.volume = 0.5;
scary.volume = 0.3;
shot.volume = 0.5;
$("body").hover( function() { $("body").hover( function() {
if (cat_meat < 4) { if (cat_meat < 4) {
theme.play(); theme.play();
@ -118,6 +127,25 @@ $("body").hover( function() {
} }
}) })
//go back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
// saves game step in the local storage // saves game step in the local storage
window.onload = function() { window.onload = function() {
theme.play(); theme.play();

@ -40,6 +40,44 @@
font-size: 1.8vw; font-size: 1.8vw;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 200;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color:transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
#ground{ #ground{
width: 120%; width: 120%;
height: 120%; height: 120%;

@ -9,6 +9,10 @@
</head> </head>
<body> <body>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio> <audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio>
<audio loop="loop" id="theme4" preload="auto"><source src="sound/theme4_scary.wav" type="audio/wav"></audio> <audio loop="loop" id="theme4" preload="auto"><source src="sound/theme4_scary.wav" type="audio/wav"></audio>
@ -101,15 +105,17 @@
//audio //audio
var theme = document.querySelector("#theme2"); var theme = document.querySelector("#theme2");
theme.volume = 1;
var scary = document.querySelector("#theme4"); var scary = document.querySelector("#theme4");
scary.volume = 0.1;
var click = document.querySelector("#click"); var click = document.querySelector("#click");
var comic = document.querySelector("#comic"); var comic = document.querySelector("#comic");
var no = document.querySelector("#no"); var no = document.querySelector("#no");
var yes = document.querySelector("#yes"); var yes = document.querySelector("#yes");
var shot = document.querySelector("#shot"); var shot = document.querySelector("#shot");
theme.volume = 1;
shot.volume = 0.5; shot.volume = 0.5;
scary.volume = 0.4;
click.volume=0.5;
$("body").hover( function() { $("body").hover( function() {
if (stop_autoplay = 0) { if (stop_autoplay = 0) {
@ -119,6 +125,30 @@ $("body").hover( function() {
},false); },false);
} }
}) })
//go back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
if ($('.invert').hasClass("invert_style") == true) {
$('.back').css("background-color","black");
}
else{
$('.back').css("background-color","white");
}
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
var fluoride = 5; var fluoride = 5;
@ -151,6 +181,7 @@ var fluoride = 5;
$(".invert").addClass("invert_style"); $(".invert").addClass("invert_style");
}); });
//fight //fight
var duo = $(".moving_duo"); var duo = $(".moving_duo");
var avatar = $("#player_img"); var avatar = $("#player_img");

@ -27,6 +27,43 @@
font-size: 1.8vw; font-size: 1.8vw;
overflow: hidden; overflow: hidden;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 100;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color: white;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
.instructions{ .instructions{
font-family:jolyregularitalic; font-family:jolyregularitalic;

@ -9,6 +9,10 @@
</head> </head>
<body> <body>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio> <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="click"><source src="sound/click.wav" type="audio/wav"></audio>
@ -82,6 +86,28 @@ var comic = document.querySelector("#comic");
var no = document.querySelector("#no"); var no = document.querySelector("#no");
var smoke = document.querySelector("#smoke"); var smoke = document.querySelector("#smoke");
click.volume = 0.5;
theme.volume =1;
no.volume= 0.8;
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
$("body").hover( function() { $("body").hover( function() {
theme.play(); theme.play();
theme.addEventListener('paused',function() { theme.addEventListener('paused',function() {

@ -39,6 +39,44 @@ body{
max-width: 100%; max-width: 100%;
max-height: 100%; max-height: 100%;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.95em;
padding-top: 1.5em;
z-index: 200;
line-height: 1.5em;
}
.button_back{
font-size: 0.95em;
-webkit-appearance: none;
background-color:transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
::-moz-selection { /* Code for Firefox */ ::-moz-selection { /* Code for Firefox */
color: #c94dff; color: #c94dff;
background-color: white; background-color: white;

@ -8,6 +8,12 @@
<link rel="stylesheet" href="final.css"> <link rel="stylesheet" href="final.css">
</head> </head>
<body> <body>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<audio id="amanda_theme"><source src="sound/amanda_theme.wav" type="audio/wav"></audio> <audio id="amanda_theme"><source src="sound/amanda_theme.wav" type="audio/wav"></audio>
<audio id="click"><source src="sound/click.wav" type="audio/wav"></audio> <audio id="click"><source src="sound/click.wav" type="audio/wav"></audio>
@ -198,8 +204,28 @@ I wanted to leave you with something to think about when you'll be outside (<img
<script> <script>
//audio //audio
var amanda = document.querySelector("#amanda_theme"); var amanda = document.querySelector("#amanda_theme");
amanda.volume= 0.05;
var click = document.querySelector("#click"); var click = document.querySelector("#click");
amanda.volume= 0.4;
click.volume = 0.5;
//go back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
//player name //player name
document.querySelector('#player_name').innerHTML =localStorage.playerName; document.querySelector('#player_name').innerHTML =localStorage.playerName;

@ -1,3 +1,49 @@
<!--
//////////////////////////////////////////////////////////////////
W h e n y o u m i g h t g o a s t r a y
---- ----
by Anna Sandri
//////////////////////////////////////////////////////////////////
* C R E D I T S *
---f o n t s---
Joly | Designed by Léon Hugues | Blaze Type
Sinistre | Designed by Jules Durand | Collletttivo
---s o u n d---
* S: Final_Boss_Battle.wav by MATRIXXX_ | License: Attribution
* S: battle-march action loop by haydensayshi123 | License: Creative Commons 0
* S: water_flows_over_rock.wav by volivieri | License: Attribution
* S: Alien x.wav by Jace | License: Attribution
* S: Magic disappearing/appearing by Tetoszka | License: Creative Commons 0
* S: Laser Shot Silenced by bubaproducer | License: Attribution
* S: Scary & Suspense by tyops | License: Attribution
* S: Danger is Near (01) by NightWolfCFM | License: Attribution
* S: smoke.wav by ilame | License: Attribution
* S: Chicken Single Alarm Call by Rudmer_Rotteveel | License: Creative Commons 0
* S: RAAAAAAAAAW!!!.wav by Reitanna | License: Creative Commons 0
* S: Building Tension by AlmightyPsyche | License: Attribution
* S: single dog bark 1 by crazymonke9 | License: Attribution
* S: strained gibberish.wav by Reitanna | License: Creative Commons 0
* S: GIBBERISH.wav by xtrgamr | License: Attribution
* S: evening in the forest.wav by reinsamba | License: Attribution
* S: Turning page by supersnd | License: Creative Commons 0
* S: Game music Time of joy by BloodPixelHero | License: Attribution
* P: beeps by thisusernameis
* S: beep3.wav by thisusernameis | License: Creative Commons 0
* S: Click.ogg by Pachoba | License: Creative Commons 0
* S: UI Confirmation Alert, A1.wav by InspectorJ | License: Attribution
* S: Park Ambiance by philipecp | License: Creative Commons 0
* S: evening in the forest.wav by reinsamba | License: Attribution
* S: Spring Birds Raw (New Jersey) by hargissssound | License: Creative Commons 0
* S: Cricket in the desert (close recording) by felix.blume | License: Creative Commons 0
* S: tongue click by fleurescence | License: Creative Commons 0
* S: UI Confirmation Alert, A2.wav by InspectorJ | License: Attribution
//////////////////////////////////////////////////////////////////
-->
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en-US"> <html lang="en-US">
<head> <head>
@ -147,7 +193,8 @@ you can press
//audio //audio
var click = document.querySelector("#click"); var click = document.querySelector("#click");
var theme= document.querySelector("#theme_amanda"); var theme= document.querySelector("#theme_amanda");
theme.volume = 0.04; theme.volume = 0.4;
click.volume = 0.5;
$("body").hover( function() { $("body").hover( function() {
theme.play(); theme.play();

@ -37,6 +37,43 @@
overflow-y: hidden; overflow-y: hidden;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 100;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color:transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
.instructions{ .instructions{
font-family:jolyregularitalic; font-family:jolyregularitalic;

@ -9,6 +9,11 @@
</head> </head>
<body > <body >
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio> <audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio>
<audio loop="loop" id="theme4" preload="auto"><source src="sound/theme4_scary.wav" type="audio/wav"></audio> <audio loop="loop" id="theme4" preload="auto"><source src="sound/theme4_scary.wav" type="audio/wav"></audio>
<audio id="click"><source src="sound/click.wav" type="audio/wav"></audio> <audio id="click"><source src="sound/click.wav" type="audio/wav"></audio>
@ -108,12 +113,18 @@ var scary = document.querySelector("#theme4");
var click = document.querySelector("#click"); var click = document.querySelector("#click");
var comic = document.querySelector("#comic"); var comic = document.querySelector("#comic");
theme.volume = 1;
click.volume = 0.5;
scary.volume = 0.4;
$("body").hover( function() { $("body").hover( function() {
theme.play(); //if (left_Percentage <= 74) {
theme.addEventListener('paused',function() { theme.play();
theme.play(); theme.addEventListener('paused',function() {
theme.play();
},false); },false);
//}
}) })
// saves game step in the local storage // saves game step in the local storage
@ -151,6 +162,23 @@ var $div = $('.duo');
} }
} }
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
//move the character //move the character
$(document).keydown(function(e) { $(document).keydown(function(e) {
@ -174,6 +202,7 @@ $(document).keydown(function(e) {
offset.left += 20; offset.left += 20;
console.log("right"); console.log("right");
$div.removeClass("flipped"); $div.removeClass("flipped");
$(".message1").hide();
break; break;
} }
} }
@ -229,12 +258,19 @@ $(document).keydown(function(e) {
$('.glasses_bar').toggleClass("glasses_bar_black"); $('.glasses_bar').toggleClass("glasses_bar_black");
$('.good').toggle(); $('.good').toggle();
$('.bad').toggle(); $('.bad').toggle();
$('.bubble1, .message2').hide(); $('.bubble1, .message2').detach();
$('.bubble2, .message3').show(); $('.bubble2, .message3').show();
$("body").css("overflow", "hidden"); $("body").css("overflow", "hidden");
if ($('.to_invert').hasClass("invert") == true) {
$('.back').css("background-color","black");
}
else{
$('.back').css("background-color","white");
}
}) })
$('.bubble1').click(function(){ $('.bubble1').click(function(){
click.play(); click.play();
$('.bubble1').hide(); $('.bubble1').hide();

@ -39,6 +39,43 @@
font-family: jolyregular; font-family: jolyregular;
font-size: 1.8vw; font-size: 1.8vw;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 200;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color:transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
.instructions{ .instructions{
font-family:jolyregularitalic; font-family:jolyregularitalic;

@ -9,6 +9,10 @@
</head> </head>
<body> <body>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio> <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="click"><source src="sound/click.wav" type="audio/wav"></audio>
@ -94,23 +98,45 @@
<script> <script>
// audio // audio
var theme = document.querySelector("#theme2"); var theme = document.querySelector("#theme2");
theme.volume=0.06;
var click = document.querySelector("#click"); var click = document.querySelector("#click");
var comic = document.querySelector("#comic"); var comic = document.querySelector("#comic");
var comic_ned = document.querySelector("#comic_ned"); var comic_ned = document.querySelector("#comic_ned");
comic_ned.volume=0.05;
var no = document.querySelector("#no"); var no = document.querySelector("#no");
var yes = document.querySelector("#yes"); var yes = document.querySelector("#yes");
var anger = document.querySelector("#anger"); var anger = document.querySelector("#anger");
var chicken = document.querySelector("#chicken"); var chicken = document.querySelector("#chicken");
var smoke = document.querySelector("#smoke"); var smoke = document.querySelector("#smoke");
theme.volume=1;
comic_ned.volume=0.5;
click.volume=0.5;
chicken.volume=0.5;
$("body").hover( function() { $("body").hover( function() {
theme.play(); theme.play();
theme.addEventListener('paused',function() { theme.addEventListener('paused',function() {
theme.play(); theme.play();
},false); },false);
}) })
//go back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
// saves game step in the local storage + onload functions // saves game step in the local storage + onload functions
window.onload = function() { window.onload = function() {

@ -33,7 +33,43 @@
/*font-size: 22px;*/ /*font-size: 22px;*/
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 100;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color: white;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
.instructions{ .instructions{
font-family:jolyregularitalic; font-family:jolyregularitalic;

@ -13,14 +13,18 @@
<audio id="click"><source src="sound/click.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"><source src="sound/speech.wav" type="audio/wav"></audio>
<body class="park_body">
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<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;">
→ Click on the objects to interact with them; <br> → Click on the objects to interact with them; <br>
→ Click on the characters to talk to them;<br> → Click on the characters to talk to them;<br>
→ Press S to go back to the start;<br>
→ If the baloon ends with ✜ you can click on it to hear more from the characters;<br> → If the baloon ends with ✜ you can click on it to hear more from the characters;<br>
→ In some places it will be possible to move your avatar using the arrow keys. → In some places it will be possible to move your avatar using the arrow keys.
</div> </div>
@ -80,7 +84,7 @@
</p> </p>
</div> </div>
<div class="school2" style="display:none;"> <div class="school2" styless="display:none;">
<p class="news_title">Suspected food poisoning at Pleasant Valley Elementary School</p> <p class="news_title">Suspected food poisoning at Pleasant Valley Elementary School</p>
The situation of the local elementary school's canteen is starting to raise some serious concerns after some suspected food poisoning episodes occurred. Although the school's administration and its food provider --the <span class="clues">Monteferro Food Enterprise</span>-- already denied all charges some parents are not convinced by the declarations, asking for more clarity and controls over the food served at the canteen. One of them is Angela G., mother of a 9 years old child who experienced nausea and sickness since the beginning of the school year. Other parents are concerned about their children who often look distant and tired. The situation of the local elementary school's canteen is starting to raise some serious concerns after some suspected food poisoning episodes occurred. Although the school's administration and its food provider --the <span class="clues">Monteferro Food Enterprise</span>-- already denied all charges some parents are not convinced by the declarations, asking for more clarity and controls over the food served at the canteen. One of them is Angela G., mother of a 9 years old child who experienced nausea and sickness since the beginning of the school year. Other parents are concerned about their children who often look distant and tired.
<p class="news_author">by N.</p> <p class="news_author">by N.</p>
@ -170,13 +174,34 @@
<script src="jquery.min.js"></script> <script src="jquery.min.js"></script>
<script> <script>
// come back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
// audio // audio
var theme = document.querySelector("#theme1"); var theme = document.querySelector("#theme1");
var page = document.querySelector("#page"); var page = document.querySelector("#page");
var click = document.querySelector("#click"); var click = document.querySelector("#click");
var comic = document.querySelector("#comic"); var comic = document.querySelector("#comic");
theme.volume = 0.04; theme.volume = 0.4;
click.volume = 0.5;
//get player avatar from local storage //get player avatar from local storage
console.log (localStorage.myavatar) console.log (localStorage.myavatar)
@ -204,6 +229,10 @@
console.log ("park:",localStorage.park) console.log ("park:",localStorage.park)
document.querySelector('#player_name').innerHTML = localStorage.playerName; document.querySelector('#player_name').innerHTML = localStorage.playerName;
if (localStorage.final === "opened" ) { if (localStorage.final === "opened" ) {
$(".memory").show(); $(".memory").show();
$(".text_container").hide(); $(".text_container").hide();

@ -18,6 +18,11 @@
<audio id="smoke"><source src="sound/smoke.wav" type="audio/wav"></audio> <audio id="smoke"><source src="sound/smoke.wav" type="audio/wav"></audio>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<div id="groundline"></div> <div id="groundline"></div>
@ -91,6 +96,10 @@
var bark = document.querySelector("#bark"); var bark = document.querySelector("#bark");
var smoke = document.querySelector("#smoke"); var smoke = document.querySelector("#smoke");
theme.volume = 0.4;
click.volume = 0.5;
bark.volume = 0.5;
$("body").hover( function() { $("body").hover( function() {
theme.play(); theme.play();
@ -179,6 +188,8 @@ $(document).keydown(function(e) {
switch (e.which) { switch (e.which) {
case 83:
$(".back").show();
case 37: case 37:
offset.left -= 20; offset.left -= 20;
console.log("left"); console.log("left");
@ -241,7 +252,17 @@ $(document).keydown(function(e) {
var player_img = document.querySelector("#player_img"); var player_img = document.querySelector("#player_img");
player_img.appendChild(img); player_img.appendChild(img);
//get player name from local storage //on click
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
$("#woman").click (function(){ $("#woman").click (function(){

@ -33,6 +33,43 @@
overflow-y: hidden; overflow-y: hidden;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 100;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color: white;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
.instructions{ .instructions{
font-family:jolyregularitalic; font-family:jolyregularitalic;

@ -18,6 +18,11 @@
<audio id="smoke"><source src="sound/smoke.wav" type="audio/wav"></audio> <audio id="smoke"><source src="sound/smoke.wav" type="audio/wav"></audio>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<div id="groundline"></div> <div id="groundline"></div>
<div id="ground"> <div id="ground">
@ -88,6 +93,11 @@
var bark = document.querySelector("#bark"); var bark = document.querySelector("#bark");
var smoke = document.querySelector("#smoke"); var smoke = document.querySelector("#smoke");
theme.volume = 0.4;
click.volume = 0.5;
bark.volume = 0.5;
smoke.volume= 0.7;
$("body").hover( function() { $("body").hover( function() {
theme.play(); theme.play();
theme.addEventListener('paused',function() { theme.addEventListener('paused',function() {
@ -174,6 +184,8 @@ $(document).keydown(function(e) {
switch (e.which) { switch (e.which) {
case 83:
$(".back").show();
case 37: case 37:
offset.left -= 20; offset.left -= 20;
console.log("left"); console.log("left");
@ -235,8 +247,15 @@ $(document).keydown(function(e) {
var player_img = document.querySelector("#player_img"); var player_img = document.querySelector("#player_img");
player_img.appendChild(img); player_img.appendChild(img);
//get player name from local storage $("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
$("#woman").click (function(){ $("#woman").click (function(){
comic.play(); comic.play();

@ -33,6 +33,43 @@
overflow-y: hidden; overflow-y: hidden;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 100;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color: white;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
.instructions{ .instructions{
font-family:jolyregularitalic; font-family:jolyregularitalic;

@ -37,6 +37,43 @@
overflow-y: hidden; overflow-y: hidden;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: black;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 100;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color: black;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
.instructions{ .instructions{
font-family:jolyregularitalic; font-family:jolyregularitalic;

@ -14,6 +14,10 @@
<audio id="appear"><source src="sound/appear.wav" type="audio/wav"></audio> <audio id="appear"><source src="sound/appear.wav" type="audio/wav"></audio>
<audio id="alien"><source src="sound/alien_speech.wav" type="audio/wav"></audio> <audio id="alien"><source src="sound/alien_speech.wav" type="audio/wav"></audio>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<div id="ground_color" class="invert scroll-pane stop_invert"></div> <div id="ground_color" class="invert scroll-pane stop_invert"></div>
@ -103,10 +107,12 @@
<script> <script>
//audio //audio
var magic = document.querySelector("#magic"); var magic = document.querySelector("#magic");
magic.volume= 0.4;
var click = document.querySelector("#click"); var click = document.querySelector("#click");
var appear = document.querySelector("#appear"); var appear = document.querySelector("#appear");
var alien = document.querySelector("#alien"); var alien = document.querySelector("#alien");
magic.volume= 0.5;
click.volume=0.5;
alien.volume= 0.5; alien.volume= 0.5;
$("body").hover( function() { $("body").hover( function() {
@ -160,6 +166,8 @@ $(document).keydown(function(e) {
console.log("offset:", offset); console.log("offset:", offset);
switch (e.which) { switch (e.which) {
case 83:
$(".back").show();
case 37: case 37:
offset.left -= 20; offset.left -= 20;
console.log("left"); console.log("left");
@ -173,6 +181,8 @@ $(document).keydown(function(e) {
break; break;
} }
//check the offset and prevent the character to exceed the screen dimension //check the offset and prevent the character to exceed the screen dimension
if (offset.left < 80) { if (offset.left < 80) {
offset.left = 80; offset.left = 80;
@ -261,6 +271,17 @@ function check_pleiadians() {
}; };
}; };
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
$(".bubble1").click( function(){ $(".bubble1").click( function(){
click.play(); click.play();
$(".bubble1").hide(); $(".bubble1").hide();

@ -14,6 +14,11 @@
<audio id="appear"><source src="sound/appear.wav" type="audio/wav"></audio> <audio id="appear"><source src="sound/appear.wav" type="audio/wav"></audio>
<audio id="alien"><source src="sound/alien_speech.wav" type="audio/wav"></audio> <audio id="alien"><source src="sound/alien_speech.wav" type="audio/wav"></audio>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<div id="ground_color" class="invert scroll-pane stop_invert"></div> <div id="ground_color" class="invert scroll-pane stop_invert"></div>
<div id="groundline" class="invert scroll-pane stop_invert"></div> <div id="groundline" class="invert scroll-pane stop_invert"></div>
@ -106,6 +111,10 @@ var click = document.querySelector("#click");
var appear = document.querySelector("#appear"); var appear = document.querySelector("#appear");
var alien = document.querySelector("#alien"); var alien = document.querySelector("#alien");
magic.volume= 0.5;
click.volume=0.5;
alien.volume= 0.5;
$("body").hover( function() { $("body").hover( function() {
magic.play(); magic.play();
magic.addEventListener('paused',function() { magic.addEventListener('paused',function() {
@ -157,6 +166,8 @@ $(document).keydown(function(e) {
console.log("offset:", offset); console.log("offset:", offset);
switch (e.which) { switch (e.which) {
case 83:
$(".back").show();
case 37: case 37:
offset.left -= 20; offset.left -= 20;
console.log("left"); console.log("left");
@ -167,6 +178,7 @@ $(document).keydown(function(e) {
offset.left += 20; offset.left += 20;
console.log("right"); console.log("right");
$div.removeClass("flipped"); $div.removeClass("flipped");
$(".message1").hide();
break; break;
} }
@ -190,6 +202,17 @@ $(document).keydown(function(e) {
adjustScroll(); adjustScroll();
}) })
//go back to start
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
// make pleiadians appear // make pleiadians appear
var pleiadians = 0; var pleiadians = 0;

@ -42,6 +42,43 @@
overflow:hidden; overflow:hidden;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: black;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 200;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color:transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
#ground { #ground {
width: 120%; width: 120%;
height: 120%; height: 120%;

@ -9,11 +9,16 @@
</head> </head>
<body> <body>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<audio loop="loop" id="theme3" preload="auto"><source src="sound/theme3_danger.mp3" type="audio/mp3"></audio> <audio loop="loop" id="theme3" preload="auto"><source src="sound/theme3_danger.mp3" type="audio/mp3"></audio>
<audio id="comic"><source src="sound/baloon_intense.wav" type="audio/wav"></audio> <audio id="comic"><source src="sound/baloon_intense.wav" type="audio/wav"></audio>
<audio id="click"><source src="sound/click.wav" type="audio/wav"></audio> <audio id="click"><source src="sound/click.wav" type="audio/wav"></audio>
<audio id="water"><source src="sound/click.wav" type="audio/wav"></audio> <audio id="water"><source src="sound/click.wav" type="audio/wav"></audio>
<audio id="smoke"><source src="sound/smoke.wav" type="audio/wav"></audio>
<div id="ground" class="invert"></div> <div id="ground" class="invert"></div>
@ -59,6 +64,14 @@ var theme = document.querySelector("#theme3");
var comic = document.querySelector("#comic"); var comic = document.querySelector("#comic");
var click = document.querySelector("#click"); var click = document.querySelector("#click");
var water = document.querySelector("#water"); var water = document.querySelector("#water");
var smoke = document.querySelector("#smoke");
theme.volume= 1;
click.volume= 0.5;
comic.volume=0.5;
$("body").hover( function() { $("body").hover( function() {
theme.play(); theme.play();
@ -67,6 +80,25 @@ $("body").hover( function() {
},false); },false);
}) })
//go back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
// saves game step in the local storage // saves game step in the local storage
window.onload = function() { window.onload = function() {
theme.play(); theme.play();
@ -98,7 +130,7 @@ $("body").hover( function() {
$("#ferryman_evil").detach(); $("#ferryman_evil").detach();
$("#boat_empty, #army").hide(); $("#boat_empty, #army").hide();
$("#boat_full").show(); $("#boat_full").show();
water.play(); smoke.play();
$("#player_img").removeClass("player_land"); $("#player_img").removeClass("player_land");
$("#player_img").hide(); $("#player_img").hide();
$(".boat").animate({ left: "100%" }, { $(".boat").animate({ left: "100%" }, {

@ -36,6 +36,44 @@
font-size: 1.8vw; font-size: 1.8vw;
overflow: hidden; overflow: hidden;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: black;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 200;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color:transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
svg { svg {
width: 100%; width: 100%;
height: 100%; height: 100%;

@ -10,6 +10,11 @@
</head> </head>
<body > <body >
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<audio loop="loop" id="theme" preload="auto"><source src="sound/theme6_march.wav" type="audio/wav"></audio> <audio loop="loop" id="theme" preload="auto"><source src="sound/theme6_march.wav" type="audio/wav"></audio>
<audio id="click"><source src="sound/click.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"><source src="sound/speech.wav" type="audio/wav"></audio>
@ -151,16 +156,39 @@
<script> <script>
var theme = document.querySelector("#theme"); var theme = document.querySelector("#theme");
theme.volume= 0.05;
var click = document.querySelector("#click"); var click = document.querySelector("#click");
var comic = document.querySelector("#comic"); var comic = document.querySelector("#comic");
var shot = document.querySelector("#shot"); var shot = document.querySelector("#shot");
var smoke = document.querySelector("#smoke"); var smoke = document.querySelector("#smoke");
var explosion = document.querySelector("#explosion"); var explosion = document.querySelector("#explosion");
explosion.volume= 0.1;
var appear = document.querySelector("#appear"); var appear = document.querySelector("#appear");
var amanda = document.querySelector("#amanda_theme"); var amanda = document.querySelector("#amanda_theme");
amanda.volume= 0.05;
amanda.volume= 0.4;
explosion.volume= 0.2;
theme.volume= 0.1;
click.volume= 0.5;
smoke.volume=0.6;
//go back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
$("body").hover( function() { $("body").hover( function() {
if ( shooting_counter < 10 ){ if ( shooting_counter < 10 ){
@ -365,6 +393,7 @@ document.querySelector('#player_name').innerHTML = localStorage.playerName;
$(".message2").hide(); $(".message2").hide();
$(".message3").show(); $(".message3").show();
$(".blur").removeClass("blur_background"); $(".blur").removeClass("blur_background");
$(".back").css("background-color","white");
smoke.play(); smoke.play();
},2500); },2500);
}); });

@ -37,6 +37,43 @@
overflow-y: hidden; overflow-y: hidden;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: black;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 200;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color:transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
.instructions{ .instructions{
font-family:jolyregularitalic; font-family:jolyregularitalic;

@ -9,6 +9,12 @@
</head> </head>
<body > <body >
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<audio loop="loop" id="theme6" preload="auto"><source src="sound/theme6_march.wav" type="audio/wav"></audio> <audio loop="loop" id="theme6" preload="auto"><source src="sound/theme6_march.wav" type="audio/wav"></audio>
<audio loop="loop" id="theme_amanda" preload="auto"><source src="sound/amanda_theme.wav" type="audio/wav"></audio> <audio loop="loop" id="theme_amanda" preload="auto"><source src="sound/amanda_theme.wav" type="audio/wav"></audio>
<audio id="click"><source src="sound/click.wav" type="audio/wav"></audio> <audio id="click"><source src="sound/click.wav" type="audio/wav"></audio>
@ -153,6 +159,12 @@ var comic = document.querySelector("#comic");
var appear = document.querySelector("#appear"); var appear = document.querySelector("#appear");
var explosion = document.querySelector("#explosion"); var explosion = document.querySelector("#explosion");
amanda.volume= 0.4;
explosion.volume= 0.2;
theme.volume= 0.1;
click.volume= 0.5;
$("body").hover( function() { $("body").hover( function() {
if ( shooting_counter < 8 ){ if ( shooting_counter < 8 ){
theme.play(); theme.play();
@ -252,6 +264,9 @@ $(document).keydown(function(e) {
} }
switch (e.which) { switch (e.which) {
case 83:
$(".back").show();
break;
case 37: case 37:
offset.left -= 20; offset.left -= 20;
console.log("left"); console.log("left");
@ -282,6 +297,16 @@ $(document).keydown(function(e) {
}) })
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
var shooting_counter = 0; var shooting_counter = 0;
$("#figure1").click(function () { $("#figure1").click(function () {
@ -326,7 +351,7 @@ $(document).keydown(function(e) {
comic.play(); comic.play();
$(".blur").addClass("blur_background"); $(".blur").addClass("blur_background");
$("#amanda").show(); $("#amanda").show();
$(".message2").hide(); $(".message2").detach();
$(".message3").show(); $(".message3").show();
setTimeout( function () { setTimeout( function () {
$(".bubble1").show(); $(".bubble1").show();
@ -340,9 +365,12 @@ $(document).keydown(function(e) {
$(".bubble1").hide(); $(".bubble1").hide();
$(".bad").hide(); $(".bad").hide();
$(".good").show(); $(".good").show();
$("#tree9").show();
$("#tree_flipped9").hide();
amanda.play(); amanda.play();
theme.pause(); theme.pause();
$(".stop_invert").removeClass("invert"); $(".stop_invert").removeClass("invert");
$('.back').css("background-color","white");
$('html').css({overflow: 'hidden'}); $('html').css({overflow: 'hidden'});
setTimeout( function () { setTimeout( function () {
comic.play(); comic.play();

@ -41,6 +41,44 @@
font-family: jolyregular; font-family: jolyregular;
font-size: 1.8vw; font-size: 1.8vw;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 100;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color: transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
#ground { #ground {
width: 120%; width: 120%;

@ -9,6 +9,10 @@
</head> </head>
<body> <body>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio> <audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio>
<audio loop="loop" id="theme3" preload="auto"><source src="sound/theme3_danger.mp3" type="audio/mp3"></audio> <audio loop="loop" id="theme3" preload="auto"><source src="sound/theme3_danger.mp3" type="audio/mp3"></audio>
@ -105,6 +109,31 @@ var click = document.querySelector("#click");
var comic = document.querySelector("#comic"); var comic = document.querySelector("#comic");
var anger = document.querySelector("#anger"); var anger = document.querySelector("#anger");
anger.volume= 0.3;
click.volume=0.5;
comic.volume=0.5;
scary.volume=0.7;
//go back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
$("body").hover( function() { $("body").hover( function() {
if (villagers < 9){ if (villagers < 9){
theme.play(); theme.play();
@ -116,6 +145,7 @@ $("body").hover( function() {
// saves game step in the local storage // saves game step in the local storage
window.onload = function() { window.onload = function() {
theme.play(); theme.play();
window.localStorage.setItem("square_satanism","opened"); window.localStorage.setItem("square_satanism","opened");
console.log ("square satanism:",localStorage.square_satanism); console.log ("square satanism:",localStorage.square_satanism);
@ -309,6 +339,7 @@ $("body").hover( function() {
function end_recluting() { function end_recluting() {
if (villagers == 9) { if (villagers == 9) {
$(".back").css("background-color","black");
setTimeout ( function (){ setTimeout ( function (){
$(".game_bar").addClass("game_bar_glow"); $(".game_bar").addClass("game_bar_glow");
$(".message1").hide(); $(".message1").hide();

@ -41,6 +41,44 @@
font-family: jolyregular; font-family: jolyregular;
font-size: 1.8vw; font-size: 1.8vw;
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 0.8em;
padding-top: 1.5em;
z-index: 100;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color: transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
#ground { #ground {
width: 120%; width: 120%;

@ -9,6 +9,11 @@
</head> </head>
<body> <body>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio> <audio loop="loop" id="theme2" preload="auto"><source src="sound/theme2.wav" type="audio/wav"></audio>
<audio loop="loop" id="theme3" preload="auto"><source src="sound/theme3_danger.mp3" type="audio/mp3"></audio> <audio loop="loop" id="theme3" preload="auto"><source src="sound/theme3_danger.mp3" type="audio/mp3"></audio>
<audio id="click"><source src="sound/click.wav" type="audio/wav"></audio> <audio id="click"><source src="sound/click.wav" type="audio/wav"></audio>
@ -104,6 +109,11 @@ var click = document.querySelector("#click");
var comic = document.querySelector("#comic"); var comic = document.querySelector("#comic");
var anger = document.querySelector("#anger"); var anger = document.querySelector("#anger");
anger.volume= 0.3;
click.volume=0.5;
comic.volume=0.5;
scary.volume=0.7;
$("body").hover( function() { $("body").hover( function() {
if (villagers < 9){ if (villagers < 9){
theme.play(); theme.play();
@ -113,6 +123,26 @@ $("body").hover( function() {
} }
}) })
//go back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
// saves game step in the local storage // saves game step in the local storage
window.onload = function() { window.onload = function() {
theme.play(); theme.play();
@ -309,6 +339,7 @@ $("body").hover( function() {
function end_recluting() { function end_recluting() {
if (villagers == 9) { if (villagers == 9) {
$(".back").css("background-color","black");
setTimeout ( function (){ setTimeout ( function (){
click.play(); click.play();
$(".game_bar").addClass("game_bar_glow"); $(".game_bar").addClass("game_bar_glow");

@ -47,6 +47,43 @@ body{
height: 100%; height: 100%;
/*overflow-x:hidden;*/ /*overflow-x:hidden;*/
} }
.back{
position: fixed;
color:#c94dff ;
text-align: center;
font-family: jolyregular;
background-color: white;
top:40%;
bottom:43%;
left:35%;
right:35%;
border: 1px solid #c94dff;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff;
-moz-box-shadow: 10px 10px 0px 0px #c94dff;
box-shadow: 10px 10px 0px 0px #c94dff;
font-size: 1.25em;
padding-top: 1.5em;
z-index: 200;
line-height: 1.5em;
}
.button_back{
font-size: 2.8vh;
-webkit-appearance: none;
background-color:transparent;
border: 1px #c94dff solid;
border-radius: 25em;
color:#c94dff;
cursor:pointer;
font-family: jolybolditalic;
padding-bottom:3px;
}
.button_back:hover{
border: 0.1em transparent solid;
-webkit-box-shadow: 0px 0px 8px 1px #c94dff;
-moz-box-shadow: 0px 0px 8px 1px #c94dff;
box-shadow: 0px 0px 8px 1px #c94dff;
}
a{ a{
color: #c94dff; color: #c94dff;
} }

@ -9,6 +9,12 @@
<link rel="stylesheet" href="thesis.css"> <link rel="stylesheet" href="thesis.css">
</head> </head>
<body> <body>
<div class="back" style="display: none;">
Do you want to start from the beginning?<br>
<button id="go_to_start" class="button_back"> yes </button> / <button id="stay"class="button_back"> no </button>
</div>
<div class="info_button"></div> <div class="info_button"></div>
<div id="info_text" style="display: none;"> <div id="info_text" style="display: none;">
<span class="title">When you might go astray</span> is a research project dealing with conspiracy theories, fictional narratives, and how their mutuality shapes the stories of their believers. <span class="title">When you might go astray</span> is a research project dealing with conspiracy theories, fictional narratives, and how their mutuality shapes the stories of their believers.
@ -309,5 +315,24 @@ Fig 5. river_of_karma (2016). <em>Kek, God of Chaos. </em>Available at:&lt;<a hr
$(".info_button").click( function (){ $(".info_button").click( function (){
$("#info_text").toggle(); $("#info_text").toggle();
}) })
//go back to start
$(document).keydown(function(e) {
e.preventDefault();
switch (e.which) {
case 83:
$(".back").show();
}
});
$("#go_to_start").click( function (){
window.location.href="index.html";
click.play();
});
$("#stay").click( function (){
$(".back").hide();
click.play();
});
</script> </script>
</body> </body>
Loading…
Cancel
Save