JavaScript is required. Please enable it to continue.
Your browser lacks required capabilities. Please upgrade it or switch to another to continue.
Loading…
<<nobr>> <h1>clean CLEAN clean</h1> <!-- <img class="grfx" src="img/mockup.png">--> <img class="grfx transparent" src="img/bg.png"> <img class="grfx puddle" id="puddle" src="img/puddle.png"> <span id=water></span> <img class="grfx faucet" src="img/faucet.png"> <img class="grfx tabcold" id="tab-cold" src="img/tab-cold.png"> <img class="grfx tabhot" id="tab-hot" src="img/tab-hot.png"> <div id="LHC" class="delay"> <!-- LEFT HAND NEUTRAL POSE --> <img class="grfx hand" id="L-neutral" src="img/hand-L-neutral.png"> <img class="grfx hand" id="L-neutral-dirty" src="img/hand-L-neutral-dirt.png"> <img class="grfx hand" id="L-neutral-wet" src="img/hand-L-neutral-water.png"> <img class="grfx hand" id="L-neutral-soapy" src="img/hand-L-neutral-soap.png"> <!-- LEFT HAND WASH POSE --> <img class="grfx hand" id="L-wash" src="img/hand-L-wash.png"> <img class="grfx hand" id="L-wash-dirty" src="img/hand-L-wash-dirt.png"> <img class="grfx hand" id="L-wash-wet" src="img/hand-L-wash-water.png"> <img class="grfx hand" id="L-wash-soapy" src="img/hand-L-wash-soap.png"> </div> <img class="grfx soap" id="soap" src="img/soap.png"> <img class="grfx towel" id="towel" src="img/towel.png"> <img class="grfx towel dirty" id="dirtyTowel" src="img/towel-dirty.png"> <div id="RHC"> <!-- RIGHT HAND NEUTRAL POSE --> <img class="grfx hand" id="R-neutral" src="img/hand-R-neutral.png"> <img class="grfx hand" id="R-neutral-dirty" src="img/hand-R-neutral-dirt.png"> <img class="grfx hand" id="R-neutral-wet" src="img/hand-R-neutral-water.png"> <img class="grfx hand" id="R-neutral-soapy" src="img/hand-R-neutral-soap.png"> <!-- RIGHT HAND INTERACTIVE/POINT POSE --> <img class="grfx hand" id="R-interactive" src="img/hand-R-interactive.png"> <img class="grfx hand" id="R-interactive-dirty" src="img/hand-R-interactive-dirt.png"> <img class="grfx hand" id="R-interactive-wet" src="img/hand-R-interactive-water.png"> <img class="grfx hand" id="R-interactive-soapy" src="img/hand-R-interactive-soap.png"> <!-- RIGHT HAND GRAB POSE --> <img class="grfx hand" id="R-grab" src="img/hand-R-grab.png"> <img class="grfx hand" id="R-grab-dirty" src="img/hand-R-grab-dirt.png"> <img class="grfx hand" id="R-grab-wet" src="img/hand-R-grab-water.png"> <img class="grfx hand" id="R-grab-soapy" src="img/hand-R-grab-soap.png"> <!-- RIGHT HAND DROP POSE --> <img class="grfx hand" id="R-drop" src="img/hand-R-drop.png"> <img class="grfx hand" id="R-drop-dirty" src="img/hand-R-drop-dirt.png"> <img class="grfx hand" id="R-drop-wet" src="img/hand-R-drop-water.png"> <img class="grfx hand" id="R-drop-soapy" src="img/hand-R-drop-soap.png"> </div> <img class="grfx frameL transparent" src="img/frame-left.png"> <img class="grfx frameT transparent" src="img/frame-top.png"> <img class="grfx frameB transparent" src="img/frame-bottom.png"> <img class="grfx frameR transparent" src="img/frame-right.png"> <br><br><br><br><br><br><br><br><br><br><br><div id="info">hello</div> <<script>> /* CLICK STUFF */ $(document).ready(function(){ $(document).mousedown(function() { State.variables.Rpose = 2; var carrySoap = State.variables.carrySoap; if (carrySoap) { State.variables.carrySoap = false; new Wikifier(null, '<<playSound dropsoap>>'); } var carryTowel = State.variables.carryTowel; if (carryTowel) { State.variables.carryTowel = false; new Wikifier(null, '<<playSound drying stop>>'); } }); $("#tab-cold").click(function(){ new Wikifier(null, '<<detectClick tab-cold>>'); }); $("#tab-hot").click(function(){ new Wikifier(null, '<<detectClick tab-hot>>'); }); $("#soap").click(function(){ new Wikifier(null, '<<toggleSoap>>'); }); $('#dirtyTowel').click(function(){ new Wikifier(null, '<<toggleTowel>>'); }); $("#soap").mouseover(function(){ State.variables.Rpose = 1; }); $("#soap").mouseout(function(){ State.variables.Rpose = 0; }); $("#towel").mouseover(function(){ State.variables.Rpose = 1; new Wikifier(null, '<<playSound drying>>'); }); $("#towel").mouseout(function(){ State.variables.Rpose = 0; }); $("#tab-hot").mouseover(function(){ State.variables.Rpose = 1; }); $("#tab-hot").mouseout(function(){ State.variables.Rpose = 0; }); $("#tab-cold").mouseover(function(){ State.variables.Rpose = 1; }); $("#tab-cold").mouseout(function(){ State.variables.Rpose = 0; }); /* Toggle hand-washing state */ $("#water").mouseover(function(){ State.variables.Lpose = 1; new Wikifier(null, '<<wash on>>'); }); $("#water").mouseout(function(){ State.variables.Lpose = 0; new Wikifier(null, '<<wash off>>'); }); }); $(document).on('mousemove', function(e){ /* MOVE RIGHT HAND ACCORDING TO MOUSE POINTER */ /* limit how far up right hand can follow mouse pointer */ var rightHandY = 0; var rightHandX = e.pageX+2; if (e.pageY < 120) { rightHandY = 120; } else { rightHandY = e.pageY+2; } /* move right hand so its closer to the soap. could also just move the soap now i guess */ /* var carrySoap = State.variables.carrySoap; if (carrySoap) { rightHandY -= 50; rightHandX -= 20; } */ $('#RHC').offset({ top: rightHandY, left: rightHandX }); /* MOVE LEFT HAND ACCORDING TO WHAT RIGHT HAND DOES */ var lefthandY = 0; if (e.pageY < 260){ lefthandY = -e.pageY+600; } else { lefthandY = e.pageY+50; } var lefthandX = 0; var flip = 550; if (e.pageX < flip){ lefthandX = e.pageX-flip+500; } else { lefthandX = -e.pageX+flip+500; } $('#LHC').offset({ top: lefthandY, left: lefthandX }); /* ADJUST CLIPPING OF RIGHT HAND TO BACKGROUND */ var mTop = 118 - rightHandY; var mWidth = 254 - e.pageX + 856; var mHeight = 668 - rightHandY; var mLeft = 164 - e.pageX; $('#R-neutral').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-neutral-dirty').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-neutral-wet').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-neutral-soapy').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-interactive').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-interactive-dirty').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-interactive-wet').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-interactive-soapy').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-grab').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-grab-dirty').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-grab-wet').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-grab-soapy').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-drop').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-drop-dirty').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-drop-wet').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-drop-soapy').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); /* ADJUST CLIPPING OF LEFT HAND TO BACKGROUND */ State.variables.LHeight = 668 - lefthandY; State.variables.LLeft = 154 - lefthandX; /* new Wikifier(null, '<<printing "height: ' + State.variables.LHeight + ', left: ' + State.variables.LLeft+ '">>'); */ mHeight = 658 - lefthandY; mLeft = 164 - lefthandX; $('#L-neutral').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-neutral-dirty').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-neutral-wet').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-neutral-soapy').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-wash').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-wash-dirty').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-wash-wet').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-wash-soapy').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); /* ATTACH TOWEL */ var carryTowel = State.variables.carryTowel; if (carryTowel){ $('#towel').offset({ top: rightHandY+25, left: rightHandX-50 }); $('#dirtyTowel').offset({ top: rightHandY+25, left: rightHandX-45 }); /* REDUCE WETNESS, SOAPINESS AND DIRTINESS IF HANDS ARE DIRTY or SOAPI, MAKE TOWEL DIRTY */ State.variables.wetness = State.variables.wetness - 0.5; State.variables.soapiness = State.variables.soapiness - 0.5; State.variables.dirtiness = State.variables.dirtiness - 0.2; if (State.variables.dirtiness > 0 || State.variables.soapiness > 0) { State.variables.towelDirtiness = State.variables.towelDirtiness + 0.1; $('#dirtyTowel').css('opacity', (State.variables.towelDirtiness/100)); /* new Wikifier(null, '<<printing "towel dirtiness: ' +State.variables.towelDirtiness+'">>'); */ } } /* ATTACH SOAP AND BUBBLES TO HAND IF IT HAS BEEN CLICKED */ var carrySoap = State.variables.carrySoap; if (carrySoap) { $('#soap').offset({ top: rightHandY+50, left: rightHandX+20 }); } /* IF HANDS ARE WET AND CARRYING SOAP SHOW BUBBLES, REDUCE DIRT AND INCREASE SOAP */ var wetness = State.variables.wetness; if (carrySoap && wetness > 0) { $('#bubbles').css('opacity', '100'); /* INCREASE SOAPINESS AND DECREASE DIRTINESS*/ State.variables.soapiness = State.variables.soapiness + 0.5; State.variables.dirtiness = State.variables.dirtiness - 0.5; } else { $('#bubbles').css('opacity', '0'); } /* LIMIT MIN & MAX OF SOAPINESS & DIRTINESS */ if (State.variables.soapiness > 100) {State.variables.soapiness = 100;} if (State.variables.dirtiness < 0) {State.variables.dirtiness = 0;} /* PRINT MOUSE POINTER / LEFT HAND COORDINATES */ /*new Wikifier(null, '<<printing "x: ' + e.pageX + ', y: ' + e.pageY+ '">>'); */ }); <</script>> <<silently>><<repeat 0.1s>><<update>><</repeat>><<timed 0.1s>><<set document.getElementById("tab-cold").style.transform = "rotate(0deg)">><<set document.getElementById("tab-hot").style.transform = "rotate(0deg)">><</timed>><</silently>> <<audio "mood" loop play>> <<audio "water1" loop play>> <<audio "water1" volume 0>> <<audio "water2" loop play>> <<audio "water2" volume 0>> <<audio "washing" loop play>> <<audio "washing" volume 0>> <<audio "soaping" loop play>> <<audio "soaping" volume 0>> <<audio "hot" volume 0 loop play>> <<audio "cold" volume 0 loop play>> <</nobr>>
<<widget playSound>> <<set _sound to $args[0]>> <<set _state to $args[1]>> <<if _sound is "dropsoap">> <<audio "dropsoap" play>> <<audio "soaping" stop>> <</if>> <<if _sound is "drying" and _state is "stop">> <<audio "drying" fadeoverto 0.2 0>> <</if>> <</widget>> <<widget setupAudio>> <<audio "mood" volume 0.2 loop play>> <</widget>> <<widget printing>> <<replace "#info">>$args[0]<</replace>> <</widget>> <<widget update>> <<set $timer += 1>> <<if $timer > 0>> <<setupAudio>> <</if>> <!-- WIN CONDITION --> <<if $dirtiness <= 0 and $soapiness <= 0 and $wetness <=0 and $coldwater is 0 and $hotwater is 0 and $carrySoap is false and $carryTowel is false>> <<goto "SparklingClean">> <</if>> <<if $washingHands>> <<set $wetness += 1>> <<set $soapiness -= 1>> <<set _vol to ($coldwater + $hotwater)*0.1>> <<audio "washing" volume _vol loop play>> <<if $temperature >= 60>> <<audio "hot" volume 1 loop play>> <<elseif $temperature <= 40>> <<audio "cold" volume 1 loop play>> <<else>> <<audio "hot" volume 0>> <<audio "cold" volume 0>> <</if>> <<else>> <<set $wetness -= 0.03>> <<audio "washing" volume 0>> <<audio "hot" volume 0>> <<audio "cold" volume 0>> <</if>> <<if $wetness > 100>> <<set $wetness to 100>> <</if>> <<if $wetness < 0>> <<set $wetness to 0>> <</if>> <<if $soapiness > 100>> <<set $soapiness to 100 <</if>> <<if $soapiness < 0>> <<set $soapiness to 0 <</if>> <<if $dirtiness < 0>> <<set $dirtiness to 0 <</if>> <!-- <<if ($coldwater + $hotwater) > 0>> <<set _link to "<img class='grfx water' src='img/waterstream" + random(1,4) + ".png'">> <<replace "#water">>_link<</replace>> <<printing _link>> <</if>> --> <<if $coldwater > 0 || $hotwater > 0>> <<set $puddle += 3>> <<set document.getElementById("puddle").style.animation = "zooming 1s infinite ease-in-out">> <<else>> <<set $puddle -= 2>> <<if $puddle < 100 and $puddle > 96>> <<set document.getElementById("puddle").style.animation = "shrinking 20s">> <</if>> <<if $puddle < 10 and $puddle > 6>> <<audio "drain" play>> <</if>> <</if>> <<if $puddle > 100>> <<set $puddle to 100>> <<elseif $puddle < 0>> <<set $puddle to 0>> <</if>> <<set document.getElementById("puddle").style.opacity = $puddle/100>> <<replace "#wetness">><progress @value=$wetness max="100"></progress><</replace>> <<replace "#soapiness">><progress @value=$soapiness max="100"></progress><</replace>> <<replace "#dirtiness">><progress @value=$dirtiness max="100"></progress><</replace>> <<turnAllHandsOff>> <<set _pose to "">> <<if $Lpose is 0>> <!-- neutral --> <<set _pose to "neutral">> <<set document.getElementById("L-neutral").style.opacity = "1">> <<elseif $Lpose is 1>> <!-- wash --> <<set _pose to "wash">> <<set document.getElementById("L-wash").style.opacity = "1">> <</if>> <<set _id to "L-" + _pose + "-dirty">> <<set document.getElementById(_id).style.opacity = $dirtiness/100>> <<set _id to "L-" + _pose + "-wet">> <<set document.getElementById(_id).style.opacity = $wetness/100>> <<set _id to "L-" + _pose + "-soapy">> <<set document.getElementById(_id).style.opacity = $soapiness/100>> <<if $carrySoap || $carryTowel>> <<set $Rpose to 2>> <</if>> <<if $carryTowel>> <<audio "drying" loop play>> <<audio "drying" fadeoverto 0.2 0.4>> <</if>> <<if $carrySoap and $wetness > 5>> <<audio "soaping" loop play>> <<audio "soaping" fadeoverto 0.2 1>> <<else>> <<audio "soaping" fadeoverto 1 0>> <<audio "soaping" stop>> <</if>> <<if $Rpose is 0>> <!-- neutral --> <<set _pose to "neutral">> <<set document.getElementById("R-neutral").style.opacity = "1">> <<elseif $Rpose is 1>> <!-- point/interact --> <<set _pose to "interactive">> <<set document.getElementById("R-interactive").style.opacity = "1">> <<elseif $Rpose is 2>> <!-- grab --> <<set _pose to "grab">> <<set document.getElementById("R-grab").style.opacity = "1">> <<elseif $Rpose is 3>> <!-- drop --> <<set _pose to "drop">> <<set document.getElementById("R-drop").style.opacity = "1">> <</if>> <<set _id to "R-" + _pose + "-dirty">> <<set document.getElementById(_id).style.opacity = $dirtiness/100>> <<set _id to "R-" + _pose + "-wet">> <<set document.getElementById(_id).style.opacity = $wetness/100>> <<set _id to "R-" + _pose + "-soapy">> <<set document.getElementById(_id).style.opacity = $soapiness/100>> <!-- CLIP THE LEFT HAND --> <!-- <<set document.getElementById('L-neutral').style.clip = "rect(0px 250px "+ $LHeight +"px "+ $LLeft +"px)">> <<set document.getElementById('L-neutral-dirty').style.clip = "rect(0px 250px "+ $LHeight +"px "+ $LLeft +"px)">> <<set document.getElementById('L-neutral-wet').style.clip = "rect(0px 250px "+ $LHeight +"px "+ $LLeft +"px)">> <<set document.getElementById('L-neutral-soapy').style.clip = "rect(0px 250px "+ $LHeight +"px "+ $LLeft +"px)">> --> <</widget>> <<widget turnAllHandsOff>> <<set document.getElementById("L-neutral").style.opacity = "0">> <<set document.getElementById("L-neutral-dirty").style.opacity = "0">> <<set document.getElementById("L-neutral-wet").style.opacity = "0">> <<set document.getElementById("L-neutral-soapy").style.opacity = "0">> <<set document.getElementById("L-wash").style.opacity = "0">> <<set document.getElementById("L-wash-dirty").style.opacity = "0">> <<set document.getElementById("L-wash-wet").style.opacity = "0">> <<set document.getElementById("L-wash-soapy").style.opacity = "0">> <<set document.getElementById("R-neutral").style.opacity = "0">> <<set document.getElementById("R-neutral-dirty").style.opacity = "0">> <<set document.getElementById("R-neutral-wet").style.opacity = "0">> <<set document.getElementById("R-neutral-soapy").style.opacity = "0">> <<set document.getElementById("R-interactive").style.opacity = "0">> <<set document.getElementById("R-interactive-dirty").style.opacity = "0">> <<set document.getElementById("R-interactive-wet").style.opacity = "0">> <<set document.getElementById("R-interactive-soapy").style.opacity = "0">> <<set document.getElementById("R-grab").style.opacity = "0">> <<set document.getElementById("R-grab-dirty").style.opacity = "0">> <<set document.getElementById("R-grab-soapy").style.opacity = "0">> <<set document.getElementById("R-grab-wet").style.opacity = "0">> <<set document.getElementById("R-drop").style.opacity = "0">> <<set document.getElementById("R-drop-dirty").style.opacity = "0">> <<set document.getElementById("R-drop-soapy").style.opacity = "0">> <<set document.getElementById("R-drop-wet").style.opacity = "0">> <</widget>> <<widget wash>> <<if $args[0] is "on">> <<set $washingHands to true>> <<set $Lpose to 1>> <<else>> <<set $washingHands to false>> <<set $Lpose to 0>> <</if>> <</widget>> <<widget toggleSoap>> <<if $carrySoap>> <<set $carrySoap to false>> <<set $Rpose to 3>> <<else>> <<set $carrySoap to true>> <<set $Rpose to 2>> <</if>> <</widget>> <<widget toggleTowel>> <<set _txt to "towel ">> <<if $carryTowel>> <<set $carryTowel to false>> <<set _txt += "dropped.">> <<set $Rpose to 3>> <<else>> <<set $carryTowel to true>> <<set _txt += "picked up.">> <<set $Rpose to 2>> <</if>> <<replace "#info">>_txt<</replace>> <</widget>> <<widget detectClick>> <<set _text to "clicked " + $args[0] + "<br>">> <<if #args[0] == "towel">> <</if>> <<if $args[0] == "tab-cold">> <<set $coldwater++>> <<if $coldwater > 5>> <<set $coldwater to 0>> <</if>> <<set document.getElementById("tab-cold").style.transform = "rotate(" + ($coldwater * 30) + "deg)">> <<set _text += "coldwater is " + $coldwater>> <<elseif $args[0] is "tab-hot">> <<set $hotwater++>> <<if $hotwater > 5>> <<set $hotwater to 0>> <</if>> <<set document.getElementById("tab-hot").style.transform = "rotate(" + ($hotwater * 30) + "deg)">> <<set _text += "hotwater is " + $coldwater>> <</if>> <<if $coldwater > 0 || $hotwater > 0>> <<replace "#water">><img class="grfx water" src="img/waterstream1.png"><</replace>> <<set $temperature to 50 + (8 * $hotwater) + (-8 * $coldwater)>> <<replace "#temperature">><progress @value=$temperature max="100"></progress><</replace>> <<else>> <<replace "#water">><</replace>> <<set $temperature to 50>> <<replace "#temperature">><progress @value=$temperature max="100"></progress><</replace>> <</if>> <<set _pressure to $coldwater + $hotwater>> <<set _volume to _pressure * 0.1>> <<set _text += ", pressure is " + _pressure>> <<audio "water1" fadeoverto 1 _volume>> <<if _pressure is 1>> <<set _text += " and water starts running">> <!--<<audio "water1" fadeoverto 1 0.5>>--> <<elseif _pressure is 0>> <<set _text += " and water is off.">> <<audio "water1" fadeoverto 1 0>> <</if>> <<if _pressure > 0>> <<set _num to random(1,4)>> <<switch _num>> <<case 1>> <<audio "open1" volume 0.3 play>> <<case 2>> <<audio "open2" volume 0.3 play>> <<case 3>> <<audio "open3" volume 0.3 play>> <<case 4>> <<audio "open4" volume 0.3 play>> <</switch>> <<else>> <<set _num to random(1,2)>> <<switch _num>> <<case 1>> <<audio "close1" play>> <<case 2>> <<audio "close2" play>> <</switch>> <</if>> <<replace "#info">>_text<</replace>> <<timed 1s>><<replace "#info">><</replace>><</timed>> <</widget>>
<<nobr>> <h1>[[Go again|Reset]]</h1> <img class="grfx transparent" id="bg" src="img/bg.png"> <img class="grfx puddle" id="puddle" src="img/puddle.png"> <span id=water></span> <img class="grfx faucet" src="img/faucet.png"> <img class="grfx tabcold" id="tab-cold" src="img/tab-cold.png"> <img class="grfx tabhot" id="tab-hot" src="img/tab-hot.png"> <img class="grfx soap" id="soap" src="img/soap.png"> <<if $towelDirtiness is 0>> <img class="grfx towel" id="towel" src="img/towel.png"> <</if>> <img class="grfx shine" id="shine" src="img/win-bg.png"> <<if $towelDirtiness > 0>> <<timed 10s>><<audio "shame" play>> <img class="grfx shame" id="dirtyTowel" src="img/towelofshame.png"> <</timed>> <</if>> <img class="grfx title" id="title" src="img/win-title.png"> <div id="LHC" class="delay"> <img class="grfx hand" id="L-neutral" src="img/hand-L-neutral.png"> <!--<img class="grfx hand" id="L-wash" src="img/hand-L-wash.png">--> <img class="grfx stars" src="img/stars.gif"> </div> <div id="RHC"> <img class="grfx hand" id="R-neutral" src="img/hand-R-neutral.png"> <!--<img class="grfx hand" id="R-drop" src="img/hand-R-drop.png">--> <img class="grfx stars" src="img/stars.gif"> </div> <img class="grfx frameL transparent" src="img/frame-left.png"> <img class="grfx frameT transparent" src="img/frame-top.png"> <img class="grfx frameB transparent" src="img/frame-bottom.png"> <img class="grfx frameR transparent" src="img/frame-right.png"> <h1>[[Go again|Reset]]</h1> <<script>> $(document).on('mousemove', function(e){ /* MOVE RIGHT HAND ACCORDING TO MOUSE POINTER */ /* limit how far up right hand can follow mouse pointer */ var rightHandY = 0; var rightHandX = e.pageX+2; if (e.pageY < 120) { rightHandY = 120; } else { rightHandY = e.pageY+2; } /* move right hand so its closer to the soap. could also just move the soap now i guess */ /* var carrySoap = State.variables.carrySoap; if (carrySoap) { rightHandY -= 50; rightHandX -= 20; } */ $('#RHC').offset({ top: rightHandY, left: rightHandX }); /* MOVE LEFT HAND ACCORDING TO WHAT RIGHT HAND DOES */ var lefthandY = 0; if (e.pageY < 260){ lefthandY = -e.pageY+600; } else { lefthandY = e.pageY+50; } var lefthandX = 0; var flip = 550; if (e.pageX < flip){ lefthandX = e.pageX-flip+500; } else { lefthandX = -e.pageX+flip+500; } $('#LHC').offset({ top: lefthandY, left: lefthandX }); /* ADJUST CLIPPING OF RIGHT HAND TO BACKGROUND */ var mTop = 118 - rightHandY; var mWidth = 254 - e.pageX + 856; var mHeight = 668 - rightHandY; var mLeft = 164 - e.pageX; $('#R-neutral').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-neutral-dirty').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-neutral-wet').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-neutral-soapy').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-interactive').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-interactive-dirty').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-interactive-wet').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-interactive-soapy').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-grab').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-grab-dirty').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-grab-wet').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-grab-soapy').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-drop').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-drop-dirty').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-drop-wet').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); $('#R-drop-soapy').css('clip', 'rect(' + mTop + 'px, '+mWidth+'px, '+mHeight+'px, '+mLeft+'px)'); /* ADJUST CLIPPING OF LEFT HAND TO BACKGROUND */ State.variables.LHeight = 668 - lefthandY; State.variables.LLeft = 154 - lefthandX; mHeight = 658 - lefthandY; mLeft = 164 - lefthandX; $('#L-neutral').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-neutral-dirty').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-neutral-wet').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-neutral-soapy').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-wash').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-wash-dirty').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-wash-wet').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); $('#L-wash-soapy').css('clip', 'rect(0px, 250px, '+mHeight+'px, '+mLeft+'px)'); /* PRINT MOUSE POINTER / LEFT HAND COORDINATES */ /*new Wikifier(null, '<<printing "x: ' + e.pageX + ', y: ' + e.pageY+ '">>'); */ }); <</script>> <<timed 1s>><<audio "sparkle1" play>><</timed>> <<audio "sparkle2" volume 1 loop play>> <<audio "sparkle2" fadeoverto 20 0>> <<repeat 3s>> <<set _num to random(1,5)>> <<switch _num>> <<case 1>> <<audio "win1" play>> <<case 2>> <<audio "win2" play>> <<case 3>> <<audio "win3" play>> <<case 4>> <<audio "win4" play>> <<case 5>> <<audio "win5" play>> <</switch>> <</repeat>> <</nobr>>
<<cacheaudio "mood" "sounds/mood.mp3">> <<cacheaudio "water1" "sounds/waterrunning1.mp3">> <<cacheaudio "water2" "sounds/waterrunning2.mp3">> <<cacheaudio "washing" "sounds/hands-washing.mp3">> <<cacheaudio "drying" "sounds/hands-drying.mp3">> <<cacheaudio "soaping" "sounds/hands-soaping.mp3">> <<cacheaudio "drain" "sounds/drain.mp3">> <<cacheaudio "dropsoap" "sounds/drop-soap2.mp3">> <<cacheaudio "dropsoap2" "sounds/drop-soap3.mp3">> <<cacheaudio "open1" "sounds/faucet/faucet-open1.mp3">> <<cacheaudio "open2" "sounds/faucet/faucet-open2.mp3">> <<cacheaudio "open3" "sounds/faucet/faucet-open3.mp3">> <<cacheaudio "open4" "sounds/faucet/faucet-open4.mp3">> <<cacheaudio "close1" "sounds/faucet/faucet-close1.mp3">> <<cacheaudio "close2" "sounds/faucet/faucet-close2.mp3">> <<cacheaudio "sparkle1" "sounds/win/clean.mp3">> <<cacheaudio "sparkle2" "sounds/win/sparkle2.mp3">> <<cacheaudio "shame" "sounds/win/shame.mp3">> <<cacheaudio "win1" "sounds/win/1.mp3">> <<cacheaudio "win2" "sounds/win/2.mp3">> <<cacheaudio "win3" "sounds/win/3.mp3">> <<cacheaudio "win4" "sounds/win/4.mp3">> <<cacheaudio "win5" "sounds/win/5.mp3">> <<cacheaudio "hot" "sounds/hot.mp3">> <<cacheaudio "cold" "sounds/cold.mp3">> <<set $coldwater to 0>> <<set $hotwater to 0>> <<set $carrySoap to false>> <<set $carryTowel to false>> <<set $washingHands to false>> <<set $dirtiness to 100>> <<set $towelDirtiness to 0>> <<set $temperature to 50>> <<set $soapiness to 0>> <<set $wetness to 0>> <<set $puddle to 0>> <<set $Lpose to 0>> <<set $Rpose to 0>> <<set $LHeight to 0>> <<set $LLeft to 0>> <<set $timer to 0>>
<<set $dirtiness to 100>> <<set $towelDirtiness to 0>> <<audio "sparkle2" stop>> <<goto "bathroom">>