annasandri
/
pizzagate
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fin

Browse Source
master
*anna* 3 years ago
parent a9ffa8f873
commit 5d143f6668
12 changed files with 320 additions and 19 deletions
Show Stats Download Patch File Download Diff File

BIN
.DS_Store vendored
View File

Binary file not shown.

BIN
tree/.DS_Store vendored
View File

Binary file not shown.

190
tree/final.css
Unescape Escape View File

@ -0,0 +1,190 @@
@font-face {
font-family: sinistre;
src: url(fonts/Sinistre-StCaroline.woff),
url(fonts/Sinistre-StCaroline.otf);
}
@font-face {
font-family: jolybolditalic;
src: url(fonts/JolyDisplay-BoldDisplayItalic.woff),
url(fonts/JolyDisplay-BoldDisplayItalic.otf);
}
@font-face {
font-family: jolyregularitalic;
src: url(fonts/JolyDisplay-RegularDisplayItalic.woff),
url(fonts/JolyDisplay-RegularDisplayItalic.otf);
}
@font-face {
font-family: jolyregular;
src: url(fonts/JolyDisplay-RegularDisplay.woff),
url(fonts/JolyDisplay-RegularDisplay.otf);
}
@font-face {
font-family: jolyheavyitalic;
src: url(fonts/JolyDisplay-HeavyDisplayItalic.woff),
url(fonts/JolyDisplay-HeavyDisplayItalic.otf);
}
/*light violet:#d166ff/ violet:#c94dff */
body{
font-size: 1.5vw;
margin:2.5%;
font-family: jolyregular;
max-width: 100%;
max-height: 100%;
}
::-moz-selection { /* Code for Firefox */
color: #c94dff;
background-color: white;
}
::selection {
color: #c94dff;
background-color: white;
}
#info_text::-moz-selection { /* Code for Firefox */
background-color: white;
color:black;
}
#info_text::selection {
background-color: white;
color:black;
}
img.inText{
height:3vw;
}
#info_button{
left:4%;
position: fixed;
font-size: 4vw;
color:#c94dff ;
z-index: 5;
cursor: pointer;
}
.blur_background {
filter: blur(2px);
}
#info_text{
position: fixed;
font-size: 1.5vw;
z-index: 10;
color:#c94dff ;
font-family: jolyregular;
background-color: white;
top:20%;
right:20%;
left:20%;
padding: 20px;
border:1px #c94dff solid;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff ;
-moz-box-shadow: 10px 10px 0px 0px #c94dff ;
box-shadow: 10px 10px 0px 0px #c94dff;
}
a {
color:#c94dff ;
}
.title{
font-family: jolybolditalic;
}
.mid_text{
font-size: 3.2vw;
}
.block1{
margin-left: 50px;
}
.amanda_intro {
position: relative;
background: #ffffff;
color: #000000;
font-family: sinistre;
font-size: 20px;
text-align: center;
width: 80%;
height: 12%;
right: 4%;
float: right;
border-radius: 15px;
padding: 20px;
border: #000000 solid 1px;
}
.amanda_intro:after {
content: '';
position: absolute;
display: block;
width: 0;
z-index: 1;
border-style: solid;
border-width: 0 20px 20px 0;
border-color: transparent #ffffff transparent transparent;
bottom: -20px;
left: 80%;
margin-left: -10px;
}
.amanda_intro:before {
content: '';
position: absolute;
width: 0;
z-index: 0;
border-style: solid;
border-width: 0 21px 21px 0;
border-color: transparent #000000 transparent transparent;
bottom: -22px;
left: 80%;
margin-left: -10px;
display: block;
}
.scene1{
height: 500px;
width: 100%;
position: absolute;
top:10%;
margin-bottom: 4%;
}
#amanda_img{
margin-left:85%;
padding-top: 20px;
height: 7vw;
}
#tree_img{
position: absolute;
height: 8vw;
left:9%;
}
svg {
position: absolute;
top:250px;
z-index:-1;
}
/* scroll bar */
/* width */
::-webkit-scrollbar {
color:white;
width: 10px;
height: 10px;
}
/* Track */
::-webkit-scrollbar-track {
background: white;
}
/* Handle */
::-webkit-scrollbar-thumb {
background: #c94dff;
border-radius: 15px;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: white;
}

68
tree/final.html
Unescape Escape View File

