<textarea id="input"></textarea>
<div>
<button id="save">Save</button>
</div>
<span id="resultSpan">
</span>
[[Output]]
<script>
var result = window.testFunction(2,10);
document.getElementById("resultSpan").innerHTML = result;
(function (global) {
document.getElementById("save").addEventListener("click",
function () {
global.sessionStorage.setItem("mySharedData"),
document.getElementById("input").value);
}, false);
}(window));
</script>
<textarea id="output">
</textarea>
[[Input]]
<script>
(function (global) {
document.getElementById("output").value =
global.sessionStorage.getItem("mySharedData");
}(window));
</script>
<script>
document.body.style.backgroundColor = "rgb(48, 48, 48)";
</script>
<div id="monitorArea" class="noSelect backgroundClass">
<img src="https://dl.dropboxusercontent.com/s/l5ocurcnuokvamw/monitor.png?dl=0" id="monitorImg" style="width:100%;height:100%;">
<div class="iconClass" class="noSelect" id="iconDive" >
<img src="https://dl.dropboxusercontent.com/s/9hl0s6o0de0mjhf/icon_Dive.png?dl=0" style="width:100%;height:100%;">
</div>
<div class="iconClass noSelect" id="iconFile">
<img src="https://dl.dropboxusercontent.com/s/axxrr3zhnaf8e4n/icon_File.png?dl=0" style="width:100%;height:100%;">
</div>
<div class="iconClass noSelect" id="iconLog">
<img src="https://dl.dropboxusercontent.com/s/tzd5ybmmnks7bxh/icon_Log.png?dl=0" style="width:100%;height:100%;">
</div>
<div class="textClass noSelect" id="textTest">
<img src="https://dl.dropboxusercontent.com/s/c91j9gbz3mb0fpc/text_Test.png?dl=0">
</div>
</div>
<script>
document.body.style.backgroundColor = "rgb(48, 48, 48)";
var bgm = document.getElementById("bgMusic");
bgm.volume = 0.5;
bgm.loop = true;
var enterFX = document.getElementById("enterEffect");
enterFX.volume = 0.5;
window.onload = function(){
console.log("Window has loaded.");
bgm.play()
}
</script>
<audio id="bgMusic">
<source
src="https://dl.dropboxusercontent.com/s/wnxhpumc6rni1qf/testAmbient.mp3?dl=0" type="audio/mpeg">
</audio>
<audio id="enterEffect">
<source src="https://dl.dropboxusercontent.com/s/ie09bmyak8iigve/entryTest.mp3?dl=0" type="audio/mpeg">
</audio>
<div id="loginArea" class="noSelect backgroundClass">
<img src="https://dl.dropboxusercontent.com/s/l5ocurcnuokvamw/monitor.png?dl=0" id="monitorImg" style="width:100%;height:100%;">
<div id="loginInput" class="windowClass">
<img src="https://dl.dropboxusercontent.com/s/pmuskygw5on4pyq/windowLogin.png?dl=0" style="width:100%;height:100%;">
<input type="text" name="Code" class="inputClass" id="code">
</br>
<input type="text" name="Password" class="inputClass"
id="password">
</div>
</div>
<script>
var code = document.getElementById("code");
var pass = document.getElementById("password");
document.onkeydown = function(event){
}
document.onkeyup = function(event){
var idContent = code.value;
var passContent = pass.value;
var key_code = event.keyCode;
if(key_code === 13){
enterFX.load();
enterFX.play();
if(idContent === "0034" && passContent === "wellspring"){
window.story.show('Home');
}
else{
return;
}
}
}
</script>
<script>
//INIT VARIABLES / LISTENERS / BASE STATES --------------------
document.body.style.backgroundColor = "rgb(48, 48, 48)";
var code = document.getElementById("code");
var pass = document.getElementById("password");
var logIcon = document.getElementById("iconLog");
var logWindow = document.getElementById("logWindow");
logIcon.style.visibility = "hidden";
logIcon.addEventListener("mousedown", clickLog);
logWindow.style.visibility = "hidden";
logWindow.addEventListener("mousedown", clickLogWindow);
var diveIcon = document.getElementById("iconDive");
var diveWindow = document.getElementById("diveWindow");
diveIcon.style.visibility = "hidden";
diveIcon.addEventListener("mousedown", clickDive);
diveWindow.style.visibility = "hidden";
diveWindow.addEventListener("mousedown", clickDiveWindow);
var diveButton = document.getElementById("diveButton");
diveButton.style.visibility = "hidden";
var fileIcon = document.getElementById("iconFile");
var fileWindow = document.getElementById("fileWindow");
fileIcon.style.visibility = "hidden";
fileIcon.addEventListener("mousedown", clickFile);
fileWindow.style.visibility = "hidden";
fileWindow.addEventListener("mousedown", clickFileWindow);
var osText = document.getElementById("textTest");
osText.style.visibility = "hidden";
var goggleImage = document.getElementById("goggleIMG");
//goggleImage.style.visibility = "hidden";
var loginWindow = document.getElementById("loginInput");
//Init Audio
var bgm = document.getElementById("bgMusic");
bgm.volume = 0.5;
bgm.loop = true;
var enterSFX = document.getElementById("enterEffect");
enterSFX.volume = 0.5;
//Check Window Load INIT
window.onload = function(){
console.log("Window has loaded.");
bgm.play()
}
//MOUSE EVENTS ---------------------------------------------
//KEY EVENTS -----------------------------------------------
//Keys Up/Down
document.onkeydown = function(event){
}
document.onkeyup = function(event){
var idContent = code.value;
var passContent = pass.value;
var key_code = event.keyCode;
//Check if ENTER
if(key_code === 13){
enterSFX.load();
enterSFX.play();
//Check Password for Login
if(idContent === "0034" && passContent === "wellspring"){
loginInput.style.visibility = "hidden";
showOS();
idContent = "";
passContent = "";
}
else{
return;
}
}
}
//FUNCTIONS------------------------------------------------
//Activate Clicked Element
function activate(target){
console.log(target + " Element was clicked.");
return;
}
//Show OS IMGs
function showOS(){
logIcon.style.visibility = "visible";
diveIcon.style.visibility = "visible";
fileIcon.style.visibility = "visible";
osText.style.visibility = "visible";
return;
}
//Hide OS IMGs
function hideOS(){
logIcon.style.visibility = "hidden";
diveIcon.style.visibility = "hidden";
fileIcon.style.visibility = "hidden";
osText.style.visibility = "hidden";
return;
}
//Blur / Un Blur OS IMGs
function unblurOS(){
logIcon.style.opacity = "1.0";
diveIcon.style.opacity = "1.0";
fileIcon.style.opacity = "1.0";
osText.style.opacity = "1.0";
return;
}
function blurOS(){
logIcon.style.opacity = "0.25";
diveIcon.style.opacity = "0.25";
fileIcon.style.opacity = "0.25";
osText.style.opacity = "0.25";
return;
}
//Blur / Unblur Target Element
function blur(target){
if(target.style.opacity =! "0.25"){
target.style.opacity = "0.25";
return;
}
else{
target.style.opacity = "1.0";
return;
}
}
function unblur(target){
return;
}
//CLICK EVENTS --------------------------------------------
//Find Clicked Element
document.body.onmousedown = function (e) {
e = e || window.event;
var target = (e.target || e.srcElement).id;
activate(target);
}
//Click Log Icon
function clickLog(){
if(logIcon.style.visibility === "visible"){
blurOS();
logWindow.style.visibility = "visible";
}
else{
return;
}
return;
}
//Click File Icon
function clickFile(){
if(fileIcon.style.visibility === "visible"){
blurOS();
fileWindow.style.visibility = "visible";
}
else{
return;
}
return;
}
//Click Dive Icon
function clickDive(){
if(diveIcon.style.visibility === "visible"){
blurOS();
diveWindow.style.visibility = "visible";
diveButton.style.visibility = "visible";
}
else{
return;
}
return;
}
//Click Log Window
function clickLogWindow(){
if(logWindow.style.visibility === "visible"){
unblurOS();
logWindow.style.visibility = "hidden";
}
else{
return;
}
return;
}
//Click File Window
function clickFileWindow(){
if(fileWindow.style.visibility === "visible"){
unblurOS();
fileWindow.style.visibility = "hidden";
}
else{
return;
}
return;
}
//Click Dive Window
function clickDiveWindow(){
if(diveWindow.style.visibility === "visible"){
unblurOS();
diveWindow.style.visibility = "hidden";
diveButton.style.visibility = "hidden";
}
else{
return;
}
return;
}
//BUTTON EVENTS ----------------------------------------------
//Dive Button Sequence
function diveFunction(){
window.story.show('Dive');
return;
}
</script>
<audio id="bgMusic">
<source
src="https://dl.dropboxusercontent.com/s/wnxhpumc6rni1qf/testAmbient.mp3?dl=0" type="audio/mpeg">
</audio>
<audio id="enterEffect">
<source src="https://dl.dropboxusercontent.com/s/ie09bmyak8iigve/entryTest.mp3?dl=0" type="audio/mpeg">
</audio>
<div id="desktopArea" class="noSelect backgroundClass">
<img src="https://dl.dropboxusercontent.com/s/l5ocurcnuokvamw/monitor.png?dl=0" id="monitorImg" style="width:100%;height:100%;">
<img src="https://dl.dropboxusercontent.com/s/oygucfyadkoh2kg/goggle.png?dl=0" id="goggleIMG" class="imageClass noSelect" style="width:70%;height:35%;">
<div id="loginInput" class="windowClass">
<img src="https://dl.dropboxusercontent.com/s/pmuskygw5on4pyq/windowLogin.png?dl=0" style="width:100%;height:100%;" id="loginInputIMG">
<input type="text" name="Code" class="inputClass" id="code">
</br>
<input type="text" name="Password" class="inputClass"
id="password">
</div>
<div class="iconClass" class="noSelect" id="iconDive" >
<img src="https://dl.dropboxusercontent.com/s/9hl0s6o0de0mjhf/icon_Dive.png?dl=0" style="width:100%;height:100%;" id="diveIconIMG">
</div>
<div class="windowClass noSelect" id="diveWindow">
<img src="https://dl.dropboxusercontent.com/s/d9m7bl1wnl2sove/windowDive.png?dl=0" style="width:100%;height:100%;" id="diveWinIMG">
</div>
<button id="diveButton" onclick="diveFunction()">
EXECUTE DIVE SEQUENCE
</button>
<div class="iconClass noSelect" id="iconFile">
<img src="https://dl.dropboxusercontent.com/s/axxrr3zhnaf8e4n/icon_File.png?dl=0" style="width:100%;height:100%;" id="fileIconIMG">
</div>
<div class="windowClass noSelect" id="fileWindow">
<img src="https://dl.dropboxusercontent.com/s/hvei9e5hn1bfmss/windowFile.png?dl=0" style="width:100%;height:100%;" id="fileWinIMG">
</div>
<div class="iconClass noSelect" id="iconLog">
<img src="https://dl.dropboxusercontent.com/s/tzd5ybmmnks7bxh/icon_Log.png?dl=0" style="width:100%;height:100%;" id="logIconIMG">
</div>
<div class="windowClass noSelect" id="logWindow">
<img src="https://dl.dropboxusercontent.com/s/pjw7wlg7ithl1ey/windowLogs.png?dl=0" style="width:100%;height:100%;" id="logWinIMG">
</div>
<div class="textClass noSelect" id="textTest">
<img src="https://dl.dropboxusercontent.com/s/c91j9gbz3mb0fpc/text_Test.png?dl=0" style="width:100%;height:100%;" id="osTextIMG">
</div>
</div>
Double-click this passage to edit it.
<div id="diveLoadWindow" class="windowClass noSelect">
<img src="https://dl.dropboxusercontent.com/s/ejpyk6akl5alctj/vrScreen.png?dl=0" id="diveLoadImg" style="width:100%;height:100%;">
</div>
<script>
var bgm = document.getElementById("bgMusic6");
bgm.volume = 0.5;
bgm.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
var mouseDown = false;
var mouseUp = true;
var mouseOver = false;
var mouseOut = true;
var toggleHold;
var cantClicked = false;
var iElement = document.getElementById("i");
var growLaunched = false;
var elementOffset;
var elementOffsetLeft;
var elementOffsetTop;
var elementIntLeft;
var elementIntTop;
var elementFontSize;
var grabTarget;
var posX;
var posY;
var elementPos = document.getElementById("elementPos");
var result = document.getElementById("result");
var people = document.getElementById("people");
var provide = document.getElementById("provide");
window.onmousemove = function(e){
posX = e.pageX;
posY = e.pageY;
elementPos.innerHTML =
"posX= " +
posX +
" / " +
"posY= " +
posY;
if(toggleHold == true){
grabTarget.style.top =
(posY - elementIntTop) + "px";
grabTarget.style.left =
(posX - elementIntLeft) + "px";
}
}
function linkSwap(target){
var string = "'" + target + "'";
if(document.getElementById(target) == you){
document.getElementById(target).innerHTML = 'I shouldn"t';
//document.getElementById(target).style.textDecoration = "underline";
//document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == i){
document.getElementById(target).innerHTML = "You";
//document.getElementById(target).style.fontSize = "150%";
//people.style.opacity = "1.0";
//document.getElementById(target).style.textDecoration = "underline";
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == yours){
document.getElementById(target).innerHTML = "mine.";
//document.getElementById(target).style.textDecoration = "underline";
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == are){
document.getElementById(target).innerHTML = "unnoticed.";
}
if(document.getElementById(target) == cant){
document.getElementById(target).innerHTML = 'shouldn"t.';
document.getElementById(target).style.fontStyle = "italic";
}
//document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
//document.getElementById(target).style.textDecoration = "underline overline";
console.log("Mouse is over a link. " + string );
}
function linkSwapBack(target){
var string = "'" + target + "'";
if(document.getElementById(target) == you){
document.getElementById(target).innerHTML = 'you don"t';
}
if(document.getElementById(target) == i){
document.getElementById(target).innerHTML = "I";
//people.style.opacity = "0.0";
}
if(document.getElementById(target) == yours){
document.getElementById(target).innerHTML = "yours.";
}
if(document.getElementById(target) == are){
document.getElementById(target).innerHTML = "made.";
}
if(document.getElementById(target) == cant){
document.getElementById(target).innerHTML = 'cant"t.';
}
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == you){
//window.story.show('Blind');
return;
}
if(document.getElementById(target) == yours){
if(cantClicked == false){
result.style.opacity = "1.0";
return;
}
}
if(document.getElementById(target) == i){
if(cantClicked == false){
people.style.opacity = "1.0"
}
}
if(document.getElementById(target) == cant && cantClicked == false){
people.style.opacity = "0.0";
provide.style.opacity = "0.0";
result.style.opacity = "0.0";
cantClicked = true;
//window.story.show('April 1st, 2056');
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show('Scope4');
//window.story.show('First');
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
function grabOver(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is over grabbable link. " + string);
return;
}
function grabOut(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is not over grabbable link. " + string);
return;
}
function grabMove(target){
grabTarget = document.getElementById(target);
grabTarget.onmousedown = function(event){
if(toggleHold == false || toggleHold == null){
toggleHold = true;
console.log("F: " + toggleHold);
return;
}
else{
toggleHold = false;
console.log("F: " + toggleHold);
return;
}
mouseUp = false;
mouseDown = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
grabTarget.onmouseup = function(event){
mouseDown = false;
mouseUp = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
elementOffset = $(grabTarget).offset();
elementOffsetLeft = elementOffset.left;
elementOffsetTop = elementOffset.top;
elementIntLeft = grabTarget.clientWidth * 0.5;
elementIntTop = grabTarget.clientHeight * 0.5;
elementFontSize = grabTarget.style.fontSize;
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function grabClick(target){
return;
}
function imageOver(target){
return;
}
function imageOut(target){
return;
}
function imageMove(target){
return;
}
function imageClick(target){
return;
}
</script>
<p id="provide" class="proseClass fadeIn">
<span id="i" class="linkClass">I</span> provide a different kind of equilibrium:
</br>
</br>
<span id="yours" class="linkClass">yours.</span>
</p>
</br>
</br>
</br>
<p id="result" class=" proseClass hiddenClass">
Sometimes, mistakes are <span id="are" class="linkClass">made.</span>
</br>
</br>
Sometimes, you decide that <span id="you" class="linkClass">you don"t</span> accept the new order of things.
</p>
</br>
</br>
</br>
<p id="people" class="proseClass hiddenClass">
Why put effort into growing as a person if I can do it for you?
</br>
Impress your coworkers with that new-found sense of humor. Live it up as the ultimate ladies man. Grow shrewd and tactful as the political elite - pour a new foundation for that temple in your head.
</br>
</br>
...
</br>
</br>
Forget someone you <span id="cant" class="linkClass">can"t.</span>
<h4 id="elementPos" class="noSelect hiddenClass">
TEST ELEMENT POS
</h4>
<div id="mark1080" class="noSelect hiddenClass">
</div>
<audio id="bgMusic6">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<script>
var bgm = document.getElementById("bgMusic15");
bgm.volume = 0.5;
bgm.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
//bgm.play();
var woodFloor = document.getElementById("woodFloor");
function linkSwap(target){
if(document.getElementById(target) == start){
document.getElementById(target).style.color = "red";
document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).innerHTML = "light";
woodFloor.style.opacity = "1.0";
woodFloor.style.display = "block";
}
//document.getElementById(target).style.fontStyle = "italic";
//document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
if(document.getElementById(target) == start){
document.getElementById(target).innerHTML = "line";
woodFloor.style.opacity = "0.0";
}
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == line){
//window.story.show("Thoughts");
}
console.log("Mouse has clicked link. " + string);
return;
}
function imageOver(target){
return;
}
function imageOut(target){
return;
}
function imageMove(target){
return;
}
function imageClick(target){
return;
}
</script>
<p class="proseClass fadeIn">
It"s dark in here.
</br>
</br>
For now, this is where the <span id="line" class="linkClass">line</span> ends.
</p>
<img src="https://dl.dropboxusercontent.com/s/tqwebqc7xuecuyh/woodFloorCr.png?dl=0" id="woodFloor" class="imageClass hiddenClass">
<audio id="bgMusic15">
<source
src="https://dl.dropboxusercontent.com/s/chezip1xkq2jmbw/WIP_BGM.mp3?dl=0" type="audio/mpeg">
</audio>
<script>
var bgm = document.getElementById("bgMusic10");
bgm.volume = 0.5;
bgm.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
var stations = document.getElementById("stations");
var morose = document.getElementById("morose");
var reason = document.getElementById("reason");
var SEE = document.getElementById("SEE");
var today = document.getElementById("today");
var specific = document.getElementById("specific");
var thoughts = document.getElementById("thoughts");
var woke = document.getElementById("woke");
var active = false;
function linkSwap(target){
if(document.getElementById(target) == enjoying && active == true){
morose.classList.add('fadeIn');
morose.classList.remove('hiddenClass');
}
if(document.getElementById(target) == woke){
woke.innerHTML = "was struck";
}
if(document.getElementById(target) == dateSpan){
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == SEE){
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == specific){
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == line){
document.getElementById(target).style.fontStyle = "italic";
}
//document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
if(document.getElementById(target) == enjoying && active == true){
document.getElementById("enjoying").innerHTML = "torching";
morose.style.opacity = "0.0";
reason.classList.add('fadeIn');
reason.classList.remove('hiddenClass');
}
if(document.getElementById(target) == woke){
woke.innerHTML = "woke up";
}
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == dateSpan){
today.classList.add('fadeIn');
today.classList.remove('hiddenClass');
}
if(document.getElementById(target) == specific){
thoughts.classList.add('fadeIn');
thoughts.classList.remove('hiddenClass');
//dateSpan.classList.add('shakeDelete');
//dateSpan.classList.remove('fadeIn');
}
if(document.getElementById(target) == SEE){
stations.classList.add('fadeIn');
stations.classList.remove('hiddenClass');
active = true;
}
if(document.getElementById(target) == line){
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Scope6");
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<div id="dateDiv" class="proseClass fadeIn">
<span id="dateSpan" class="linkClass">
April 1st, 2056
</span>
</br>
</br>
</br>
</br>
</br>
<p id="today" class="hiddenClass">Today I <span id="woke" class="linkClass">woke up</span> blind.
</br>
</br>
I fumbled my way to my desk mind racing, offering curses into the void.
<br/>
The scope slipped on, and the starlight returned to my
retinas.
<br/>
Someone, something has to have done this - it"s too <span id="specific" class="linkClass">specific.</span>
</p>
<br/>
<br/>
<p id="thoughts" class="hiddenClass">
I <span id="SEE" class="linkClass">see</span> my thoughts. I can"t escape them.
</p>
<br/>
<br/>
<br/>
<br/>
<span id="stations" class="hiddenClass">
Are you <span id="enjoying" class="linkClass">enjoying</span> the stations in between?
</span>
</br>
</br>
<span id="morose" class="hiddenClass">
I apologise for being morose.
</span>
</br>
<span id="reason" class="hiddenClass">
From one diver to another, I know what I"m risking.
</br>
</br>
Don"t worry about judgement -
<br/>
Just get to the end of the <span id="line" class="linkClass">line.</span>
</span>
</div>
<audio id="bgMusic10">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<script>
var consoleSpan = document.getElementById("consoleSpan");
var forwards = document.getElementById("forwards");
var backwards = document.getElementById("backwards");
var status = document.getElementById("status");
var navigation = document.getElementById("navigation");
var mousePos = document.getElementById("mousePos");
var woodFloor = document.getElementById("woodFloor");
//console.log("woodFloor value is " + woodFloor);
var lightSwitch = document.getElementById("lightSwitch");
//lightSwitch.style.display = "block";
var playerPos = 0;
//var looping =false;
//var touchInterval;
//var curr;
//var currMinus;
//var add;
//var addMinus;
//var fix;
//var fixMinus;
//var string;
//var newID;
//var newTrig;
//var fIn;
//var fOut;
function Interval(fn, time) {
var timer = false;
this.start = function () {
if (!this.isRunning())
timer = setInterval(fn, time);
};
this.stop = function () {
clearInterval(timer);
timer = false;
};
this.isRunning = function () {
return timer !== false;
};
}
function linkSwap(target){
if(document.getElementById(target) == consoleSpan){
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == forwards){
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == backwards){
document.getElementById(target).style.fontStyle = "italic";
}
//document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
//console.log("Mouse is over a link. " + string );
return;
}
function print(argument){
console.log("argument is " +argument);
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
if(document.getElementById(target) == consoleSpan){
navigation.style.opacity = "1.0";
}
if(document.getElementById(target) == forwards){
if(playerPos < 10){
console.log("woodFloor value forward is " + woodFloor);
//print(woodFloor);
if(woodFloor.style.opacity <= 0.0){
touch(woodFloor, target);
}
}
if(playerPos < 10){
playerPos += 1;
console.log("Player Position = " + playerPos);
return;
}else{
document.getElementById("status").innerHTML = "Fuck, I think this is the far wall.";
console.log("Player can't move forwards.");
return;
}
}
if(document.getElementById(target) == backwards){
if(playerPos > 0){
playerPos -= 1;
console.log("Player Position = " + playerPos);
return;
}else{
document.getElementById("status").innerHTML = 'I"m back at my bed.';
console.log("Player can't move backwards");
return;
}
}
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function imageSwap(target){
if(document.getElementById(target).style.opacity <= 0.0){
touch(document.getElementById(target), document.getElementById(target));
}
var string = "'" + target + "'";
console.log("Mouse is over image= " + string);
}
window.onmousemove = function(e){
var posX = e.pageX;
var posY = e.pageY;
mousePos.innerHTML = "mouseX= " + posX + " / " + "mouseY= " + posY;
}
function touch(elementID, triggerID){
console.log("Timers started.")
var curr = 0.0;
var currMinus = 1.0;
var add = 0.0;
var addMinus = 1.0;
var fix = 0.0;
var fixMinus = 1.0;
var string = "";
var newID = elementID;
var newTrig = triggerID;
console.log(newID);
console.log(newTrig);
//newID.style.opacity = "0.0";
var looping = false;
var fIn = true;
var fOut = false;
if(looping == false){
looping = true;
var touchInterval = new Interval(reveal, 1000/24);
touchInterval.start();
function reveal(){
if (curr >= 1.0){
fIn = false;
fOut = true;
}
if (fIn == true){
console.log("Curr:" + curr);
add = curr += 0.170;
fix = add.toFixed(3);
string = fix.toString();
curr = parseFloat(fix);
newID.style.opacity = string;
//woodFloor.style.opacity = string;
console.log("string:" + string + "/" + "opacity: " + newID.style.opacity);
console.log("New:" + add + "/" + fix);
}
if (fOut == true){
console.log("Curr:" + currMinus);
addMinus = currMinus -= 0.020
fixMinus = addMinus.toFixed(3);
stringMinus = fixMinus.toString();
currMinus = parseFloat(fixMinus);
elementID.style.opacity = stringMinus;
console.log("string:" + stringMinus + "/" + "opacity: " + elementID.style.opacity);
console.log("New:" + addMinus + "/" + fixMinus);
}
if (currMinus <= 0.0 && fOut == true){
touchInterval.stop();
fOut = false;
fIn = true;
looping = false;
console.log("Timers ended.");
}
}
}
else{
return;
}
}
</script>
<h4 id="mousePos">
</h4>
<p class="proseClass fadeIn">
This is the part where I go blind and lose it.
</p>
</br>
</br>
<p class="proseClass fadeIn">
Fuck me - just get to the <span id="consoleSpan" class="linkClass">console</span>, jack in.
</br>
</br>
Fix this.
</p>
</br>
</br>
<p id="navigation" class="proseClass hiddenClass noSelect">
One step at a time. <span id="forwards" class="linkClass">Forwards</span> and <span id="backwards" class="linkClass">backwards.</span> Real easy.
</br>
</br>
<span id="status">I think I"m near my bed.</span>
</br>
</br>
He"ll pay.
</p>
<img src="https://dl.dropboxusercontent.com/s/tqwebqc7xuecuyh/woodFloorCr.png?dl=0" id="woodFloor" class="imageClass hiddenClass mark">
<img src="https://dl.dropboxusercontent.com/s/orw3xmmh35p89qk/lightSwitch2Cr.png?dl=0" id="lightSwitch" class="mouseImage imageClass hiddenClass mark">
<p id="firstTime" class="proseClass">
The first time I remote tunneled into someone"s head was a high I"ve never stopped trying to recapture. I suppose that"s the way it gets you. Through the years my ability to mesh with the machine has grown in tandem with my growth as a person; every problem people bring becomes a little easier to trivialise.
</p>
<br/>
<br/>
<br/>
<p id="entry" class="proseClass">
Words fail me about the entry. A stark, weightless shock - like that falling sensation in bed - but there"s no realisation of safety. No matress to desperately latch onto. No familiar chair. No weight of your wrists hitting the desk. The unreality persists until you acclimate to having no semantic bonds left to strap yourself to. Pure consciousness.
</p>
<br/>
<br/>
<p id="terms" class="proseClass">
Harness off; these are the terms. Hand in your resume, and resign to daintily tumbling until you don"t anymore. I hope you remember how to get back, and I hope you like existensial crisis.
</p>
<br/>
<br/>
<br/>
<p id="promise" class="proseClass">
Imagine being promised a boundless sea of stars; to sunbathe in the light of the cosmic sky. The light transmits an awareness. You chart the synaptic connections that make a person. It feels perverse. It feels close and vulnerable.
<br/>
You adventure out into a field of soft grass; camping out under a stark sky all day. Waiting for night to shroud itself over the horizon.
<br/>
<br/>
You lie down.
<br/>
<br/>
Night comes.
<br/>
<br/>
It"s overcast.
<br/>
<br/>
Through the building frustration and absence of moonlight, you see only one star. You want to seize it, force it to give up its secrets.
The opaque sky grins at you - there"s not even a body left to enjoy the grass with.
</p>
<br/>
<br/>
<br/>
<p id="mastery" class="proseClass">
Mastery has its own flavor. A sense of flow and control, the means to act on possibility. I still live those moments - but the irony of my experience is comedic.
<br/>
<br/>
</p>
<p id="justJob" class="proseClass">
Here I am, diving into the depths of the sphere. I witness things beyond compare and replacement - and I dread that it"s starting to bore me.
<br/>
<br/>
Maybe it does for the others too; even I"m just a <span id="job" class="linkClass noSelect">job.</span>
</p>
<script>
var job = document.getElementById("job");
function linkSwap(target){
document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
if(document.getElementById(target) == job){
sessionStorage.testWord = "Job";
window.story.show("Eye");
}else{
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
}
</script>
<script>
var place = false;
var frame = document.getElementById("frame");
var frameTopIMG = document.getElementById("frameTopIMG");
var frameBottomIMG = document.getElementById("frameBottomIMG");
var frameLeftIMG = document.getElementById("frameLeftIMG");
var frameRightIMG = document.getElementById("frameRightIMG");
var blockL = document.getElementById("blockLIMG");
var posX;
var posY;
var elementPos = document.getElementById("elementPos");
var mouseDown = false;
var mouseUp = true;
var mouseOver = false;
var mouseOut = true;
var toggleVert = false;
var toggleHorz = false;
var elementOffset;
var elementOffsetLeft;
var elementOffsetTop;
var Xdiff;
var Ydiff;
var newX;
var newY;
var grabTarget;
window.onmousemove = function(e){
posX = e.pageX;
posY = e.pageY;
elementPos.innerHTML = "eOL= " +
elementOffsetLeft +
" / " +
"eOT= " +
elementOffsetTop +
"<br/>" +
"<br/>" +
"posX= " +
posX +
" / " +
"posY= " +
posY +
"<br/>" +
"<br/>" +
"Xdiff= " +
Xdiff +
" / " +
"Ydiff= " +
Ydiff +
"<br/>" +
"<br/>" +
"newX= " +
newX +
" / " +
"newY= " +
newY;
if(mouseOver == true){
elementOffset = $(grabTarget).offset();
elementOffsetLeft = elementOffset.left;
elementOffsetTop = elementOffset.top;
elementIntLeft = grabTarget.clientWidth * 0.5;
elementIntTop = grabTarget.clientHeight * 0.5;
elCenterLeft = elementOffsetLeft + elementIntLeft;
elCenterTop = elementOffsetTop + elementIntTop;
Xdiff = posX - elementOffsetLeft;
Ydiff = posY - elementOffsetTop;
newY = posY - Ydiff;
newX = posX - Xdiff;
}
if(toggleVert == true){
grabTarget.style.top =
(posY - elementIntTop) + "px";
}
if(toggleHorz == true){
grabTarget.style.left =
(posX - elementIntLeft) + "px";
}
}
function linkSwap(target){
var string = "'" + target + "'";
if(document.getElementById(target) == things){
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == frame){
frame.innerHTML = "drag";
}
//document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
console.log("Mouse is over a link. " + string );
}
function linkSwapBack(target){
var string = "'" + target + "'";
if(document.getElementById(target) == frame){
frame.innerHTML = "frame";
}
if(document.getElementById(target) == things){
}
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == things){
window.story.show('Intro');
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
function grabOver(target){
grabTarget = document.getElementById(target);
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is over grabbable link. " + string);
return;
}
function grabOut(target){
mouseOver = true;
mouseOut = false;
//mouseDown = false;
var string = "'" + target + "'";
console.log("Mouse is not over grabbable link. " + string);
return;
}
function grabClick(target){
if(toggleVert == false && toggleHorz == false){
if(document.getElementById(target) == frameTopIMG || document.getElementById(target) == frameBottomIMG){
toggleVert = true;
toggleHorz = false;
console.log("H: " + toggleHorz + " \\ " + "V: " + toggleVert);
return;
}
if(document.getElementById(target) == frameLeftIMG || document.getElementById(target) == frameRightIMG){
toggleHorz = true;
toggleVert = false;
console.log("H: " + toggleHorz + " \\ " + "V: " + toggleVert);
return;
}
}
else{
toggleHorz = false;
toggleVert = false;
console.log("H: " + toggleHorz + " \\ " + "V: " + toggleVert);
return;
}
}
function grabMove(target){
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<div id="snowball" class="fadeIn">
<p class="proseClass">
I"ve let this thought snowball its way downhill before.
<br/>
<span class="proseClassBlack">I"m sure you can identify.</span>
<br/>
It"s always an entertaining ride; the stations in the middle of nowhere provide the time and lack of accountability to cut loose.
<br/>
<span class="proseClassBlack">You don"t understand. It takes a tol.</span>
<br/>
The destination never makes me feel particularly good about what I do.
</p>
<br/>
<br/>
<p id="hold" class="proseClass">
I need to <span id="frame" class="grabClass linkClass">frame</span> myself in the right way - Keep the image from going askew.
</p>
<br/>
<br/>
<p id="place" class="proseClass">
Maybe I"m holding on to the wrong ideas.
<span id="things" class="proseClass linkClass">Things</span> have got to fall into place - sometime.
</p>
</div>
<img
src="https://dl.dropboxusercontent.com/s/wkdsfjwif2harym/frameCrTop.png?dl=0" id="frameTopIMG" class="imageClass grabClass fadeIn noSelect">
<img
src="https://dl.dropboxusercontent.com/s/amp70rkpbswnq77/frameCrBottom.png?dl=0" id="frameBottomIMG" class="imageClass grabClass fadeIn noSelect">
<img
src="https://dl.dropboxusercontent.com/s/didp8udyjv1b04n/frameCrLeft.png?dl=0" id="frameLeftIMG" class="imageClass grabClass fadeIn noSelect">
<img
src="https://dl.dropboxusercontent.com/s/86io7qp9uom3e4k/frameCrRight.png?dl=0" id="frameRightIMG" class="imageClass grabClass fadeIn noSelect">
<img
src="https://dl.dropboxusercontent.com/s/4e1pksqth27g6jq/block.png?dl=0" id="blockLIMG" class="imageClass grabClass fadeIn noSelect mark">
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<h4 id="elementPos" class="noSelect">
TEST ELEMENT POS
</h4>
<script>
document.body.style.backgroundColor = "rgb(11, 11, 11)";
var bgm = document.getElementById("bgMusic2");
bgm.volume = 0.5;
bgm.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
//VARIABLES----------------------------------------------------
var place = document.getElementById("place");
var frame = document.getElementById("frame");
var frameTM = document.getElementById("frameTM");
var tTop = document.getElementById("triggerTop");
var tBottom = document.getElementById("triggerBottom");
var tLeft = document.getElementById("triggerLeft");
var tRight = document.getElementById("triggerRight");
var frameTopIMG = document.getElementById("frameTopIMG");
var frameBottomIMG = document.getElementById("frameBottomIMG");
var frameLeftIMG = document.getElementById("frameLeftIMG");
var frameRightIMG = document.getElementById("frameRightIMG");
var circleIMG = document.getElementById("circleIMG");
var elementPos = document.getElementById("elementPos");
var posX;
var posY;
var mouseDown = false;
var mouseUp = true;
var mouseOver = false;
var mouseOut = true;
var toggleHold = false;
var topClicked = false;
var bottomClicked = false;
var leftClicked = false;
var rightClicked = false;
var finished = false;
var elementOffset;
var elementOffsetLeft;
var elementOffsetTop;
var elementIntLeft;
var elementIntTop;
var circleIntLeft = circleIMG.clientWidth * 0.5;
var circleIntTop = circleIMG.clientHeight * 0.5;
var grabTarget;
//FUNCTIONS-------------------------------------------------
window.onmousemove = function(e){
posX = e.pageX;
posY = e.pageY;
if(topClicked == true && bottomClicked == true
&& leftClicked == true && rightClicked == true){
finished = true;
}
elementPos.innerHTML =
"eOL= "+
elementOffsetLeft +
" / " +
"eOT= " +
elementOffsetTop +
"</br>" +
"</br>" +
"eIL= " +
elementIntLeft +
" / " +
"eIT= " +
elementIntTop +
"</br>" +
"</br>" +
"posX= " +
posX +
" / " +
"posY= " +
posY;
if(toggleHold == true){
grabTarget.style.top =
(posY - elementIntTop) + "px";
grabTarget.style.left =
(posX - elementIntLeft) + "px";
circleIMG.style.top =
(posY - circleIntTop) + "px";
circleIMG.style.left =
(posX - circleIntLeft) + "px";
circleIMG.classList.remove('hiddenClass');
}
if(finished == true){
place.classList.add('fadeIn');
place.classList.remove('hiddenClass');
}
}
function linkSwap(target){
if(document.getElementById(target) == things){
document.getElementById(target).style.color = "red";
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == frame){
document.getElementById(target).style.color = "red";
frame.innerHTML = "paint";
}
if(document.getElementById(target) == tTop){
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == tBottom){
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == tLeft){
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == tRight){
document.getElementById(target).style.color = "white";
}
//document.getElementById(target).style.fontStyle = "italic";
//document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function grabOver(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is over grabbable link. " + string);
return;
}
function linkSwapBack(target){
if(document.getElementById(target) == frame){
document.getElementById(target).style.color = "white";
frame.innerHTML = "frame";
}
if(document.getElementById(target) == tTop){
document.getElementById(target).style.color = "rgb(11,11,11)";
}
if(document.getElementById(target) == tBottom){
document.getElementById(target).style.color = "rgb(11,11,11)";
}
if(document.getElementById(target) == tLeft){
document.getElementById(target).style.color = "rgb(11,11,11)";
}
if(document.getElementById(target) == things){
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == tRight){
document.getElementById(target).style.color = "rgb(11,11,11)";
}
document.getElementById(target).style.fontStyle = "normal";
//document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function grabOut(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is not over grabbable link. " + string);
return;
}
function linkClick(target){
if(document.getElementById(target) == things && finished == true){
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show('Scope2');
return;
}
if(document.getElementById(target) == tTop){
frameTopIMG.classList.add('fadeIn');
frameTopIMG.classList.remove('hiddenClass');
topClicked = true;
console.log("top clicked.");
return;
}
if(document.getElementById(target) == tBottom){
frameBottomIMG.classList.add('fadeIn');
frameBottomIMG.classList.remove('hiddenClass');
//frameTopIMG.classList.add('fadeIn');
//frameTopIMG.classList.remove('hiddenClass');
bottomClicked = true;
console.log("bottom clicked.");
return;
}
if(document.getElementById(target) == tLeft){
frameLeftIMG.classList.add('fadeIn');
frameLeftIMG.classList.remove('hiddenClass');
leftClicked = true;
console.log("left clicked.");
return;
}
if(document.getElementById(target) == tRight){
frameRightIMG.classList.add('fadeIn');
frameRightIMG.classList.remove('hiddenClass');
rightClicked = true;
console.log("right clicked.");
return;
}
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function grabClick(target){
return;
}
function grabMove(target){
grabTarget = document.getElementById(target);
grabTarget.onmousedown = function(event){
if(toggleHold == false){
toggleHold = true;
console.log("F: " + toggleHold);
return;
}
else{
toggleHold = false;
console.log("F: " + toggleHold);
return;
}
mouseUp = false;
mouseDown = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
grabTarget.onmouseup = function(event){
mouseDown = false;
mouseUp = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
elementOffset = $(grabTarget).offset();
elementOffsetLeft = elementOffset.left;
elementOffsetTop = elementOffset.top;
elementIntLeft = grabTarget.clientWidth * 0.5;
elementIntTop = grabTarget.clientHeight * 0.5;
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function imageOver(target){
return;
}
function imageOut(target){
return;
}
function imageMove(target){
return;
}
function imageClick(target){
return;
}
</script>
<div id="snowball" class="fadeIn">
<p class="proseClass">
I"ve let this thought snowball its way downhill before.
<br/>
<span class="proseClassBlack">I"m sure you can identify.</span>
<br/>
It"s always an entertaining ride; the stations in the middle of nowhere provide the time and lack of accountability to cut loose.
<br/>
<span class="proseClassBlack">I catch myself wondering if anyone really resists for long. Or if it"s purely an ego preservation exercise.</span>
<br/>
The destination never makes me feel particularly good about what I do.
</p>
<br/>
<br/>
<p id="hold" class="proseClass">
I need to <span id="frameTM" class="hiddenClass" noSelect">frame</span> myself in the right way - keep the record straight.
<br/>
<span class="proseClassBlack"> Just need to want it enough.</span>
</p>
<br/>
<br/>
<p id="place" class="proseClass hiddenClass">
Maybe I"m holding on to the wrong ideas.
<span id="things" class="linkClass">Things</span> have got to fall into place - sometime.
</p>
</div>
<span id="frame" class="proseClass linkClass grabClass noSelect fadeIn">frame</span>
<p id ="pLeft" class="proseClassBlack text80">
I"m <span id="triggerLeft" class="linkClass noSelect fadeIn"> left</span> with my freedom. Baring it all.
</p>
<p id ="pRight" class="proseClassBlack text80">
Your choice is dragging me <br/> <span id="triggerRight" class="proseClassBlack linkClass noSelect fadeIn">right</span> down with it.
</p>
<p id ="pBottom" class="proseClassBlack text80">
Someone needs to get to the <span id="triggerBottom" class="proseClassBlack linkClass noSelect fadeIn">bottom</span> of this.
</p>
<p id ="pTop" class="proseClassBlack text80">
Off the <span id="triggerTop" class="proseClassBlack linkClass noSelect fadeIn">top</span> of my head,<br/> I can"t imagine something <br/>that scares me more.
</p>
<img
src="https://dl.dropboxusercontent.com/s/ogu5to1n9m8987d/frameTop.png?dl=0" id="frameTopIMG" class="imageClass hiddenClass noSelect">
<img
src="https://dl.dropboxusercontent.com/s/sm55xi4e2jsb7un/frameBottom.png?dl=0" id="frameBottomIMG" class="imageClass hiddenClass noSelect">
<img
src="https://dl.dropboxusercontent.com/s/didp8udyjv1b04n/frameCrLeft.png?dl=0" id="frameLeftIMG" class="imageClass hiddenClass noSelect">
<img
src="https://dl.dropboxusercontent.com/s/86io7qp9uom3e4k/frameCrRight.png?dl=0" id="frameRightIMG" class="imageClass hiddenClass noSelect">
<img
src="https://dl.dropboxusercontent.com/s/ba5o3vj8wz5wbnm/frameCircleCR.png?dl=0" id="circleIMG" class="imageClass noSelect hiddenClass">
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<h4 id="elementPos" class="noSelect hiddenClass">
TEST ELEMENT POS
</h4>
<audio id="bgMusic2">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<div id="mark1080" class="noSelect hiddenClass">
</div>
<div id="mark1440" class="noSelect hiddenClass">
</div>
<script>
var place = false;
var frame = document.getElementById("frame");
var frameTopIMG = document.getElementById("frameTopIMG");
var frameBottomIMG = document.getElementById("frameBottomIMG");
var frameLeftIMG = document.getElementById("frameLeftIMG");
var frameRightIMG = document.getElementById("frameRightIMG");
var blockL = document.getElementById("blockLIMG");
var posX;
var posY;
var elementPos = document.getElementById("elementPos");
var mouseDown = false;
var mouseUp = true;
var mouseOver = false;
var mouseOut = true;
var mouseOverL = false;
var mouseOutL = true;
var toggleVert = false;
var toggleHorz = false;
var toggleFrame = false;
var cursorX;
var cursorY;
var elementOffset;
var elementOffsetLeft;
var elementOffsetTop;
var elementIntLeft;
var elementIntTop;
var linkOffset;
var linkOffsetLeft;
var linkOffsetTop;
var linkIntLeft;
var linkIntTop
var Xdiff;
var Ydiff;
var newX;
var newY;
var grabTarget;
var linkTarget;
window.onmousemove = function(e){
posX = e.pageX;
posY = e.pageY;
if(mouseOver == true){
elementOffset = $(grabTarget).offset();
elementOffsetLeft = elementOffset.left;
elementOffsetTop = elementOffset.top;
elementIntLeft = grabTarget.clientWidth * 0.5;
elementIntTop = grabTarget.clientHeight * 0.5;
Xdiff = posX - elementOffsetLeft;
Ydiff = posY - elementOffsetTop;
newY = posY - Ydiff;
newX = posX - Xdiff;
}
if(toggleVert == true){
grabTarget.style.top =
(posY - elementIntTop) + "px";
}
if(toggleHorz == true){
grabTarget.style.left =
(posX - elementIntLeft) + "px";
}
if(toggleFrame == true){
linkTarget.style.left =
(posX - linkOffsetLeft ) + "px";
linkTarget.style.top =
(posY - linkOffsetTop) + "px";
//linkTarget.style.left =
//((posX - linkOffsetLeft) - linkIntLeft ) + "px";
//linkTarget.style.top =
//((posY - linkOffsetTop) - linkIntTop) + "px";
}
var string = "'" + linkTarget + "'";
elementPos.innerHTML = "eOL= " +
elementOffsetLeft +
" / " +
"eOT= " +
elementOffsetTop +
"<br/>" +
"<br/>" +
"posX= " +
posX +
" / " +
"posY= " +
posY +
"<br/>" +
"<br/>" +
"Xdiff= " +
Xdiff +
" / " +
"Ydiff= " +
Ydiff +
"<br/>" +
"<br/>" +
"newX= " +
newX +
" / " +
"newY= " +
newY + "<br/>" +
"lOL= " +
linkOffsetLeft +
" / " +
"lOT= " +
linkOffsetTop +
"<br/>" +
"<br/>" +
"toggleFrame= " +
toggleFrame + "<br/>" +
"linkTarget= " +
string + "<br/>";
}
function linkSwap(target){
var string = "'" + target + "'";
mouseOverL = true;
mouseOutL = false;
if(toggleFrame == false){
linkTarget = document.getElementById(target);
console.log("linkTarget Updated");
}
if(document.getElementById(target) == things){
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == frame){
frame.innerHTML = "drag";
}
//document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
console.log("Mouse is over a link. " + string );
}
function linkSwapBack(target){
var string = "'" + target + "'";
mouseOverL = false;
mouseOutL = true;
if(document.getElementById(target) == frame){
frame.innerHTML = "frame";
}
if(document.getElementById(target) == things){
}
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
//linkTarget = document.getElementById(target);
if(document.getElementById(target) == frame){
if(toggleFrame == false){
toggleFrame = true;
linkOffset = $(linkTarget).offset();
linkOffsetLeft = linkOffset.left;
linkOffsetTop = linkOffset.top;
linkIntLeft = linkTarget.clientWidth * 0.5;
linkIntTop = linkTarget.clientHeight * 0.5;
console.log("F: " + toggleFrame);
return;
}
else{
toggleFrame = false;
console.log("F: " + toggleFrame);
return;
}
frameTopIMG.classList.remove('hiddenClass');
frameTopIMG.classList.add('fadeIn');
}
if(document.getElementById(target) == things){
window.story.show('Intro');
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
function grabOver(target){
//grabTarget = document.getElementById(target);
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is over grabbable link. " + string);
return;
}
function grabOut(target){
mouseOver = false;
mouseOut = true;
//mouseDown = false;
var string = "'" + target + "'";
console.log("Mouse is not over grabbable link. " + string);
return;
}
function grabClick(target){
if(document.getElementById(target) == frameTopIMG || document.getElementById(target) == frameBottomIMG){
if(toggleVert == false){
toggleVert = true;
toggleHorz = false;
console.log("H: " + toggleHorz + " \\ " + "V: " + toggleVert);
return;
}
else{
toggleVert = false;
toggleHorz = false;
console.log("H: " + toggleHorz + " \\ " + "V: " + toggleVert);
return;
}
}
if(document.getElementById(target) == frameLeftIMG || document.getElementById(target) == frameRightIMG){
if(toggleHorz == false){
toggleVert = false;
toggleHorz = true;
console.log("H: " + toggleHorz + " \\ " + "V: " + toggleVert);
return;
}
else{
toggleVert = false;
toggleHorz = false;
console.log("H: " + toggleHorz + " \\ " + "V: " + toggleVert);
return;
}
}
}
function grabMove(target){
grabTarget = document.getElementById(target);
var string = "'" + target + "'";
//console.log("Mouse has clicked link. " + string);
return;
}
</script>
<span id="frame" class="linkClass grabClass proseClass noSelect mark">frame</span>
<div id="snowball" class="fadeIn">
<p class="proseClass">
I"ve let this thought snowball its way downhill before.
<br/>
<span class="proseClassBlack">I"m sure you can identify.</span>
<br/>
It"s always an entertaining ride; the stations in the middle of nowhere provide the time and lack of accountability to cut loose.
<br/>
<span class="proseClassBlack">You don"t understand. It takes a tol.</span>
<br/>
The destination never makes me feel particularly good about what I do.
</p>
<br/>
<br/>
<p id="hold" class="proseClass">
I need to myself in the right way - Keep the image from going askew.
</p>
<br/>
<br/>
<p id="place" class="proseClass">
Maybe I"m holding on to the wrong ideas.
<span id="things" class="proseClass linkClass">Things</span> have got to fall into place - sometime.
</p>
</div>
<img
src="https://dl.dropboxusercontent.com/s/wkdsfjwif2harym/frameCrTop.png?dl=0" id="frameTopIMG" class="imageClass noSelect hiddenClass grabClass">
<img
src="https://dl.dropboxusercontent.com/s/amp70rkpbswnq77/frameCrBottom.png?dl=0" id="frameBottomIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/didp8udyjv1b04n/frameCrLeft.png?dl=0" id="frameLeftIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/86io7qp9uom3e4k/frameCrRight.png?dl=0" id="frameRightIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/4e1pksqth27g6jq/block.png?dl=0" id="blockLIMG" class="imageClass noSelect mark hiddenClass">
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<h4 id="elementPos" class="noSelect">
TEST ELEMENT POS
</h4>
<script>
var bgm = document.getElementById("bgMusic12");
bgm.volume = 0.5;
bgm.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
//VARIABLES----------------------------------------------------
var mousePos = document.getElementById("mousePos");
var elementPos = document.getElementById("elementPos");
var posX;
var posY;
var mouseDown = false;
var mouseUp = true;
var mouseOver = false;
var mouseOut = true;
var need = false;
var toggleHold = false;
var cursorX;
var cursorY;
var elementOffset;
var elementOffsetLeft;
var elementOffsetTop;
var winOffset;
var winOffsetTop;
var elementIntLeft;
var elementIntTop;
var elCenterLeft;
var elCenterTop;
var grabTarget;
var textBox = document.getElementById("sleep");
var grab = document.getElementById("grab");
var grab2 = document.getElementById("grab2");
var grab3 = document.getElementById("grab3");
var grab4 = document.getElementById("grab4");
var grab5 = document.getElementById("grab5");
var grab6 = document.getElementById("grab6");
var grab7 = document.getElementById("grab7");
var grab8 = document.getElementById("grab8");
var grab9 = document.getElementById("grab9");
var grab10 = document.getElementById("grab10");
var grab11 = document.getElementById("grab11");
var grab12 = document.getElementById("grab12");
var grab13 = document.getElementById("grab13");
var grab14 = document.getElementById("grab14");
var grab15 = document.getElementById("grab15");
var needLink = document.getElementById("needLink");
var rainArray = [grab, grab2, grab3, grab4, grab5, grab6, grab7, grab8, grab9, grab10, grab11, grab12, grab13, grab14, grab15];
var index = 0;
//FUNCTIONS-------------------------------------------------
function Interval(fn, time) {
var timer = false;
this.start = function () {
if (!this.isRunning())
timer = setInterval(fn, time);
};
this.stop = function () {
clearInterval(timer);
timer = false;
};
this.isRunning = function () {
return timer !== false;
};
}
function Timeout(fn, time) {
var timer = false;
this.start = function () {
if (!this.isRunning())
timer = setTimeout(fn, time);
};
this.stop = function () {
clearTimeout(timer);
timer = false;
};
this.isRunning = function () {
return timer !== false;
};
}
window.onmousemove = function(e){
posX = e.pageX;
posY = e.pageY;
if(toggleHold == true){
//grabTarget.style.top= "0";
//grabTarget.style.bottom= "0";
//grabTarget.style.left= "0";
//grabTarget.style.right= "0";
//grabTarget.style.marginLeft= "0";
//grabTarget.style.marginRight= "0";
//grabTarget.style.top =
((posY - elementOffsetTop) -
elementIntTop) + "px";
//grabTarget.style.left =
((posX - elementOffsetLeft) -
elementIntLeft) + "px";
grabTarget.style.top =
posY + "px";
grabTarget.style.left =
posX + "px";
}
mousePos.innerHTML = "mouseX = " + posX + " // " + "mouseY = " + posY;
}
function linkSwap(target){
document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function grabOver(target){
//grabTarget = document.getElementById(target);
mouseDown = false;
mouseUp = true;
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is over grabbable link. " + string);
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function grabOut(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is not over grabbable link. " + string);
return;
}
function linkClick(target){
if(need == false){
if(document.getElementById(target) == grab){
textBox.innerHTML = 'Why did I ignore the anomalies? I felt the starlight shift<br/>- you"re more careful than this. You should to be.';
}
if(document.getElementById(target) == grab2){
textBox.innerHTML = "You need to do this on your own.<br/> If you opened this can of worms, you can close it again.";
}
if(document.getElementById(target) == grab3){
textBox.innerHTML = 'Did I do something to some to deserve this?<br/> I tried my best.<br/> I need to be okay.';
}
if(document.getElementById(target) == grab4){
textBox.innerHTML = 'Stop agonizing. You"re making it worse.<br/> Let yourself rest already. Stop Obesssing.';
}
if(document.getElementById(target) == grab5){
textBox.innerHTML = 'Your frustration is just feeding it.<br/>Pull out of the loop. Relax. Breathe In, breathe out.';
}
if(document.getElementById(target) == grab6){
textBox.innerHTML = 'Fuck, what if I miscalibrated something?<br/> The poor bastard on the other end - did I burn two people?';
}
if(document.getElementById(target) == grab7){
textBox.innerHTML = 'You had it coming. Remember the words?<br/> It"s only a matter of time. Shame on me for thinking I was an exception.';
}
if(document.getElementById(target) == grab8){
textBox.innerHTML = 'Would they judge me now? Say that I was a victim of hubris, that I should"ve know better?<br/> I would. I"m better than that.';
}
if(document.getElementById(target) == grab9){
textBox.innerHTML = 'Should I resign myself? Close my eyes, ignore it all,<br/> hope real hard? Expect the plasticity of my mind to bail me out?';
}
if(document.getElementById(target) == grab10){
textBox.innerHTML = 'I wish it wasn"t so quiet in my place. All that open space seemed like a blessing.<br/> I"d do anything to hear their voices.';
}
if(document.getElementById(target) == grab11){
textBox.innerHTML = 'Does this mean a part of my connections are in limbo?<br/> If I"m lucky maybe some part of me finds it"s way into the sphere.';
}
if(document.getElementById(target) == grab12){
textBox.innerHTML = 'You"ve dealt with disgruntled clients before.<br/> Usually, you take enough care<br/> - did you fuck up? Is someone sending a message?';
}
if(document.getElementById(target) == grab13){
textBox.innerHTML = 'I"m losing track - what day is it?<br/> What if I skip through consciousness and slowly wither?';
}
if(document.getElementById(target) == grab14){
textBox.innerHTML = 'You really do like floating around in that fishbowl of a head huh?<br/> Well, congrats - you got your wish, maybe permanently,';
}
if(document.getElementById(target) == grab15){
textBox.innerHTML = 'If I somehow manage to drift off, will I even wake?<br/> What if it gets worse - is this my last night?';
}
}
if(document.getElementById(target) == needLink
&& need == true){
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show('Scope7');
}
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function grabClick(target){
return;
}
function grabMove(target){
grabTarget = document.getElementById(target);
grabTarget.onmousedown = function(event){
if(toggleHold == false){
toggleHold = true;
console.log("F: " + toggleHold);
return;
}
else{
toggleHold = false;
console.log("F: " + toggleHold);
return;
}
mouseUp = false;
mouseDown = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
grabTarget.onmouseup = function(event){
mouseDown = false;
mouseUp = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
cursorY = event.pageY;
cursorX = event.pageX;
elementOffset = $(grabTarget).offset();
elementOffsetLeft = elementOffset.left;
elementOffsetTop = elementOffset.top;
winOffset = window.innerWidth * 0.5;
winOffsetTop = window.innerHeight * 0.5;
elementIntLeft = grabTarget.clientWidth * 0.5;
elementIntTop = grabTarget.clientHeight * 0.5;
elCenterLeft = elementOffsetLeft + elementIntLeft;
elCenterTop = elementOffsetTop + elementIntTop;
elementPos.innerHTML = "wO= " +
winOffset +
" / " +
"wOT= " +
winOffsetTop +
"</br>" +
"eOL= " +
elementOffsetLeft +
" / " +
"eOT= " +
elementOffsetTop +
"</br>" +
"eCL= " +
elCenterLeft +
" / " +
"eCT= " +
elCenterTop +
"</br>" +
"</br>" +
"eIL= " +
elementIntLeft +
" / " +
"eIT= " +
elementIntTop +
"</br>" +
"</br>" +
"curX= " +
cursorX +
" / " +
"curY= " +
cursorY;
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function rain(elementID, triggerID){
if(need == false){
console.log("Timers started.")
var curr = 0.0;
var currMinus = 1.0;
var add = 0.0;
var addMinus = 1.0;
var fix = 0.0;
var fixMinus = 1.0;
var string = "";
var newID = elementID;
var newTrig = triggerID;
console.log(newID);
console.log(newTrig);
var looping = false;
var fIn = true;
var fOut = false;
var caught = false;
var drop = document.querySelector('.dropAnim');
newID.addEventListener("mouseover", catchWord);
newID.addEventListener("mouseout", releaseWord);
var touchInterval = new Interval(reveal, 1000/24);
if(looping == false){
newID.classList.add('dropAnim');
looping = true;
touchInterval.start();
}
function catchWord(){
caught = true;
newID.classList.add('pauseAnim');
console.log("word caught. = " + newID);
}
function releaseWord(){
caught = false;
newID.classList.remove('pauseAnim');
console.log("word released. = " + newID);
}
function reveal(){
if (caught == true){
fOut = false;
fIn = true;
looping = false;
newID.style.opacity = "1.0";
return;
}
if (curr >= 1.0){
fIn = false;
fOut = true;
}
if (fIn == true && caught == false){
console.log("Curr:" + curr);
add = curr += 0.170;
fix = add.toFixed(3);
string = fix.toString();
curr = parseFloat(fix);
newID.style.opacity = string;
console.log("string:" + string + "/" + "opacity: " + newID.style.opacity);
console.log("New:" + add + "/" + fix);
}
if (fOut == true && caught == false){
console.log("Curr:" + currMinus);
addMinus = currMinus -= 0.020
fixMinus = addMinus.toFixed(3);
stringMinus = fixMinus.toString();
currMinus = parseFloat(fixMinus);
newID.style.opacity = stringMinus;
console.log("string:" + stringMinus + "/" + "opacity: " + newID.style.opacity);
console.log("New:" + addMinus + "/" + fixMinus);
}
if (currMinus <= 0.0 && fOut == true){
touchInterval.stop();
fOut = false;
fIn = true;
looping = false;
console.log("Timers ended.");
}
}
}
}
//window.onload = function(){
var delayTimer = setTimeout(start, 2000);
function start(){
console.log("rain started.");
var rainInterval = setInterval(startRain, 1500);
return;
}
//}
function startRain(){
console.log("It's raining." + "/ index: " + index);
if(index == 1){
rain(rainArray[0], rainArray[0]);
}
if(index == 2){
rain(rainArray[1], rainArray[1]);
}
if(index == 3){
rain(rainArray[2], rainArray[2]);
}
if(index == 4){
rain(rainArray[3], rainArray[3]);
}
if(index == 5){
rain(rainArray[4], rainArray[4]);
}
if(index == 6){
rain(rainArray[5], rainArray[5]);
}
if(index == 7){
rain(rainArray[6], rainArray[6]);
}
if(index == 8){
rain(rainArray[7], rainArray[7]);
}
if(index == 9){
rain(rainArray[8], rainArray[8]);
}
if(index == 10){
rain(rainArray[9], rainArray[9]);
}
if(index == 11){
rain(rainArray[10], rainArray[10]);
}
if(index == 12){
rain(rainArray[11], rainArray[11]);
}
if(index == 13){
rain(rainArray[12], rainArray[12]);
}
if(index == 14){
rain(rainArray[13], rainArray[13]);
}
if(index == 15){
rain(rainArray[14], rainArray[14]);
}
if(index == 17){
need = true;
textBox.classList.remove('fadeIn');
textBox.classList.add('fadeOut');
needLink.classList.remove('hiddenClass');
needLink.style.opacity = "0.0";
needLink.classList.add("fadeIn4");
needLink.classList.add("flickerH");
console.log("It's stopped raining." + "/ index: " + index);
return;
}
if(need == false){
index +=1;
}
return;
}
//function dropAnim(newID){
//var animID = newID;
//animID.classList.add('drop');
//var drop = document.querySelector('.drop');
//drop.addEventListener('transitionend', onTransitionEnd,
//false);
//function onTransitionEnd(){
//animID.classList.remove('drop');
//}
//}
function imageOver(target){
return;
}
function imageOut(target){
return;
}
function imageMove(target){
return;
}
function imageClick(target){
return;
}
</script>
<img src="https://dl.dropboxusercontent.com/s/r3b2cabd30b7w2a/ceilingShadeCr.png?dl=0" id="ceiling" class="imageClass fadeIn noSelect">
<p id="sleep" class="proseClass noSelect fadeIn">
Sleep isn"t what it used to be. I"m eroded</br> by questions - the promise of rest through resolution. My focus feels</br> cloudy and limp. I mostly lie completely stil while my head turns</br> in circles, and I wake frustrated and anxious.
</br>
</br>
</br>
Even when I close my eyes, I still stare at the ceiling.
</span>
</p>
<span id="grab" class="proseClass linkClass noSelect animClass hiddenClass text115">
Starlight.</br>
</span>
<span id="grab2" class="proseClass linkClass noSelect animClass hiddenClass text115">
Worms.</br>
</span>
<span id="grab3" class="proseClass linkClass noSelect animClass hiddenClass text115">
Deserve.</br>
</span><span id="grab4" class="proseClass linkClass noSelect animClass hiddenClass text115">
Obsessing.</br>
</span>
<span id="grab5" class="proseClass linkClass noSelect animClass hiddenClass text115">
Loop.</br>
</span>
<span id="grab6" class="proseClass linkClass noSelect animClass hiddenClass text115">
Miscalibration.</br>
</span>
<span id="grab7" class="proseClass linkClass noSelect animClass hiddenClass text115">
Exception.</br>
</span>
<span id="grab8" class="proseClass linkClass noSelect animClass hiddenClass text115">
Victim.</br>
</span>
<span id="grab9" class="proseClass linkClass noSelect animClass hiddenClass text115">
Hope.</br>
</span>
<span id="grab10" class="proseClass linkClass noSelect animClass hiddenClass text115">
Quiet.</br>
</span>
<span id="grab11" class="proseClass linkClass noSelect animClass hiddenClass text115">
Limbo.</br>
</span>
<span id="grab12" class="proseClass linkClass noSelect animClass hiddenClass text115">
Clients.</br>
</span>
<span id="grab13" class="proseClass linkClass noSelect animClass hiddenClass text115">
Time.</br>
</span>
<span id="grab14" class="proseClass linkClass noSelect animClass hiddenClass text115">
Fishbowl.</br>
</span>
<span id="grab15" class="proseClass linkClass noSelect animClass hiddenClass text115">
Wake.</br>
</span>
<span id="needLink" class="proseClassBackground linkClass hiddenClass noSelect">
I need to let someone in.
</span>
<audio id="bgMusic12">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
</br>
</br>
</br>
</br>
<h4 id="mousePos" class="noSelect hiddenClass">
</h4>
</br>
</br>
<h4 id="elementPos" class="noSelect hiddenClass">
TEST ELEMENT POS
</h4>
<script>
//INIT --------------------------------------------------------
var bgm = document.getElementById("bgMusic4");
bgm.volume = 0.5;
bgm.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
//VARIABLES ---------------------------------------------------
var sun = document.getElementById("sunIMG");
var earth = document.getElementById("earthIMG");
var eTop;
var earthIntLeft = earth.clientWidth * 0.5;
var earthIntTop = earth.clientHeight * 0.5;
var intro1 = document.getElementById("intro1");
intro1.style.zIndex = 2;
var weve = document.getElementById("weve");
var technology = document.getElementById("technology");
var equilibrium = document.getElementById("equilibrium");
var credit = document.getElementById("credit");
var likeMe = document.getElementById("likeMe");
var intro2 = document.getElementById("intro2");
intro2.style.zIndex = -1;
var holdOn = document.getElementById("holdOn");
var parents = document.getElementById("parents");
var freed = document.getElementById("freed");
var problem = document.getElementById("problem");
var innovation = document.getElementById("innovation");
var trap = document.getElementById("trap");
var intro3 = document.getElementById("intro3");
intro3.style.zIndex = -1;
var abundance = document.getElementById("abundance");
var left = document.getElementById("left");
var scars = document.getElementById("scars");
var we = document.getElementById("we");
var want = document.getElementById("want");
var act1 = false;
var act2 = false;
var act3 = false;
var equilibrium = document.getElementById("equilibrium");
equilibrium.style.zIndex = -1;
var eqTrigger = document.getElementById("eqTrigger");
var posX;
var posY;
var elementPos = document.getElementById("elementPos");
var mouseDown = false;
var mouseUp = true;
var mouseOver = false;
var mouseOut = true;
var toggleHold = false;
var sunSet = false;
var elementOffset;
var elementOffsetLeft;
var elementOffsetTop;
var elementIntLeft;
var elementIntTop;
//var convertX = (window.innerHeight / 256);
//var convertXD = convertX.toFixed(2);
//var convertY = (window.innerWidth / 256);
//var convertYD = convertY.toFixed(2);
var convertX = (880 / 256);
var convertXD = convertX.toFixed(0);
var convertY = (1720/ 256);
var convertYD = convertY.toFixed(0);
var convertYD;
var valR;
var valG;
var valB;
var grabTarget;
//LISTENERS
//links.addEventListener("mouseover", linkSwap);
//links.addEventListener("mouseout", linkSwapBack);
//links.addEventListener("click", linkClick);
//FUNCTIONS ---------------------------------------------------
window.onmousemove = function(e){
posX = e.pageX;
posY = e.pageY;
eTop = parseFloat((earth.style.top + earthIntTop));
valR = Math.floor(posX / convertXD);
valG = Math.floor(posY / convertYD);
valB = Math.floor((valR + valG) / 2);
elementPos.innerHTML = "posX= " +
posX +
" / " +
"posY= " +
posY +
"<br/>" +
"<br/>" +
"eTop = " +
eTop;
if(toggleHold == true){
grabTarget.style.top =
(posY - elementIntTop) + "px";
grabTarget.style.left =
(posX - elementIntLeft) + "px";
//circleIMG.style.top =
//(posY - circleIntTop) + "px";
//circleIMG.style.left =
//(posX - circleIntLeft) + "px";
//circleIMG.classList.remove('hiddenClass');
if((posY + elementIntTop) >= 950){
sunSet = true;
}
if((posY + elementIntTop) < 950){
sunSet = false;
}
if((posX + elementIntLeft) >= 950){
//DO
}
if((posX + elementIntLeft) < 950){
//DO
}
document.body.style.backgroundColor =
"rgba(" + valG + ", " + valG + ", " + valG + ", 1.0)";
}
if(eTop > 0 && eTop < 350){
act1 = true;
act2 = false;
act3 = false;
intro2.style.zIndex = -1;
//intro2.style.opacity = "0.0";
intro3.style.zIndex = -1;
//intro3.style.opacity = "0.0";
intro1.style.zIndex = 2;
//intro1.style.opacity = "1.0";
intro2.classList.add('hiddenClass');
intro2.classList.remove('fadeIn');
intro3.classList.remove('fadeIn');
intro3.classList.add('hiddenClass');
intro1.classList.add('fadeIn');
intro1.classList.remove('hiddenClass');
console.log("ZONE A" + act1 + " / " + act2 + " / " + act3);
}
if(eTop > 350 && eTop < 705){
act2 = true;
act1 = false;
act3 = false;
intro1.style.zIndex = -1;
intro3.style.zIndex = -1;
intro2.style.zIndex = 2;
intro3.classList.remove('fadeIn');
intro3.classList.add('hiddenClass');
intro1.classList.remove('fadeIn');
intro1.classList.add('hiddenClass');
intro2.classList.add('fadeIn');
intro2.classList.remove('hiddenClass');
console.log("ZONE B" + act1 + " / " + act2 + " / " + act3);
}
if(eTop > 705 && eTop < 1080){
act3 = true;
act1 = false;
act2 = false;
intro2.style.zIndex = -1;
intro1.style.zIndex = -1;
intro3.style.zIndex = 2;
intro2.classList.remove('fadeIn');
intro2.classList.add('hiddenClass');
intro1.classList.remove('fadeIn');
intro1.classList.add('hiddenClass');
intro3.classList.add('fadeIn');
intro3.classList.remove('hiddenClass');
console.log("ZONE C" + act1 + " / " + act2 + " / " + act3);
}
if(sunSet == true){
//technology.innerHTML = "ways to kill each other";
//technology.style.color = "red";
//equilibrium.innerHTML = "equilibrium";
//equilibrium.style.color = "red";
//weve.innerHTML = "The west has";
//weve.style.color = "red";
}
if(sunSet == false){
//technology.innerHTML = "technology";
//technology.style.color = "white";
//equilibrium.innerHTML = "contradiction";
//equilibrium.style.color = "white";
//weve.innerHTML = 'We"ve';
//weve.style.color = "white";
}
if(toggleHold == false && sunSet == true){
earth.classList.add('fadeOut');
earth.classList.remove('grabClass');
intro1.classList.remove('fadeIn');
intro1.classList.add('fadeOut');
intro1.style.zIndex = -1;
intro2.classList.remove('fadeIn');
intro2.classList.add('fadeOut');
intro2.style.zIndex = -1;
intro3.classList.remove('fadeIn');
intro3.classList.add('fadeOut');
intro3.style.zIndex = -1;
equilibrium.style.zIndex = 3;
equilibrium.classList.add('fadeIn3');
//equilibrium.classList.remove('hiddenClass');
}
}
function linkSwap(target){
var string = "'" + target + "'";
if(document.getElementById(target) == weve){
document.getElementById(target).innerHTML = "The west has";
//document.getElementById(target).style.fontStyle = "italic";
credit.classList.add('fadeIn');
credit.classList.remove('hiddenClass');
}
if(document.getElementById(target) == equilibrium){
//document.getElementById(target).style.textDecoration = "underline";
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == technology){
document.getElementById(target).innerHTML = "ways to kill each other";
//document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == holdOn){
document.getElementById(target).innerHTML = "display white knuckles.";
}
if(document.getElementById(target) == parents){
document.getElementById(target).innerHTML = "Our parents";
problem.classList.add('fadeIn');
problem.classList.remove('hiddenClass');
}
if(document.getElementById(target) == freed){
document.getElementById(target).innerHTML = "saved";
}
if(document.getElementById(target) == innovation){
document.getElementById(target).innerHTML = "comfort";
}
if(document.getElementById(target) == trap){
document.getElementById(target).innerHTML = "rift widens.";
}
if(document.getElementById(target) == abundance){
document.getElementById(target).innerHTML = "spoils.";
}
if(document.getElementById(target) == left){
document.getElementById(target).innerHTML = "discarded";
}
if(document.getElementById(target) == scars){
document.getElementById(target).innerHTML = "Instincts";
}
if(document.getElementById(target) == we){
want.classList.add('fadeIn');
want.classList.remove('hiddenClass');
}
if(document.getElementById(target) == eqTrigger){
document.getElementById(target).style.fontStyle = "italic";
likeMe.style.opacity = "1.0";
}
document.getElementById(target).style.color = "red";
//document.getElementById(target).style.textDecoration = "underline overline";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
var string = "'" + target + "'";
if(document.getElementById(target) == weve){
document.getElementById(target).innerHTML = 'We"ve';
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
credit.classList.add('hiddenClass');
credit.classList.remove('fadeIn');
}
if(document.getElementById(target) == technology){
document.getElementById(target).innerHTML = "technology";
//document.getElementById(target).style.textDecoration = "none";
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == holdOn){
document.getElementById(target).innerHTML =
"hold on.";
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == parents){
document.getElementById(target).innerHTML = 'They"ve';
document.getElementById(target).style.color = "white";
problem.classList.add('hiddenClass');
problem.classList.remove('fadeIn');
}
if(document.getElementById(target) == freed){
document.getElementById(target).innerHTML = "freed";
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == innovation){
document.getElementById(target).innerHTML = "minor innovation";
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == trap){
document.getElementById(target).innerHTML = "trap-jaw is prepared.";
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == abundance){
document.getElementById(target).innerHTML = "abundance.";
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == left){
document.getElementById(target).style.color = "white";
document.getElementById(target).innerHTML = "left";
}
if(document.getElementById(target) == scars){
document.getElementById(target).style.color = "white";
document.getElementById(target).innerHTML = "Scars";
}
if(document.getElementById(target) == we){
document.getElementById(target).style.color = "white";
want.classList.remove('fadeIn');
want.classList.add('hiddenClass');
}
if(document.getElementById(target) == eqTrigger){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "rgb(11, 11, 11)";
likeMe.style.opacity = "0.0";
}
//document.getElementById(target).style.fontStyle = "normal";
//document.getElementById(target).style.color = "white";
//document.getElementById(target).style.textDecoration = "none";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
if(document.getElementById(target) == eqTrigger && sunSet == true){
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show('Scope3');
return;
}
//if(document.getElementById(target) == technology){
//window.story.show('Technology');
//return;
//}
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function grabOver(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is over grabbable link. " + string);
return;
}
function grabOut(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is not over grabbable link. " + string);
return;
}
function grabMove(target){
grabTarget = document.getElementById(target);
grabTarget.onmousedown = function(event){
if(toggleHold == false){
toggleHold = true;
console.log("F: " + toggleHold);
return;
}
else{
toggleHold = false;
console.log("F: " + toggleHold);
return;
}
mouseUp = false;
mouseDown = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
grabTarget.onmouseup = function(event){
mouseDown = false;
mouseUp = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
elementOffset = $(grabTarget).offset();
elementOffsetLeft = elementOffset.left;
elementOffsetTop = elementOffset.top;
elementIntLeft = grabTarget.clientWidth * 0.5;
elementIntTop = grabTarget.clientHeight * 0.5;
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function grabClick(target){
return;
}
function imageOver(target){
return;
}
function imageOut(target){
return;
}
function imageMove(target){
return;
}
function imageClick(target){
return;
}
</script>
<p class="proseClass noSelect fadeIn" id="intro1">
Fortunes reverse.
<br/>
<br/>
Favors exchange hands.
<br/>
<br/>
Power waxes and wanes.
<br/>
<br/>
Somehow, earth manages to keep merrily spinning on its axis in 2056.
<br/>
<br/>
Invent some new game-changing <span id="technology" class=" linkClass"> technology</span>, revolutionise an economic system - hell, figure out the oil crisis. Solve one problem for mankind, and several more inevitably take its place. An oddly functional equilibrium - as if we would spin off into the sun should a violent influx of positivity weigh us own.
<br/>
<br/>
...
<br/>
<br/>
<span id="weve" class="linkClass">We"ve</span> done all these things; four decades in lockstep progress and slog.
</p>
<br/>
<br/>
<p id="credit" class="hiddenClass proseClass">
Well, partial credit only - the third world beat us to most of them.
</p>
<img
src="https://dl.dropboxusercontent.com/s/3fc6opj5qky14mf/sunCR.png?dl=0" id="sunIMG" class="imageClass noSelect">
<img
src="https://dl.dropboxusercontent.com/s/x6i8cw0lspbu3um/ringCR.png?dl=0" id="earthIMG" class="imageClass noSelect grabClass">
<h4 id="elementPos" class="noSelect hiddenClass">
TEST ELEMENT POS
</h4>
<p class="proseClass noSelect hiddenClass" id="intro2">
<br/>
Fortunes grow bold.
<br/>
<br/>
Pleasantries fill hands.
<br/>
<br/>
The powerful <span id="holdOn" class="linkClass">hold on.</span>
<br/>
<br/>
This 2056 is quiet.
<br/>
<br/>
Sit content with <span id="innovation" class=" linkClass">minor innovation</span> sprouting around you, tow the bottom line into a gentle upward slope.
People are <span id="freed" class="linkClass">freed</span> from labor, but not from class.
A <span id="trap" class="linkClass">trap-jaw is prepared.</span> As we peek out the window from orbit, the globe dances for us.
<br/>
<br/>
...
<br/>
<br/>
<span id="parents" class="linkClass">They"ve</span> floated through all these things; four decades of uncritical stability.
</p>
<br/>
<br/>
<p id="problem" class="proseClass hiddenClass noSelect">
The next generation will have no idea when it becomes their problem.
</p>
<p class="proseClass noSelect hiddenClass" id="intro3">
<br/>
Fortunes are divided.
<br/>
<br/>
We wash our hands in <span id="abundance" class="linkClass">abundance.</span>
<br/>
<br/>
The tallest trees are meticulously pruned.
<br/>
<br/>
In 2056, you desire nothing beyond your needs - and sleep through dreamless days.
<br/>
<br/>
Under one faith, all else was <span id="left" class="linkClass">left</span> by the wayside for the praise of a higher calling. Many lost their lives in the process.<span id="scars" class="linkClass">Scars</span> linger below the skin, appealing to our tribal nature.
<br/>
We are told our earth beams with pride.
<br/>
<br/>
...
<br/>
<br/>
<span id="we" class="linkClass">We</span> looked inward through all these things; four decades of egalitarianism and olive branches.
</p>
<br/>
<br/>
<p id="want" class="proseClass hiddenClass noSelect">
Taught not to want, we are are helpless when others force their want on us.
</p>
<p id="equilibrium" class="proseClassBlack noSelect hiddenClass text120">There will always be an <span id="eqTrigger" class="linkClass">equilibrium.</span>
<br/>
<br/>
<span id="likeMe" class="hiddenClass">
There will always be someone like me.
</span>
</p>
<audio id="bgMusic4">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<script>
var bgm = document.getElementById("bgMusic14");
bgm.volume = 0.5;
bgm.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
//INIT DEPOSIT WORDS-------------------------------------------
var scopeWord1 = sessionStorage.scope1;
document.getElementById("s1Target").innerHTML = scopeWord1;
var scopeWord2 = sessionStorage.scope2;
document.getElementById("s2Target").innerHTML = scopeWord2;
var scopeWord3 = sessionStorage.scope3;
document.getElementById("s3Target").innerHTML = scopeWord3;
var scopeWord4 = sessionStorage.scope4;
document.getElementById("s4Target").innerHTML = scopeWord4;
var scopeWord5 = sessionStorage.scope5;
document.getElementById("s5Target").innerHTML = scopeWord5;
var scopeWord6 = sessionStorage.scope6;
document.getElementById("s6Target").innerHTML = scopeWord6;
var scopeWord7 = sessionStorage.scope7;
document.getElementById("s7Target").innerHTML = scopeWord7;
//VARS---------------------------------------------------------
var mouseDown = false;
var mouseUp = true;
var mouseOver = false;
var mouseOut = true;
var toggleHold;
var changeClicked = false;
var exit = false;
var roofPride = false;
var roomPride = false;
var pillarsLPride = false;
var pillarsRPride = false;
var basePride = false;
var roofAnxiety = false;
var roomAnxiety = false;
var pillarsLAnxiety = false;
var pillarsRAnxiety = false;
var baseAnxiety = false;
var roofIntelligence = false;
var roomIntelligence = false;
var pillarsLIntelligence = false;
var pillarsRIntelligence = false;
var baseIntelligence = false;
var roofFaith = false;
var roomFaith = false;
var pillarsLFaith = false;
var pillarsRFaith = false;
var baseFaith = false;
var roofOc = false;
var roomOc = false;
var pillarsOc = false;
var baseOc= false;
var elementOffset;
var elementOffsetLeft;
var elementOffsetTop;
var elementIntLeft;
var elementIntTop;
var grabTarget;
var posX;
var posY;
var elementPos = document.getElementById("elementPos");
var result = document.getElementById("result");
var people = document.getElementById("people");
var provide = document.getElementById("provide");
var done = document.getElementById("done");
var pride = document.getElementById("pride");
var pPride = document.getElementById("pPride");
var faith = document.getElementById("faith");
var pFaith = document.getElementById("pFaith");
var anxiety = document.getElementById("anxiety");
var pAnxiety = document.getElementById("pAnxiety");
var intelligence = document.getElementById("intelligence");
var pIntelligence = document.getElementById("pIntelligence");
var roof = document.getElementById("roofIMG");
var roofFull = document.getElementById("roofFullIMG");
var pillarL = document.getElementById("pillarLIMG");
var pillarLFull = document.getElementById("pillarLFullIMG");
var pillarR = document.getElementById("pillarRIMG");
var pillarRFull = document.getElementById("pillarRFullIMG");
var room = document.getElementById("roomIMG");
var roomFull = document.getElementById("roomFullIMG");
var base = document.getElementById("baseIMG");
var baseFull = document.getElementById("baseFullIMG");
var prideLeft;
var prideTop;
var anxietyTop;
var anxietyLeft;
var intelligenceTop;
var inteilligenceLeft;
var faithTop;
var faithLeft;
function Interval(fn, time) {
var timer = false;
this.start = function () {
if (!this.isRunning())
timer = setInterval(fn, time);
};
this.stop = function () {
clearInterval(timer);
timer = false;
};
this.isRunning = function () {
return timer !== false;
};
}
window.onmousemove = function(e){
posX = e.pageX;
posY = e.pageY;
prideLeft = parseFloat(pride.style.left)+
(pride.clientWidth * 0.5);
prideTop = parseFloat(pride.style.top) +
(pride.clientHeight * 0.5);
anxietyLeft = parseFloat(anxiety.style.left)+
(anxiety.clientWidth * 0.5);
anxietyTop = parseFloat(anxiety.style.top) +
(anxiety.clientHeight * 0.5);
intelligenceLeft = parseFloat(intelligence.style.left)+
(intelligence.clientWidth * 0.5);
intelligenceTop = parseFloat(intelligence.style.top) +
(intelligence.clientHeight * 0.5);
faithLeft = parseFloat(faith.style.left)+
(faith.clientWidth * 0.5);
faithTop = parseFloat(faith.style.top) +
(faith.clientHeight * 0.5);
elementPos.innerHTML =
"posX= " +
posX +
" / " +
"posY= " +
posY +
"<br/>" +
"<br/>" +
"rfOc= " +
roofOc +
" / " +
"roOc= " +
roomOc +
" / " +
"pOc= " +
pillarsOc +
" / " +
"bOc= " +
baseOc;
if(toggleHold == true){
grabTarget.style.top =
(posY - elementIntTop) + "px";
grabTarget.style.left =
(posX - elementIntLeft) + "px";
}
//Roof
if(changeClicked == true){
if(roofPride == true || roofAnxiety == true ||
roofIntelligence == true || roofFaith == true){
roofOc = true;
}
else{
roofOc = false;
}
if(roofPride == false && roofAnxiety == false &&
roofIntelligence == false && roofFaith == false){
roofFull.style.opacity = "0.0";
roof.style.opacity = "1.0";
}
if(prideLeft > 829 && prideLeft < 1006
&& prideTop > 474 && prideTop < 530){
if(toggleHold == false){
roof.style.opacity = "0.0";
roofFull.style.opacity = "1.0";
roofFull.classList.remove('hiddenClass');
//pride.style.color = "rgb(11, 11, 11)";
roofPride = true;
}
}
else{
//pride.style.color = "white";
roofPride = false;
}
if(anxietyLeft > 829 && anxietyLeft < 1006
&& anxietyTop > 474 && anxietyTop < 530){
if(toggleHold == false){
roof.style.opacity = "0.0";
roofFull.style.opacity = "1.0";
roofFull.classList.remove('hiddenClass');
//anxiety.style.color = "rgb(11, 11, 11)";
roofAnxiety = true;
}
}
else{
//anxiety.style.color = "white";
roofAnxiety = false;
}
if(intelligenceLeft > 829 && intelligenceLeft < 1006
&& intelligenceTop > 474 && intelligenceTop < 530){
if(toggleHold == false){
roof.style.opacity = "0.0";
roofFull.style.opacity = "1.0";
roofFull.classList.remove('hiddenClass');
//intelligence.style.color = "rgb(11, 11, 11)";
roofIntelligence = true;
}
}
else{
//intelligence.style.color = "white";
roofIntelligence = false;
}
if(faithLeft > 829 && faithLeft < 1006
&& faithTop > 474 && faithTop < 530){
if(toggleHold == false){
roof.style.opacity = "0.0";
roofFull.style.opacity = "1.0";
roofFull.classList.remove('hiddenClass');
//faith.style.color = "rgb(11, 11, 11)";
roofFaith = true;
}
}
else{
//faith.style.color = "white";
roofFaith = false;
}
}
//Room
if(changeClicked == true){
if(roomPride == true || roomAnxiety == true ||
roomIntelligence == true || roomFaith == true){
roomOc = true;
}
else{
roomOc = false;
}
if(roomPride == false && roomAnxiety == false &&
roomIntelligence == false && roomFaith == false){
roomFull.style.opacity = "0.0";
room.style.opacity = "1.0";
}
if(prideLeft > 852 && prideLeft < 965
&& prideTop > 605 && prideTop < 717){
if(toggleHold == false){
room.style.opacity = "0.0";
roomFull.style.opacity = "1.0";
roomFull.classList.remove('hiddenClass');
//pride.style.color = "rgb(11, 11, 11)";
roomPride = true;
}
}
else{
//pride.style.color = "white";
roomPride = false;
}
if(anxietyLeft > 852 && anxietyLeft < 965
&& anxietyTop > 605 && anxietyTop < 717){
if(toggleHold == false){
room.style.opacity = "0.0";
roomFull.style.opacity = "1.0";
roomFull.classList.remove('hiddenClass');
//anxiety.style.color = "rgb(11, 11, 11)";
roomAnxiety = true;
}
}
else{
//anxiety.style.color = "white";
roomAnxiety = false;
}
if(intelligenceLeft > 852 && intelligenceLeft < 965
&& intelligenceTop > 605 && intelligenceTop < 717){
if(toggleHold == false){
room.style.opacity = "0.0";
roomFull.style.opacity = "1.0";
roomFull.classList.remove('hiddenClass');
//intelligence.style.color = "rgb(11, 11, 11)";
roomIntelligence = true;
}
}
else{
//intelligence.style.color = "white";
roomIntelligence = false;
}
if(faithLeft > 852 && faithLeft < 965
&& faithTop > 605 && faithTop < 717){
if(toggleHold == false){
room.style.opacity = "0.0";
roomFull.style.opacity = "1.0";
roomFull.classList.remove('hiddenClass');
//faith.style.color = "rgb(11, 11, 11)";
roomFaith = true;
}
}
else{
//faith.style.color = "white";
roomFaith = false;
}
}
//Pillars
if(changeClicked == true){
if(pillarsRPride == true || pillarsLPride == true ||
pillarsLAnxiety == true || pillarsRAnxiety == true ||
pillarsLIntelligence == true || pillarsRIntelligence == true || pillarsLFaith == true || pillarsRFaith == true){
pillarsOc = true;
}
else{
pillarsOc = false;
}
if(pillarsLPride == false && pillarsLAnxiety == false && pillarsLIntelligence == false && pillarsLFaith == false
&& pillarsRPride == false && pillarsRAnxiety == false && pillarsRIntelligence == false && pillarsRFaith == false){
pillarRFull.style.opacity = "0.0";
pillarR.style.opacity = "1.0";
pillarLFull.style.opacity = "0.0";
pillarL.style.opacity = "1.0";
}
if(prideLeft > 664 && prideLeft < 705
&& prideTop > 576 && prideTop < 814){
if(toggleHold == false){
pillarR.style.opacity = "0.0";
pillarRFull.style.opacity = "1.0";
pillarRFull.classList.remove('hiddenClass');
pillarL.style.opacity = "0.0";
pillarLFull.style.opacity = "1.0";
pillarLFull.classList.remove('hiddenClass');
//pride.style.color = "rgb(11, 11, 11)";
pillarsLPride = true;
}
}
else{
//pride.style.color = "white"
pillarsLPride = false;
}
if(prideLeft > 1109 && prideLeft < 1153
&& prideTop > 576 && prideTop < 814){
if(toggleHold == false){
pillarR.style.opacity = "0.0";
pillarRFull.style.opacity = "1.0";
pillarRFull.classList.remove('hiddenClass');
pillarL.style.opacity = "0.0";
pillarLFull.style.opacity = "1.0";
pillarLFull.classList.remove('hiddenClass');
//pride.style.color = "rgb(11, 11, 11)";
pillarsRPride = true;
}
}
else{
//pride.style.color = "white";
pillarsRPride = false;
}
if(anxietyLeft > 646 && anxietyLeft < 705
&& anxietyTop > 576 && anxietyTop < 814){
if(toggleHold == false){
pillarR.style.opacity = "0.0";
pillarRFull.style.opacity = "1.0";
pillarRFull.classList.remove('hiddenClass');
pillarL.style.opacity = "0.0";
pillarLFull.style.opacity = "1.0";
pillarLFull.classList.remove('hiddenClass');
//anxiety.style.color = "rgb(11, 11, 11)";
pillarsLAnxiety = true;
}
}
else{
//anxiety.style.color = "white";
pillarsLAnxiety = false;
}
if(anxietyLeft > 1109 && anxietyLeft < 1153
&& anxietyTop > 576 && anxietyTop < 814){
if(toggleHold == false){
pillarR.style.opacity = "0.0";
pillarRFull.style.opacity = "1.0";
pillarRFull.classList.remove('hiddenClass');
pillarL.style.opacity = "0.0";
pillarLFull.style.opacity = "1.0";
pillarLFull.classList.remove('hiddenClass');
//anxiety.style.color = "rgb(11, 11, 11)";
pillarsRAnxiety = true;
}
}
else{
//anxiety.style.color = "white";
pillarsRAnxiety = false;
}
if(intelligenceLeft > 646 && intelligenceLeft < 705
&& intelligenceTop > 576 && intelligenceTop < 814){
if(toggleHold == false){
pillarR.style.opacity = "0.0";
pillarRFull.style.opacity = "1.0";
pillarRFull.classList.remove('hiddenClass');
pillarL.style.opacity = "0.0";
pillarLFull.style.opacity = "1.0";
pillarLFull.classList.remove('hiddenClass');
//intelligence.style.color = "rgb(11, 11, 11)";
pillarsLIntelligence = true;
}
}
else{
//intelligence.style.color = "white";
pillarsLIntelligence = false;
}
if(intelligenceLeft > 1109 && intelligenceLeft < 1153
&& intelligenceTop > 576 && intelligenceTop < 814){
if(toggleHold == false){
pillarR.style.opacity = "0.0";
pillarRFull.style.opacity = "1.0";
pillarRFull.classList.remove('hiddenClass');
pillarL.style.opacity = "0.0";
pillarLFull.style.opacity = "1.0";
pillarLFull.classList.remove('hiddenClass');
//intelligence.style.color = "rgb(11, 11, 11)";
pillarsRIntelligence = true;
}
}
else{
//intelligence.style.color = "white";
pillarsRIntelligence = false;
}
if(faithLeft > 646 && faithLeft < 705
&& faithTop > 576 && faithTop < 814){
if(toggleHold == false){
pillarR.style.opacity = "0.0";
pillarRFull.style.opacity = "1.0";
pillarRFull.classList.remove('hiddenClass');
pillarL.style.opacity = "0.0";
pillarLFull.style.opacity = "1.0";
pillarLFull.classList.remove('hiddenClass');
//faith.style.color = "rgb(11, 11, 11)";
pillarsLFaith = true;
}
}
else{
//faith.style.color = "white";
pillarsLFaith = false;
}
if(faithLeft > 1109 && faithLeft < 1153
&& faithTop > 576 && faithTop < 814){
if(toggleHold == false){
pillarR.style.opacity = "0.0";
pillarRFull.style.opacity = "1.0";
pillarRFull.classList.remove('hiddenClass');
pillarL.style.opacity = "0.0";
pillarLFull.style.opacity = "1.0";
pillarLFull.classList.remove('hiddenClass');
//faith.style.color = "rgb(11, 11, 11)";
pillarsRFaith = true;
}
}
else{
//faith.style.color = "white";
pillarsRFaith = false;
}
}
//Base
if(changeClicked == true){
if(basePride == true || baseAnxiety == true ||
baseIntelligence == true || baseFaith == true){
baseOc = true;
}
else{
baseOc = false;
}
if(basePride == false && baseAnxiety == false &&
baseIntelligence == false && baseFaith == false){
baseFull.style.opacity = "0.0";
base.style.opacity = "1.0";
}
if(prideLeft > 785 && prideLeft < 1025
&& prideTop > 778 && prideTop < 814){
if(toggleHold == false){
base.style.opacity = "0.0";
baseFull.style.opacity = "1.0";
baseFull.classList.remove('hiddenClass');
//pride.style.color = "rgb(11, 11, 11)";
basePride = true;
}
}
else{
//pride.style.color = "white";
basePride = false;
}
if(anxietyLeft > 785 && anxietyLeft < 1025
&& anxietyTop > 778 && anxietyTop < 814){
if(toggleHold == false){
base.style.opacity = "0.0";
baseFull.style.opacity = "1.0";
baseFull.classList.remove('hiddenClass');
//anxiety.style.color = "rgb(11, 11, 11)";
baseAnxiety = true;
}
}
else{
//anxiety.style.color = "white";
baseAnxiety = false;
}
if(intelligenceLeft > 785 && intelligenceLeft < 1025
&& intelligenceTop > 778 && intelligenceTop < 814){
if(toggleHold == false){
base.style.opacity = "0.0";
baseFull.style.opacity = "1.0";
baseFull.classList.remove('hiddenClass');
//intelligence.style.color = "rgb(11, 11, 11)";
baseIntelligence = true;
}
}
else{
//intelligence.style.color = "white";
baseIntelligence = false;
}
if(faithLeft > 785 && faithLeft < 1025
&& faithTop > 778 && faithTop < 814){
if(toggleHold == false){
base.style.opacity = "0.0";
baseFull.style.opacity = "1.0";
baseFull.classList.remove('hiddenClass');
//faith.style.color = "rgb(11, 11, 11)";
baseFaith = true;
}
}
else{
//faith.style.color = "white";
baseFaith = false;
}
}
if(baseOc == true && pillarsOc == true &&
roofOc == true && roomOc == true && exit == false){
done.classList.add('fadeIn');
done.classList.remove('hiddenClass');
exit = true;
return;
}
}
function linkSwap(target){
var string = "'" + target + "'";
if(document.getElementById(target) == done){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == change){
document.getElementById(target).innerHTML =
'change.';
document.getElementById(target).style.fontStyle =
"italic";
}
//document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
//document.getElementById(target).style.textDecoration = "underline overline";
console.log("Mouse is over a link. " + string );
}
function linkSwapBack(target){
var string = "'" + target + "'";
if(document.getElementById(target) == change){
document.getElementById(target).innerHTML = 'see.';
}
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(baseOc == true && pillarsOc == true &&
roofOc == true && roomOc == true
&& document.getElementById(target) == done){
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show('Scope8');
return;
}
if(document.getElementById(target) == change
&& changeClicked == false){
//window.story.show('April 1st, 2056');
//window.story.show('Technology');
roof.classList.add('fadeIn');
roof.classList.remove('hiddenClass');
pillarL.classList.add('fadeIn');
pillarL.classList.remove('hiddenClass');
pillarR.classList.add('fadeIn');
pillarR.classList.remove('hiddenClass');
room.classList.add('fadeIn');
room.classList.remove('hiddenClass');
base.classList.add('fadeIn');
base.classList.remove('hiddenClass');
pride.classList.add('fadeIn');
pride.classList.remove('hiddenClass');
pPride.classList.add('fadeIn');
pPride.classList.remove('hiddenClass');
faith.classList.add('fadeIn');
faith.classList.remove('hiddenClass');
pFaith.classList.add('fadeIn');
pFaith.classList.remove('hiddenClass');
anxiety.classList.add('fadeIn');
anxiety.classList.remove('hiddenClass');
pAnxiety.classList.add('fadeIn');
pAnxiety.classList.remove('hiddenClass');
intelligence.classList.add('fadeIn');
intelligence.classList.remove('hiddenClass');
pIntelligence.classList.add('fadeIn');
pIntelligence.classList.remove('hiddenClass');
changeClicked = true;
return;
}
//if(roomPride == true || roofPride == true ||
//pillarsRPride == true || pillarsLPride == true ||
//basePride == true){
//pride.style.color = "rgb(11, 11, 11)";
//}
console.log("Mouse has clicked link. " + string);
return;
}
function grabOver(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is over grabbable link. " + string);
return;
}
function grabOut(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is not over grabbable link. " + string);
return;
}
function grabMove(target){
grabTarget = document.getElementById(target);
grabTarget.onmousedown = function(event){
if(toggleHold == false || toggleHold == null){
toggleHold = true;
console.log("F: " + toggleHold);
return;
}
else{
toggleHold = false;
console.log("F: " + toggleHold);
return;
}
mouseUp = false;
mouseDown = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
grabTarget.onmouseup = function(event){
mouseDown = false;
mouseUp = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
elementOffset = $(grabTarget).offset();
elementOffsetLeft = elementOffset.left;
elementOffsetTop = elementOffset.top;
elementIntLeft = grabTarget.clientWidth * 0.5;
elementIntTop = grabTarget.clientHeight * 0.5;
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function grabClick(target){
return;
}
function imageOver(target){
return;
}
function imageOut(target){
return;
}
function imageMove(target){
return;
}
function imageClick(target){
return;
}
</script>
<p id="see" class="proseClass fadeIn">
This is how I <span id="change"
class="linkClass">see.</span>
<br/>
<br/>
<span id="s1Target"
class="linkClass">TEST</span>
<br/>
<br/>
<span id="s2Target"
class="linkClass">TEST</span>
<br/>
<br/>
<span id="s3Target"
class="linkClass">TEST</span>
<br/>
<br/>
<span id="s4Target"
class="linkClass">TEST</span>
<br/>
<br/>
<span id="s5Target"
class="linkClass">TEST</span>
<br/>
<br/>
<span id="s6Target"
class="linkClass">TEST</span>
<br/>
<br/>
<span id="s7Target"
class="linkClass">TEST</span>
<br/>
<br/>
</p>
</br>
</br>
<p id="pAnxiety" class="proseClass hiddenClass noSelect">
test <span class="proseClassBlack">anxiety</span> test
</p>
</br>
</br>
<p id="pPride" class="proseClass hiddenClass noSelect">
test <span class="proseClassBlack">pride</span> test
</p>
</br>
</br>
<p id="pIntelligence" class="proseClass hiddenClass noSelect">
test <span class="proseClassBlack">intelligence</span> test
</p>
</br>
</br>
<p id="pFaith" class="proseClass hiddenClass noSelect">
test <span class="proseClassBlack">faith</span> test
</p>
<img
src="https://dl.dropboxusercontent.com/s/qttelbdvbtz5phf/roofCR.png?dl=0" id="roofIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/q0lwk5bktw57d3c/roofFullCR.png?dl=0" id="roofFullIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/hbr8h962eaqhq6x/pillar.png?dl=0" id="pillarLIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/58gs6bbbfk9tp75/pillarFull.png?dl=0" id="pillarLFullIMG" class="imageClass noSelect hiddenClass">
<img
<img
src="https://dl.dropboxusercontent.com/s/hbr8h962eaqhq6x/pillar.png?dl=0" id="pillarRIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/58gs6bbbfk9tp75/pillarFull.png?dl=0" id="pillarRFullIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/3gnn2qa1dt3nc97/roomCR.png?dl=0" id="roomIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/rgp0ear81nggjel/roomFullCR.png?dl=0" id="roomFullIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/w1ijinvy7li0f6n/baseCR.png?dl=0" id="baseIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/9scb7jtx5tvdmvu/baseFullCR.png?dl=0" id="baseFullIMG" class="imageClass noSelect hiddenClass">
<span id="pride" class="proseClass linkClass grabClass noSelect hiddenClass">pride</span>
<span id="anxiety" class="proseClass linkClass grabClass noSelect hiddenClass">anxiety</span>
<span id="faith" class="proseClass linkClass grabClass noSelect hiddenClass">faith</span>
<span id="intelligence" class="proseClass linkClass grabClass noSelect hiddenClass">intelligence</span>
<span id="done" class="proseClass linkClass noSelect hiddenClass">Done playing with blocks?</span>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
<audio id="bgMusic14">
<source
src="https://dl.dropboxusercontent.com/s/tymk6rbc79h9ptq/NooDriver%20Draft%203.wav?dl=0" type="audio/wav">
</audio>
<h4 id="elementPos" class="noSelect">
TEST ELEMENT POS
</h4>
<div id="mark1080" class="noSelect">
</div>
<script>
document.body.style.backgroundColor = "rgb(11, 11, 11)";
var mouseDown = false;
var mouseUp = true;
var mouseOver = false;
var mouseOut = true;
var toggleHold;
var cantClicked = false;
var iElement = document.getElementById("i");
var growLaunched = false;
var elementOffset;
var elementOffsetLeft;
var elementOffsetTop;
var elementIntLeft;
var elementIntTop;
var elementFontSize;
var grabTarget;
var posX;
var posY;
var elementPos = document.getElementById("elementPos");
var result = document.getElementById("result");
var people = document.getElementById("people");
var provide = document.getElementById("provide");
function Interval(fn, time) {
var timer = false;
this.start = function () {
if (!this.isRunning())
timer = setInterval(fn, time);
};
this.stop = function () {
clearInterval(timer);
timer = false;
};
this.isRunning = function () {
return timer !== false;
};
}
function growWord(target){
var targetID = target;
//targetID.style.fontSize = "200%";
var floatConvert = "";
var newFloat = 0.0;
var increment = 0.5;
var sizeString;
var floatConvertMin = "";
var newFloatMin = 0.0;
var incrementMin = 0.5;
var toggleUD = false;
var switchDir false;
var growInterval = new Interval(grow, 1000/30);
targetID.addEventListener("mousedown", clickWord);
growInterval.start();
console.log("growInterval Started.");
clickWord(){
if(toggleUD == false){
toggleUD = true;
}
if(toggleUD == true){
toggleUD = false;
}
}
function grow(){
sizeString = window.getComputedStyle
(targetID, null).getPropertyValue('font-size');
if(toggleUD == false){
floatConvert = parseFloat(sizeString);
newFloat = (floatConvert -= increment).toFixed(2);
targetID.style.fontSize = newFloat + "px";
console.log("sizeString = " + sizeString);
console.log("floatConvert = " + floatConvert);
console.log("newFloat = " + newFloat);
console.log("growInterval Running.");
if(newFloat >= 100.00){
growInterval.stop();
console.log("growInterval Stopped.");
return;
}
}
if(toggleUD == true){
floatConvertMin = parseFloat(sizeString);
newFloatMin = (floatConvertMin += incrementMin).toFixed(2);
targetID.style.fontSize = newFloatMin + "px";
console.log("sizeString = " + sizeString);
console.log("floatConvertMin = " + floatConvertMin);
console.log("newFloatMin = " + newFloatMin);
console.log("growInterval Running.");
if(newFloatMin <= 5.00){
growInterval.stop();
console.log("growInterval Stopped.");
return;
}
}
window.onmousemove = function(e){
posX = e.pageX;
posY = e.pageY;
elementPos.innerHTML =
"posX= " +
posX +
" / " +
"posY= " +
posY;
if(toggleHold == true){
grabTarget.style.top =
(posY - elementIntTop) + "px";
grabTarget.style.left =
(posX - elementIntLeft) + "px";
}
}
function linkSwap(target){
var string = "'" + target + "'";
if(document.getElementById(target) == you){
document.getElementById(target).innerHTML = "your cronies";
//document.getElementById(target).style.textDecoration = "underline";
//document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == i){
document.getElementById(target).innerHTML = "You";
//document.getElementById(target).style.fontSize = "150%";
//people.style.opacity = "1.0";
//document.getElementById(target).style.textDecoration = "underline";
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == yours){
document.getElementById(target).innerHTML = "mine.";
//document.getElementById(target).style.textDecoration = "underline";
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == are){
document.getElementById(target).innerHTML = "have been";
}
if(document.getElementById(target) == cant){
document.getElementById(target).innerHTML = 'shouldn"t.';
document.getElementById(target).style.fontStyle = "italic";
}
//document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
//document.getElementById(target).style.textDecoration = "underline overline";
console.log("Mouse is over a link. " + string );
}
function linkSwapBack(target){
var string = "'" + target + "'";
if(document.getElementById(target) == you){
document.getElementById(target).innerHTML = "you"
}
if(document.getElementById(target) == i){
document.getElementById(target).innerHTML = "I";
//people.style.opacity = "0.0";
}
if(document.getElementById(target) == yours){
document.getElementById(target).innerHTML = "yours.";
}
if(document.getElementById(target) == are){
document.getElementById(target).innerHTML = "are";
}
if(document.getElementById(target) == cant){
document.getElementById(target).innerHTML = 'cant"t.';
}
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == you){
//window.story.show('Blind');
return;
}
if(document.getElementById(target) == yours){
if(cantClicked == false){
result.style.opacity = "1.0";
return;
}
}
if(document.getElementById(target) == i){
if(cantClicked == false){
people.style.opacity = "1.0"
//iElement.classList.remove('fadeIn');
//iElement.classList.add('growAnim');
growWord(document.getElementById(target));
}
}
if(document.getElementById(target) == cant && cantClicked == false){
people.style.opacity = "0.0";
provide.style.opacity = "0.0";
result.style.opacity = "0.0";
cantClicked = true;
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
function grabOver(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is over grabbable link. " + string);
return;
}
function grabOut(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is not over grabbable link. " + string);
return;
}
function grabMove(target){
grabTarget = document.getElementById(target);
grabTarget.onmousedown = function(event){
if(toggleHold == false || toggleHold == null){
toggleHold = true;
console.log("F: " + toggleHold);
return;
}
else{
toggleHold = false;
console.log("F: " + toggleHold);
return;
}
mouseUp = false;
mouseDown = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
grabTarget.onmouseup = function(event){
mouseDown = false;
mouseUp = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
elementOffset = $(grabTarget).offset();
elementOffsetLeft = elementOffset.left;
elementOffsetTop = elementOffset.top;
elementIntLeft = grabTarget.clientWidth * 0.5;
elementIntTop = grabTarget.clientHeight * 0.5;
elementFontSize = grabTarget.style.fontSize;
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function grabClick(target){
return;
}
function imageOver(target){
return;
}
function imageOut(target){
return;
}
function imageMove(target){
return;
}
function imageClick(target){
return;
}
</script>
<p id="provide" class="proseClass fadeIn">
<span id="i" class="linkClass">I</span> provide a different kind of equilibrium:
</br>
</br>
<span id="yours" class="linkClass">yours.</span>
</p>
</br>
</br>
</br>
<p id="result" class=" proseClass hiddenClass">
Sometimes, mistakes <span id="are" class="linkClass">are</span> made.
</br>
</br>
Sometimes, you decide that <span id="you" class="linkClass">you</span> don"t like the new order of things.
</p>
</br>
</br>
</br>
<p id="people" class="proseClass hiddenClass">
Why put effort into growing as a person if I can do it for you?
</br>
Impress your coworkers with that new-found sense of humor. Live it up as the ultimate ladies man. Grow shrewd and tactful as the political elite - pour a new foundation for that temple in your head.
</br>
</br>
...
</br>
</br>
Forget someone you <span id="cant" class="linkClass">can"t.</span>
<h4 id="elementPos" class="noSelect">
TEST ELEMENT POS
</h4>
<div id="mark1080" class="noSelect">
</div>
<script>
var bgm = document.getElementById("bgMusic1");
bgm.volume = 0.5;
bgm.loop = true;
bgm.load();
bgm.play();
var bgm2 = document.getElementById("bgMusicB");
bgm2.volume = 0.3;
bgm2.loop = true;
bgm2.load();
bgm2.play();
var scopeP1 = document.getElementById("scopeP1");
var scopeHigh = document.getElementById("scopeHigh");
var scopeTakes = document.getElementById("scopeTakes");
function linkSwap(target){
document.getElementById(target).style.fontStyle =
"italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == scopeTakes){
//DO
sessionStorage.scope1="Takes";
bgm.pause();
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("First");
return;
}
if(document.getElementById(target) == scopeHigh){
//DO
sessionStorage.scope1="High";
bgm.pause();
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("First");
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<p id="scopeP1" class="proseClassScope scopeClass noSelect flickerH">
The first time I remote tunneled into someone"s head was a <span id="scopeHigh" class="linkClass">high</span> I"ve never stopped trying to recapture.
<br/>
<br/>I suppose that"s the way it <span id="scopeTakes" class="linkClass">takes</span> you.
</p>
<audio id="bgMusic1">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<audio id="bgMusicB">
<source
src="https://dl.dropboxusercontent.com/s/34mtwukiejvfnvu/Ambience_Subway.wav?dl=0" type="audio/wav">
</audio>
<script>
var bgm = document.getElementById("bgMusic3");
bgm.volume = 0.5;
bgm.loop = true;
var bgm2 = document.getElementById("bgMusicB");
bgm2.volume = 0.3;
bgm2.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
if(sessionStorage.audioMark2!= null){
bgm.currentTime = sessionStorage.audioMark2
}
bgm2.play();
var scopeP2 = document.getElementById("scopeP2");
var scopeTrivialise = document.getElementById("scopeTrivialise");
var scopeGrowth = document.getElementById("scopeGrowth");
function linkSwap(target){
document.getElementById(target).style.fontStyle =
"italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == scopeGrowth){
//DO
sessionStorage.scope2="Growth";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Intro");
return;
}
if(document.getElementById(target) == scopeTrivialise){
//DO
sessionStorage.scope2="Trivialise";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Intro");
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<p id="scopeP2" class="proseClassScope scopeClass noSelect flickerH">
Through the years my ability to mesh with the machine has grown in tandem with<br/>my <span id="scopeGrowth" class="linkClass">growth</span> as a person; every problem people bring becomes a little easier to <span id="scopeTrivialise" class="linkClass">trivialise.</span>
</p>
<audio id="bgMusic3">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<audio id="bgMusicB">
<source
src="https://dl.dropboxusercontent.com/s/34mtwukiejvfnvu/Ambience_Subway.wav?dl=0" type="audio/wav">
</audio>
<script>
var bgm = document.getElementById("bgMusic5");
bgm.volume = 0.5;
bgm.loop = true;
var bgm2= document.getElementById("bgMusicB");
bgm2.volume= 0.5;
bgm2.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
if(sessionStorage.audioMark2!= null){
bgm.currentTime = sessionStorage.audioMark2
}
bgm2.play();
document.body.style.backgroundColor = "rgb(11, 11, 11)";
var scopeP3 = document.getElementById("scopeP3");
var scopeDesperately = document.getElementById("scopeDesperately");
var scopeConsciousness = document.getElementById("scopeConsciousness");
function linkSwap(target){
document.getElementById(target).style.fontStyle =
"italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == scopeConsciousness){
//DO
sessionStorage.scope3="Consciousness";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Equilibrium");
return;
}
if(document.getElementById(target) == scopeDesperately){
//DO
sessionStorage.scope3="Desperately";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Equilibrium");
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<p id="scopeP3" class="proseClassScope scopeClass noSelect flickerH">
Words fail me about the entry. A stark, weightless shock
<br/>- like that falling sensation in bed - but there"s no realisation of safety.
<br/>
<br/>
No mattress to <span id="scopeDesperately" class="linkClass">desperately</span> latch onto. No familiar chair. No weight of your wrists hitting the desk.
<br/>
The unreality persists until you acclimate to having no bonds left to strap yourself to.
<br/>
<br/>
Pure <span id="scopeConsciousness" class="linkClass">consciousness.</span>
</p>
<audio id="bgMusic5">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<audio id="bgMusicB">
<source
src="https://dl.dropboxusercontent.com/s/34mtwukiejvfnvu/Ambience_Subway.wav?dl=0" type="audio/wav">
</audio>
<script>
var bgm = document.getElementById("bgMusic7");
bgm.volume = 0.5;
bgm.loop = true;
var bgm2= document.getElementById("bgMusicB");
bgm2.volume= 0.5;
bgm2.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
if(sessionStorage.audioMark2!= null){
bgm.currentTime = sessionStorage.audioMark2
}
bgm2.play();
var scopeP4 = document.getElementById("scopeP4");
var scopeRemember = document.getElementById("scopeRemember");
var scopeTerms = document.getElementById("scopeTerms");
function linkSwap(target){
document.getElementById(target).style.fontStyle =
"italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == scopeTerms){
//DO
sessionStorage.scope4="Terms";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Technology");
return;
}
if(document.getElementById(target) == scopeRemember){
//DO
sessionStorage.scope4="Remember";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Technology");
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<p id="scopeP4" class="proseClassScope scopeClass noSelect flickerH">
Harness off; these are the <span id="scopeTerms" class="linkClass">terms.</span>
<br/>
<br/>
Hand in your resume, and resign to daintily tumbling until you don"t anymore.
<br/>
<br/>
I hope you <span id="scopeRemember" class="linkClass">remember</span> how to get back, and I hope you like existensial crisis.
</p>
<audio id="bgMusic7">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<audio id="bgMusicB">
<source
src="https://dl.dropboxusercontent.com/s/34mtwukiejvfnvu/Ambience_Subway.wav?dl=0" type="audio/wav">
</audio>
<script>
var bgm = document.getElementById("bgMusic9");
bgm.volume = 0.5;
bgm.loop = true;
var bgm2= document.getElementById("bgMusicB");
bgm2.volume= 0.5;
bgm2.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
if(sessionStorage.audioMark2!= null){
bgm.currentTime = sessionStorage.audioMark2
}
bgm2.play();
var scopeP5 = document.getElementById("scopeP5");
var scopePerverse = document.getElementById("scopePerverse");
var scopeVulnerable = document.getElementById("scopeVulnerable");
function linkSwap(target){
document.getElementById(target).style.fontStyle =
"italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == scopePerverse){
//DO
sessionStorage.scope5="Perverse";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("April 1st, 2056");
return;
}
if(document.getElementById(target) == scopeVulnerable){
//DO
sessionStorage.scope5="Vulnerable";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("April 1st, 2056");
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<p id="scopeP5" class="proseClassScope scopeClass noSelect flickerH">
Imagine being promised a boundless sea of stars; to sunbathe in the light of the cosmic sky. The light transmits an awareness. <br/>
You chart the synaptic connections that make a person. It feels <span id="scopePerverse" class="linkClass">perverse.</span> It feels close and <span id="scopeVulnerable" class="linkClass">vulnerable.</span>
<br/>
<br/>
You adventure out into a field of soft grass; camping out under a stark sky all day. Waiting for night to shroud itself over the horizon.
<br/>
<br/>
<br/>
You lie down.
<br/>
<br/>
<br/>
Night comes.
<br/>
<br/>
<br/>
It"s overcast.
</p>
<audio id="bgMusic9">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<audio id="bgMusicB">
<source
src="https://dl.dropboxusercontent.com/s/34mtwukiejvfnvu/Ambience_Subway.wav?dl=0" type="audio/wav">
</audio>
<script>
var bgm = document.getElementById("bgMusic11");
bgm.volume = 0.5;
bgm.loop = true;
var bgm2= document.getElementById("bgMusicB");
bgm2.volume= 0.5;
bgm2.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
if(sessionStorage.audioMark2!= null){
bgm.currentTime = sessionStorage.audioMark2
}
bgm2.play();
var scopeP6 = document.getElementById("scopeP6");
var scopeEnjoy = document.getElementById("scopeEnjoy");
var scopeFrustration = document.getElementById("scopeFrustration");
function linkSwap(target){
document.getElementById(target).style.fontStyle =
"italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == scopeEnjoy){
//DO
sessionStorage.scope6="Enjoy";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Thoughts");
return;
}
if(document.getElementById(target) == scopeFrustration){
//DO
sessionStorage.scope6="Frustration";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Thoughts");
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<p id="scopeP6" class="proseClassScope scopeClass noSelect flickerH">
Through the building <span id="scopeFrustration" class="linkClass">frustration</span> and absence of moonlight, you see only one star. You want to seize it, force it to give up its secrets.
<br/>
<br/>
The opaque sky grins at you - there"s not even a body left to <span id="scopeEnjoy" class="linkClass">enjoy</span> the grass with.
</p>
<audio id="bgMusic11">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<audio id="bgMusicB">
<source
src="https://dl.dropboxusercontent.com/s/34mtwukiejvfnvu/Ambience_Subway.wav?dl=0" type="audio/wav">
</audio>
<script>
var bgm = document.getElementById("bgMusic14");
bgm.volume = 0.5;
bgm.loop = true;
var bgm2= document.getElementById("bgMusicB");
bgm2.volume= 0.5;
bgm2.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
if(sessionStorage.audioMark2!= null){
bgm.currentTime = sessionStorage.audioMark2
}
bgm2.play();
var scopeP8 = document.getElementById("scopeP8");
var tomorrow = document.getElementById("tomorrow");
var job = document.getElementById("job");
var jobclicked = false;
var nooscope = document.getElementById("nooscope");
function linkSwap(target){
document.getElementById(target).style.fontStyle =
"italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == job){
//DO
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
tomorrow.classList.remove("hiddenClass");
tomorrow.style.opacity = "0.0";
tomorrow.classList.add("fadeIn3");
scopeP8.classList.remove("flickerH");
scopeP8.classList.add("fadeOut");
//window.story.show("End");
jobclicked = true;
return;
}
if(document.getElementById(target) == nooscope && jobclicked == true){
//DO
window.story.show("End2");
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<p id="scopeP8" class="proseClassScope scopeClass noSelect flickerH text120">
Maybe it does for the others too -<br/> even I"m just a <span id="job" class="linkClass noSelect">job.</span>
</p>
<br/>
<br/>
<p id="tomorrow" class="proseClassScope scopeClass noSelect text120 hiddenClass">
With new perspective, the <span id="nooscope" class="linkClass noSelect">Noöscope</span> calls.
</p>
<audio id="bgMusic14">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<audio id="bgMusicB">
<source
src="https://dl.dropboxusercontent.com/s/34mtwukiejvfnvu/Ambience_Subway.wav?dl=0" type="audio/wav">
</audio>
<script>
var bgm = document.getElementById("bgMusic13");
bgm.volume = 0.5;
bgm.loop = true;
var bgm2= document.getElementById("bgMusicB");
bgm2.volume= 0.5;
bgm2.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
if(sessionStorage.audioMark2!= null){
bgm.currentTime = sessionStorage.audioMark2
}
bgm2.play();
var scopeP7 = document.getElementById("scopeP7");
var scopeWitness = document.getElementById("scopeWitness");
var scopescopePossibility = document.getElementById("scopePossibility");
function linkSwap(target){
document.getElementById(target).style.fontStyle =
"italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == scopePossibility){
//DO
sessionStorage.scope7= "Possibility";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Eye");
return;
}
if(document.getElementById(target) == scopeWitness){
//DO
sessionStorage.scope7= "Witness";
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
sessionStorage.audioMark2 = bgm2.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Eye");
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<p id="scopeP7" class="proseClassScope scopeClass noSelect flickerH">
Mastery has its own flavor. A sense of flow and control, the means to act on <span id="scopePossibility" class="linkClass">possibility.</span> I still live those moments.
<br/>
<br/>- Here I <span id="scopeWitness" class="linkClass">witness</span> things beyond compare and replacement - and I dread that it"s starting to bore me.
</p>
<audio id="bgMusic13">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<audio id="bgMusicB">
<source
src="https://dl.dropboxusercontent.com/s/34mtwukiejvfnvu/Ambience_Subway.wav?dl=0" type="audio/wav">
</audio>
<script>
var bgm = document.getElementById("bgMusic14");
bgm.volume = 0.5;
bgm.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
//INIT DEPOSIT WORDS-------------------------------------------
var sWord1;
//sWord1.style.color = "red";
var sWord2;
//sWord2.style.color = "red";
var sWord3;
//sWord3.style.color = "red";
var sWord4;
//sWord4.style.color = "red";
var sWord5;
//sWord5.style.color = "red";
var sWord6;
//sWord6.style.color = "red";
var sWord7;
//sWord7.style.color = "red";
if(sessionStorage.scope1 != null){
sWord1 = sessionStorage.scope1;
}else{sWord1 = "Takes";}
document.getElementById("s1Target").innerHTML = sWord1;
if(sessionStorage.scope2 != null){
sWord2 = sessionStorage.scope2;
}else{ var sWord2 = "Time";}
document.getElementById("s2Target").innerHTML = sWord2;
if(sessionStorage.scope3 != null){
sWord3 = sessionStorage.scope3;
}else{ sWord3 = "Consciousness";}
document.getElementById("s3Target").innerHTML = sWord3;
if(sessionStorage.scope4 != null){
sWord4 = sessionStorage.scope4;
}else{ sWord4 = "Terms";}
document.getElementById("s4Target").innerHTML = sWord4;
if(sessionStorage.scope5 != null){
sWord5 = sessionStorage.scope5;
}else{ sWord5 = "Vulnerable";}
document.getElementById("s5Target").innerHTML = sWord5;
if(sessionStorage.scope6 != null){
sWord6 = sessionStorage.scope6;
}else{ sWord6 = "Frustration";}
document.getElementById("s6Target").innerHTML = sWord6;
if(sessionStorage.scope7 != null){
sWord7 = sessionStorage.scope7;
}else{sWord7 = "Witness";}
document.getElementById("s7Target").innerHTML = sWord7;
//VARS---------------------------------------------------------
var mouseDown = false;
var mouseUp = true;
var mouseOver = false;
var mouseOut = true;
var toggleHold;
var changeClicked = false;
var exit = false;
var roofS1 = false;
var roomS1 = false;
var pillarS1 = false;
var baseS1 = false;
var roofS2 = false;
var roomS2 = false;
var pillarS2 = false;
var baseS2 = false;
var roofS3 = false;
var roomS3 = false;
var pillarS3 = false;
var baseS3 = false;
var roofS4 = false;
var roomS4 = false;
var pillarS4 = false;
var baseS4 = false;
var roofS5 = false;
var roomS5 = false;
var pillarS5 = false;
var baseS5 = false;
var roofS6 = false;
var roomS6 = false;
var pillarS6 = false;
var baseS6 = false;
var roofS7 = false;
var roomS7 = false;
var pillarS7 = false;
var baseS7 = false;
var roofInt1 = false;
var roomInt1 = false;
var pillarInt1 = false;
var baseInt1 = false;
var roofInt2 = false;
var roomInt2 = false;
var pillarInt2 = false;
var baseInt2 = false;
var roofInt3 = false;
var roomInt3 = false;
var pillarInt3 = false;
var baseInt3 = false;
var roofInt4 = false;
var roomInt4 = false;
var pillarInt4 = false;
var baseInt4 = false;
var roofInt5 = false;
var roomInt5 = false;
var pillarInt5 = false;
var baseInt5 = false;
var roofInt6 = false;
var roomInt6 = false;
var pillarInt6 = false;
var baseInt6 = false;
var roofInt7 = false;
var roomInt7 = false;
var pillarInt7 = false;
var baseSInt7 = false;
var roomTotal;
var roofTotal;
var pillarTotal;
var baseTotal;
var intTotal;
var s1 = document.getElementById("s1Target");
var s2 = document.getElementById("s2Target");
var s3 = document.getElementById("s3Target");
var s4 = document.getElementById("s4Target");
var s5 = document.getElementById("s5Target");
var s6 = document.getElementById("s6Target");
var s7 = document.getElementById("s7Target");
var roofOc = false;
var roomOc = false;
var pillarsOc = false;
var baseOc= false;
var elementOffset;
var elementOffsetLeft;
var elementOffsetTop;
var elementIntLeft;
var elementIntTop;
var grabTarget;
var posX;
var posY;
var elementPos = document.getElementById("elementPos");
var result = document.getElementById("result");
var people = document.getElementById("people");
var provide = document.getElementById("provide");
var done = document.getElementById("done");
var see = document.getElementById("see");
see.style.zIndex = "3";
var roof = document.getElementById("roofIMG");
var pillarL = document.getElementById("pillarLIMG");
var room = document.getElementById("roomIMG");
var base = document.getElementById("baseIMG");
var eye = document.getElementById("eyeIMG");
var lidTop = document.getElementById("lidTopIMG");
var lidBottom = document.getElementById("lidBottomIMG");
var dotLT = document.getElementById("dotLT");
var dotRT = document.getElementById("dotRT");
var dotLB = document.getElementById("dotLB");
var dotRB = document.getElementById("dotRB");
var dotLT2 = document.getElementById("dotLT2");
var dotRT2 = document.getElementById("dotRT2");
var dotLB2 = document.getElementById("dotLB2");
var dotRB2 = document.getElementById("dotRB2");
var dotIris = document.getElementById("dotIris");
var dotIris2 = document.getElementById("dotIris2");
var dotIris3 = document.getElementById("dotIris3");
var s1Left;
var s1Top;
var s2Top;
var s2Left;
var s3Top;
var s3Left;
var s4Top;
var s4Left;
var s5Left;
var s5Top;
var s6Top;
var s6Left;
var s7Top;
var s7Left;
var filter = document.getElementById("filter");
var newEyes = document.getElementById("newEyes");
function Interval(fn, time) {
var timer = false;
this.start = function () {
if (!this.isRunning())
timer = setInterval(fn, time);
};
this.stop = function () {
clearInterval(timer);
timer = false;
};
this.isRunning = function () {
return timer !== false;
};
}
window.onmousemove = function(e){
posX = e.pageX;
posY = e.pageY;
s1Left = parseFloat(s1.style.left)+
(s1.clientWidth * 0.5);
s1Top = parseFloat(s1.style.top) +
(s1.clientHeight * 0.5);
s2Left = parseFloat(s2.style.left)+
(s2.clientWidth * 0.5);
s2Top = parseFloat(s2.style.top) +
(s2.clientHeight * 0.5);
s3Left = parseFloat(s3.style.left)+
(s3.clientWidth * 0.5);
s3Top = parseFloat(s3.style.top) +
(s3.clientHeight * 0.5);
s4Left = parseFloat(s4.style.left)+
(s4.clientWidth * 0.5);
s4Top = parseFloat(s4.style.top) +
(s4.clientHeight * 0.5);
s5Left = parseFloat(s5.style.left)+
(s5.clientWidth * 0.5);
s5Top = parseFloat(s5.style.top) +
(s5.clientHeight * 0.5);
s6Left = parseFloat(s6.style.left)+
(s6.clientWidth * 0.5);
s6Top = parseFloat(s6.style.top) +
(s6.clientHeight * 0.5);
s7Left = parseFloat(s7.style.left)+
(s7.clientWidth * 0.5);
s7Top = parseFloat(s7.style.top) +
(s7.clientHeight * 0.5);
elementPos.innerHTML =
"posX= " +
posX +
" / " +
"posY= " +
posY +
"<br/>" +
"<br/>" +
"rfOc= " +
roofOc +
" / " +
"roOc= " +
roomOc +
" / " +
"pOc= " +
pillarsOc +
" / " +
"bOc= " +
baseOc;
if(toggleHold == true){
grabTarget.style.top =
(posY - elementIntTop) + "px";
grabTarget.style.left =
(posX - elementIntLeft) + "px";
}
//Roof---------------------------------------------------
if(changeClicked == true){
if(roofS1 == true || roofS2 == true ||
roofS3 == true || roofS4 == true || roofS5 == true
|| roofS6 == true || roofS7 == true){
dotLT.style.backgroundColor = "rgba(255,37,37,0.8)";
dotLT2.style.backgroundColor = "rgba(255,37,37,0.8)";
roofOc = true;
}
else{
dotLT.style.backgroundColor = "rgba(255,37,37,0.4)";
dotLT2.style.backgroundColor = "rgba(255,37,37,0.4)";
roofOc = false;
}
if(roofS1 == false && roofS2 == false &&
roofS3 == false && roofS4 == false && roofS5 == false
&& roofS6 == false && roofS7 == false){
//roof.style.opacity = "1.0";
}
if(roofS1 == true){
roofInt1 = 1;
}
else{
roofInt1 = 0;
}
if(roofS2 == true){
roofInt2 = 1;
}
else{
roofInt2 = 0;
}
if(roofS3 == true){
roofInt3 = 1;
}
else{
roofInt3 = 0;
}
if(roofS4 == true){
roofInt4 = 1;
}
else{
roofInt4 = 0;
}
if(roofS5 == true){
roofInt5 = 1;
}
else{
roofInt5 = 0;
}
if(roofS6 == true){
roofInt6 = 1;
}
else{
roofInt6 = 0;
}
if(roofS7 == true){
roofInt7 = 1;
}
else{
roofInt7 = 0;
}
roofTotal = (roofInt1 + roofInt2 + roofInt3 +
roofInt4 + roofInt5 + roofInt6 + roofInt7);
console.log("roofTotal= " + roofTotal);
//S1 - roof
if(s1Left > 255 && s1Left < 350
&& s1Top > 254 && s1Top < 330){
if(toggleHold == false){
//roof.style.opacity = "0.0";
roofS1 = true;
}
}
else{
//pride.style.color = "white";
roofS1 = false;
}
//S2 - roof
if(s2Left > 255 && s2Left < 350
&& s2Top > 254 && s2Top < 330){
if(toggleHold == false){
//roof.style.opacity = "0.0";
roofS2 = true;
}
}
else{
//anxiety.style.color = "white";
roofS2 = false;
}
//S3 - roof
if(s3Left > 255 && s3Left < 350
&& s3Top > 254 && s3Top < 330){
if(toggleHold == false){
//roof.style.opacity = "0.0";
roofS3 = true;
}
}
else{
//intelligence.style.color = "white";
roofS3 = false;
}
//S4 - roof
if(s4Left > 255 && s4Left < 350
&& s4Top > 254 && s4Top < 330){
if(toggleHold == false){
//roof.style.opacity = "0.0";
roofS4 = true;
}
}
else{
//faith.style.color = "white";
roofS4 = false;
}
//S5 - roof
if(s5Left > 255 && s5Left < 350
&& s5Top > 254 && s5Top < 330){
if(toggleHold == false){
//roof.style.opacity = "0.0";
roofS5 = true;
}
}
else{
//faith.style.color = "white";
roofS5 = false;
}
//S6 - roof
if(s6Left > 255 && s6Left < 350
&& s6Top > 254 && s6Top < 330){
if(toggleHold == false){
//roof.style.opacity = "0.0";
roofS6 = true;
}
}
else{
//faith.style.color = "white";
roofS6 = false;
}
//S7 - roof
if(s7Left > 255 && s7Left < 350
&& s7Top > 254 && s7Top < 330){
if(toggleHold == false){
//roof.style.opacity = "0.0";
roofS7 = true;
}
}
else{
//faith.style.color = "white";
roofS7 = false;
}
}
//Room -------------------------------------------------
if(changeClicked == true){
if(roomS1 == true || roomS2 == true ||
roomS3 == true || roomS4 == true || roomS5 == true
|| roomS6 == true || roomS7 == true){
roomOc = true;
dotLB.style.backgroundColor = "rgba(255,37,37,0.8)";
dotLB2.style.backgroundColor = "rgba(255,37,37,0.8)";
}
else{
dotLB.style.backgroundColor = "rgba(255,37,37,0.4)";
dotLB2.style.backgroundColor = "rgba(255,37,37,0.4)";
roomOc = false;
}
if(roomS1 == false && roomS2 == false &&
roomS3 == false && roomS4 == false && roomS5 == false
&& roomS6 == false && roomS7 == false){
//room.style.opacity = "1.0";
}
if(roomS1 == true){
roomInt1 = 1;
}
else{
roomInt1 = 0;
}
if(roomS2 == true){
roomInt2 = 1;
}
else{
roomInt2 = 0;
}
if(roomS3 == true){
roomInt3 = 1;
}
else{
roomInt3 = 0;
}
if(roomS4 == true){
roomInt4 = 1;
}
else{
roomInt4 = 0;
}
if(roomS5 == true){
roomInt5 = 1;
}
else{
roomInt5 = 0;
}
if(roomS6 == true){
roomInt6 = 1;
}
else{
roomInt6 = 0;
}
if(roomS7 == true){
roomInt7 = 1;
}
else{
roomInt7 = 0;
}
roomTotal = (roomInt1 + roomInt2 + roomInt3 +
roomInt4 + roomInt5 + roomInt6 + roomInt7);
console.log("roomTotal= " + roomTotal);
//S1 - room
if(s1Left > 451 && s1Left < 518
&& s1Top > 682 && s1Top < 774){
if(toggleHold == false){
//room.style.opacity = "0.0";
roomS1 = true;
}
}
else{
//pride.style.color = "white";
roomS1 = false;
}
//S2 - room
if(s2Left > 451 && s2Left < 518
&& s2Top > 682 && s2Top < 774){
if(toggleHold == false){
//room.style.opacity = "0.0";
roomS2 = true;
}
}
else{
//pride.style.color = "white";
roomS2 = false;
}
//S3 - room
if(s3Left > 451 && s3Left < 518
&& s3Top > 682 && s3Top < 774){
if(toggleHold == false){
//room.style.opacity = "0.0";
roomS3 = true;
}
}
else{
//pride.style.color = "white";
roomS3 = false;
}
//S4 - room
if(s4Left > 451 && s4Left < 518
&& s4Top > 682 && s4Top < 774){
if(toggleHold == false){
//room.style.opacity = "0.0";
roomS4 = true;
}
}
else{
//pride.style.color = "white";
roomS4 = false;
}
//S5 - room
if(s5Left > 451 && s5Left < 518
&& s5Top > 682 && s5Top < 774){
if(toggleHold == false){
//room.style.opacity = "0.0";
roomS5 = true;
}
}
else{
//pride.style.color = "white";
roomS5 = false;
}
//S6 - room
if(s6Left > 451 && s6Left < 518
&& s6Top > 682 && s6Top < 774){
if(toggleHold == false){
//room.style.opacity = "0.0";
roomS6 = true;
}
}
else{
//pride.style.color = "white";
roomS6 = false;
}
//S7 - room
if(s7Left > 451 && s7Left < 518
&& s7Top > 682 && s7Top < 774){
if(toggleHold == false){
//room.style.opacity = "0.0";
roomS7 = true;
}
}
else{
//pride.style.color = "white";
roomS7 = false;
}
}
//Pillars--------------------------------------------------
if(changeClicked == true){
if(pillarS1 == true || pillarS2 == true ||
pillarS3 == true || pillarS4 == true
|| pillarS5 == true || pillarS6 == true
|| pillarS7 == true){
pillarsOc = true;
dotRT.style.backgroundColor = "rgba(255,37,37,0.8)";
dotRT2.style.backgroundColor = "rgba(255,37,37,0.8)";
}
else{
dotRT.style.backgroundColor = "rgba(255,37,37,0.4)";
dotRT2.style.backgroundColor = "rgba(255,37,37,0.4)";
pillarsOc = false;
}
if(pillarS1 == false && pillarS2 == false &&
pillarS3 == false && pillarS4 == false
&& pillarS5 == false && pillarS6 == false
&& pillarS7 == false){
//pillarL.style.opacity = "1.0";
}
if(pillarS1 == true){
pillarInt1 = 1;
}
else{
pillarInt1 = 0;
}
if(pillarS2 == true){
pillarInt2 = 1;
}
else{
pillarInt2 = 0;
}
if(pillarS3 == true){
pillarInt3 = 1;
}
else{
pillarInt3 = 0;
}
if(pillarS4 == true){
pillarInt4 = 1;
}
else{
pillarInt4 = 0;
}
if(pillarS5 == true){
pillarInt5 = 1;
}
else{
pillarInt5 = 0;
}
if(pillarS6 == true){
pillarInt6 = 1;
}
else{
pillarInt6 = 0;
}
if(pillarS7 == true){
pillarInt7 = 1;
}
else{
pillarInt7 = 0;
}
pillarTotal = (pillarInt1 + pillarInt2 + pillarInt3 +
pillarInt4 + pillarInt5 + pillarInt6 + pillarInt7);
console.log("pillarTotal= " + pillarTotal);
//S1
if(s1Left > 1489 && s1Left < 1584
&& s1Top > 246 && s1Top < 336){
if(toggleHold == false){
//pillarL.style.opacity = "0.0";
pillarS1 = true;
}
}
else{
//pride.style.color = "white"
pillarS1 = false;
}
//S2
if(s2Left > 1489 && s2Left < 1584
&& s2Top > 246 && s2Top < 336){
if(toggleHold == false){
//pillarL.style.opacity = "0.0";
pillarS2 = true;
}
}
else{
//pride.style.color = "white"
pillarS2 = false;
}
//S3
if(s3Left > 1489 && s3Left < 1584
&& s3Top > 246 && s3Top < 336){
if(toggleHold == false){
//pillarL.style.opacity = "0.0";
pillarS3 = true;
}
}
else{
//pride.style.color = "white"
pillarS3 = false;
}
//S4
if(s4Left > 1489 && s4Left < 1584
&& s4Top > 246 && s4Top < 336){
if(toggleHold == false){
//pillarL.style.opacity = "0.0";
pillarS4 = true;
}
}
else{
//pride.style.color = "white"
pillarS4 = false;
}
//S5
if(s5Left > 1489 && s5Left < 1584
&& s5Top > 246 && s5Top < 336){
if(toggleHold == false){
//pillarL.style.opacity = "0.0";
pillarS5 = true;
}
}
else{
//pride.style.color = "white"
pillarS5 = false;
}
//S6
if(s6Left > 1489 && s6Left < 1584
&& s6Top > 246 && s6Top < 336){
if(toggleHold == false){
//pillarL.style.opacity = "0.0";
pillarS6 = true;
}
}
else{
//pride.style.color = "white"
pillarS6 = false;
}
//S7
if(s7Left > 1489 && s7Left < 1584
&& s7Top > 246 && s7Top < 336){
if(toggleHold == false){
//pillarL.style.opacity = "0.0";
pillarS7 = true;
}
}
else{
//pride.style.color = "white"
pillarS7 = false;
}
}
//Base-----------------------------------------------
if(changeClicked == true){
if(baseS1 == true || baseS2 == true ||
baseS3 == true || baseS4 == true || baseS5 == true
|| baseS6 == true || baseS7 == true){
dotRB.style.backgroundColor = "rgba(255,37,37,0.8)";
dotRB2.style.backgroundColor = "rgba(255,37,37,0.8)";
baseOc = true;
}
else{
dotRB.style.backgroundColor = "rgba(255,37,37,0.4)";
dotRB2.style.backgroundColor = "rgba(255,37,37,0.4)";
baseOc = false;
}
if(baseS1 == false && baseS2 == false &&
baseS3 == false && baseS4 == false
&& baseS5 == false && baseS6 == false
&& baseS7 == false){
//base.style.opacity = "1.0";
}
if(baseS1 == true){
baseInt1 = 1;
}
else{
baseInt1 = 0;
}
if(baseS2 == true){
baseInt2 = 1;
}
else{
baseInt2 = 0;
}
if(baseS3 == true){
baseInt3 = 1;
}
else{
baseInt3 = 0;
}
if(baseS4 == true){
baseInt4 = 1;
}
else{
baseInt4 = 0;
}
if(baseS5 == true){
baseInt5 = 1;
}
else{
baseInt5 = 0;
}
if(baseS6 == true){
baseInt6 = 1;
}
else{
baseInt6 = 0;
}
if(baseS7 == true){
baseInt7 = 1;
}
else{
baseInt7 = 0;
}
baseTotal = (baseInt1 + baseInt2 + baseInt3 +
baseInt4 + baseInt5 + baseInt6 + baseInt7);
console.log("baseTotal= " + baseTotal);
//S1
if(s1Left > 1304 && s1Left < 1371
&& s1Top > 682 && s1Top < 774){
if(toggleHold == false){
//base.style.opacity = "0.0";
baseS1 = true;
}
}
else{
//pride.style.color = "white";
baseS1 = false;
}
//S2
if(s2Left > 1304 && s2Left < 1371
&& s2Top > 682 && s2Top < 774){
if(toggleHold == false){
//base.style.opacity = "0.0";
baseS2 = true;
}
}
else{
//pride.style.color = "white";
baseS2 = false;
}
//S3
if(s3Left > 1304 && s3Left < 1371
&& s3Top > 682 && s3Top < 774){
if(toggleHold == false){
//base.style.opacity = "0.0";
baseS3 = true;
}
}
else{
//pride.style.color = "white";
baseS3 = false;
}
//S4
if(s4Left > 1304 && s4Left < 1371
&& s4Top > 682 && s4Top < 774){
if(toggleHold == false){
//base.style.opacity = "0.0";
baseS4 = true;
}
}
else{
//pride.style.color = "white";
baseS4 = false;
}
//S5
if(s5Left > 1304 && s5Left < 1371
&& s5Top > 682 && s5Top < 774){
if(toggleHold == false){
//base.style.opacity = "0.0";
baseS5 = true;
}
}
else{
//pride.style.color = "white";
baseS5 = false;
}
//S6
if(s6Left > 1304 && s6Left < 1371
&& s6Top > 682 && s6Top < 774){
if(toggleHold == false){
//base.style.opacity = "0.0";
baseS6 = true;
}
}
else{
//pride.style.color = "white";
baseS6 = false;
}
//S7
if(s7Left > 1304 && s7Left < 1371
&& s7Top > 682 && s7Top < 774){
if(toggleHold == false){
//base.style.opacity = "0.0";
baseS7 = true;
}
}
else{
//pride.style.color = "white";
baseS7 = false;
}
}
intTotal = (roofTotal + roomTotal
+ pillarTotal + baseTotal);
console.log("intTotal= " + intTotal);
if(baseOc == true && pillarsOc == true &&
roofOc == true && roomOc == true && intTotal == 4 && exit == false){
dotIris.classList.remove("flickerIrisM");
dotIris.classList.add("flickerIrisH");
dotIris.style.backgroundColor = "rgba(255,37,37,0.8)";
dotIris3.classList.remove("flickerIrisM");
dotIris3.classList.add("flickerIrisH");
dotIris3.style.backgroundColor = "rgba(255,37,37,0.8)";
dotIris2.classList.add("fadeIn");
dotIris2.classList.remove("hiddenClass");
done.classList.add('fadeIn');
done.classList.add('textHighlight');
done.classList.remove('hiddenClass');
done.style.zIndex = "3";
exit = true;
return;
}
if(baseOc == false || pillarsOc == false ||
roofOc == false || roomOc == false || intTotal > 4 ||
intTotal < 4){
dotIris.classList.remove("flickerIrisH");
dotIris.classList.add("flickerIrisM");
dotIris.style.backgroundColor = "rgba(255,37,37,0.4)";
dotIris3.classList.remove("flickerIrisH");
dotIris3.classList.add("flickerIrisM");
dotIris3.style.backgroundColor = "rgba(255,37,37,0.4)";
dotIris2.classList.remove("fadeIn");
dotIris2.classList.add("hiddenClass");
done.classList.add('hiddenClass');
done.classList.remove('textHighlight');
done.classList.remove('fadeIn');
done.style.zIndex = "-1";
exit = false;
}
}
function linkSwap(target){
var string = "'" + target + "'";
if(document.getElementById(target) == filter){
filter.innerHTML = "face.";
}
if(document.getElementById(target) == newEyes){
newEyes.innerHTML = "you";
}
if(document.getElementById(target) == done){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == change){
document.getElementById(target).innerHTML =
'change.';
document.getElementById(target).style.fontStyle =
"italic";
}
//document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
//document.getElementById(target).style.textDecoration = "underline overline";
console.log("Mouse is over a link. " + string );
}
function linkSwapBack(target){
var string = "'" + target + "'";
if(document.getElementById(target) == change){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
change.innerHTML = "see.";
}
if(document.getElementById(target) == filter){
filter.innerHTML = "filter.";
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
}
if(document.getElementById(target) == newEyes){
newEyes.innerHTML = "I";
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
}
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
document.getElementById(target).style.textDecoration = "none";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(baseOc == true && pillarsOc == true &&
roofOc == true && roomOc == true
&& document.getElementById(target) == done){
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show('Scope8');
return;
}
if(document.getElementById(target) == change
&& changeClicked == false){
//window.story.show('April 1st, 2056');
//window.story.show('Technology');
roof.classList.add('fadeIn');
roof.classList.remove('hiddenClass');
//roof.classList.add('flickerH');
dotLT.classList.add('flickerIrisM');
pillarL.classList.add('fadeIn');
pillarL.classList.remove('hiddenClass');
//pillarL.classList.add('flickerH');
dotRT.classList.add('flickerIrisM');
room.classList.add('fadeIn');
room.classList.remove('hiddenClass');
//room.classList.add('flickerH');
dotLB.classList.add('flickerIrisM');
base.classList.add('fadeIn');
base.classList.remove('hiddenClass');
//base.classList.add('flickerH');
dotRB.classList.add('flickerIrisM');
eye.classList.add('fadeIn');
eye.classList.remove('hiddenClass');
dotIris.classList.remove('hiddenClass');
dotIris.classList.add('flickerIrisM');
lidTop.classList.remove('fadeIn');
lidTop.classList.add('lidTIn');
lidBottom.classList.remove('fadeIn');
lidBottom.classList.add('lidBIn');
s1.classList.remove("hiddenClass");
s1.style.opacity = "0.0";
s1.classList.add("fadeIn2");
s2.classList.remove("hiddenClass");
s2.style.opacity = "0.0";
s2.classList.add("fadeIn2");
s3.classList.remove("hiddenClass");
s3.style.opacity = "0.0";
s3.classList.add("fadeIn2");
s4.classList.remove("hiddenClass");
s4.style.opacity = "0.0";
s4.classList.add("fadeIn2");
s5.classList.remove("hiddenClass");
s5.style.opacity = "0.0";
s5.classList.add("fadeIn2");
s6.classList.remove("hiddenClass");
s6.style.opacity = "0.0";
s6.classList.add("fadeIn2");
s7.classList.remove("hiddenClass");
s7.style.opacity = "0.0";
s7.classList.add("fadeIn2");
changeClicked = true;
return;
}
//if(roomPride == true || roofPride == true ||
//pillarsRPride == true || pillarsLPride == true ||
//basePride == true){
//pride.style.color = "rgb(11, 11, 11)";
//}
console.log("Mouse has clicked link. " + string);
return;
}
function grabOver(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is over grabbable link. " + string);
return;
}
function grabOut(target){
mouseOver = true;
mouseOut = false;
var string = "'" + target + "'";
console.log("Mouse is not over grabbable link. " + string);
return;
}
function grabMove(target){
grabTarget = document.getElementById(target);
grabTarget.onmousedown = function(event){
if(toggleHold == false || toggleHold == null){
toggleHold = true;
console.log("F: " + toggleHold);
return;
}
else{
toggleHold = false;
console.log("F: " + toggleHold);
return;
}
mouseUp = false;
mouseDown = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
grabTarget.onmouseup = function(event){
mouseDown = false;
mouseUp = true;
console.log("Up= " + mouseUp +
" / " +
"Down= " + mouseDown);
}
elementOffset = $(grabTarget).offset();
elementOffsetLeft = elementOffset.left;
elementOffsetTop = elementOffset.top;
elementIntLeft = grabTarget.clientWidth * 0.5;
elementIntTop = grabTarget.clientHeight * 0.5;
var string = "'" + target + "'";
console.log("Mouse has clicked link. " + string);
return;
}
function grabClick(target){
return;
}
function imageOver(target){
return;
}
function imageOut(target){
return;
}
function imageMove(target){
return;
}
function imageClick(target){
return;
}
</script>
<p id="see" class="proseClassBackground fadeIn">
This is how I <span id="change"
class="linkClass">see.</span>
<br/>
Tomorrow, I"ll wake without that familiar <span id="filter"class="linkClass noSelect">filter.</span>
<br/>
With four connections, <span id="newEyes"class="linkClass noSelect">I</span> make new eyes.
</p>
</br>
</br>
<img
src="https://dl.dropboxusercontent.com/s/9zqn97htwwjxu89/neuronHighL.png?dl=0" id="roofIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/7jjf2nbokkaw5z8/neuronHighR.png?dl=0" id="pillarLIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/nscimpax3fb44vi/neuronLowL.png?dl=0" id="roomIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/3l6bpcktrwm08e5/neuronLowR.png?dl=0" id="baseIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/znab8aspkhppvdj/eye.png?dl=0" id="eyeIMG" class="imageClass noSelect hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/tzqk5h698467dle/lid_Top.png?dl=0" id="lidTopIMG" class="imageClass noSelect fadeIn">
<img
src="https://dl.dropboxusercontent.com/s/qk232nk605e3ycf/lid_Bottom.png?dl=0" id="lidBottomIMG" class="imageClass noSelect fadeIn">
<div id="dotLT" class="imageClass flickerS">
</div>
<div id="dotRT" class="imageClass flickerS">
</div>
<div id="dotLB" class="imageClass flickerS">
</div>
<div id="dotRB" class="imageClass flickerS">
</div>
<div id="dotLT2" class="imageClass flickerS">
</div>
<div id="dotRT2" class="imageClass flickerS">
</div>
<div id="dotLB2" class="imageClass flickerS">
</div>
<div id="dotRB2" class="imageClass flickerS">
</div>
<div id="dotIris" class="imageClass hiddenClass">
</div>
<div id="dotIris2" class="imageClass hiddenClass">
</div>
<div id="dotIris3" class="imageClass hiddenClass">
</div>
<span id="s1Target"
class="proseClass linkClass noSelect grabClass hiddenClass">TEST</span>
<br/>
<br/>
<span id="s2Target"
class="proseClass linkClass noSelect grabClass hiddenClass">TEST</span>
<br/>
<br/>
<span id="s3Target"
class="proseClass linkClass noSelect grabClass hiddenClass">TEST</span>
<br/>
<br/>
<span id="s4Target"
class="proseClass linkClass noSelect grabClass hiddenClass">TEST</span>
<br/>
<br/>
<span id="s5Target"
class="proseClass linkClass noSelect grabClass hiddenClass">TEST</span>
<br/>
<br/>
<span id="s6Target"
class="proseClass linkClass noSelect grabClass hiddenClass">TEST</span>
<br/>
<br/>
<span id="s7Target"
class="proseClass linkClass noSelect grabClass hiddenClass">TEST</span>
<br/>
<br/>
<span id="done" class="proseClassBackground linkClass noSelect hiddenClass text120">IMPRINT</span>
<p id= "filler1" class="proseBackGroundClass fadeIn noSelect">
</p>
<p id= "filler2" class="proseBackGroundClass fadeIn noSelect">
</p>
<p id= "filler3" class="proseBackGroundClass fadeIn noSelect">
</p>
<p id= "filler4" class="proseBackGroundClass fadeIn noSelect">
</p>
<p id= "filler5" class="proseBackGroundClass fadeIn noSelect">
</p>
<p id= "filler6" class="proseBackGroundClass fadeIn noSelect">
</p>
<p id= "filler7" class="proseBackGroundClass fadeIn noSelect">
</p>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
</br>
<audio id="bgMusic14">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<h4 id="elementPos" class="noSelect hiddenClass">
TEST ELEMENT POS
</h4>
<div id="mark1080" class="noSelect hiddenClass">
</div>
<script>
var bgm = document.getElementById("bgMusic8");
bgm.volume = 0.5;
bgm.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
bgm.play();
var elementPos = document.getElementById("elementPos");
//var techDiv = document.getElementById("textTechnology");
var tech1 = document.getElementById("tech1");
var tech2 = document.getElementById("tech2");
var tech3 = document.getElementById("tech3");
var people = document.getElementById("people");
var time = document.getElementById("time");
var burnt = document.getElementById("burnt");
var pMary = document.getElementById("pMary");
var pMary2 = document.getElementById("pMary2");
var pMary3 = document.getElementById("pMary3");
var pDax = document.getElementById("pDax");
var pDax2 = document.getElementById("pDax2");
var pMark = document.getElementById("pMark");
var pMark2 = document.getElementById("pMark2");
var pMark3 = document.getElementById("pMark3");
chummyMary = document.getElementById("chummyMary");
networkMary = document.getElementById("networkMary");
overDax = document.getElementById("overDax");
angleDax = document.getElementById("angleDax");
ninefiveMark = document.getElementById("ninefiveMark");
homeMark = document.getElementById("homeMark");
chummyMary.style.color = "rgb(11, 11, 11)";
networkMary.style.color = "rgb(11, 11, 11)";
overDax.style.color = "rgb(11, 11, 11)";
angleDax.style.color = "rgb(11, 11, 11)";
ninefiveMark.style.color = "rgb(11, 11, 11)";
homeMark.style.color = "rgb(11, 11, 11)";
var inTime = document.getElementById("inTime");
var mom1 = document.getElementById("mom1");
var mom2 = document.getElementById("mom2");
var safe = document.getElementById("safe");
var sharing = document.getElementById("sharing");
var view = document.getElementById("view");
var failure = document.getElementById("failure");
var feel = document.getElementById("feel");
var moments = document.getElementById("moments");
var moment = document.getElementById("moment");
var moment1A = document.getElementById("moment1A");
var moment1B = document.getElementById("moment1B");
var moment1C = document.getElementById("moment1C");
var moment2A = document.getElementById("moment2A");
var moment2B = document.getElementById("moment2B");
var moment2C = document.getElementById("moment2C");
var maryNuc = document.getElementById("maryNucIMG");
var maryDot1 = document.getElementById("maryDot1");
var md1c = false;
var maryDot2 = document.getElementById("maryDot2");
var md2c = false;
var maryDot3 = document.getElementById("maryDot3");
var md3c = false;
var daxNuc = document.getElementById("daxNucIMG");
var daxDot1 = document.getElementById("daxDot1");
var dd1c = false;
var daxDot2 = document.getElementById("daxDot2");
var dd2c = false;
var markNuc = document.getElementById("markNucIMG");
var markDot1 = document.getElementById("markDot1");
var kd1c = false;
var markDot2 = document.getElementById("markDot2");
var kd2c = false;
var markDot3 = document.getElementById("markDot3");
var kd3c = false;
var neuronMary = document.getElementById("neuronMaryIMG");
var neuronDax = document.getElementById("neuronDaxIMG");
var neuronMark = document.getElementById("neuronMarkIMG");
var receptorT = document.getElementById("receptTIMG");
var receptorM = document.getElementById("recepMIMG");
var receptorB = document.getElementById("recepBIMG");
tapMary = 0;
tapDax = 0;
tapMark = 0;
var phase1 = false;
var phase2 = false;
var feelActive = false;
var done = false;
window.onmousemove = function(e){
posX = e.pageX;
posY = e.pageY;
elementPos.innerHTML =
"posX= " +
posX +
" / " +
"posY= " +
posY;
}
function linkSwap(target){
var string = "'" + target + "'";
if(phase1 == false){
if(document.getElementById(target) == burnt){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == i){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == surprised){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == everyone){
people.style.opacity = " 1.0";
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == th){
document.getElementById(target).innerHTML =
'the NoöScope';
}
if(document.getElementById(target) == wait){
document.getElementById(target).innerHTML =
'It just takes time.';
document.getElementById(target).style.fontStyle =
"italic";
tech1.classList.add('fadeIn2');
time.classList.remove('fadeIn');
time.classList.add('fadeOut');
//var techTimeout = setTimeout(start, 2000);
//function start(){
//console.log("Timers started.")
//var curr = 0.0;
//var currMinus = 1.0;
//var add = 0.0;
//var addMinus = 1.0;
//var fix = 0.0;
//var fixMinus = 1.0;
//var addMinus = 1.0;
//var string = "";
//var stringMinus = "";
//if(done === false){
//done = true;
//var techInterval =
//setInterval(reveal,1000/24);
//function reveal(){
//console.log("Curr:" + curr);
//add = curr += 0.014;
//addMinus = currMinus -= 0.014;
//fix = add.toFixed(3);
//fixMinus = addMinus.toFixed(3);
//string = fix.toString();
//stringMinus = fixMinus.toString();
//curr = parseFloat(fix);
//currMinus = parseFloat(fixMinus);
//tech1.style.opacity = string;
//time.style.opacity = stringMinus;
//console.log("string:" + string + "/"
//+ "opacity: " + tech1.style.opacity);
//console.log("New:" + add + "/" + fix);
//if(curr >= 1.0){
//clearInterval(techInterval);
//clearTimeout(techTimeout);
//done = true;
//console.log("Timers ended.");
//return;
//}
//}
//}
//else{
//return;
//}
//}
}
}
if(phase1 == true){
if(document.getElementById(target) == ferocity){
document.getElementById(target).innerHTML =
"passion";
}
if(document.getElementById(target) == homeMark){
document.getElementById(target).innerHTML =
"free-standing, designer establishment.";
document.getElementById(target).style.fontStyle = "italic";
}
if(document.getElementById(target) == chummyMary){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == networkMary){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == overDax){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == angleDax){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == ninefiveMark){
document.getElementById(target).style.fontStyle =
"italic";
}
}
if(phase2 == true){
if(document.getElementById(target) == moments){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == feel){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == sharing){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == safe){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == moment){
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == sharing){
document.getElementById(target).innerHTML =
"consuming";
}
}
//document.getElementById(target).style.fontStyle = "italic";
document.getElementById(target).style.color = "red";
console.log("Mouse is over a link. " + string );
}
function linkSwapBack(target){
var string = "'" + target + "'";
if(phase1 == false){
if(document.getElementById(target) == everyone){
document.getElementById(target).innerHTML =
"Your";
burnt.style.opacity = " 1.0";
}
if(document.getElementById(target) == burnt){
document.getElementById(target).style.fontStyle
= "normal";
}
if(document.getElementById(target) == wait){
document.getElementById(target).innerHTML =
'Wait.';
}
if(document.getElementById(target) == everyone){
people.style.opacity = " 0.0";
document.getElementById(target).style.fontStyle
= "italic";
}
if(document.getElementById(target) == th){
document.getElementById(target).innerHTML =
"this";
}
}
if(phase1 == true){
if(document.getElementById(target) == ferocity){
document.getElementById(target).innerHTML =
"ferocity";
}
if(document.getElementById(target) == homeMark){
document.getElementById(target).innerHTML =
"home.";
}
}
if(phase2 == true){
if(document.getElementById(target) == sharing){
document.getElementById(target).innerHTML =
"sharing";
}
}
document.getElementById(target).style.fontStyle =
"normal";
document.getElementById(target).style.color =
"white";
document.getElementById(target).style.textDecoration =
"none";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(phase1 == false){
if(document.getElementById(target) == i){
tech3.style.opacity = "1.0" ;
}
if(document.getElementById(target) == surprised){
tech2.style.opacity = "1.0";
}
}
if(document.getElementById(target) == burnt){
if(phase1 == false){
tech1.classList.remove('fadeIn2');
tech1.style.opacity = "0.0";
tech2.style.opacity = "0.0";
tech3.style.opacity = "0.0";
tech1.style.zIndex = "-1";
tech2.style.zIndex = "-1";
tech3.style.zIndex = "-1";
burnt.classList.add('fadeIn');
burnt.style.top = "404px";
burnt.style.left = "-196px";
pMary.classList.add('fadeIn');
pMary.classList.remove('hiddenClass');
pMary.style.zIndex = "3";
//pDax.classList.remove('hiddenClass');
//pDax.style.opacity = "0.0";
//pDax.classList.add('fadeIn1');
//pMark.classList.remove('hiddenClass');
//pMark.style.opacity = "0.0";
//pMark.classList.add('fadeIn2');
phase1 = true;
return;
}
if(phase1 == true){
burnt.style.opacity = "0.0";
burnt.style.zIndex = "-1";
pMary.style.opacity = "0.0";
pMary2.style.opacity = "0.0";
pMary3.style.opacity = "0.0";
pDax.style.opacity = "0.0";
pDax2.style.opacity = "0.0";
pMark.style.opacity = "0.0";
pMark2.style.opacity = "0.0";
pMark3.style.opacity = "0.0";
pMary.style.zIndex = "-1";
chummyMary.classList.remove('linkClass');
networkMary.classList.remove('linkClass');
overDax.classList.remove('linkClass');
angleDax.classList.remove('linkClass');
ninefiveMark.classList.remove('linkClass');
homeMark.classList.remove('linkClass');
ferocity.classList.remove('linkClass');
pMary2.style.zIndex = "-1";
pMary3.style.zIndex = "-1";
pDax.style.zIndex = "-1";
pDax2.style.zIndex = "-1";
pMark.style.zIndex = "-1";
pMark2.style.zIndex = "-1";
pMark3.style.zIndex = "-1";
inTime.classList.add('fadeIn');
inTime.classList.remove('hiddenClass');
maryNuc.classList.add('flickerS');
maryNuc.classList.remove('hiddenClass');
daxNuc.classList.add('flickerS');
daxNuc.classList.remove('hiddenClass');
markNuc.classList.add('flickerS');
markNuc.classList.remove('hiddenClass');
pMary.style.top = "-605px";
pMary.style.left = "55px";
pMary.classList.remove('proseClass');
pMary.classList.add('proseClassBackground');
pMary.classList.add('flickerS');
pMary2.style.top = "-605px";
pMary2.style.left = "55px";
pMary2.classList.remove('proseClass');
pMary2.classList.add('proseClassBackground');
pMary2.classList.add('flickerS');
pMary3.style.top = "-605px";
pMary3.style.left = "55px";
pMary3.classList.remove('proseClass');
pMary3.classList.add('proseClassBackground');
pMary3.classList.add('flickerS');
pDax.style.top = "-662px";
pDax.style.left = "205px";
pDax.classList.remove('proseClass');
pDax.classList.add('proseClassBackground');
pDax.classList.add('flickerS');
pDax2.style.top = "-662px";
pDax2.style.left = "205px";
pDax2.classList.remove('proseClass');
pDax2.classList.add('proseClassBackground');
pDax2.classList.add('flickerS');
pMark.style.top = "-705px";
pMark.style.left = "0px";
pMark.classList.remove('proseClass');
pMark.classList.add('proseClassBackground');
pMark.classList.add('flickerS');
pMark2.style.top = "-705px";
pMark2.style.left = "0px";
pMark2.classList.remove('proseClass');
pMark2.classList.add('proseClassBackground');
pMark2.classList.add('flickerS');
pMark3.style.top = "-705px";
pMark3.style.left = "0px";
pMark3.classList.remove('proseClass');
pMark3.classList.add('proseClassBackground');
pMark3.classList.add('flickerS');
phase2 = true;
return;
//window.story.show("April 1st, 2056");
}
}
//if(document.getElementById(target) == this){
//window.story.show("Scope");
//}
if(phase1 == true){
if(document.getElementById(target) == chummyMary){
pDax.classList.add('fadeIn');
pDax.classList.remove('hiddenClass');
pDax.style.zIndex = "3";
}
if(document.getElementById(target) == networkMary){
pMark.classList.add('fadeIn');
pMark.classList.remove('hiddenClass');
pMark.style.zIndex = "3";
}
if(document.getElementById(target) == overDax){
pMary2.classList.add('fadeIn');
pMary2.classList.remove('hiddenClass');
pMary2.style.zIndex = "3";
}
if(document.getElementById(target) == angleDax){
pMary3.classList.add('fadeIn');
pMark3.classList.remove('hiddenClass');
pMary3.style.zIndex = "3";
pMark3.classList.add('fadeIn');
pMary3.classList.remove('hiddenClass');
pMark3.style.zIndex = "3";
}
if(document.getElementById(target) == ninefiveMark){
pDax2.classList.add('fadeIn');
pDax2.classList.remove('hiddenClass');
pDax2.style.zIndex = "3";
}
if(document.getElementById(target) == homeMark){
pMark2.classList.add('fadeIn');
pMark2.classList.remove('hiddenClass');
pMark2.style.zIndex = "3";
}
}
if(phase2 == true){
if(document.getElementById(target) == moments){
mom1.classList.add('fadeIn');
mom1.classList.remove('hiddenClass');
moment1A.classList.remove('hiddenClass');
moment1A.style.opacity = "0.0";
moment1A.classList.add('fadeIn1');
moment1B.classList.remove('hiddenClass');
moment1B.style.opacity = "0.0";
moment1B.classList.add('fadeIn2');
moment1C.classList.remove('hiddenClass');
moment1C.style.opacity = "0.0";
moment1C.classList.add('fadeIn3');
maryNuc.classList.remove('flickerS');
maryNuc.classList.add('flickerM');
daxNuc.classList.remove('flickerS');
daxNuc.classList.add('flickerM');
markNuc.classList.remove('flickerS');
markNuc.classList.add('flickerM');
pMary.classList.remove('flickerS');
pMary.classList.add('flickerM');
pMary2.classList.remove('flickerS');
pMary2.classList.add('flickerM');
pMary3.classList.remove('flickerS');
pMary3.classList.add('flickerM');
pDax.classList.remove('flickerS');
pDax.classList.add('flickerM');
pDax2.classList.remove('flickerS');
pDax2.classList.add('flickerM');
pMark.classList.remove('flickerS');
pMark.classList.add('flickerM');
pMark2.classList.remove('flickerS');
pMark2.classList.add('flickerM');
pMark3.classList.remove('flickerS');
pMark3.classList.add('flickerM');
}
if(document.getElementById(target) == safe){
mom2.classList.add('fadeIn');
mom2.classList.remove('hiddenClass');
}
if(document.getElementById(target) == moment){
moment2A.classList.add('fadeIn');
moment2A.classList.remove('hiddenClass');
moment2B.classList.remove('hiddenClass');
moment2B.style.opacity = "0.0";
moment2B.classList.add('fadeIn1');
moment2C.classList.remove('hiddenClass');
moment2C.style.opacity = "0.0";
moment2C.classList.add('fadeIn2');
maryNuc.classList.remove('flickerM');
maryNuc.classList.add('flickerH');
maryOverlay.classList.remove('hiddenClass');
maryOverlay.classList.add('neuroF');
daxNuc.classList.remove('flickerM');
daxNuc.classList.add('flickerH');
daxOverlay.classList.remove('hiddenClass');
daxOverlay.classList.add('neuroF');
markNuc.classList.remove('flickerM');
markNuc.classList.add('flickerH');
markOverlay.classList.remove('hiddenClass');
markOverlay.classList.add('neuroF');
maryNuc.classList.remove('flickerM');
maryNuc.classList.add('flickerH');
maryOverlay.classList.remove('hiddenClass');
maryOverlay.classList.add('neuroF');
daxNuc.classList.remove('flickerM');
daxNuc.classList.add('flickerH');
daxOverlay.classList.remove('hiddenClass');
daxOverlay.classList.add('neuroF');
markNuc.classList.remove('flickerM');
markNuc.classList.add('flickerH');
markOverlay.classList.remove('hiddenClass');
markOverlay.classList.add('neuroF');
pMary.classList.remove('flickerM');
pMary.classList.add('flickerH');
pMary2.classList.remove('flickerM');
pMary2.classList.add('flickerH');
pMary3.classList.remove('flickerM');
pMary3.classList.add('flickerH');
pDax.classList.remove('flickerM');
pDax.classList.add('flickerH');
pDax2.classList.remove('flickerM');
pDax2.classList.add('flickerH');
pMark.classList.remove('flickerM');
pMark.classList.add('flickerH');
pMark2.classList.remove('flickerM');
pMark2.classList.add('flickerH');
pMark3.classList.remove('flickerM');
pMark3.classList.add('flickerH');
}
if(document.getElementById(target) == feel){
failure.classList.add('fadeIn');
failure.classList.remove('hiddenClass');
view.classList.remove('hiddenClass');
view.style.opacity = "0.0";
view.classList.add('fadeIn2');
maryDot1.classList.remove('hiddenClass');
maryDot1.classList.add('neuroF');
maryDot2.classList.remove('hiddenClass');
maryDot2.classList.add('neuroF');
maryDot3.classList.remove('hiddenClass');
maryDot3.classList.add('neuroF');
daxDot1.classList.remove('hiddenClass');
daxDot1.classList.add('neuroF');
daxDot2.classList.remove('hiddenClass');
daxDot2.classList.add('neuroF');
markDot1.classList.remove('hiddenClass');
markDot1.classList.add('neuroF');
markDot2.classList.remove('hiddenClass');
markDot2.classList.add('neuroF');
markDot3.classList.remove('hiddenClass');
markDot3.classList.add('neuroF');
neuronMary.classList.add('fadeIn2');
neuronDax.classList.add('fadeIn2');
neuronMark.classList.add('fadeIn2');
feelActive = true;
}
if(document.getElementById(target) == sharing){
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Scope5");
}
}
console.log("Mouse has clicked link. " + string);
return;
}
function imageOver(target){
if(feelActive == true){
if(document.getElementById(target) == maryDot1
&& md1c == false){
document.getElementById(target)
.classList.remove('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgb(79, 203, 241)";
return;
}
if(document.getElementById(target) == maryDot2
&& md2c == false){
document.getElementById(target)
.classList.remove('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgb(79, 203, 241)";
return;
}
if(document.getElementById(target) == maryDot3
&& md3c == false){
document.getElementById(target)
.classList.remove('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgb(79, 203, 241)";
return;
}
if(document.getElementById(target) == daxDot1
&& dd1c == false){
document.getElementById(target)
.classList.remove('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgb(79, 203, 241)";
return;
}
if(document.getElementById(target) == daxDot2
&& dd2c == false){
document.getElementById(target)
.classList.remove('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgb(79, 203, 241)";
return;
}
if(document.getElementById(target) == markDot1
&& kd1c == false){
document.getElementById(target)
.classList.remove('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgb(79, 203, 241)";
return;
}
if(document.getElementById(target) == markDot2
&& kd2c == false){
document.getElementById(target)
.classList.remove('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgb(79, 203, 241)";
return;
}
if(document.getElementById(target) == markDot3
&& kd3c == false){
document.getElementById(target)
.classList.remove('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgb(79, 203, 241)";
return;
}
}
}
function imageOut(target){
if(feelActive == true){
if(document.getElementById(target) == maryDot1
&& md1c == false){
document.getElementById(target)
.classList.add('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgba(255,255,255,0.1)";
return;
}
if(document.getElementById(target) == maryDot2
&& md2c == false){
document.getElementById(target)
.classList.add('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgba(255,255,255,0.1)";
return;
}
if(document.getElementById(target) == maryDot3
&& md3c == false){
document.getElementById(target)
.classList.add('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgba(255,255,255,0.1)";
return;
}
if(document.getElementById(target) == daxDot1
&& dd1c == false){
document.getElementById(target)
.classList.add('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgba(255,255,255,0.1)";
return;
}
if(document.getElementById(target) == daxDot2
&& dd2c == false){
document.getElementById(target)
.classList.add('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgba(255,255,255,0.1)";
return;
}
if(document.getElementById(target) == markDot1
&& kd1c == false){
document.getElementById(target)
.classList.add('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgba(255,255,255,0.1)";
return;
}
if(document.getElementById(target) == markDot2
&& kd2c == false){
document.getElementById(target)
.classList.add('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgba(255,255,255,0.1)";
return;
}
if(document.getElementById(target) == markDot3
&& kd3c == false){
document.getElementById(target)
.classList.add('neuroF');
document.getElementById(target)
.style.backgroundColor = "rgba(255,255,255,0.1)";
return;
}
}
}
function imageMove(target){
return;
}
function imageClick(target){
if(feelActive == true){
if(document.getElementById(target) == maryDot1
&& md1c == false){
//PLAY TEXT ANIM
//PLAY DOT ANIM document.getElementById(target).classList.remove('neuroF');
document.getElementById(target).style.opacity = "0.0";
//document.getElementById(target).classList.add('shakeDelete');
pMary.classList.remove('fadeIn');
pMary.classList.remove('flickerH');
pMary.classList.add('shakeDelete');
inTime.classList.remove('textHighlight');
inTime.innerHTML = 'Finally, you fling yourself through two barriers - out into the fresh air to spread your wings.';
inTime.classList.add('textHighlight');
mom1.classList.remove('textHighlight');
mom1.innerHTML = 'Safety is overrated - celebrate the rush on the way down to whatever.';
mom1.classList.add('textHighlight');
if(tapMary == 0){
maryNuc.classList.remove('flickerH');
maryNuc.classList.add('flickerM');
tapMary = 1;
md1c = true;
return;
}
if(tapMary == 1){
maryNuc.classList.remove('flickerM');
maryNuc.classList.add('flickerS');
tapMary = 2;
md1c = true;
return;
}
if(tapMary == 2){
maryNuc.classList.remove('flickerS');
maryNuc.classList.add('fadeOut');
tapMary = 3;
md1c = true;
return;
}
}
if(document.getElementById(target) == maryDot2){
//PLAY TEXT ANIM
//PLAY DOT ANIM document.getElementById(target).classList.remove('neuroF'); document.getElementById(target).style.opacity = "0.0";
//document.getElementById(target).classList.add('shakeDelete');
pMary2.classList.remove('fadeIn');
pMary2.classList.remove('flickerH');
pMary2.classList.add('shakeDelete');
//moment1A.opacity = "1.0";
//moment1A.classList.remove('textHighlight');
//moment1A.classList.add('textHighlight');
moment1A.innerHTML = 'Who knows what it means to be in control; we"re just people, mucking around in the heads of other people.';
//moment1B.opacity = "1.0";
//moment1B.classList.remove('textHighlight');
//moment1B.classList.add('textHighlight');
moment1B.innerHTML = 'I Know that you can catch yourself, and that others will catch you.';
//moment1C.opacity = "1.0";
//moment1C.classList.remove('textHighlight');
//moment1C.classList.add('textHighlight');
moment1C.innerHTML = 'I know that guts and glory will allow me to self-determine.';
if(tapMary == 0){
maryNuc.classList.remove('flickerH');
maryNuc.classList.add('flickerM');
tapMary = 1;
md2c = true;
return;
}
if(tapMary == 1){
maryNuc.classList.remove('flickerM');
maryNuc.classList.add('flickerS');
tapMary = 2;
md2c = true;
return;
}
if(tapMary == 2){
maryNuc.classList.remove('flickerS');
maryNuc.classList.add('fadeOut');
tapMary = 3;
md2c = true;
return;
}
return;
}
if(document.getElementById(target) == maryDot3){
//PLAY TEXT ANIM
//PLAY DOT ANIM document.getElementById(target).classList.remove('neuroF');
document.getElementById(target).style.opacity = "0.0";
//document.getElementById(target).classList.add('shakeDelete');
pMary3.classList.remove('fadeIn');
pMary3.classList.remove('flickerH');
pMary3.classList.add('shakeDelete');
//mom2.classList.remove('textHighlight');
//mom2.classList.add('textHighlight');
mom2.innerHTML = 'It doesn"t matter how sweet, things eventually end.';
//moment2A.classList.remove('textHighlight');
//moment2A.classList.add('textHighlight');
moment2A.innerHTML = 'That"s okay. When it"s your time, it"s your time.';
//moment2B.classList.remove('textHighlight');
//moment2B.classList.add('textHighlight');
moment2B.innerHTML = 'Know when you can relax and face the music with a grin.';
//moment2C.classList.remove('textHighlight');
//moment2C.classList.add('textHighlight');
moment2C.innerHTML = 'Promise yourself that you can be satisfied when it"s over.';
if(tapMary == 0){
maryNuc.classList.remove('flickerH');
maryNuc.classList.add('flickerM');
tapMary = 1;
md3c = true;
return;
}
if(tapMary == 1){
maryNuc.classList.remove('flickerM');
maryNuc.classList.add('flickerS');
tapMary = 2;
md3c = true;
return;
}
if(tapMary == 2){
maryNuc.classList.remove('flickerS');
maryNuc.classList.add('fadeOut');
tapMary = 3;
md3c = true;
return;
}
return;
}
if(document.getElementById(target) == daxDot1){
//PLAY TEXT ANIM
//PLAY DOT ANIM document.getElementById(target).classList.remove('neuroF');
document.getElementById(target).style.opacity = "0.0";
//document.getElementById(target).classList.add('shakeDelete');
pDax.classList.remove('fadeIn');
pDax.classList.remove('flickerH');
pDax.classList.add('shakeDelete');
//inTime.classList.remove('textHighlight');
//inTime.classList.add('textHighlight');
inTime.innerHTML = 'Opening that particular door came in two steps - and some help from outside.';
//mom1.classList.remove('textHighlight');
//mom1.classList.add('textHighlight');
mom1.innerHTML = 'Step one is a dream - awakening your own curiousity.';
//moment1A.classList.remove('textHighlight');
//moment1A.classList.add('textHighlight');
moment1A.innerHTML = "You explore based on your intuition; open to novel experiences."
//moment1B.classList.remove('textHighlight');
//moment1B.classList.add('textHighlight');
moment1B.innerHTML = 'Intuition tells you that there is never a face value - there"s always a keyhole to peer through.';
//moment1C.classList.remove('textHighlight');
//moment1C.classList.add('textHighlight');
moment1C.innerHTML = 'Intuition shows you that if the door can be locked, it can also be broken open.';
if(tapDax == 0){
daxNuc.classList.remove('flickerH');
daxNuc.classList.add('flickerS');
dd1c = true;
tapDax =1;
return;
}
if(tapDax == 1){
daxNuc.classList.remove('flickerS');
daxNuc.classList.add('fadeOut');
dd1c = true;
tapDax =2;
return;
}
}
if(document.getElementById(target) == daxDot2){
//PLAY TEXT ANIM
//PLAY DOT ANIM document.getElementById(target).classList.remove('neuroF');
document.getElementById(target).style.opacity = "0.0";
//document.getElementById(target).classList.add('shakeDelete');
pDax2.classList.remove('fadeIn');
pDax2.classList.remove('flickerH');
pDax2.classList.add('shakeDelete');
//mom2.classList.remove('textHighlight');
//mom2.classList.add('textHighlight');
mom2.innerHTML = 'Step two are the tools; the means to disregard locks.';
//moment2A.classList.remove('textHighlight');
//moment2A.classList.add('textHighlight');
moment2A.innerHTML = 'Tools can be people or things - certain substances specifically.';
//moment2B.classList.remove('textHighlight');
//moment2B.classList.add('textHighlight');
moment2B.innerHTML = 'It"s not like I"m antisocial, I"ve just always preferred option two.';
//moment2C.classList.remove('textHighlight');
//moment2C.classList.add('textHighlight');
moment2C.innerHTML = 'Mastery of the tools is earned through experimentation and insight into yourself.';
if(tapDax == 0){
daxNuc.classList.remove('flickerH');
daxNuc.classList.add('flickerS');
dd2c = true;
tapDax =1;
return;
}
if(tapDax == 1){
daxNuc.classList.remove('flickerS');
daxNuc.classList.add('fadeOut');
dd2c = true;
tapDax =2;
return;
}
}
if(document.getElementById(target) == markDot1){
//PLAY TEXT ANIM
//PLAY DOT ANIM document.getElementById(target).classList.remove('neuroF');
document.getElementById(target).style.opacity = "0.0";
//document.getElementById(target).classList.add('shakeDelete');
pMark.classList.remove('fadeIn');
pMark.classList.remove('flickerH');
pMark.classList.add('shakeDelete');
//inTime.classList.remove('textHighlight');
//inTime.classList.add('textHighlight');
inTime.innerHTML = 'I"d like to make two points - they might seem like shitty excuses, but hear me out.';
//mom1.classList.remove('textHighlight');
//mom1.classList.add('textHighlight');
mom1.innerHTML = 'Point one: It"s easy to let your work reflect too directly on you.';
if(tapMark == 0){
markNuc.classList.remove('flickerH');
markNuc.classList.add('flickerM');
tapMark =1;
kd1c = true;
return;
}
if(tapMark == 1){
markNuc.classList.remove('flickerM');
markNuc.classList.add('flickerS');
tapMark =2;
kd1c = true;
return;
}
if(tapMark == 2){
markNuc.classList.remove('flickerS');
markNuc.classList.add('fadeOut');
tapMark =3;
kd1c = true;
return;
}
}
if(document.getElementById(target) == markDot2){
//PLAY TEXT ANIM
//PLAY DOT ANIM document.getElementById(target).classList.remove('neuroF');
document.getElementById(target).style.opacity = "0.0";
//document.getElementById(target).classList.add('shakeDelete');
pMark2.classList.remove('fadeIn');
pMark2.classList.remove('flickerH');
pMark2.classList.add('shakeDelete');
//moment1A.classList.remove('textHighlight');
//moment1A.classList.add('textHighlight');
moment1A.innerHTML = 'We"re here because we are willing to give people the service they want. They don"t own you.';
//moment1B.classList.remove('textHighlight');
//moment1B.classList.add('textHighlight');
moment1B.innerHTML = 'It"s ok. You come first. The people you care about come first.';
//moment1C.classList.remove('textHighlight');
//moment1C.classList.add('textHighlight');
moment1C.innerHTML = 'You owe it to yourself to take my advice.';
if(tapMark == 0){
markNuc.classList.remove('flickerH');
markNuc.classList.add('flickerM');
tapMark =1;
kd2c = true;
return;
}
if(tapMark == 1){
markNuc.classList.remove('flickerM');
markNuc.classList.add('flickerS');
tapMark =2;
kd2c = true;
return;
}
if(tapMark == 2){
markNuc.classList.remove('flickerS');
markNuc.classList.add('fadeOut');
tapMark =3;
kd2c = true;
return;
}
return;
}
if(document.getElementById(target) == markDot3){
//PLAY TEXT ANIM
//PLAY DOT ANIM document.getElementById(target).classList.remove('neuroF');
document.getElementById(target).style.opacity = "0.0";
//document.getElementById(target).classList.add('shakeDelete');
pMark3.classList.remove('fadeIn');
pMark3.classList.remove('flickerH');
pMark3.classList.add('shakeDelete');
mom2.classList.remove('textHighlight');
mom2.classList.add('textHighlight');
mom2.innerHTML = "Point two: Find something else to care about."
moment2A.classList.remove('textHighlight');
moment2A.classList.add('textHighlight');
moment2A.innerHTML = 'The world won"t carry you into the annals of history. There"s a real world beyond that field of stars.';
moment2B.classList.remove('textHighlight');
moment2B.classList.add('textHighlight');
moment2B.innerHTML = 'Find someone to remember you as you live.';
moment2C.classList.remove('textHighlight');
moment2C.classList.add('textHighlight');
moment2C.innerHTML = 'Find someone to carry you after you pass.';
if(tapMark == 0){
markNuc.classList.remove('flickerH');
markNuc.classList.add('flickerM');
tapMark =1;
kd3c = true;
return;
}
if(tapMark == 1){
markNuc.classList.remove('flickerM');
markNuc.classList.add('flickerS');
tapMark =2;
kd3c = true;
return;
}
if(tapMark == 2){
markNuc.classList.remove('flickerS');
markNuc.classList.add('fadeOut');
tapMark =3;
kd3c = true;
return;
}
}
}
}
</script>
<h4 id="elementPos" class="noSelect hiddenClass">
TEST ELEMENT POS
</h4>
<p id="time" class="proseClass fadeIn">
<span id="wait" class="linkClass">Watch.</span>
</br>
</br>
...
</br>
</br>
Why is this relevant?
</p>
</br>
</br>
</br>
<p id="tech1" class="proseClass hiddenClass">
Oh, right.
</br>
</br>
Because I"m <span id="surprised" class="linkClass">surprised</span> that <span id="th"
class=" linkClass">this</span> hasn"t deliberately been used to kill anyone.
</p>
</br>
</br>
</br>
<p id="tech2" class="proseClass hiddenClass">
...
</br>
</br>
I"m surprised that <span id="i" class="linkClass">I</span> haven"t killed anyone.
</p>
</br>
</br>
</br>
<p id="tech3" class="proseClass hiddenClass">
I"ve got this sinking feeling that it"s only a matter of time.
</br>
</br>
<span id="everyone" class="linkClass">everyone"s</span> number eventually comes up.
</p>
</br>
</br>
<p id="people" class="proseClass hiddenClass">
Dax. Mary. Mark. All smiles.
</p>
<span id="burnt" class="proseClass linkClass hiddenClass">All burnt.
</span>
<br/>
<p id="pMary" class="hiddenClass proseClass noSelect">
Mary was definitely the most fun.
<br/>
I joined the group last - it was clear that there was an air between the three of them that I wasn"t catching. I"m
not sure how long I would have stagnated on the sidelines
if she hadn"t made it a point to be <span id="chummyMary" class="linkClass">chummy</span> towards me.
</p>
<br/>
<p id="pMary3" class="hiddenClass proseClass noSelect">
Sometimes I wonder if she was hiding something - the others had a far lower tolerance for her brand of clinginess.
</p>
<p id="pMary2" class="hiddenClass proseClass noSelect"> Still, she was fearless as they come; the weaponised <span
id="ferocity" class="linkClass">ferocity</span> that she
fired across<br/> our <span id="networkMary"
class="linkClass">network</span> during some of her
infamous spats prove as much.
</p>
<br/>
<br/>
<br/>
<p id="pDax" class="hiddenClass proseClass noSelect">
Dax was the quiet one - and there"s always one.
<br/>
Maybe if we hadn"t been so <span id="overDax"
class="linkClass">overbearing</span> at times he"d have let us in a bit more.
Get him either truly engaged about a topic, or catch him on something, and the story changes.
</p>
<br/>
<p id="pDax2" class="hiddenClass proseClass noSelect">
Dax was at his best when it was late and quiet. Mark would
have bugged out for the day - familial responsibilities, and Mary would be bashing her head against
a tough client. Without warning, a new <span id="angleDax"
class="linkClass">angle</span> would emerge. I made sure to stick around for those evenings.
</p>
<br/>
<br/>
<br/>
<p id="pMark" class="proseClass hiddenClass noSelect">
Mark was the den mother.
<br/>
Literally - as in working <span id="ninefiveMark"
class="linkClass">nine to five</span> from an actual den in
his actual four person <span id="homeMark"
class="linkClass">home.
</p>
<p id="pMark2" class="hiddenClass proseClass noSelect">
He made a killing during the early years of diving for
corporate until deciding that suits were less important than the two offspring you hardly see.
It always amazed us how this man found the time to do all
the things he did.
</p>
<p id="pMark3" class="hiddenClass proseClass noSelect">
He mentioned his kids often, but not in a normal way. It sounded more like he was trying to re-assure himself.
<br/>
We were an escape from married life.
</p>
<br/>
<br/>
<br/>
<p id="inTime" class="proseClass hiddenClass noSelect">
<br/>
In time, you work towards two <span id="moments" class="linkClass">moments</span> - dealing with the consequences in spite of the feeling.
</p>
<br/>
<br/>
<p id="mom1" class="proseClass hiddenClass noSelect">
The first is the realisation that you"re good enough.
</p>
<br/>
<br/>
<span id="moment1A" class="proseClass noSelect hiddenClass">
After the learning curve, you"re a
benefit rather than a hazard.
</span>
<br/>
<span id="moment1B" class="proseClass noSelect hiddenClass">
Good enough to admit the need to keep learning.
</span>
<br/>
<span id="moment1C" class="proseClass noSelect hiddenClass">
Good enough not to feel <span id="safe" class="linkClass">safe.</span>
</span>
<br/>
<br/>
<br/>
<p id="mom2" class="proseClass hiddenClass noSelect">
The second <span id="moment" class="linkClass">moment</span> comes much later down the line.
</p>
<br/>
<br/>
<span id="moment2A" class="proseClass noSelect hiddenClass">
You"re the best you"ve ever been.
</span>
<br/>
<span id="moment2B" class="proseClass noSelect hiddenClass">
Too good not to want more - to face that you should peak.
</span>
<br/>
<span id="moment2C" class="proseClass noSelect hiddenClass">
Too good to <span id="feel" class="linkClass">feel</span> uncomfortable.
</span>
<br/>
<br/>
<p id="failure" class="proseClass hiddenClass noSelect">
There"s just too many failure points.<br/>Too many stars streaking through the sky; and no lens vast enough<br/>to spot the ones heading right for you.
<br/>
<br/>
By the scope, by my hand, by your head <br/><br/>- a link will be snipped that can"t be un-snipped.
<br/>
<br/>
<br/>
...
<br/>
<br/>
<br/>
<span id="view" class="hiddenClass">
This is my bond. <span id="sharing" class="linkClass">sharing</span> it warms me.
</span>
</p>
<div id="maryOverlay" class="imageClass hiddenClass">
</div>
<div id="maryDot1" class="imageClass hiddenClass mouseImage">
</div>
<div id="maryDot2" class="imageClass hiddenClass mouseImage">
</div>
<div id="maryDot3" class="imageClass hiddenClass mouseImage">
</div>
<img
src="https://dl.dropboxusercontent.com/s/ba5o3vj8wz5wbnm/frameCircleCR.png?dl=0" id="maryNucIMG" class="imageClass noSelect hiddenClass">
<div id="daxOverlay" class="imageClass hiddenClass">
</div>
<div id="daxDot1" class="imageClass hiddenClass mouseImage">
</div>
<div id="daxDot2" class="imageClass hiddenClass mouseImage">
</div>
<img
src="https://dl.dropboxusercontent.com/s/ba5o3vj8wz5wbnm/frameCircleCR.png?dl=0" id="daxNucIMG" class="imageClass noSelect hiddenClass">
<div id="markOverlay" class="imageClass hiddenClass">
</div>
<div id="markDot1" class="imageClass hiddenClass mouseImage">
</div>
<div id="markDot2" class="imageClass hiddenClass mouseImage">
</div>
<div id="markDot3" class="imageClass hiddenClass mouseImage">
</div>
<img
src="https://dl.dropboxusercontent.com/s/ba5o3vj8wz5wbnm/frameCircleCR.png?dl=0" id="markNucIMG" class="imageClass noSelect hiddenClass">
<audio id="bgMusic8">
<source
src="https://dl.dropboxusercontent.com/s/ma7y129l1f22zbz/NooDriver_Loop.ogg?dl=0" type="audio/ogg">
</audio>
<img
src="https://dl.dropboxusercontent.com/s/aur1iyt66xqd76c/neuronMary.png?dl=0" id="neuronMaryIMG" class="imageClass noSelect
hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/4b2li9zed1wjuzl/neuronDax.png?dl=0" id="neuronDaxIMG" class="imageClass noSelect
hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/s8kjvpavggjorrd/neuronMark.png?dl=0" id="neuronMarkIMG" class="imageClass noSelect
hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/gdks757t7xvbdol/receptorTop.png?dl=0" id="recepTIMG" class="imageClass noSelect mark hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/1w0mw3geqm8beip/receptorMiddle.png?dl=0" id="recepMIMG" class="imageClass noSelect mark hiddenClass">
<img
src="https://dl.dropboxusercontent.com/s/nbpbkxn65syoi9a/receptorBottom.png?dl=0" id="recepBIMG" class="imageClass noSelect mark hiddenClass">
<div id="mark1080" class="noSelect hiddenClass">
</div>
<script>
var bgm = document.getElementById("bgMusic15");
bgm.volume = 0.5;
bgm.loop = true;
//bgm.load();
if(sessionStorage.audioMark != null){
bgm.currentTime = sessionStorage.audioMark;
}
//bgm.play();
var pEnd = document.getElementById("pEnd");
var start = document.getElementById("start");
function linkSwap(target){
document.getElementById(target).style.fontStyle =
"italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == start){
//DO
console.log("time= " + bgm.currentTime);
sessionStorage.audioMark = bgm.currentTime;
var resumeTime = sessionStorage.audioMark;
console.log("sessionTime =" + resumeTime);
window.story.show("Instructions");
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<p id="pEnd" class="proseClassScope scopeClass noSelect flickerH text120">
The door slides open, and you step out onto the platform.
<br/>
<br/>
Catch another <span id="start" class="linkClass noSelect">ride?</span>
</p>
<audio id="bgMusic15">
<source
src="https://dl.dropboxusercontent.com/s/34mtwukiejvfnvu/Ambience_Subway.wav?dl=0" type="audio/wav">
</audio>
<audio id="bgMusicB">
<script>
var pInstructions = document.getElementById("pInstructions");
var play = document.getElementById("play");
var swap = document.getElementById("swap");
var show = document.getElementById("show");
var ryan = document.getElementById("ryan");
var bgm = document.getElementById("bgMusic");
bgm.volume = 0.4;
bgm.loop = true;
window.onload = function(){
console.log("Window has loaded.");
bgm.load();
//bgm.play();
}
function linkSwap(target){
if(document.getElementById(target) == play){
//DO
document.getElementById(target).style.fontStyle =
"italic";
}
if(document.getElementById(target) == swap){
//DO
//document.getElementById(target).style.fontStyle =
"italic";
swap.innerHTML = "Or this.";
}
if(document.getElementById(target) == show){
//DO
//document.getElementById(target).style.fontStyle =
"italic";
ryan.classList.add("fadeIn");
ryan.classList.remove("hiddenClass");
}
//document.getElementById(target).style.fontStyle =
"italic";
document.getElementById(target).style.color = "red";
var string = "'" + target + "'";
console.log("Mouse is over a link. " + string );
return;
}
function linkSwapBack(target){
document.getElementById(target).style.fontStyle = "normal";
document.getElementById(target).style.color = "white";
if(document.getElementById(target) == swap){
//DO
//document.getElementById(target).style.fontStyle =
"italic";
swap.innerHTML = "Such as this.";
}
if(document.getElementById(target) == show){
//DO
//document.getElementById(target).style.fontStyle =
"italic";
ryan.classList.remove("fadeIn");
ryan.classList.add("hiddenClass");
}
var string = "'" + target + "'";
console.log("Mouse is not over a link. " + string);
return;
}
function linkClick(target){
var string = "'" + target + "'";
if(document.getElementById(target) == play){
//DO
window.story.show("Scope1");
return;
}
console.log("Mouse has clicked link. " + string);
return;
}
</script>
<p id="pInstructions" class="proseClass scopeClass noSelect fadeIn text120">
Welcome to the Noöweb customer service <span id="show" class="linkClass noSelect">department.</span>
<br/>Please hit F11 for full screen mode on your input device if you haven"t already.
<br/>
<br/>Depending on resolution, you may need to adjust zoom level till text is centered with Ctrl + or Ctrl -
<br/> We sincerely apologise to users affected by low resolution devices.
<br/>
<br/>
<span id="ryan" class="linkClass noSelect hiddenClass">AKA Ryan - Please stop sending me personal ticket requests.</span>
<br/>
<br/>
Please scan, explore, and feel all text and images carefully, and consider the purpose of each station.
<br/>Please refrain from dragging the mouse
<br/>- only regular clicking and hovering over will be required.
<br/>
Clicking Italicised links trigger actions that reveal more information or progress to the next station.
<br/>
Use these last, when you think you have finished exploring.
<br/>
Hovering over non-italicised links trigger variable word meanings.
<br/>
<br/>
<span id="swap" class="linkClass noSelect">Such as this.</span>
<br/>
<br/>
When you are ready, please <span id="play" class="linkClass noSelect">board.</span>
<br/>
<br/>
Please keep your arms, legs, and wits aboard at all times.
</p>
<audio id="bgMusic">
<source
src="https://dl.dropboxusercontent.com/s/34mtwukiejvfnvu/Ambience_Subway.wav?dl=0" type="audio/wav">
</audio>