@ -4,17 +4,47 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<title>oracle</title> <title>oracle</title>
<link rel="icon" href="imgs/avatars/ball2.gif"> <link rel="icon" href="imgs/avatars/ball2.gif">
<link rel="stylesheet" href="final.css">
</head> </head>
<body> <body>
<span id="info_button" >ⓘ</span>
<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 the mutuality between the two shapes the stories of their believers.
The research starts from the following questions: how much of the pervasiveness of conspiracy theories is generated by their compliance to certain narrative schemes? What happens when the legitimate need to generate counter-narratives gets trapped in other kinds of templates?
<br>
<span class="title">When you might go astray</span> deals with these questions by exploring the dangers of conspiracy theories and their entanglement with narrative schemes transforming their believers into heroes on a quest. <br>
The project is divided into two parts: a game, where the player is asked to undertake a journey, and an essay, examining conspiratorial narratives through the lenses of the mono-myth.
<br><br>
<span class="title">When you might go astray</span> has been developed by <a href="https://www.annasandri.com/" target="_blank">Anna Sandri</a> during her studies at the <a href="https://www.pzwart.nl/experimental-publishing/" target="_blank">Experimental Publishing</a> master course, Piet Zwart Institute (NL).
</div>
<div class="amanda_intro"> <div class="amanda_intro">
<span id="player_name"></span> (<span id="player_img"></span>), I think you already met the oracle. welcome back <span id="player_name"></span>, I think you already met the oracle.
The oracle you are dealing with is an omniscient narrator, someone who very much likes to scrutinize the characters of their stories. The oracle usually shows to have more knowledge about the characters than they have about themselves. This time, the oracle is willing to show you what they learned about your journey here. We are going to do this step by step. The oracle you are dealing with is an omniscient narrator, someone who very much likes to scrutinize the characters of their stories. As part of their role, the oracle usually shows to have more knowledge about the characters than they have about themselves. For this time, they are willing to show you what it learned about your journey here. We are going to do this step by step.
</div> </div>
<img id="amanda_img"src="imgs/spring_river/amanda.gif">
<!--
<div class="scene1">
<svg class="ground_top" height="1px" width="97%">
<line x1="0" y1="0" x2="99%" y2="0" style="stroke:black;stroke-width:2" />
</svg>
<img id="tree_img"src="imgs/spring_river/tree.gif">
</div>
-->
<div class="mid_text ">
This might be a bit of a shock for you <span id="player_name"></span> (<span id="player_img"></span>) but it seems that, while looking for your friend Amanda (<img class="inText"src="imgs/spring_river/amanda.gif">) you got caught up in the situation. I was observing you from behind (<img class="inText" src="imgs/avatars/ball1.png" >) and I managed to collect some things that you might have forgotten along the track. I understand that the journey can be really insidious (<img class="inText" src="imgs/spring_river/tree_rotate.gif">) and so I won't judge you: I will only try to show you what happened along the way.
</div>
<div class="mid_text">
You would be lying to yourself if you told me that you already knew what was going to happen, where you wanted to go, or what you were looking for when you started this journey (<img class="inText"src="imgs/final/journey.gif">). The fact is that sometimes all these questions can temporarily take a back seat. On certain days, a path that you didn't explore yet can appear in front of you. You just need to carry on walking (<img class="inText"src="imgs/final/journey2.gif">).
</div>
<div class="quote"> <div class="quote">
“A hero ventures forth from the world of common day into a region of supernatural wonder:[...]"<br> “A hero ventures forth from the world of common day into a region of supernatural wonder:[...]"<br>
-- J.Campbell, The Hero with a Thousand Faces -- J.Campbell, The Hero with a Thousand Faces
</div> </div>
<div id="park_block" style="display:none;"> <div id="park_block" style="display:none;">
<u>you waited at the park</u><br> <u>you waited at the park</u><br>
You were alone in the park, waiting for your friend Amanda. She bailed on you with no explanation. It is quite likely that she just forgot about the appointment. Somehow you think there is much more going on: she doesn't want to meet you anymore or she spent the night at a cool party where you were not invited. Maybe she ended up being part of something even bigger. You were alone in the park, waiting for your friend Amanda. She bailed on you with no explanation. It is quite likely that she just forgot about the appointment. Somehow you think there is much more going on: she doesn't want to meet you anymore or she spent the night at a cool party where you were not invited. Maybe she ended up being part of something even bigger.
@ -31,7 +61,9 @@
✉ In 2017, on the image-board website 4chan, a user named "Q Clearance Patriot" started to drop some alleged government secrets, claiming to be a high-level federal administrator. The clues shared by the supposed government whistleblower originated the conspiracy theory QAnon. The latter is the alt-right conspiracy fantasy asserting the world's rulers are affiliates of a pedophile cabal. ✉ In 2017, on the image-board website 4chan, a user named "Q Clearance Patriot" started to drop some alleged government secrets, claiming to be a high-level federal administrator. The clues shared by the supposed government whistleblower originated the conspiracy theory QAnon. The latter is the alt-right conspiracy fantasy asserting the world's rulers are affiliates of a pedophile cabal.
</div> </div>
</div> </div>
<div class="mid_text">
As you probably noticed, at this point of the journey you seemed to have taken a new turn: confident or not of your findings, you felt like continuing the investigation. This is the moment where you entered a new dimension, unraveling another descending road: the place where the true conflict exists and manifests itself.
</div>
<div class="quote"> <div class="quote">
"[...] fabulous forces are there encountered and a decisive victory is won:[...]" <br> "[...] fabulous forces are there encountered and a decisive victory is won:[...]" <br>
-- J.Campbell, The Hero with a Thousand Faces -- J.Campbell, The Hero with a Thousand Faces
@ -60,12 +92,15 @@
✰According to some UFO/ New Age cults, aliens coming from other planets are part of a galactic confederation that, concerned for earth's future, is trying to help humans to fight evil and make them ascend to higher dimensions. In order to achieve it the aliens, also known as Pleiadians or Nordic Aliens, are often contacting some special individuals to channel them and convey their messages. ✰According to some UFO/ New Age cults, aliens coming from other planets are part of a galactic confederation that, concerned for earth's future, is trying to help humans to fight evil and make them ascend to higher dimensions. In order to achieve it the aliens, also known as Pleiadians or Nordic Aliens, are often contacting some special individuals to channel them and convey their messages.
</div> </div>
</div> </div>
<div class="mid_text">
Maybe, despite everything that you had been through, you realised that you had to enter in a phase of a different kind. You made a step for yourself but what about the others? What can you do with your achievements if they cannot be translated for the outer world?
To survive the impact with it is not an easy task but you decided to come back home and share your journey.
</div>
<div class="quote"> <div class="quote">
"The hero comes back from this mysterious adventure with the power to bestow boons on his fellow man.” <br> "The hero comes back from this mysterious adventure with the power to bestow boons on his fellow man.” <br>
-- J.Campbell, The Hero with a Thousand Faces -- J.Campbell, The Hero with a Thousand Faces
</div> </div>
<div id="square_s_block" style="display:none;"> <div id="square_s_block" style="display:none;">
<u>you recruited your army at the village square</u><br> <u>you recruited your army at the village square</u><br>
By then certain of the school's staff abuse, you headed off to the village square in order to share your findings with the local community and persuade them to interrupt the educational trip. By then certain of the school's staff abuse, you headed off to the village square in order to share your findings with the local community and persuade them to interrupt the educational trip.
@ -83,15 +118,21 @@
➳ On January 6, 2021, a group of Donald Trump's most fervent supporters, white supremacists, and QAnon disciples stormed the United States Capitol in a violent attack. Most of them believed to be there to liberate the country from a reptilian pedophile cabal. ➳ On January 6, 2021, a group of Donald Trump's most fervent supporters, white supremacists, and QAnon disciples stormed the United States Capitol in a violent attack. Most of them believed to be there to liberate the country from a reptilian pedophile cabal.
</div> </div>
</div> </div>
<div class="quote"> <div class="quote">
“... we read novels because they give us the comfortable sensation of living in worlds where the notion of truth is indisputable, while the actual world seems to be a more treacherous place.”<br> “... we read novels because they give us the comfortable sensation of living in worlds where the notion of truth is indisputable, while the actual world seems to be a more treacherous place.”<br>
― U. Eco, Six Walks in the Fictional Woods ― U. Eco, Six Walks in the Fictional Woods
</div> </div>
<div class="mid_text">
After you met Amanda, you probably found yourself a bit unsettled. Was everything a lie?
Why was (whistleblower) hiding the truth from you? How could you make such an error of judgment?
I can't really say, I suppose you only took this turn for the sake of it. It really didn't matter why, and most importantly, you really didn't care if the signals you were grasping were real or illusionary, if the people you met along the way were lying to you or not.
I am also suggesting is that what happened can be considered unimportant: it only served the purpose of distracting yourself and giving you with temporary glimpses of possible adventures. If I were you, I want bother too much to understand what these symbols (pills, weapons, whatever) and characters (pat, saurians, ecc) meant. As far as I am concerned, as right or wrong they can be, hidden in this corner, they are not hurting anyone.
</div>
<script src="jquery.min.js"></script>
<script> <script>
//player name //player name
@ -153,8 +194,11 @@ window.onload = function (){
spring_river.style.display ="block"; spring_river.style.display ="block";
} }
} }
// buttons
$("#info_button").click( function () {
$("#info_text").toggle();
/*$("#info_button").toggleClass("blur_background");*/
});
</script> </script>
<script type="text/javascript" src="index.js" ></script> <script type="text/javascript" src="index.js" ></script>

BIN
tree/imgs/.DS_Store vendored
View File

Binary file not shown.

BIN
tree/imgs/final/.DS_Store vendored
View File

Binary file not shown.

BIN
tree/imgs/final/journey.gif
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
tree/imgs/final/journey2.gif
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.6 KiB

BIN
tree/imgs/final/oracle.gif
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

56
tree/index.css
Unescape Escape View File

@ -34,6 +34,62 @@ body{
max-width: 100%; max-width: 100%;
max-height: 100%; max-height: 100%;
} }
::-moz-selection { /* Code for Firefox */
background-color: white;
}
::selection {
background-color: white;
}
#info_text::-moz-selection { /* Code for Firefox */
background-color: white;
color:black;
}
#info_text::selection {
background-color: white;
color:black;
}
#info_button{
left:4%;
position: fixed;
font-size: 4vw;
color:#c94dff ;
z-index: 5;
cursor: pointer;
}
.blur_background {
filter: blur(2px);
}
#info_text{
position: fixed;
font-size: 1.5vw;
line-height: initial;
z-index: 10;
color:#c94dff ;
font-family: jolyregular;
background-color: white;
top:20%;
right:20%;
left:20%;
padding: 20px;
border:1px #c94dff solid;
-webkit-box-shadow: 10px 10px 0px 0px #c94dff ;
-moz-box-shadow: 10px 10px 0px 0px #c94dff ;
box-shadow: 10px 10px 0px 0px #c94dff;
}
a {
color:#c94dff ;
}
.title{
font-family: jolybolditalic;
}
span.special1{ span.special1{
font-family: jolybolditalic; font-family: jolybolditalic;

23
tree/index.html
Unescape Escape View File

@ -9,6 +9,16 @@
</head> </head>
<body> <body>
<span id="info_button" >ⓘ</span>
<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 the mutuality between the two shapes the stories of their believers.
The research starts from the following questions: how much of the pervasiveness of conspiracy theories is generated by their compliance to certain narrative schemes? What happens when the legitimate need to generate counter-narratives gets trapped in other kinds of templates?
<br>
<span class="title">When you might go astray</span> deals with these questions by exploring the dangers of conspiracy theories and their entanglement with narrative schemes transforming their believers into heroes on a quest. <br>
The project is divided into two parts: a game, where the player is asked to undertake a journey, and an essay, examining conspiratorial narratives through the lenses of the mono-myth.
<br><br>
<span class="title">When you might go astray</span> has been developed by <a href="https://www.annasandri.com/" target="_blank">Anna Sandri</a> during her studies at the <a href="https://www.pzwart.nl/experimental-publishing/" target="_blank">Experimental Publishing</a> master course, Piet Zwart Institute (NL).
</div>
<div class="introtext"> <div class="introtext">
<span style="-webkit-padding-start: 15vw;">It</span> looks like you have been summoned by the <span class="special1">oracle (<img src="imgs/avatars/ball1.png" height="60vw">,<img src="imgs/avatars/ball2.gif" height="60vw">,<img src="imgs/avatars/ball4.gif" height="60vw">)</span> <span style="-webkit-padding-start: 15vw;">It</span> looks like you have been summoned by the <span class="special1">oracle (<img src="imgs/avatars/ball1.png" height="60vw">,<img src="imgs/avatars/ball2.gif" height="60vw">,<img src="imgs/avatars/ball4.gif" height="60vw">)</span>
<div class="line"></div> you will be asked to start a journey: throughout it you will be called <div class="line"></div> you will be asked to start a journey: throughout it you will be called
@ -110,23 +120,24 @@ you can press
when you are ready when you are ready
</div> </div>
<script src="jquery.min.js"></script>
<script> <script>
//clear local storage when back on the landing page $("#info_button").click( function () {
$("#info_text").toggle();
$("#info_button").toggleClass("blur_background");
});
/* /*
window.onload = function() {
window.localStorage.clear();
}*/
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {
window.localStorage.clear(); window.localStorage.clear();
console.log("loaded"); console.log("loaded");
updateAvatar(); updateAvatar();
}); });
*/
</script> </script>
<script src="jquery.min.js"></script>
<script type="text/javascript" src="index.js" ></script> <script type="text/javascript" src="index.js" ></script>
</body> </body>

2
tree/index.js
Unescape Escape View File

@ -38,7 +38,7 @@ var inputPlayer = document.querySelector('#player_name').value;
localStorage.playerName=inputPlayer; localStorage.playerName=inputPlayer;
if (document.querySelector('#player_name').value === '') { if (document.querySelector('#player_name').value === '') {
alert('Please insert you name and choose your avatar'); alert('Dear visitor, in order to start you journey you are kindly asked to type you name and choose your avatar');
} }
else { else {
window.location.href = "park.html"; window.location.href = "park.html";

Write Preview
Loading…
Cancel
Save