Your browser lacks required capabilities. Please upgrade it or switch to another to continue.
Loading…
,,,<<cacheaudio "intro-EN" "./src/audio/Intro_EN.mp3">>
<<cacheaudio "intro-NL" "./src/audio/Intro_NL.mp3">>
<<cacheaudio "tap" "./src/audio/Tap.wav">>
<<cacheaudio "tap0" "./src/audio/tap0.mp3">>
<<cacheaudio "tap1" "./src/audio/tap1.mp3">>
<<cacheaudio "tap2" "./src/audio/tap2.mp3">>
<<cacheaudio "tap3" "./src/audio/tap3.mp3">>
<<cacheaudio "tap4" "./src/audio/tap4.mp3">>
<<cacheaudio "tap5" "./src/audio/tap5.mp3">>
<<cacheaudio "tap6" "./src/audio/tap6.mp3">>
<<cacheaudio "tap7" "./src/audio/tap7.mp3">>
<<cacheaudio "tap8" "./src/audio/tap8.mp3">>
<<waitforaudio>>
<<set $duration to 0>>
<<set $progress to 0>>
<<set $EN to true>>
/* Introduction prompts */
<<set $introprompts = ["Walk in a spiral, one person starting from the inside and the other starting from the outside", "Pretend you're iceskating", "The tallest player closes their eyes and the shortest player guides them while narrating the surroundings", "Pretend one player's right leg is tied to the other's left leg and walk as normally as possible", "Stand back to back and try to sit down"]>>
/* Prompts new*/
<<set $mission1 = ["Stand still and trace the 360° skyline with your finger", "Avoid walking on any sidewalks or "official" paths", "Walk as slowly as possible", "Observe your surroundings through a mirrored surface", "Balance something on your head while walking", "Smell objects in the street and describe them to each other", "Pick up an object from the ground and create a way to showcase it", "Leave behind a breadcrumb trail", "Climb up something", "Tie each other's shoelaces together"]>>
<<set $mission2 = ["Walk backwards over a pedestrian crossing", "Wear your shirt or jacket backwards", "Figure out which direction the wind is blowing and walk in that direction", "Kick some trash around and make it into a competition", "Greet everyone you pass", "Occupy an empty parking spot", "Follow a pigeon as long as you can without scaring it", "Stumble and stagger exaggeratedly like you're under the influence", "Walk in a straight line as long as possible and figure out how to pass through anything in your "way"", "Run like a T-Rex"]>>
<<set $mission3 = ["Keep your tongue out while walking", "Treat this space like your own private property", "Play "chicken" with people you pass on the sidewalk", "Make a sexy pose in front of a non-photogenic object and take a picture", "Wave at someone walking alone in the distance", "Stand still in the middle of a walkway for four minutes", "Switch a piece of clothing with your partner for the rest of the game", "Read out loud any graffiti you see", "Sit down in the middle of a walkway", "Read out texts on commercial signs as if they were poetry", "Pretend to dramatically bump into each other while walking from different directions"]>>
<<set $mission4 = ["Hide in the bushes until someone notices you", "Observe an ordinary object in a way that makes it seem extraordinary", "Run your fingers along things you pass with great intimacy", "Do a footrace towards the nearest tree - best two out of three wins", "Stand still at a pedestrian crossing and wait for the third green light before you cross.", "Find a way to observe your surroundings upside down", "Pretend the floor is lava and die a dramatic stage death if you lose", "Describe every item in a shop window", "Walk together as if one of you is arresting the other", "Ring the bells of parked bicycles", "Pretend you're a traffic cop and signal cars and pedestrians with your arms"]>>
<<set $mission5 = ["Pick a fight with a public, inanimate object, like a tree or wall", "Lean against wall or pole and describe passers-by out loud", "Laugh out loud and point every time you see the color red", "Decide which breed of dog you are and play "fetch" with each other", "If you hear a loud noise, make an even louder noise", "Agree that all farts must be announced for the rest of the game", "Do a competition of who can spit furthest away", "Pretend to have a loud argument about what makes good public art", "Lay down here for a nap", "Be the animal paparazzi and ask them questions with an imaginary mic", "Walk barefoot for the next two rounds"]>>
<<set $mission6 = ["Ask a stranger if you can walk their dog", "Challenge a stranger to a rock paper scissors match", "Ask for directions to a shop that sells instant happiness", "Start a serious conversation with a child you don't know", "Ring a doorbell and ask for directions to the nearest jail", "Ask someone wearing blue to give you life advice", "Ask people waiting for the next bus or tram if it will go to paradise", "Be the supervisor of a trashcan and interact with people throwing things away", "Ask a stranger if you can ride their bike", "Run next to a jogger", "Challenge a stranger to a foot-race"]>>
<<set $mission7 = ["Discuss loudly what you like about each other", "Slowly take off a piece of clothing", "Have a throwing contest with things you find on the ground", "Applaud everyone who walks past", "Do a celebratory dance every time you see dog poo", "Make exaggerated gestures while you speak for the next five minutes", "Find the nearest security camera and serenade it", "Pretend to call each other on the phone while walking next to each other", "If you see a mural, give it a ruthless art critique"]>>
<<set $mission8 = ["Sing a song you both know while you walk", "Make a portrait of each other with something you've found", "Make everything you do for the next 5 minutes a competition", "Storm a playground and go down the slide together", "When you encounter someone busy working on the street, offer to help with a task", "Take one mannerism of an animal you encounter and make it yours", "Act like two statues in a classical scene", "Pretend the stairs are piano keys and sing the notes as you walk up and down", "Buy each other a surprise snack"]>>
/* NL Prompts */
<<set $NLintroprompts = ["Loop rond in een spiraal. De een van buiten naar binnen, de ander andersom",
"Doe alsof je schaatst",
"De langste speler sluit de ogen. De ander leidt hem door iets over de omgeving te vertellen",
"Doe alsof één been aan dat van de ander vastzit en loop zo normaal mogelijk",
"Sta met de rug tegen elkaar aan en probeer te gaan zitten"]>>
<<set $NLmission1 = ["Sta stil en volg de skyline met je vingers",
"Loop niet op trottoir of officiële paden",
"Loop zo langzaam mogelijk",
"Observeer je omgeving via spiegelende oppervlakken",
"Balanceer iets op je hoofd terwijl je loopt",
"Ruik aan objecten op straat en beschrijf de geur aan elkaar",
"Pik iets op van de grond en verzin een manier om het tentoon te stellen",
"Laat een kruimelpad achter",
"Klim ergens op",
"Bind elkaars veters aan elkaar vast"]>>
<<set $NLmission2 = ["Steek achterstevoren een zebrapad over",
"Draag je jas of shirt binnenstebuiten",
"Voel waar de wind vandaan komt en loop die richting uit",
"Trap tegen afval op straat aan en maak er een competitie van",
"Groet iedereen die je tegenkomt",
"Bezet een lege parkeerplek",
"Volg zo lang mogelijk een duif zonder hem af te schrikken",
"Loop strompelend en heen en weer wiegend alsof je onder invloed bent",
"Loop in een rechte lijn en vind manieren om obstakels te vermijden",
"Ren als een Tirannosaurus Rex"]>>
<<set $NLmission3 = ["Steek je tong uit terwijl je loopt",
"Ga met de ruimte om alsof het jouw terrein is",
"Ga pas op het allerlaatste moment opzij voor mensen",
"Ga bij een banaal object staan, neem een sexy pose aan en maak er een foto van",
"Zwaai naar iemand in de verte",
"Ga vier minuten lang midden op de stoep stil staan",
"Ruil een kledingstuk met elkaar voor de verdere duur van het spel",
"Lees hardop alle graffiti voor die je tegenkomt",
"Ga midden op de stoep zitten",
"Lees commerciële borden hardop voor alsof het poëzie is",
"Loop vanuit verschillende kanten theatraal tegen elkaar aan"]>>
<<set $NLmission4 = ["Verstop je in de bosjes totdat iemand je heeft opgemerkt",
"Observeer een banaal object alsof het heel opmerkelijk is",
"Laat je vingers op intieme wijze langs objecten en oppervlakten gaan",
"Doe een wedstrijdje rennen naar de dichtstbijzijnde boom. Wie twee van de drie races wint is de grote winnaar",
"Steek bij een voetgangersstoplicht pas over als het licht voor de derde keer op groen gaat",
"Vind een manier om je omgeving ondersteboven te bekijken",
"Doe alsof de stoep lava is en sterf theatraal als je die aanraakt",
"Beschrijf elk object in een etalage",
"Loop samen waarbij je doet alsof de één de ander heeft gearresteerd",
"Luid de fietsbel van geparkeerde fietsen die je tegenkomt",
"Doe alsof je een verkeersagent bent en regel zogenaamd het verkeer"]>>
<<set $NLmission5 = ["Begin een gevecht met een levenloos object, zoals een boom of muur",
"Leun tegen een paal of muur en beschrijf hardop voorbijgangers",
"Wijs naar alles dat rood is en lach hardop",
"Bedenk welk hondenras je wilt zijn en apporteer een stok voor elkaar",
"Als je een hard geluid hoort, maak dan een nog harder geluid",
"Spreek af dat je scheten van tevoren aankondigt",
"Doe een wedstrijd wie het verst kan spugen",
"Doe hardop alsof je een meningsverschil hebt over wat goede publieke kunst is",
"Ga hier liggen voor een tukje",
"Speel dieren-journalist en stel dieren vragen met een onzichtbare microfoon",
"Loop de volgende twee rondes op blote voeten"]>>
<<set $NLmission6 = ["Vraag een vreemde of je zijn of haar hond mag uitlaten",
"Daag een vreemde uit tot een spelletje steen-papier-schaar",
"Vraag de weg naar een winkel waar ze geluk verkopen",
"Begin met een onbekend kind een serieus gesprek",
"Bel ergens aan en vraag naar de dichtstbijzijnde gevangenis",
"Vraag aan iemand die iets blauws aanheeft om levensadvies",
"Vraag mensen bij een halte of de tram of bus naar het paradijs gaat",
"Doe alsof je de beheerder bent van een prullenbak of vuilcontainer",
"Vraag een vreemde of je even op zijn fiets mag fietsen",
"Ren naast een jogger",
"Daag een vreemde uit tot een stukje hardlopen"]>>
<<set $NLmission7 = ["Wissel hardop uit wat je fijn vindt aan elkaar",
"Doe heel langzaam een kledingstuk uit",
"Doe een wedstrijdje ver gooien met iets dat je op de grond vindt",
"Applaudisseer voor iedereen die langsloopt",
"Doe een vreugdedans, bij elke volgende hondenpoep",
"Praat de komende vijf minuten met heftige gebaren",
"Breng de eerstvolgende veiligheidscamera een serenade",
"Bel zogenaamd met elkaar terwijl je naast elkaar loopt",
"Geef een muurschildering die je ziet een genadeloze beoordeling"]>>
<<set $NLmission8 = ["Kies een lied dat je samen zingt tijdens het lopen",
"Maak een portret van elkaar met gevonden voorwerpen",
"Maak een wedstrijd van alles wat je doet in de komende vijf minuten",
"Ren naar een speeltuin en ga jubelend van de glijbaan af",
"Als je iemand op straat aan het werk ziet, bied dan aan om met een taak te helpen",
"Neem een maniërisme van een dier aan dat je tegenkomt",
"Poseer als twee klassieke standbeelden",
"Doe alsof een trap een piano is en zing alle noten terwijl je de trap op en neer loopt",
"Koop een verrassende snack voor elkaar"]>>
<<set $introprompts.shuffle()>>
<<set $mission1.shuffle()>>
<<set $mission2.shuffle()>>
<<set $mission3.shuffle()>>
<<set $mission4.shuffle()>>
<<set $mission5.shuffle()>>
<<set $mission6.shuffle()>>
<<set $mission7.shuffle()>>
<<set $mission8.shuffle()>>
<<set $NLintroprompts.shuffle()>>
<<set $NLmission1.shuffle()>>
<<set $NLmission2.shuffle()>>
<<set $NLmission3.shuffle()>>
<<set $NLmission4.shuffle()>>
<<set $NLmission5.shuffle()>>
<<set $NLmission6.shuffle()>>
<<set $NLmission7.shuffle()>>
<<set $NLmission8.shuffle()>>
<<set $stickercounter = ["st-0","st-1","st-2","st-3","st-4","st-5","st-6","st-7","st-8","st-9","st-10","st-11","st-12","st-13","st-14","st-15","st-16","st-17","st-18","st-19"]>>
<<set $bodycolor = ["purple", "brown", "blue", "green", "pink", "orange"]>>
<<set $bodycolor.shuffle()>>
<<set $bgcolor to random(1, 6)>>
<<set $orarrow to true>>
<div id="navigation" class="" data-passage="Nav"></div>
<div class="bg-pole">
<div id="interface" class="">
<div id="passages" class=""></div>
<div id="footer" data-passage="Footer"></div>
</div>
</div>
<<include "ProgressBar">>
<<include "SignSound">>
<script>
function openNav() {
document.getElementById("myNav").style.height = "100%";
}
function closeNav() {
document.getElementById("myNav").style.height = "0%";
}
</script>
/* Open menu */
<div class="menu-place">
<a href="javascript:void(0)" class="black-btn" onclick="openNav();">
<img alt="menu-icon" src="./src/img/menu-black.svg" width="40" height="36">
</a>
</div>
/* The Overlay */
<div id="myNav" class="overlay">
<div class="overlay-border">
<div class="menu-place">
<a href="javascript:void(0)" class="black-btn" onclick="closeNav();">
<img alt="menu-icon" src="./src/img/menu-white.svg" width="40" height="36">
</a>
/* <a href="javascript:void(0)" class="menu-btn" onclick="closeNav();"></a> */
</div>
<div class="overlay-content items">
<p class="menu">
<ul>
<li>
<<if $EN is true>>
<p class="about-title">ABOUT
<br>URBAN PLAYWALKS</p>
<<else>>
<p class="about-title">OVER
<br>URBAN PLAYWALKS</p>
<</if>>
<p class="">
<<if $EN is true>>
An Urban Playwalk is a series of playful challenges and street games that play with the rules of city life.
<<else>>
Een Urban Playwalk is een serie speelse uitdagingen en straatspellen die spelen met de regels van het stadsleven.
<</if>>
</p>
<<if $EN is true>>
<<message 'Read more' 'read more'>>
<p>
This game is a part of <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>RAUM Der Lusten</a> on display in Utrecht from April 30-August 29, 2021. Play the game while visiting the outdoor exhibition or any other urban environment you happen to find yourself in.
</p>
<p>
<a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>Urban Playwalks</a> is a play-based city-making initiative founded by Lily Higgins & Bruno Setola in 2019. If you enjoyed this game, join our community of Playwalkers <a href="https://www.meetup.com/Urban-Playwalks-Rotterdam/" target='_blank'>here</a> and come play along at future live events in Rotterdam.
</p>
<</message>>
<<else>>
<<message 'Lees meer' 'read more NL'>>
<p>
Dit spel is onderdeel van <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>RAUM Der Lusten</a>, te zien in Utrecht van 30 april t/m 29 augustus 2021. Speel het spel tijdens je bezoek aan de openluchttentoonstelling of elke andere stedelijke omgeving waar je je momenteel in bevindt.
</p>
<p>
Urban Playwalks is een op spel gebaseerd <i>city-making</i> initiatief, in 2019 opgericht door Lily Higgins & Bruno Setola. Als je plezier hebt beleefd aan dit spel, doe dan <a href="https://www.meetup.com/Urban-Playwalks-Rotterdam/" target='_blank'>hier</a> mee met onze <i>community</i> van Playwalkers en kom meespelen tijdens onze live evenementen in Rotterdam.
</p>
<</message>>
<</if>>
</li>
<li><<if $EN is true>>
<<message 'ABOUT THE MAKERS' 'Makers'>>
<p>Lily Higgins (USA) is an experience designer and play expert.<br>
<a href="https://www.instagram.com/lilyobserves/" target='_blank'>@lilyobserves</a><br>
<a href="https://theinterventionbureau.com" target='_blank'>theinterventionbureau.com</a>
</p>
<p>
Bruno Setola (NL) is a game thinker.<br>
<a href="https://www.instagram.com/playspacer/" target='_blank'>@playspacer</a><br>
<a href="https://playspace.cc" target='_blank'>playspace.cc</a>
</p>
<p>
Mats Tijmes (NL) is an alternative reality designer.<br>
<a href="https://www.instagram.com/matstijmes/" target='_blank'>@matstijmes</a><br>
<a href="https://matstijmes.com" target='_blank'>matstijmes.com</a>
</p>
<</message>>
<<else>>
<<message 'OVER DE MAKERS' 'MakersNL'>>
<p>Lily Higgins (USA) is een <i>experience designer</i> en <i>play expert</i>.<br>
<a href="https://www.instagram.com/lilyobserves/" target='_blank'>@lilyobserves</a><br>
<a href="https://theinterventionbureau.com" target='_blank'>theinterventionbureau.com</a>
</p>
<p>
Bruno Setola (NL) is een <i>game thinker.</i>
<br>
<a href="https://www.instagram.com/playspacer/" target='_blank'>@playspacer</a><br>
<a href="https://playspace.cc" target='_blank'>playspace.cc</a>
</p>
<p>
Mats Tijmes (NL) is an <i>alternative reality designer</i>.<br>
<a href="https://www.instagram.com/matstijmes/" target='_blank'>@matstijmes</a><br>
<a href="https://matstijmes.com" target='_blank'>matstijmes.com</a>
</p>
<</message>>
<</if>>
</li>
<li><<if $EN is true>>
<<link "RESTART GAME">><<run Engine.restart()>><</link>>
<<else>>
<<link "HERSTART SPEL">><<run Engine.restart()>><</link>>
<</if>>
</li>
<li>
<<if $EN is true>>
<<link "END GAME">><<goto "VideoAsk">><</link>>
<<else>>
<<link "BEËINDIG SPEL">><<goto "VideoAsk">><</link>>
<</if>>
</li>
/*<li>
<<if $EN is true>>
<a href="#">SHARE</a>
<<else>>
<a href="#">DEEL</a>
<</if>>
</li>*/
</ul>
<p><<if $EN is true>>
Share your favorite challenges and tag us <a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>@urbanplaywalks</a> Show us how you play the city!
<<else>>
Deel je favoriete uitdagingen en <i>tag</i> ons <a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>@urbanplaywalks</a>. Laat ons zien hoe jij met de stad speelt!
<</if>>
</p>
<p>
<<if $EN is true>>
This digital Playwalk was commissioned by <a href="https://raumutrecht.nl/" target='_blank'>RAUM</a> for the <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>RAUM Der Lusten Exhibition</a>
<<else>>
Deze digitale Playwalk is gemaakt in opdracht van <a href="https://raumutrecht.nl/" target='_blank'>RAUM</a> voor de <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>RAUM Der Lusten Tentoonstelling</a>
<</if>>
</p>
</p>
</div>
</div>
<script>
function openNav() {
document.getElementById("myNav").style.height = "100%";
}
function closeNav() {
document.getElementById("myNav").style.height = "0%";
}
</script>
/*<<include "Debugger">>*/<div id="interface" class="wrapper">
<div id="nav" class="header" data-passage="Nav"></div>
<div id="menu" data-passage="Menu"></div>
<aside class="aside aside-1">Aside 1</aside>
<aside class="aside aside-2">Aside 2</aside>
<div id="notifications" data-passage="Notifications"></div>
<div id="passages" class="main"></div>
<div id="footer" class="footer" data-passage="Footer"></div>
</div>
<div id="footer" class="footer" data-passage="Footer"></div>
<aside class="aside aside-1"></aside>
<aside class="aside aside-2"></aside> <<audio "intro-EN" stop>>
<<audio "intro-NL" stop>>
<div class= "center">
<div id="Prompt1" class="card m-text">
<div class="border-inset"><h1>
<<if $EN is true>>
<<include "Level 1 Top">>
<</if>>
<<if $EN is false>>
<<include "Level 1 Top NL">>
<</if>>
</h1></div>
</div>
<<include "OR">>
<div id="Prompt2" class="card card_alt m-text">
<div class="border-inset"><h1>
<<if $EN is true>>
<<include "Level 1 Bottom">>
<</if>>
<<if $EN is false>>
<<include "Level 1 Bottom NL">>
<</if>>
</h1></div>
</div>
<<include "LevelSettings">>
</div>
/* Duration checker */ /* Do -1 on the duration (because of the 0)*/
<<if passage() is "Level 1">>
<<if $long is true and $duration is 5>>
<<set $duration to 0>>
<<goto "Level 2">>
<</if>>
<<if $short is true and $duration is 2>>
<<set $duration to 0>>
<<goto "Level 2">>
<</if>>
<</if>>
<<if passage() is "Level 2">>
<<if $long is true and $duration is 5>>
<<set $duration to 0>>
<<goto "Halfway">>
<</if>>
<<if $short is true and $duration is 2>>
<<set $duration to 0>>
<<goto "Halfway">>
<</if>>
<</if>>
<<if passage() is "Level 3">>
<<if $long is true and $duration is 4>>
<<set $duration to 0>>
<<goto "Level 4">>
<</if>>
<<if $short is true and $duration is 2>>
<<set $duration to 0>>
<<goto "Level 4">>
<</if>>
<</if>>
<<if passage() is "Level 4">>
<<if $long is true and $duration is 5>>
<<set $duration to 0>>
<<goto "Last Prompt">>
<</if>>
<<if $short is true and $duration is 3>>
<<set $duration to 0>>
<<goto "Last Prompt">>
<</if>>
<</if>>
/* Back Button
<<include "Comp Back Temp">>*/
<div class= "center">
<div id="intro" class="card m-text noise">
<div class="border-inset">
<h2><<if $EN is true>>
A <i>Playwalk</i> is a series of playful challenges to do while walking through the city.
<br><br>
You'll observe the streets with new eyes and play around with what is considered normal in public space.
<</if>>
<<if $EN is false>>
Een <i>Playwalk</i> is een serie speelse uitdagingen om te doen tijdens een wandeling in de stad.
<br><br>
Daarbij verken je wat je wel of niet normaal gedrag vindt in de publieke ruimte.
<</if>></h2>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Short game (10 rounds)">>
<<set $short to true>>
<<set $long to false>>
<<set $duration to 0>>
<<goto "How to play 1">>
<</button>>
<</if>>
<<if $EN is false>>
<<button "Kort spel (10 rondes)">>
<<set $short to true>>
<<set $long to false>>
<<set $duration to 0>>
<<goto "How to play 1">>
<</button>>
<</if>>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Long game (20 rounds)">>
<<set $short to false>>
<<set $long to true>>
<<set $duration to 0>>
<<goto "How to play 1">>
<</button>>
<</if>>
<<if $EN is false>>
<<button "Lang spel (20 rondes)">>
<<set $short to false>>
<<set $long to true>>
<<set $duration to 0>>
<<goto "How to play 1">>
<</button>>
<</if>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<goto "Welcome">>
<</button>>
</div>
</div>
</div><<set $thispassage = passage()>>
<div id="next">
<<button "">>
<<set $duration++>>
<<set $progress++>>
<<goto $thispassage>>
<</button>>
</div><div class= "center">
<div id="Prompt1" class="card m-text">
<div class="border-inset"><h1>
<<if $EN is true>>
<<include "Level 2 Top">>
<</if>>
<<if $EN is false>>
<<include "Level 2 Top NL">>
<</if>>
</h1></div>
</div>
<<include "OR">>
<div id="Prompt2" class="card card_alt m-text">
<div class="border-inset"><h1>
<<if $EN is true>>
<<include "Level 2 Bottom">>
<</if>>
<<if $EN is false>>
<<include "Level 2 Bottom NL">>
<</if>>
</h1></div>
</div>
<<include "LevelSettings">>
</div>/* <<set $thispassage = passage()>>
<<if $duration > 0 >>
<div id="previous">
<<button "">>
<<if $duration > 0>>
<<set $duration-->>
<</if>>
<<goto $thispassage>>
<</button>>
</div>
<</if>>
*/<<include "DurationCheck">>
<<set $thispassage = passage()>>
<div id="buttons">
<div><<include "NextMission">></div>
</div>
/*
<<if passage() is "Level 1">>
<div><<include "PreviousMission">></div>
<</if>>
<<if passage() is "Level 2">>
<<include "PreviousLevel">>
<</if>>
<<if passage() is "Level 3">>
<<include "PreviousLevel">>
<</if>>
<<if passage() is "Level 4">>
<<include "PreviousLevel">>
<</if>>
*/
<<if $duration eq 0>>
<<print $mission1[$duration]>>
<<elseif $duration eq 1>>
<<print $mission1[$duration]>>
<<elseif $duration eq 2>>
<<print $mission1[$duration]>>
<<elseif $duration eq 3>>
<<print $mission1[$duration]>>
<<elseif $duration eq 4>>
<<print $mission1[$duration]>>
<<elseif $duration eq 5>>
<<print $mission1[$duration]>>
<<elseif $duration eq 6>>
<<print $mission1[$duration]>>
<<elseif $duration eq 7>>
<<print $mission1[$duration]>>
<<elseif $duration eq 8>>
<<print $mission1[$duration]>>
<<elseif $duration eq 9>>
<<print $mission1[$duration]>>
<<elseif $duration eq 10>>
<<print $mission1[$duration]>>
<<elseif $duration eq 11>>
<<print $mission1[$duration]>>
<</if>><<if $duration eq 0>>
<<print $mission2[$duration]>>
<<elseif $duration eq 1>>
<<print $mission2[$duration]>>
<<elseif $duration eq 2>>
<<print $mission2[$duration]>>
<<elseif $duration eq 3>>
<<print $mission2[$duration]>>
<<elseif $duration eq 4>>
<<print $mission2[$duration]>>
<<elseif $duration eq 5>>
<<print $mission2[$duration]>>
<<elseif $duration eq 6>>
<<print $mission2[$duration]>>
<<elseif $duration eq 7>>
<<print $mission2[$duration]>>
<<elseif $duration eq 8>>
<<print $mission2[$duration]>>
<<elseif $duration eq 9>>
<<print $mission2[$duration]>>
<<elseif $duration eq 10>>
<<print $mission2[$duration]>>
<<elseif $duration eq 11>>
<<print $mission2[$duration]>>
<</if>><<set $mission1 = ["Make a portrait or painting of each other with something you've found.", "Set out a parkour and challenge others to beat you.", "Walk with imaginary glasses (like doing batman with your hands).", "Ask someone to guess your favourite fruit."]>><<set $mission1 = [ "1.1", "1.2", "1.3", "1.4", "1.5", "1.6", "1.7"]>>
<<set $mission2 = [ "2.1", "2.2", "2.3", "2.4", "2.5", "2.6", "2.7"]>>
<<set $mission2 = ["Make a portrait or painting of each other with something you've found.", "Set out a parkour and challenge others to beat you.", "Walk with imaginary glasses (like doing batman with your hands).", "Ask someone to guess your favourite fruit."]>>/*
<<if passage() isnot "Level 1">>
<<button "Previous level">>
<<if $long is true>>
<<set $duration to 5>>
<</if>>
<<if $short is true>>
<<set $duration to 2>>
<</if>>
<<if passage() is "Level 2">>
<<goto "Level 1">>
<<elseif passage() "Level 3">>
<<goto "Level 2">>
<<elseif passage() "Level 4">>
<<goto "Level 3">>
<</if>>
<</button>>
<</if>>
*/
/* <<set $thispassage = passage()>>
<<if $duration > 0 >>
<<button "Previous mission">>
<<if $duration > 0>><<set $duration-->><</if>>
<<goto $thispassage>>
<</button>>
<</if>> */<div class= "center">
<div id="Prompt1" class="card m-text">
<div class="border-inset"><h1>
<<if $EN is true>>
<<include "Level 3 Top">>
<</if>>
<<if $EN is false>>
<<include "Level 3 Top NL">>
<</if>>
</h1></div>
</div>
<<include "OR">>
<div id="Prompt2" class="card card_alt m-text">
<div class="border-inset"><h1>
<<if $EN is true>>
<<include "Level 3 Bottom">>
<</if>>
<<if $EN is false>>
<<include "Level 3 Bottom NL">>
<</if>>
</h1></div>
</div>
<<include "LevelSettings">>
</div><<set $mission3 = ["3.1 Vestibulum malesuada nisi a dui lobortis vulputate. Donec sit amet accumsan sem, non luctus nibh. Donec quis lacus at dolor sollicitudin lobortis tristique eu nisl. Vivamus quis rutrum mauris. Nullam et justo at ligula dapibus tempor eget sit amet orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed eget quam ut magna mattis facilisis. Integer porta purus lacus, id sodales urna tincidunt vel. Maecenas euismod placerat lacinia. Maecenas eu varius dui.",
"3.2 Donec erat odio, lobortis ut varius venenatis, convallis vel purus. Nullam at nisl sed metus varius ultricies nec a orci. Nunc congue, lectus eu pellentesque tristique, tortor quam maximus dolor, eu lacinia ligula eros ac augue. Aliquam eu erat viverra neque viverra volutpat. Duis orci quam, porta eget iaculis eget, ultricies et libero. Nulla facilisi. Proin ultrices ligula a turpis vehicula vestibulum. Aliquam ac egestas lectus. Donec eu iaculis ipsum. Quisque scelerisque, mauris ut fringilla commodo, augue lorem aliquam mi, quis imperdiet ante sem id felis. Donec eget ligula tellus. Mauris ut erat magna.",
"3.3 Phasellus sagittis erat eget tellus rhoncus dignissim. Phasellus mollis est nec enim convallis, et cursus tortor ultrices. Pellentesque scelerisque nec tortor at ultricies. Fusce tempus, lorem non posuere tristique, erat tellus vehicula justo, sollicitudin molestie arcu diam eget sapien. Integer ut lectus ac mauris condimentum imperdiet ac ut mauris. Nullam neque elit, pretium lobortis suscipit sed, cursus a lorem. Nunc iaculis porta ligula. Aliquam vel neque lorem. Maecenas id tincidunt nibh. Ut malesuada volutpat sapien, et euismod nisi. Mauris non malesuada metus. Cras nec tortor nec enim pellentesque vehicula.",
"3.4 Suspendisse bibendum accumsan orci pharetra blandit. Proin aliquet dapibus vehicula. Phasellus pretium elit vitae eleifend euismod. Sed nunc elit, volutpat sit amet velit vitae, luctus tincidunt augue. Aenean eleifend est nisl, ac tincidunt purus gravida eget. Nunc tristique ut urna quis pulvinar. In vitae dapibus ipsum, eget interdum justo. Nulla rutrum enim odio, quis placerat mauris rutrum ut. Praesent consequat ut lorem pulvinar sodales. Integer efficitur sagittis consectetur.",
"3.5 In tellus turpis, efficitur nec ante nec, ultrices venenatis lorem. Donec ipsum neque, mollis vel est non, consectetur hendrerit odio. Nulla elementum non sapien eu scelerisque. Duis ac lacinia massa. Duis dignissim mattis ligula, eu dictum nulla ultrices nec. Aliquam scelerisque erat eget justo accumsan auctor. Quisque consectetur volutpat sagittis. Vestibulum sapien erat, suscipit mattis ullamcorper quis, lacinia non eros. Suspendisse posuere eros odio, non placerat erat maximus sed. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.",
"3.6 Nulla facilisi. Nulla sit amet orci eu sapien mattis convallis. Sed imperdiet at lectus auctor euismod. Pellentesque et ipsum ut sapien fringilla convallis in hendrerit enim. Phasellus eget mauris urna. Praesent eleifend rhoncus enim vitae malesuada. Mauris volutpat varius eros, et luctus diam bibendum sed. Donec ut feugiat erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed id nibh nibh.",
"3.7 Morbi vehicula, metus quis bibendum porttitor, magna massa sollicitudin neque, id sodales dui augue id ex. Proin ut massa at sem dictum finibus. Ut ullamcorper et neque at varius. Ut ex purus, semper a efficitur vel, sodales ac nisl. Fusce aliquet molestie turpis sed vulputate. Pellentesque sodales, ipsum at varius molestie, magna risus suscipit justo, tincidunt maximus velit magna id quam. Morbi at faucibus quam, in dictum nunc. Sed vehicula enim eu enim condimentum, cursus suscipit orci volutpat. Nullam quam quam, accumsan at dolor quis, sagittis tempor nunc. Etiam faucibus orci mattis libero faucibus blandit. Donec eros ligula, tincidunt et convallis ut, vestibulum eget ante. Integer rutrum justo ipsum, eu dapibus turpis sagittis a. Cras at ante nulla. Praesent vehicula pellentesque metus, at varius massa cursus eu. Cras orci sapien, semper sit amet justo sit amet, scelerisque faucibus massa. Morbi volutpat pulvinar nunc in finibus."
]>><div class= "center">
<div id="card" class="start noise card m-text">
<div class="border-inset">
<h1>
<<if $EN is true>>
Welcome<br>
to the Urban<br>
Playwalk<br>
<br><br>
Ready to play with the rules of the city?
<<else>>
Welkom bij de Urban Playwalk
<br><br>
Klaar om te gaan spelen met de regels van de stad?
<</if>>
</h1>
</div>
</div>
<div id="next-language">
<div id="buttons">
<<button "EN">>
<<set $EN to true>>
<<goto "Choose Duration">>
<</button>>
</div>
<div id="buttons">
<<button "NL">>
<<set $EN to false>>
<<goto "Choose Duration">>
<</button>>
</div>
</div>
</div>
<<if $duration eq 0>>
<<print $mission3[$duration]>>
<<elseif $duration eq 1>>
<<print $mission3[$duration]>>
<<elseif $duration eq 2>>
<<print $mission3[$duration]>>
<<elseif $duration eq 3>>
<<print $mission3[$duration]>>
<<elseif $duration eq 4>>
<<print $mission3[$duration]>>
<<elseif $duration eq 5>>
<<print $mission3[$duration]>>
<<elseif $duration eq 6>>
<<print $mission3[$duration]>>
<</if>><<if $duration eq 0>>
<<print $mission4[$duration]>>
<<elseif $duration eq 1>>
<<print $mission4[$duration]>>
<<elseif $duration eq 2>>
<<print $mission4[$duration]>>
<<elseif $duration eq 3>>
<<print $mission4[$duration]>>
<<elseif $duration eq 4>>
<<print $mission4[$duration]>>
<<elseif $duration eq 5>>
<<print $mission4[$duration]>>
<<elseif $duration eq 6>>
<<print $mission4[$duration]>>
<</if>><<set $mission4 = ["4.1 Vestibulum malesuada nisi a dui lobortis vulputate. Donec sit amet accumsan sem, non luctus nibh. Donec quis lacus at dolor sollicitudin lobortis tristique eu nisl. Vivamus quis rutrum mauris. Nullam et justo at ligula dapibus tempor eget sit amet orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed eget quam ut magna mattis facilisis. Integer porta purus lacus, id sodales urna tincidunt vel. Maecenas euismod placerat lacinia. Maecenas eu varius dui.",
"4.2 Donec erat odio, lobortis ut varius venenatis, convallis vel purus. Nullam at nisl sed metus varius ultricies nec a orci. Nunc congue, lectus eu pellentesque tristique, tortor quam maximus dolor, eu lacinia ligula eros ac augue. Aliquam eu erat viverra neque viverra volutpat. Duis orci quam, porta eget iaculis eget, ultricies et libero. Nulla facilisi. Proin ultrices ligula a turpis vehicula vestibulum. Aliquam ac egestas lectus. Donec eu iaculis ipsum. Quisque scelerisque, mauris ut fringilla commodo, augue lorem aliquam mi, quis imperdiet ante sem id felis. Donec eget ligula tellus. Mauris ut erat magna.",
"4.3 Phasellus sagittis erat eget tellus rhoncus dignissim. Phasellus mollis est nec enim convallis, et cursus tortor ultrices. Pellentesque scelerisque nec tortor at ultricies. Fusce tempus, lorem non posuere tristique, erat tellus vehicula justo, sollicitudin molestie arcu diam eget sapien. Integer ut lectus ac mauris condimentum imperdiet ac ut mauris. Nullam neque elit, pretium lobortis suscipit sed, cursus a lorem. Nunc iaculis porta ligula. Aliquam vel neque lorem. Maecenas id tincidunt nibh. Ut malesuada volutpat sapien, et euismod nisi. Mauris non malesuada metus. Cras nec tortor nec enim pellentesque vehicula.",
"4.4 Suspendisse bibendum accumsan orci pharetra blandit. Proin aliquet dapibus vehicula. Phasellus pretium elit vitae eleifend euismod. Sed nunc elit, volutpat sit amet velit vitae, luctus tincidunt augue. Aenean eleifend est nisl, ac tincidunt purus gravida eget. Nunc tristique ut urna quis pulvinar. In vitae dapibus ipsum, eget interdum justo. Nulla rutrum enim odio, quis placerat mauris rutrum ut. Praesent consequat ut lorem pulvinar sodales. Integer efficitur sagittis consectetur.",
"4.5 In tellus turpis, efficitur nec ante nec, ultrices venenatis lorem. Donec ipsum neque, mollis vel est non, consectetur hendrerit odio. Nulla elementum non sapien eu scelerisque. Duis ac lacinia massa. Duis dignissim mattis ligula, eu dictum nulla ultrices nec. Aliquam scelerisque erat eget justo accumsan auctor. Quisque consectetur volutpat sagittis. Vestibulum sapien erat, suscipit mattis ullamcorper quis, lacinia non eros. Suspendisse posuere eros odio, non placerat erat maximus sed. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.",
"4.6 Nulla facilisi. Nulla sit amet orci eu sapien mattis convallis. Sed imperdiet at lectus auctor euismod. Pellentesque et ipsum ut sapien fringilla convallis in hendrerit enim. Phasellus eget mauris urna. Praesent eleifend rhoncus enim vitae malesuada. Mauris volutpat varius eros, et luctus diam bibendum sed. Donec ut feugiat erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed id nibh nibh.",
"4.7 Morbi vehicula, metus quis bibendum porttitor, magna massa sollicitudin neque, id sodales dui augue id ex. Proin ut massa at sem dictum finibus. Ut ullamcorper et neque at varius. Ut ex purus, semper a efficitur vel, sodales ac nisl. Fusce aliquet molestie turpis sed vulputate. Pellentesque sodales, ipsum at varius molestie, magna risus suscipit justo, tincidunt maximus velit magna id quam. Morbi at faucibus quam, in dictum nunc. Sed vehicula enim eu enim condimentum, cursus suscipit orci volutpat. Nullam quam quam, accumsan at dolor quis, sagittis tempor nunc. Etiam faucibus orci mattis libero faucibus blandit. Donec eros ligula, tincidunt et convallis ut, vestibulum eget ante. Integer rutrum justo ipsum, eu dapibus turpis sagittis a. Cras at ante nulla. Praesent vehicula pellentesque metus, at varius massa cursus eu. Cras orci sapien, semper sit amet justo sit amet, scelerisque faucibus massa. Morbi volutpat pulvinar nunc in finibus."
]>>/* Back Button
<<include "Comp Back Temp">>*/
<div class= "center">
<div class="card m-text">
<div class="border-inset">
<h1>Well played!</h1>
<p>Share buttons?</p>
</div>
</div>
<div id="buttons">
<<button "Restart game">><<run Engine.restart()>><</button>></div>
</div>
<div class= "center">
<div id="Prompt1" class="card m-text">
<div class="border-inset"><h1>
<<if $EN is true>>
<<include "Level 4 Top">>
<</if>>
<<if $EN is false>>
<<include "Level 4 Top NL">>
<</if>>
</h1></div>
</div>
<<include "OR">>
<div id="Prompt2" class="card card_alt m-text">
<div class="border-inset"><h1>
<<if $EN is true>>
<<include "Level 4 Bottom">>
<</if>>
<<if $EN is false>>
<<include "Level 4 Bottom NL">>
<</if>>
</h1></div>
</div>
<<include "LevelSettings">>
</div>
/*<<include "Stickerscript">>
<<timed 0s>><<run Sticker()>><</timed>>
<div id="sticker-visi">
<div id="sticker" class="stick-cont">
<<include "Stickers">>
</div>
</div>
*/<<if $duration eq 0>>
<<print $mission5[$duration]>>
<<elseif $duration eq 1>>
<<print $mission5[$duration]>>
<<elseif $duration eq 2>>
<<print $mission5[$duration]>>
<<elseif $duration eq 3>>
<<print $mission5[$duration]>>
<<elseif $duration eq 4>>
<<print $mission5[$duration]>>
<<elseif $duration eq 5>>
<<print $mission5[$duration]>>
<<elseif $duration eq 6>>
<<print $mission5[$duration]>>
<</if>><<if $duration eq 0>>
<<print $mission6[$duration]>>
<<elseif $duration eq 1>>
<<print $mission6[$duration]>>
<<elseif $duration eq 2>>
<<print $mission6[$duration]>>
<<elseif $duration eq 3>>
<<print $mission6[$duration]>>
<<elseif $duration eq 4>>
<<print $mission6[$duration]>>
<<elseif $duration eq 5>>
<<print $mission6[$duration]>>
<<elseif $duration eq 6>>
<<print $mission6[$duration]>>
<</if>><<if $duration eq 0>>
<<print $mission7[$duration]>>
<<elseif $duration eq 1>>
<<print $mission7[$duration]>>
<<elseif $duration eq 2>>
<<print $mission7[$duration]>>
<<elseif $duration eq 3>>
<<print $mission7[$duration]>>
<<elseif $duration eq 4>>
<<print $mission7[$duration]>>
<<elseif $duration eq 5>>
<<print $mission7[$duration]>>
<<elseif $duration eq 6>>
<<print $mission7[$duration]>>
<</if>><<if $duration eq 0>>
<<print $mission8[$duration]>>
<<elseif $duration eq 1>>
<<print $mission8[$duration]>>
<<elseif $duration eq 2>>
<<print $mission8[$duration]>>
<<elseif $duration eq 3>>
<<print $mission8[$duration]>>
<<elseif $duration eq 4>>
<<print $mission8[$duration]>>
<<elseif $duration eq 5>>
<<print $mission8[$duration]>>
<<elseif $duration eq 6>>
<<print $mission8[$duration]>>
<</if>><<set $mission5 = ["5.1 Vestibulum malesuada nisi a dui lobortis vulputate. Donec sit amet accumsan sem, non luctus nibh. Donec quis lacus at dolor sollicitudin lobortis tristique eu nisl. Vivamus quis rutrum mauris. Nullam et justo at ligula dapibus tempor eget sit amet orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed eget quam ut magna mattis facilisis. Integer porta purus lacus, id sodales urna tincidunt vel. Maecenas euismod placerat lacinia. Maecenas eu varius dui.",
"5.2 Donec erat odio, lobortis ut varius venenatis, convallis vel purus. Nullam at nisl sed metus varius ultricies nec a orci. Nunc congue, lectus eu pellentesque tristique, tortor quam maximus dolor, eu lacinia ligula eros ac augue. Aliquam eu erat viverra neque viverra volutpat. Duis orci quam, porta eget iaculis eget, ultricies et libero. Nulla facilisi. Proin ultrices ligula a turpis vehicula vestibulum. Aliquam ac egestas lectus. Donec eu iaculis ipsum. Quisque scelerisque, mauris ut fringilla commodo, augue lorem aliquam mi, quis imperdiet ante sem id felis. Donec eget ligula tellus. Mauris ut erat magna.",
"5.3 Phasellus sagittis erat eget tellus rhoncus dignissim. Phasellus mollis est nec enim convallis, et cursus tortor ultrices. Pellentesque scelerisque nec tortor at ultricies. Fusce tempus, lorem non posuere tristique, erat tellus vehicula justo, sollicitudin molestie arcu diam eget sapien. Integer ut lectus ac mauris condimentum imperdiet ac ut mauris. Nullam neque elit, pretium lobortis suscipit sed, cursus a lorem. Nunc iaculis porta ligula. Aliquam vel neque lorem. Maecenas id tincidunt nibh. Ut malesuada volutpat sapien, et euismod nisi. Mauris non malesuada metus. Cras nec tortor nec enim pellentesque vehicula.",
"5.4 Suspendisse bibendum accumsan orci pharetra blandit. Proin aliquet dapibus vehicula. Phasellus pretium elit vitae eleifend euismod. Sed nunc elit, volutpat sit amet velit vitae, luctus tincidunt augue. Aenean eleifend est nisl, ac tincidunt purus gravida eget. Nunc tristique ut urna quis pulvinar. In vitae dapibus ipsum, eget interdum justo. Nulla rutrum enim odio, quis placerat mauris rutrum ut. Praesent consequat ut lorem pulvinar sodales. Integer efficitur sagittis consectetur.",
"5.5 In tellus turpis, efficitur nec ante nec, ultrices venenatis lorem. Donec ipsum neque, mollis vel est non, consectetur hendrerit odio. Nulla elementum non sapien eu scelerisque. Duis ac lacinia massa. Duis dignissim mattis ligula, eu dictum nulla ultrices nec. Aliquam scelerisque erat eget justo accumsan auctor. Quisque consectetur volutpat sagittis. Vestibulum sapien erat, suscipit mattis ullamcorper quis, lacinia non eros. Suspendisse posuere eros odio, non placerat erat maximus sed. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.",
"5.6 Nulla facilisi. Nulla sit amet orci eu sapien mattis convallis. Sed imperdiet at lectus auctor euismod. Pellentesque et ipsum ut sapien fringilla convallis in hendrerit enim. Phasellus eget mauris urna. Praesent eleifend rhoncus enim vitae malesuada. Mauris volutpat varius eros, et luctus diam bibendum sed. Donec ut feugiat erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed id nibh nibh.",
"5.7 Morbi vehicula, metus quis bibendum porttitor, magna massa sollicitudin neque, id sodales dui augue id ex. Proin ut massa at sem dictum finibus. Ut ullamcorper et neque at varius. Ut ex purus, semper a efficitur vel, sodales ac nisl. Fusce aliquet molestie turpis sed vulputate. Pellentesque sodales, ipsum at varius molestie, magna risus suscipit justo, tincidunt maximus velit magna id quam. Morbi at faucibus quam, in dictum nunc. Sed vehicula enim eu enim condimentum, cursus suscipit orci volutpat. Nullam quam quam, accumsan at dolor quis, sagittis tempor nunc. Etiam faucibus orci mattis libero faucibus blandit. Donec eros ligula, tincidunt et convallis ut, vestibulum eget ante. Integer rutrum justo ipsum, eu dapibus turpis sagittis a. Cras at ante nulla. Praesent vehicula pellentesque metus, at varius massa cursus eu. Cras orci sapien, semper sit amet justo sit amet, scelerisque faucibus massa. Morbi volutpat pulvinar nunc in finibus."
]>><<set $mission6 = ["6.1 Vestibulum malesuada nisi a dui lobortis vulputate. Donec sit amet accumsan sem, non luctus nibh. Donec quis lacus at dolor sollicitudin lobortis tristique eu nisl. Vivamus quis rutrum mauris. Nullam et justo at ligula dapibus tempor eget sit amet orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed eget quam ut magna mattis facilisis. Integer porta purus lacus, id sodales urna tincidunt vel. Maecenas euismod placerat lacinia. Maecenas eu varius dui.",
"6.2 Donec erat odio, lobortis ut varius venenatis, convallis vel purus. Nullam at nisl sed metus varius ultricies nec a orci. Nunc congue, lectus eu pellentesque tristique, tortor quam maximus dolor, eu lacinia ligula eros ac augue. Aliquam eu erat viverra neque viverra volutpat. Duis orci quam, porta eget iaculis eget, ultricies et libero. Nulla facilisi. Proin ultrices ligula a turpis vehicula vestibulum. Aliquam ac egestas lectus. Donec eu iaculis ipsum. Quisque scelerisque, mauris ut fringilla commodo, augue lorem aliquam mi, quis imperdiet ante sem id felis. Donec eget ligula tellus. Mauris ut erat magna.",
"6.3 Phasellus sagittis erat eget tellus rhoncus dignissim. Phasellus mollis est nec enim convallis, et cursus tortor ultrices. Pellentesque scelerisque nec tortor at ultricies. Fusce tempus, lorem non posuere tristique, erat tellus vehicula justo, sollicitudin molestie arcu diam eget sapien. Integer ut lectus ac mauris condimentum imperdiet ac ut mauris. Nullam neque elit, pretium lobortis suscipit sed, cursus a lorem. Nunc iaculis porta ligula. Aliquam vel neque lorem. Maecenas id tincidunt nibh. Ut malesuada volutpat sapien, et euismod nisi. Mauris non malesuada metus. Cras nec tortor nec enim pellentesque vehicula.",
"6.4 Suspendisse bibendum accumsan orci pharetra blandit. Proin aliquet dapibus vehicula. Phasellus pretium elit vitae eleifend euismod. Sed nunc elit, volutpat sit amet velit vitae, luctus tincidunt augue. Aenean eleifend est nisl, ac tincidunt purus gravida eget. Nunc tristique ut urna quis pulvinar. In vitae dapibus ipsum, eget interdum justo. Nulla rutrum enim odio, quis placerat mauris rutrum ut. Praesent consequat ut lorem pulvinar sodales. Integer efficitur sagittis consectetur.",
"6.5 In tellus turpis, efficitur nec ante nec, ultrices venenatis lorem. Donec ipsum neque, mollis vel est non, consectetur hendrerit odio. Nulla elementum non sapien eu scelerisque. Duis ac lacinia massa. Duis dignissim mattis ligula, eu dictum nulla ultrices nec. Aliquam scelerisque erat eget justo accumsan auctor. Quisque consectetur volutpat sagittis. Vestibulum sapien erat, suscipit mattis ullamcorper quis, lacinia non eros. Suspendisse posuere eros odio, non placerat erat maximus sed. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.",
"6.6 Nulla facilisi. Nulla sit amet orci eu sapien mattis convallis. Sed imperdiet at lectus auctor euismod. Pellentesque et ipsum ut sapien fringilla convallis in hendrerit enim. Phasellus eget mauris urna. Praesent eleifend rhoncus enim vitae malesuada. Mauris volutpat varius eros, et luctus diam bibendum sed. Donec ut feugiat erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed id nibh nibh.",
"6.7 Morbi vehicula, metus quis bibendum porttitor, magna massa sollicitudin neque, id sodales dui augue id ex. Proin ut massa at sem dictum finibus. Ut ullamcorper et neque at varius. Ut ex purus, semper a efficitur vel, sodales ac nisl. Fusce aliquet molestie turpis sed vulputate. Pellentesque sodales, ipsum at varius molestie, magna risus suscipit justo, tincidunt maximus velit magna id quam. Morbi at faucibus quam, in dictum nunc. Sed vehicula enim eu enim condimentum, cursus suscipit orci volutpat. Nullam quam quam, accumsan at dolor quis, sagittis tempor nunc. Etiam faucibus orci mattis libero faucibus blandit. Donec eros ligula, tincidunt et convallis ut, vestibulum eget ante. Integer rutrum justo ipsum, eu dapibus turpis sagittis a. Cras at ante nulla. Praesent vehicula pellentesque metus, at varius massa cursus eu. Cras orci sapien, semper sit amet justo sit amet, scelerisque faucibus massa. Morbi volutpat pulvinar nunc in finibus."
]>><<set $mission7 = ["7.1 Vestibulum malesuada nisi a dui lobortis vulputate. Donec sit amet accumsan sem, non luctus nibh. Donec quis lacus at dolor sollicitudin lobortis tristique eu nisl. Vivamus quis rutrum mauris. Nullam et justo at ligula dapibus tempor eget sit amet orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed eget quam ut magna mattis facilisis. Integer porta purus lacus, id sodales urna tincidunt vel. Maecenas euismod placerat lacinia. Maecenas eu varius dui.",
"7.2 Donec erat odio, lobortis ut varius venenatis, convallis vel purus. Nullam at nisl sed metus varius ultricies nec a orci. Nunc congue, lectus eu pellentesque tristique, tortor quam maximus dolor, eu lacinia ligula eros ac augue. Aliquam eu erat viverra neque viverra volutpat. Duis orci quam, porta eget iaculis eget, ultricies et libero. Nulla facilisi. Proin ultrices ligula a turpis vehicula vestibulum. Aliquam ac egestas lectus. Donec eu iaculis ipsum. Quisque scelerisque, mauris ut fringilla commodo, augue lorem aliquam mi, quis imperdiet ante sem id felis. Donec eget ligula tellus. Mauris ut erat magna.",
"7.3 Phasellus sagittis erat eget tellus rhoncus dignissim. Phasellus mollis est nec enim convallis, et cursus tortor ultrices. Pellentesque scelerisque nec tortor at ultricies. Fusce tempus, lorem non posuere tristique, erat tellus vehicula justo, sollicitudin molestie arcu diam eget sapien. Integer ut lectus ac mauris condimentum imperdiet ac ut mauris. Nullam neque elit, pretium lobortis suscipit sed, cursus a lorem. Nunc iaculis porta ligula. Aliquam vel neque lorem. Maecenas id tincidunt nibh. Ut malesuada volutpat sapien, et euismod nisi. Mauris non malesuada metus. Cras nec tortor nec enim pellentesque vehicula.",
"7.4 Suspendisse bibendum accumsan orci pharetra blandit. Proin aliquet dapibus vehicula. Phasellus pretium elit vitae eleifend euismod. Sed nunc elit, volutpat sit amet velit vitae, luctus tincidunt augue. Aenean eleifend est nisl, ac tincidunt purus gravida eget. Nunc tristique ut urna quis pulvinar. In vitae dapibus ipsum, eget interdum justo. Nulla rutrum enim odio, quis placerat mauris rutrum ut. Praesent consequat ut lorem pulvinar sodales. Integer efficitur sagittis consectetur.",
"7.5 In tellus turpis, efficitur nec ante nec, ultrices venenatis lorem. Donec ipsum neque, mollis vel est non, consectetur hendrerit odio. Nulla elementum non sapien eu scelerisque. Duis ac lacinia massa. Duis dignissim mattis ligula, eu dictum nulla ultrices nec. Aliquam scelerisque erat eget justo accumsan auctor. Quisque consectetur volutpat sagittis. Vestibulum sapien erat, suscipit mattis ullamcorper quis, lacinia non eros. Suspendisse posuere eros odio, non placerat erat maximus sed. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.",
"7.6 Nulla facilisi. Nulla sit amet orci eu sapien mattis convallis. Sed imperdiet at lectus auctor euismod. Pellentesque et ipsum ut sapien fringilla convallis in hendrerit enim. Phasellus eget mauris urna. Praesent eleifend rhoncus enim vitae malesuada. Mauris volutpat varius eros, et luctus diam bibendum sed. Donec ut feugiat erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed id nibh nibh.",
"7.7 Morbi vehicula, metus quis bibendum porttitor, magna massa sollicitudin neque, id sodales dui augue id ex. Proin ut massa at sem dictum finibus. Ut ullamcorper et neque at varius. Ut ex purus, semper a efficitur vel, sodales ac nisl. Fusce aliquet molestie turpis sed vulputate. Pellentesque sodales, ipsum at varius molestie, magna risus suscipit justo, tincidunt maximus velit magna id quam. Morbi at faucibus quam, in dictum nunc. Sed vehicula enim eu enim condimentum, cursus suscipit orci volutpat. Nullam quam quam, accumsan at dolor quis, sagittis tempor nunc. Etiam faucibus orci mattis libero faucibus blandit. Donec eros ligula, tincidunt et convallis ut, vestibulum eget ante. Integer rutrum justo ipsum, eu dapibus turpis sagittis a. Cras at ante nulla. Praesent vehicula pellentesque metus, at varius massa cursus eu. Cras orci sapien, semper sit amet justo sit amet, scelerisque faucibus massa. Morbi volutpat pulvinar nunc in finibus."
]>><<set $mission8 = ["8.1 Vestibulum malesuada nisi a dui lobortis vulputate. Donec sit amet accumsan sem, non luctus nibh. Donec quis lacus at dolor sollicitudin lobortis tristique eu nisl. Vivamus quis rutrum mauris. Nullam et justo at ligula dapibus tempor eget sit amet orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed eget quam ut magna mattis facilisis. Integer porta purus lacus, id sodales urna tincidunt vel. Maecenas euismod placerat lacinia. Maecenas eu varius dui.",
"8.2 Donec erat odio, lobortis ut varius venenatis, convallis vel purus. Nullam at nisl sed metus varius ultricies nec a orci. Nunc congue, lectus eu pellentesque tristique, tortor quam maximus dolor, eu lacinia ligula eros ac augue. Aliquam eu erat viverra neque viverra volutpat. Duis orci quam, porta eget iaculis eget, ultricies et libero. Nulla facilisi. Proin ultrices ligula a turpis vehicula vestibulum. Aliquam ac egestas lectus. Donec eu iaculis ipsum. Quisque scelerisque, mauris ut fringilla commodo, augue lorem aliquam mi, quis imperdiet ante sem id felis. Donec eget ligula tellus. Mauris ut erat magna.",
"8.3 Phasellus sagittis erat eget tellus rhoncus dignissim. Phasellus mollis est nec enim convallis, et cursus tortor ultrices. Pellentesque scelerisque nec tortor at ultricies. Fusce tempus, lorem non posuere tristique, erat tellus vehicula justo, sollicitudin molestie arcu diam eget sapien. Integer ut lectus ac mauris condimentum imperdiet ac ut mauris. Nullam neque elit, pretium lobortis suscipit sed, cursus a lorem. Nunc iaculis porta ligula. Aliquam vel neque lorem. Maecenas id tincidunt nibh. Ut malesuada volutpat sapien, et euismod nisi. Mauris non malesuada metus. Cras nec tortor nec enim pellentesque vehicula.",
"8.4 Suspendisse bibendum accumsan orci pharetra blandit. Proin aliquet dapibus vehicula. Phasellus pretium elit vitae eleifend euismod. Sed nunc elit, volutpat sit amet velit vitae, luctus tincidunt augue. Aenean eleifend est nisl, ac tincidunt purus gravida eget. Nunc tristique ut urna quis pulvinar. In vitae dapibus ipsum, eget interdum justo. Nulla rutrum enim odio, quis placerat mauris rutrum ut. Praesent consequat ut lorem pulvinar sodales. Integer efficitur sagittis consectetur.",
"8.5 In tellus turpis, efficitur nec ante nec, ultrices venenatis lorem. Donec ipsum neque, mollis vel est non, consectetur hendrerit odio. Nulla elementum non sapien eu scelerisque. Duis ac lacinia massa. Duis dignissim mattis ligula, eu dictum nulla ultrices nec. Aliquam scelerisque erat eget justo accumsan auctor. Quisque consectetur volutpat sagittis. Vestibulum sapien erat, suscipit mattis ullamcorper quis, lacinia non eros. Suspendisse posuere eros odio, non placerat erat maximus sed. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.",
"8.6 Nulla facilisi. Nulla sit amet orci eu sapien mattis convallis. Sed imperdiet at lectus auctor euismod. Pellentesque et ipsum ut sapien fringilla convallis in hendrerit enim. Phasellus eget mauris urna. Praesent eleifend rhoncus enim vitae malesuada. Mauris volutpat varius eros, et luctus diam bibendum sed. Donec ut feugiat erat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed id nibh nibh.",
"8.7 Morbi vehicula, metus quis bibendum porttitor, magna massa sollicitudin neque, id sodales dui augue id ex. Proin ut massa at sem dictum finibus. Ut ullamcorper et neque at varius. Ut ex purus, semper a efficitur vel, sodales ac nisl. Fusce aliquet molestie turpis sed vulputate. Pellentesque sodales, ipsum at varius molestie, magna risus suscipit justo, tincidunt maximus velit magna id quam. Morbi at faucibus quam, in dictum nunc. Sed vehicula enim eu enim condimentum, cursus suscipit orci volutpat. Nullam quam quam, accumsan at dolor quis, sagittis tempor nunc. Etiam faucibus orci mattis libero faucibus blandit. Donec eros ligula, tincidunt et convallis ut, vestibulum eget ante. Integer rutrum justo ipsum, eu dapibus turpis sagittis a. Cras at ante nulla. Praesent vehicula pellentesque metus, at varius massa cursus eu. Cras orci sapien, semper sit amet justo sit amet, scelerisque faucibus massa. Morbi volutpat pulvinar nunc in finibus."
]>><<include "LevelSettings">>
<<include "DurationCheck">>
<div>
<p>
/* Printing mission1 array:
<<print $mission1>> */
</p>
<p>
/* Printing mission2 array:
<<print $mission2>> */
</p>
<div class="card">
<p><<include "Level 1 Top">></p>
</div>
<div class="card">
<p><<include "Level 1 Bottom">></p>
</div>
</div>
<div id="video"><iframe width="560" height="315" src="https://www.youtube.com/embed/xSY--1x66sU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
<div class="center">
<<button "Start game">> <<goto "ChooseDuration">> <</button>>
</div><script>
function SnackBar() {
var x = document.getElementById("snackbar");
x.className = "show";
setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
}
</script><span id="debugger" class="left">
<b>Debugger:</b>
Passage name: <span class="debug-color"><<print passage()>></span>
<<if def $duration>>
| Duration:
<span class="debug-color">
<<if $duration eq 0>>
Starts at 0<<elseif $duration gt 0>>
<<print $duration>><</if>>
<<if $short is true>>
short version($duration)+1
<</if>>
<<if $long is true>>
long version($duration)+1
<</if>>
</span>
<</if>>
</span>
<div class="c-text">
<p><<message>>Hello<</message>></p>
<p><<message 'How to play?' btn>>Text<</message>></p>
<p><<message 'Share' 'share'>>...<</message>></p>
<p><<message 'Feedback' 'feedback'>>...<</message>></p>
</div><div id="interface" class="wrapper">
<div id="nav" class="header" data-passage="Nav"></div>
<div id="passages" class="main"></div>
<div id="pole" class="pole"></div>
<div id="footer" data-passage="Footer"></div>
</div>
<div id="interface" class="wrapper">
<div id="nav" class="header" data-passage="Nav"></div>
<div id="passages" class="main"></div>
<div id="footer" data-passage="Footer"></div>
</div><div class="center">
<div id="pole" class="pole"></div>
</div><div class= "center">
<div class="card m-text noise">
<div class="border-inset">
<p>Each round, you'll be presented with two play-challenges. Take turns choosing which one to do. Play each challenge as best you can. Don't skip- be creative. When you're ready for the next challenge, hit the NEXT arrow below. Step out of your daily routine and have fun!</p>
</div>
</div>
<div id="next">
<div id="buttons">
<<button "">>
<<goto "How to play 1">>
<</button>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<goto "Choose Duration">>
<</button>>
</div>
</div>
<div class= "center">
<div class="magiccircle">
<<if $EN is true>>
<img src="./src/img/EN-magic-circle-noise.png" />
<<else>>
<img src="./src/img/NL-magic-circle-noise.png" />
<</if>>
</div>
<div class="card m-text center-txt">
<div class="border-inset">
<div id="audio-play">
<div id="audio">
<<button [img[src/img/audio-play.svg]]>>
<<if $EN is true>>
<<audio "intro-EN" play>>
<<else>>
<<audio "intro-NL" play>>
<</if>>
<</button>>
</div>
</div>
<<if $EN is true>>
<h2>Listen up before you play!</h2>
<h2><<link "Or read this message">></h2>
<<popover>>Before we dive into the game, we'd like to tell you about the magic circle.
<br><br>
The magic circle is the metaphorical space in which we allow ourselves to play because special rules apply. In sports, it's the field or the court- when players step onto the field, they all agree that for a set amount of time, they're going to play by different rules and roles than in everyday life. In this walk, we're inviting you to do the same. The city streets are now your playing field.
<br><br>
That said, you can only enter the magic circle voluntarily and if at any moment you need to stop playing, you can step out of the game- no questions asked.
For the next little while, dare to step out of your comfort zone and approach your environment with a playful mindset.
<br><br>
Ready for the first challenge?<</popover>>
<</link>>
<<else>>
<h2>Beluister voordat je gaat spelen!</h2>
<h2><<link "Of lees dit bericht">></h2>
<<popover>>
Voordat we aan onze Playwalk beginnen, vertellen we je graag eerst iets over de magische cirkel.
<br><br>
De magische cirkel is de metaforische ruimte waarin ons spel plaatsvindt. Het is alsof je in een andere wereld stapt. In de sport is het letterlijk het speelveld - als spelers het veld opkomen is de afspraak dat er voor een bepaalde tijd andere regels en rollen gelden dan in het dagelijks leven. We willen je nu uitnodigen om de stad als speelveld te betreden.
<br><br>
Onderdeel van elk spel is dat je de magische cirkel vrijwillig betreedt. Als je om wat voor reden dan ook uit het spel wil stappen, mag dat op elk moment, zonder verdere toelichting.
<br><br>
Dat gezegd hebbende, we dagen je graag uit om uit je comfort zone te stappen en je omgeving op speelse wijze te gaan verkennen.
<br><br>
Klaar voor de eerste uitdaging?
<</popover>>
<</link>>
<</if>>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Start game">>
<<goto "Introduction Prompt 1">>
<</button>>
<<else>>
<<button "Start het spel">>
<<goto "Introduction Prompt 1">>
<</button>>
<</if>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<audio "intro-EN" stop>>
<<audio "intro-NL" stop>>
<<goto "How to play 5">>
<</button>>
</div>
</div>
</div><script>
function Sticker() {
var x = document.getElementById("sticker-visi");
x.className = "show";
setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
}
</script><<set $thispassage = passage()>>
<div id="next">
<<button "">>
<<set $duration++>>
<<goto $thispassage>>
<</button>>
</div>
<div class="arrow-card">
<div class="arrow-fwd"><img align="middle" src="./src/img/arrow.svg"/></div>
</div>
[img[Go home|arrow.svg][Home][$duration++]]
[img[$show|$src][$go][$done to true]]<<set $stickers = ["1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20"]>>
<<set $stickers.shuffle()>>
<<if $duration eq 1>
<<print $stickers[0]>>
<<if $duration eq 0>
<<print $stickers[1]>>
<<if $duration eq 1>
<<print $stickers[2]>>
<<if $duration eq 1>
<<print $stickers[3]>>
for each loop?
<<set $stickercounter eq $duration>>
<<if $stickercounter eq 1>>
<<print $stickers[0]>>
<<elseif $stickercounter eq 2>
<<print $stickers[1]>>
<<elseif $stickercounter eq 3>
<<print $stickers[2]>>
<<elseif $stickercounter eq 4>
<<print $stickers[3]>>
<<elseif $stickercounter eq 5>
<<print $stickers[4]>>
<<elseif $stickercounter eq 6>
<<print $stickers[5]>>
<<elseif $stickercounter eq 7>
<<print $stickers[6]>>
<<elseif $stickercounter eq 8>
<<print $stickers[7]>>
<<elseif $stickercounter eq 9>
<<print $stickers[8]>>
<<elseif $stickercounter eq 10>
<<print $stickers[9]>>
<<elseif $stickercounter eq 11>
<<print $stickers[10]>>
<<elseif $stickercounter eq 12>
<<print $stickers[11]>>
<<elseif $stickercounter eq 13>
<<print $stickers[12]>>
<<elseif $stickercounter eq 14>
<<print $stickers[13]>>
<<elseif $stickercounter eq 15>
<<print $stickers[14]>>
<<elseif $stickercounter eq 16>
<<print $stickers[15]>>
<<elseif $stickercounter eq 17>
<<print $stickers[16]>>
<<elseif $stickercounter eq 18>
<<print $stickers[17]>>
<<elseif $stickercounter eq 19>
<<print $stickers[18]>>
<<elseif $stickercounter eq 20>
<<print $stickers[19]>>
<</if>><<include "Sticker">>
<<include "Stickers">>
<<timed 0s>><<run Sticker()>><</timed>>
<div id="sticker-visi">
<div id="sticker" class="stick-cont">
<<if $duration eq 0>>
<img src="./src/img/stickers/sticker-s.svg"/>
<<elseif $sticker eq 1>>
<img src="./src/img/stickers/sticker-s.svg"/>
<<elseif $sticker eq 1>>
<img src="./src/img/stickers/sticker-s.svg"/>
<</if>>
</div>
</div><<if $stickercounter eq 1>>
<img src="./src/img/stickers/st-0.svg"/>
<<elseif $stickercounter eq 2>>
<img src="./src/img/stickers/st-1.svg"/>
<<elseif $stickercounter eq 3>>
<img src="./src/img/stickers/st-2.svg"/>
<<elseif $stickercounter eq 4>>
<img src="./src/img/stickers/st-3.svg"/>
<<elseif $stickercounter eq 5>>
<img src="./src/img/stickers/st-4.svg"/>
<<elseif $stickercounter eq 6>>
<img src="./src/img/stickers/st-5.svg"/>
<<elseif $stickercounter eq 7>>
<img src="./src/img/stickers/st-6.svg"/>
<<elseif $stickercounter eq 8>>
<img src="./src/img/stickers/st-7.svg"/>
<<elseif $stickercounter eq 9>>
<img src="./src/img/stickers/st-8.svg"/>
<<elseif $stickercounter eq 10>>
<img src="./src/img/stickers/st-9.svg"/>
<<elseif $stickercounter eq 11>>
<img src="./src/img/stickers/st-10.svg"/>
<<elseif $stickercounter eq 12>>
<img src="./src/img/stickers/st-11.svg"/>
<<elseif $stickercounter eq 13>>
<img src="./src/img/stickers/st-12.svg"/>
<<elseif $stickercounter eq 14>>
<img src="./src/img/stickers/st-13.svg"/>
<<elseif $stickercounter eq 15>>
<img src="./src/img/stickers/st-14.svg"/>
<<elseif $stickercounter eq 16>>
<img src="./src/img/stickers/st-15.svg"/>
<<elseif $stickercounter eq 17>>
<img src="./src/img/stickers/st-16.svg"/>
<<elseif $stickercounter eq 18>>
<img src="./src/img/stickers/st-17.svg"/>
<<elseif $stickercounter eq 19>>
<img src="./src/img/stickers/st-18.svg"/>
<<elseif $stickercounter eq 20>>
<img src="./src/img/stickers/st-19.svg"/>
<</if>>
<<set $stickers = ["<img src="./src/img/stickers/st-0.svg"/>",
"<img src="./src/img/stickers/st-1.svg"/>", "<img src="./src/img/stickers/st-3.svg"/>", "<img src="./src/img/stickers/st-5.svg"/>", "<img src="./src/img/stickers/st-6.svg"/>", "<img src="./src/img/stickers/st-7.svg"/>", "<img src="./src/img/stickers/st-8.svg"/>", "<img src="./src/img/stickers/st-9.svg"/>", "<img src="./src/img/stickers/st-10.svg"/>", "<img src="./src/img/stickers/st-11.svg"/>", "<img src="./src/img/stickers/st-12.svg"/>", "<img src="./src/img/stickers/st-13.svg"/>", "<img src="./src/img/stickers/st-14.svg"/>", "<img src="./src/img/stickers/st-15.svg"/>", "<img src="./src/img/stickers/st-16.svg"/>", "<img src="./src/img/stickers/st-17.svg"/>", "<img src="./src/img/stickers/st-18.svg"/>", "<img src="./src/img/stickers/st-19.svg"/>", "<img src="./src/img/stickers/st-20.svg"/>",
]>>
<<set $stickers.shuffle()>><<set $stickerrandom to $stickercounter.pluck()>>
<<if $stickerrandom is "st-0">>
<img src="./src/img/stickers/st-0.svg"/>
<<elseif $stickerrandom is "st-1">>
<img src="./src/img/stickers/st-1.svg"/>
<<elseif $stickerrandom is "st-2">>
<img src="./src/img/stickers/st-2.svg"/>
<<elseif $stickerrandom is "st-3">>
<img src="./src/img/stickers/st-3.svg"/>
<<elseif $stickerrandom is "st-3">>
<img src="./src/img/stickers/st-4.svg"/>
<<elseif $stickerrandom is "st-4">>
<img src="./src/img/stickers/st-5.svg"/>
<<elseif $stickerrandom is "st-5">>
<img src="./src/img/stickers/st-6.svg"/>
<<elseif $stickerrandom is "st-6">>
<img src="./src/img/stickers/st-7.svg"/>
<<elseif $stickerrandom is "st-7">>
<img src="./src/img/stickers/st-8.svg"/>
<<elseif $stickerrandom is "st-8">>
<img src="./src/img/stickers/st-9.svg"/>
<<elseif $stickerrandom is "st-10">>
<img src="./src/img/stickers/st-10.svg"/>
<<elseif $stickerrandom is "st-11">>
<img src="./src/img/stickers/st-11.svg"/>
<<elseif $stickerrandom is "st-12">>
<img src="./src/img/stickers/st-12.svg"/>
<<elseif $stickerrandom is "st-13">>
<img src="./src/img/stickers/st-13.svg"/>
<<elseif $stickerrandom is "st-14">>
<img src="./src/img/stickers/st-14.svg"/>
<<elseif $stickerrandom is "st-15">>
<img src="./src/img/stickers/st-15.svg"/>
<<elseif $stickerrandom is "st-16">>
<img src="./src/img/stickers/st-16.svg"/>
<<elseif $stickerrandom is "st-17">>
<img src="./src/img/stickers/st-17.svg"/>
<<elseif $stickerrandom is "st-18">>
<img src="./src/img/stickers/st-18.svg"/>
<<elseif $stickerrandom is "st-19">>
<img src="./src/img/stickers/st-19.svg"/>
<</if>>
<<if $EN is true>>
<span id="select-or">
<div id="or" class="or"><<button "OR">><</button>></div>
</span>
<</if>>
<<if $EN is false>>
<span id="select-or">
<div id="or" class="or"><<button "OF">><</button>></div></span>
<</if>>/* Back Button
<<include "Comp Back Temp">>*/
<div class= "center">
<div id="card" class="noise card m-text">
<div class="border-inset c-text">
<h2>A question for you from the game-creators...</h2>
</div>
</div>
<div id="card" class="noise card m-text">
<div class="border-inset c-text">
<h2>Placeholder for the Videoask-embed</h2>
</div>
</div>
/*<div id="next">
<div id="buttons">
<<button "">>
<<goto "End">>
<</button>>
</div>
</div>
*/
<div id="buttons">
<<button "Restart game">><<run Engine.restart()>><</button>></div>
</div>
<div class= "center">
<div class="card m-text noise circle">
<div class="border-inset">
<div class="magiccircle-cont">
<ul class="ch-grid">
<li>
<div class="ch-item ch-img-1">
<div class="ch-info">
<h3>Murrawad een Goodjagra Program, this is a good test.</h3>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="card m-text noise">
<div class="border-inset">
Let op! Speel af voor je gaat spelen.
</div>
</div>
<div id="next">
<div id="buttons">
<<button "">>
<<goto "Level 1">>
<</button>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<goto "Rules">>
<</button>>
</div>
</div>
</div>
<<script>>
$('div.ch-info').each(function () {
var h = ($(this).height() - $(this).children('h3').outerHeight()) / 2;
$(this).children('h3').css('margin-top', h + 'px');
});
<</script>><div class= "center">
<div class="card m-text noise">
<div class="border-inset hp-np">
<div class="how-play">
<<include "HOW TO PLAY">>
</div>
<h2>
<<if $EN is true>>
1. Grab a friend and hit the street! You only need one phone to play.
<br><br>
You choose the location or route. Decide whether you want to wander around in a certain area or if you’re going to Playwalk from A to B.
<</if>>
<<if $EN is false>>
1. Nodig een vriend(in) uit en ga de straat op. Je hebt maar één telefoon nodig.
<br><br>
Kies zelf hoe je wilt wandelen: een route van A naar B afleggen óf rondlopen in een bepaald gebied.
<</if>>
</h2>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Ok, sounds good">>
<<goto "How to play 2">>
<</button>>
<<else>>
<<button "Klinkt goed">>
<<goto "How to play 2">>
<</button>>
<</if>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<goto "Choose Duration">>
<</button>>
</div>
</div>
</div>
<div class= "center">
<div class="card m-text noise">
<div class="border-inset hp-np">
<div class="how-play"><<include "HOW TO PLAY">>
</div>
<h2>
<<if $EN is true>>
2. Elect a gamemaster.
<br><br>
Play rock-paper-scissors to determine who will hold the phone and read the Play Challenges out loud during the game.
<<else>>
2. Kies een spelleider.
<br><br>
Speel steen-papier-
schaar om te bepalen wie de telefoon vasthoudt en de uitdagingen hardop voorleest.
<</if>>
</h2>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Gamemaster is ready">>
<<goto "How to play 3">>
<</button>>
<<else>>
<<button "Spelleider gekozen">>
<<goto "How to play 3">>
<</button>>
<</if>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<goto "How to play 1">>
<</button>>
</div>
</div>
</div><div class= "center">
<div class="card m-text noise">
<div class="border-inset hp-np">
<div class="how-play"><<include "HOW TO PLAY">>
</div>
<h2>
<<if $EN is true>>
3. The Playwalk consists of several rounds. The progress bar at the top shows you how far along you are.
<br><br>
We’ll start with a few warm-ups and then turn up the heat as you make your way through the Play Challenges.
<<else>>
3. De Playwalk bestaat uit verschillende rondes. De voortgangsbalk links bovenaan laat zien hoe ver je al bent.
<br><br>
We beginnen met een paar opwarmers, waarna de rondes steeds spannender worden.
<</if>>
</h2>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "We like it hot">>
<<goto "How to play 4">>
<</button>>
<<else>>
<<button "Klinkt uitdagend">>
<<goto "How to play 4">>
<</button>>
<</if>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<goto "How to play 2">>
<</button>>
</div>
</div>
<div class= "center">
<div class="card m-text noise halfway">
<div class="border-inset hp-np">
<div class="how-play">
<<if $EN is true>>
HALFWAY POINT
<<else>>
HALVERWEGE
<</if>></div>
<<if $EN is true>>
<h1>Get ready, shit’s about to get real.</h1>
<<else>>
<h1>Zet je schrap, dit gaat pas écht uitdagend
worden.</h1>
<</if>>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Bring it on">>
<<goto "Level 3">>
<</button>>
<<else>>
<<button "Kom maar op!">>
<<goto "Level 3">>
<</button>>
<</if>>
</div>
</div>Double-click this passage to edit it.<div class= "center">
<div id="Prompt1" class="card m-text">
<div class="border-inset"><h1>
<<if $EN is true>>
Invent an improvised "secret handshake" AND applaud each other for playing along<</if>>
<<if $EN is false>>
Verzin een geïmproviseerde "secret handshake" EN geef elkaar een applaus voor het meespelen<</if>>
</h1></div>
</div>
<div id="next">
<div id="buttons">
<<button "">>
<<goto "Party">>
<</button>>
</div>
</div>
</div>
/*
<<include "Stickerscript">>
<<timed 0s>><<run Sticker()>><</timed>>
<div id="sticker-visi">
<div id="sticker" class="stick-cont">
<<include "Stickers">>
</div>
</div>*/<<if $duration eq 0>>
<<include "Stickerscript">>
<<timed 0.1s>><<run Sticker()>><</timed>>
<div id="sticker-visi">
<div id="sticker" class="stick-cont">
<<include "Stickers">>
</div>
</div>
<</if>><<if random(1, 9) gt 4>>
<<include "Stickerscript">>
<<timed 0.2s>><<run Sticker()>><</timed>>
<div id="sticker-visi">
<div id="sticker" class="stick-cont">
<<include "Stickers">>
</div>
</div>
<</if>>/* Back Button */
<div id="back-btn">
<<button [img[./src/img/arrow-prev.svg]]>>
<<goto "Welcome">>
<</button>>
</div>
<<if passage() is "Level 1">>
<div><<include "PreviousMission">></div>
<</if>>
<<if passage() is "Level 2">>
<<include "PreviousLevel">>
<</if>>
<<if passage() is "Level 3">>
<<include "PreviousLevel">>
<</if>>
<<if passage() is "Level 4">>
<<include "PreviousLevel">>
<</if>> <<button [img[./src/img/arrow-prev.svg]]>>
<<if $thispassage is "Choose Duration">>
<<goto "Welcome">>
<<elseif $thispassage is "How to play 1">>
<<goto "Choose Duration">>
<<elseif $thispassage is "How to play 2">>
<<goto "How to play 1">>
<<elseif $thispassage is "How to play 3">>
<<goto "How to play 2">>
<<elseif $thispassage is "Magic Circle">>
<<goto "How to play 3">>
<<elseif $thispassage is "Level 1">>
<<if $duration === 0>>
<<set $duration-->>
<<goto $thispassage>>
<</if>>
<<if $duration is 0>>
<<goto "Magic Circle">>
<</if>>
<<elseif $thispassage is "Level 2">>
<<if $duration > 0>>
<<set $duration-->>
<<goto $thispassage>>
<</if>>
<<if $duration === 0>>
<<if $long is true>>
<<set $duration = 8>>
<<goto "Level 1">>
<<else $short is true>>
<<set $duration = 4>>
<<goto "Level 1">>
<</if>>
<</if>>
<<elseif $thispassage is "Halfway">>
<<if $duration === 0>>
<<if $long is true>>
<<set $duration = 4>>
<<goto "Level 2">>
<<else $short is true>>
<<set $duration = 2>>
<<goto "Level 2">>
<</if>>
<</if>>
<<elseif $thispassage is "Level 3">>
<<if $duration > 0>>
<<set $duration-->>
<<goto $thispassage>>
<</if>>
<<if $duration === 0>>
<<if $long is true>>
<<set $duration = 0>>
<<goto "Halfway">>
<<elseif $short is true>>
<<set $duration = 0>>
<<goto "Halfway">>
<</if>>
<</if>>
<<elseif $thispassage is "Level 4">>
<<if $duration > 0>>
<<set $duration-->>
<<goto $thispassage>>
<</if>>
<<if $duration === 0>>
<<if $long is true>>
<<set $duration = 4>>
<<goto "Level 3">>
<<else $short is true>>
<<set $duration = 2>>
<<goto "Level 3">>
<</if>>
<</if>>
<<elseif $thispassage is "Last Prompt">>
<<if $duration > 0>>
<<set $duration-->>
<<goto $thispassage>>
<</if>>
<<if $duration === 0>>
<<if $long is true>>
<<set $duration = 4>>
<<goto "Level 4">>
<<else $short is true>>
<<set $duration = 2>>
<<goto "Level 4">>
<</if>>
<</if>>
<<elseif $thispassage is "VideoAsk">>
<<goto "End">>
<<elseif $thispassage is "End">>
<<goto "VideoAsk">>
<</if>>
<</button>>
<</if>>/* Back Button */
<div id="back-btn">
<<button [img[./src/img/arrow-prev.svg]]>>
<<goto "Welcome">>
<</button>>
</div>
<<set $thispassage = passage()>>
<<if $thispassage isnot "Welcome">>
<<button [img[./src/img/arrow-prev.svg]]>>
<<if $thispassage is "Choose Duration">>
<<goto "Welcome">>
<<elseif $thispassage is "How to play 1">>
<<goto "Choose Duration">>
<<elseif $thispassage is "How to play 2">>
<<goto "How to play 1">>
<<elseif $thispassage is "How to play 3">>
<<goto "How to play 2">>
<<elseif $thispassage is "Magic Circle">>
<<goto "How to play 3">>
<<elseif $thispassage is "Level 1">>
<<if $duration > 0>>
<<set $duration-->>
<<goto $thispassage>>
<</if>>
<<if $duration is 0>>
<<goto "Magic Circle">>
<</if>>
<<elseif $thispassage is "Level 2">>
<<if $duration is 0>>
<<set $duration-->>
<<goto $thispassage>>
<</if>>
<<if $duration < 0>>
<<goto "Level 1">>
<</if>>
<<elseif $thispassage is "Halfway">>
<<goto "Level 2">>
<<elseif $thispassage is "Level 3">>
<<goto "Halfway">>
<<elseif $thispassage is "Level 4">>
<<goto "Level 3">>
<<elseif $thispassage is "Last Prompt">>
<<goto "Level 4">>
<<elseif $thispassage is "VideoAsk">>
<<goto "End">>
<<elseif $thispassage is "End">>
<<goto "VideoAsk">>
<</if>>
<</button>>
<</if>> <<button [img[./src/img/arrow-prev.svg]]>>
<<if $thispassage is "Choose Duration">>
<<goto "Welcome">>
<<elseif $thispassage is "How to play 1">>
<<goto "Choose Duration">>
<<elseif $thispassage is "How to play 2">>
<<goto "How to play 1">>
<<elseif $thispassage is "How to play 3">>
<<goto "How to play 2">>
<<elseif $thispassage is "Magic Circle">>
<<goto "How to play 3">>
<<elseif $thispassage is "Level 1" and $duration eq 0>>
<<goto "Magic Circle">>
<<elseif $thispassage is "VideoAsk">>
<<goto "End">>
<<elseif $thispassage is "End">>
<<goto "Last Prompt">>
<</if>>
<</button>><<set $thispassage = passage()>>
<<if $thispassage eq "Choose Duration" or $thispassage eq "How to play 1" eq $thispassage eq "How to play 2" or $thispassage eq "How to play 3" or $thispassage eq "Level 1" or $thispassage eq "Magic Circle" or "VideoAsk" or $thispassage eq "Last Prompt" or $thispassage eq "End">> <div id="back-btn">
<<include "Temp Back">>
</div>
<</if>>The idea here was to make a global setting for the duration of the levels.
<<set $durationlvl1long to 8>>
<<set $durationlvl1short to 4>>
<<set $durationlvl2long to 4>>
<<set $durationlvl2short to 2>>
<<set $durationlvl3long to 4>>
<<set $durationlvl3short to 2>>
<<set $durationlvl4long to 4>>
<<set $durationlvl4short to 2>><<if random(1, 9) gt 4>>
<<if $duration gt 0>>
<<include "Stickerscript">>
<<timed 0s>><<run Sticker()>><</timed>>
<div id="sticker-visi">
<div id="sticker" class="stick-cont">
<<include "Stickers">>
</div>
</div>
<</if>>
<</if>><<audio "intro-EN" stop>>
<<audio "intro-NL" stop>>
<div class= "center">
<div class="card m-text noise">
<div id="Prompt1" class="border-inset hp-np">
<div class="how-play">WARM UP
</div>
<h1><<if $EN is true>>
<<print $introprompts[0]>>
<<else>>
<<print $NLintroprompts[0]>>
<</if>>
</h1>
</div>
</div>
<div id="next">
<div id="buttons">
<<if $short is false and $long is true>>
<<button "">>
<<goto "Introduction Prompt 2">>
<</button>>
<</if>>
<<if $short is true and $long is false>>
<<button "">>
<<goto "Introduction Prompt 2">>
<</button>>
<</if>>
</div>
</div>
</div>
<div class= "center">
<div class="card m-text noise">
<div id="Prompt1" class="border-inset hp-np">
<div class="how-play">WARM UP
</div>
<h1><<if $EN is true>>
<<print $introprompts[1]>>
<<else>>
<<print $NLintroprompts[1]>>
<</if>>
</h1>
</div>
</div>
<div id="next">
<div id="buttons">
<<if $short is false and $long is true>>
<<button "">>
<<goto "New Rule">>
<</button>>
<</if>>
<<if $short is true and $long is false>>
<<button "">>
<<goto "New Rule">>
<</button>>
<</if>>
</div>
</div>
</div>
/* Back Button
<<include "Comp Back Temp">>*/
<div class= "center">
<div class="card m-text noise">
<div class="border-inset hp-np">
<div class="how-play"><<include "HOW TO PLAY">>
</div>
<h2><<if $EN is true>>
4. Play each Challenge
as best you can. Don't skip any- there’s no wrong way to play.
<br><br>
When you’ve decided together that
a Play Challenge is completed, hit the arrow below for the next round. 3-5 min per Challenge is average, but it’s up to you.
<<else>>
4. Doe elke uitdaging zo goed als je kan. Er is geen goede of foute manier om te spelen.
<br><br>
Als je samen besluit dat een uitdaging klaar is, druk dan op de pijl naar rechts voor een volgende uitdaging.
<br><br>
Hoe lang elke uitdaging duurt is aan jullie. Denk aan 3-5 min gemiddeld.
<</if>>
</h2>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Challenge accepted">>
<<goto "How to play 5">>
<</button>>
<<else>>
<<button "Dat gaat goedkomen">>
<<goto "How to play 5">>
<</button>>
<</if>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<goto "How to play 3">>
<</button>>
</div>
</div>
<div class= "center">
<div class="card m-text noise">
<div class="border-inset hp-np">
<div class="how-play">
<<include "HOW TO PLAY">>
</div>
<h2>
<<if $EN is true>>
5. The Playwalk ends when you’ve completed all of the Play Challenges.
<br><br>
The only way to lose the game is by not daring to give it your all; but you’ll be the judge of that.
<<else>>
5. De Playwalk is voorbij als je alle uitdagingen hebt volbracht.
<br><br>
De enige manier om te verliezen is wanneer je niet alles geeft.
En dat beoordeel je natuurlijk zelf.
<</if>>
</h2>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Ok, we’re ready">>
<<goto "Magic Circle">>
<</button>>
<<else>>
<<button "We zijn er klaar voor">>
<<goto "Magic Circle">>
<</button>>
<</if>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<goto "How to play 4">>
<</button>>
</div>
</div>
<div class= "center">
<div id="card" class="noise card m-text">
<div class="border-inset c-text">
<h1>Welcome
<br>to the
<br>
Playwalk
<br><br>
Ready to<br> play with<br> the rules of<br> the city?
</h1>
</div>
</div>
<div id="next-language">
<div id="buttons">
<<button "EN">>
<<set $EN to true>>
<<goto "Choose Duration">>
<</button>>
</div>
<div id="buttons">
<<button "NL">>
<<set $EN to false>>
<<goto "Choose Duration">>
<</button>>
</div>
</div>
</div>
<script>
//touch events - touchstart, touchend, touchmove, touchcancel
//There is NO tap, doubletap, swipe, swipeleft, swiperight, rotate, pinch, or zoom
//You would have to create those events yourself by connecting to the touch events.
//work on devices that are touch capable
//No error on other devices because 'touchstart' is just a name like winlottery
//The event will probably just never happen on my laptop
document.querySelector('h1').addEventListener('touchstart', f);
document.querySelector('p').addEventListener('touchend', f);
document.querySelector('p').addEventListener('touchmove', f);
document.getElementById("card").addEventListener('touchstart', f);
function f(ev){
console.log( ev.touches, ev.type );
}
</script>
<<if passage() is "Level 1" or passage() is "Level 2" or passage() is "Level 3" or passage() is "Level 4" or passage() is "Last Prompt">>
<div id="progress-bar" class="progress">
<<if $long is false and $short is true>>
<img @src='"src/img/progress-short/" + $progress + ".svg"'>
<</if>>
<<if $long is true and $short is false>>
<img @src='"src/img/progress-long/" + $progress + ".svg"'>
<</if>>
</div>
<</if>>
/*
passage() is "Introduction Prompt 1" or passage() is "Introduction Prompt 2" or */<<if $duration eq 0>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 1>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 2>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 3>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 4>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 5>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 6>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 7>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 8>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 9>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 10>>
<<print $NLmission1[$duration]>>
<<elseif $duration eq 11>>
<<print $NLmission1[$duration]>>
<</if>><<if $duration eq 0>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 1>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 2>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 3>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 4>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 5>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 6>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 7>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 8>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 9>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 10>>
<<print $NLmission2[$duration]>>
<<elseif $duration eq 11>>
<<print $NLmission2[$duration]>>
<</if>><<if $duration eq 0>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 1>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 2>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 3>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 4>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 5>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 6>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 7>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 8>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 9>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 10>>
<<print $NLmission3[$duration]>>
<<elseif $duration eq 11>>
<<print $NLmission3[$duration]>>
<</if>>
<<if $duration eq 0>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 1>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 2>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 3>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 4>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 5>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 6>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 7>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 8>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 9>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 10>>
<<print $NLmission4[$duration]>>
<<elseif $duration eq 11>>
<<print $NLmission4[$duration]>>
<</if>>
<<if $duration eq 0>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 1>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 2>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 3>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 4>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 5>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 6>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 7>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 8>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 9>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 10>>
<<print $NLmission5[$duration]>>
<<elseif $duration eq 11>>
<<print $NLmission5[$duration]>>
<</if>>
<<if $duration eq 0>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 1>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 2>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 3>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 4>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 5>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 6>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 7>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 8>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 9>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 10>>
<<print $NLmission7[$duration]>>
<<elseif $duration eq 11>>
<<print $NLmission7[$duration]>>
<</if>>
<<if $duration eq 0>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 1>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 2>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 3>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 4>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 5>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 6>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 7>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 8>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 9>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 10>>
<<print $NLmission6[$duration]>>
<<elseif $duration eq 11>>
<<print $NLmission6[$duration]>>
<</if>>
<<if $duration eq 0>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 1>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 2>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 3>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 4>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 5>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 6>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 7>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 8>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 9>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 10>>
<<print $NLmission8[$duration]>>
<<elseif $duration eq 11>>
<<print $NLmission8[$duration]>>
<</if>><<popover>>Welcome!<</popover>><<if $EN is true>>
HOW TO PLAY
<<else>>
ZO SPEEL JE
<</if>>/*
<<if random(1, 9) gt 4>>
<<if $duration gt 0>>
<<include "Stickerscript">>
<<timed 0s>><<run Sticker()>><</timed>>
<div id="sticker-visi">
<div id="sticker" class="stick-cont">
<<include "Stickers">>
</div>
</div>
<</if>>
<</if>>*/Well played,
Share on social media?
Reminder of the mission of the app.
/*true is up false is down arrow*/
<<on 'click' '#Prompt1'>>
<<set $orarrow to false>>
<<replace "#select-or">>
<div id="or" class="or-top"><<button "">><</button>></div>
<</replace>>
<</on>>
<<on 'click' '#Prompt2'>>
<<set $orarrow to true>>
<<replace "#select-or">>
<div id="or" class="or-bottom"><<button "">><</button>></div>
<</replace>>
<</on>>
/*true is up false is down arrow*/
<<on 'touchstart' '#Prompt1'>>
<<set $orarrow to false>>
<<replace "#select-or">>
<div id="or" class="or-top"><<button "">><</button>></div>
<</replace>>
<</on>>
<<on 'touchstart' '#Prompt2'>>
<<replace "#select-or">>
<<set $orarrow to true>>
<div id="or" class="or-bottom"><<button "">><</button>></div>
<</replace>>
<</on>>
/* CLICK ON OR BUTTON */
<<on 'touchstart' '#select-or'>>
<<if $orarrow is true>>
<<replace "#select-or">>
<div id="or" class="or-top"><<button "">><</button>></div>
<</replace>>
<<set $orarrow to false>>
<<else>>
<<set $orarrow to true>>
<<replace "#select-or">>
<div id="or" class="or-bottom"><<button "">><</button>></div>
<</replace>>
<<set $orarrow to true>>
<</if>>
<</on>>
<<on 'click' '#select-or'>>
<<if $orarrow is true>>
<<set $orarrow to true>>
<<replace "#select-or">>
<div id="or" class="or-top"><<button "">><</button>></div>
<</replace>>
<<elseif>>
<<set $orarrow to false>>
<<replace "#select-or">>
<div id="or" class="or-bottom"><<button "">><</button>></div>
<</replace>>
<</if>>
<</on>>
/* TAP SOUND */
<<on 'touchstart' '.card'>>
<<audio "tap5" play>>
<</on>>
<<on 'touchstart' '#buttons'>>
<<audio "tap1" play>>
<</on>>
<<on 'touchstart' '.magiccircle'>>
<<audio "tap2" play>>
<</on>>
<<on 'touchstart' '#or'>>
<<audio "tap7" play>>
<</on>>
<div class= "center">
<div class="magiccircle">
<<if $EN is true>>
<img src="./src/img/magic/magic-EN@2x.png" />
<<else>>
<img src="./src/img/magic/magic-NL@2x.png" />
<</if>>
</div>
<div class="card m-text center-txt">
<div id="audio-play">
<div id="audio">
<<button [img[src/img/audio-play.svg]]>>
<<if $EN is true>>
<<audio "intro-EN" play>>
<<else>>
<<audio "intro-NL" play>>
<</if>>
<</button>>
</div>
</div>
<div class="center">
<<if $EN is true>>
<p>Listen up before you play!</p>
<<link "Or read this message">>
<<popover>>Before we dive into the game, we'd like to tell you about the magic circle.
<br><br>
The magic circle is the metaphorical space in which we allow ourselves to play because special rules apply. In sports, it's the field or the court- when players step onto the field, they all agree that for a set amount of time, they're going to play by different rules and roles than in everyday life. In this walk, we're inviting you to do the same. The city streets are now your playing field.
<br><br>
That said, you can only enter the magic circle voluntarily and if at any moment you need to stop playing, you can step out of the game- no questions asked.
For the next little while, dare to step out of your comfort zone and approach your environment with a playful mindset.
<br><br>
Ready for the first challenge?<</popover>>
<</link>>
<<else>>
<p>Listen up before you play!</p>
<<link "Or read this message">>
<<popover>>
Voordat we aan onze Playwalk beginnen, vertellen we je graag eerst iets over de magische cirkel.
<br><br>
De magische cirkel is de metaforische ruimte waarin ons spel plaatsvindt. Het is alsof je in een andere wereld stapt. In de sport is het letterlijk het speelveld - als spelers het veld opkomen is de afspraak dat er voor een bepaalde tijd andere regels en rollen gelden dan in het dagelijks leven. We willen je nu uitnodigen om de stad als speelveld te betreden.
<br><br>
Onderdeel van elk spel is dat je de magische cirkel vrijwillig betreedt. Als je om wat voor reden dan ook uit het spel wil stappen, mag dat op elk moment, zonder verdere toelichting.
<br><br>
Dat gezegd hebbende, we dagen je graag uit om uit je comfort zone te stappen en je omgeving op speelse wijze te gaan verkennen.
<br><br>
Klaar voor de eerste uitdaging?")>>
<</popover>>
<</link>>
<</if>>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Understood.">>
<<goto "Introduction Prompt 1">>
<</button>>
<<else>>
<<button "Begrepen.">>
<<goto "Introduction Prompt 1">>
<</button>>
<</if>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<goto "How to play 5">>
<</button>>
</div>
</div>
</div><div class= "center">
<div class="magiccircle">
<<if $EN is true>>
<img src="./src/img/magic/magic-EN@2x.png" />
<<else>>
<img src="./src/img/magic/magic-NL@2x.png" />
<</if>>
</div>
<div class="card m-text center-txt">
<div id="audio-play">
<div id="audio">
<<button [img[src/img/audio-play.svg]]>>
<<if $EN is true>>
<<audio "intro-EN" play>>
<<else>>
<<audio "intro-NL" play>>
<</if>>
<</button>>
</div>
</div>
<div class="center">
<<if $EN is true>>
<p>Listen up before you play!</p>
<<link "Or read this message">>
<<run Dialog.setup("ENTERING THE MAGIC CIRCLE")>>
<<run Dialog.wiki("Before we dive into the game, we'd like to tell you about the magic circle.
<br><br>
The magic circle is the metaphorical space in which we allow ourselves to play because special rules apply. In sports, it's the field or the court- when players step onto the field, they all agree that for a set amount of time, they're going to play by different rules and roles than in everyday life. In this walk, we're inviting you to do the same. The city streets are now your playing field.
<br><br>
That said, you can only enter the magic circle voluntarily and if at any moment you need to stop playing, you can step out of the game- no questions asked.
For the next little while, dare to step out of your comfort zone and approach your environment with a playful mindset.
<br><br>
Ready for the first challenge?")>>
<<run Dialog.open()>>
<</link>>
<<else>>
<p>Listen up before you play!</p>
<<link "Or read this message">>
<<run Dialog.setup("ENTERING THE MAGIC CIRCLE")>>
<<run Dialog.wiki("Voordat we aan onze Playwalk beginnen, vertellen we je graag eerst iets over de magische cirkel.
<br><br>
De magische cirkel is de metaforische ruimte waarin ons spel plaatsvindt. Het is alsof je in een andere wereld stapt. In de sport is het letterlijk het speelveld - als spelers het veld opkomen is de afspraak dat er voor een bepaalde tijd andere regels en rollen gelden dan in het dagelijks leven. We willen je nu uitnodigen om de stad als speelveld te betreden.
<br><br>
Onderdeel van elk spel is dat je de magische cirkel vrijwillig betreedt. Als je om wat voor reden dan ook uit het spel wil stappen, mag dat op elk moment, zonder verdere toelichting.
<br><br>
Dat gezegd hebbende, we dagen je graag uit om uit je comfort zone te stappen en je omgeving op speelse wijze te gaan verkennen.
<br><br>
Klaar voor de eerste uitdaging?")>>
<<run Dialog.open()>>
<</link>>
<</if>>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Understood.">>
<<goto "Introduction Prompt 1">>
<</button>>
<<else>>
<<button "Begrepen.">>
<<goto "Introduction Prompt 1">>
<</button>>
<</if>>
</div>
</div>
<div id="previous">
<div id="buttons">
<<button "">>
<<goto "How to play 5">>
<</button>>
</div>
</div>
</div>Urban Playwalks<div class= "center">
<div class="card m-text noise">
<div class="border-inset hp-np">
<div class="how-play">
<<if $EN is true>>
NEW RULE
<<else>>
NIEUWE REGEL
<</if>>
</div>
<h2>
<<if $EN is true>>
Each round, you'll be presented with 2 Play Challenges. Take turns choosing which one to do.
<br><br>
The shortest player gets the first turn.
<<else>>
Elke ronde kan je kiezen uit twee uitdagingen. Je mag om de beurt kiezen.
<br><br>
De kortste speler krijgt als eerste de beurt.
<</if>>
</h2>
</div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "Power to the shorties">>
<<goto "Level 1">>
<</button>>
<<else>>
<<button "Goede keuze">>
<<goto "Level 1">>
<</button>>
<</if>>
</div>
</div><<addclass "body" "purple">>
<<addclass "body" "brown">>
<<addclass "body" "blue">>
<<addclass "body" "green">>
<<addclass "body" "pink">>
<<addclass "body" "orange">>
<<set $bodycolor =["purple", "brown", "blue", "green", "pink", "orange"]>>
<<set $bodycolor.shuffle()>>
<<print $bodycolor[0]>>
<<addclass "body" "$bodycolor[0]">>
<<addclass "body" "brown">>
<<addclass "body" "blue">>
<<addclass "body" "green">>
<<addclass "body" "pink">>
<<addclass "body" "orange">>
<</if>>
<<if is "Café">>
<<addclass "body" "green">>
<<if random(1, 9) gt 4>>
<<set $bgcolor.random(1,6)>>
<<if $bgcolor is 1>>
<<addclass "body" "purple">>
<<elseif $bgcolor is 2>>
<<addclass "body" "brown">>
<<elseif $bgcolor is 3>>
<<addclass "body" "blue">>
<<elseif $bgcolor is 4>>
<<addclass "body" "green">>
<<elseif $bgcolor is 5>>
<<addclass "body" "pink">>
<<elseif $bgcolor is 6>>
<<addclass "body" "orange">>
<</if>>
<div class= "center">
<div class="card m-text noise">
<div class="border-inset hp-np">
<div class="how-play">
<<if $EN is true>>
HOW WAS IT?
<<else>>
HOE WAS HET?
<</if>>
</div>
<h2>
<<if $EN is true>>
We want to know how you played the game!
<<else>>
We horen graag wat je van het spel vindt!
<</if>>
</h2>
<div id="videoaskembed">
<iframe src="https://www.videoask.com/f17sgwx2g"
allow="camera *; microphone *; autoplay *; encrypted-media *; fullscreen *; display-capture *;"
width="100%"
height="500px"
style="border: none; border-radius: 0.5em"
>
</iframe>
</div>
<h2>
<<if $EN is true>>
Leave a message for the makers
<<else>>
Laat een boodschap achter voor de makers
<</if>>
</h2>
</div>
</div>
<div id="buttons" class="last-div">
<div id="end" class="card m-text end-bg">
<div class="border-inset end-border">
<<if $EN is true>>
Play again with new challenges! <<else>>
Speel opnieuw met<br>nieuwe uitdagingen!
<</if>>
</div>
</div>
</div>
</div>
<<on 'click' '#end'>>
<<run Engine.restart()>>
<</on>>
<<on 'touchend' '#end'>>
<<run Engine.restart()>>
<</on>><p class="menu">
<ul>
<li>
ABOUT
<br>URBAN PLAYWALKS
<p>An Urban Playwalk is a series of playful challenges and street games that play with the rules of city life.</p>
<<message 'Read more'>>
<p>This game is a part of the <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>Raum Der Lusten Exhibition 2021.</a> on display in Utrecht from May 1-August 29, 2021. Play the game while visiting the outdoor exhibition or any other urban environment you happen to find yourself in.</p>
<p>Urban Playwalks is a play-based city-making initiative founded by Lily Higgins & Bruno Setola in 2019. If you enjoyed this game, join our community of Playwalkers <a href="https://www.meetup.com/Urban-Playwalks-Rotterdam/" target='_blank'>here</a> and come play along at future live events in Rotterdam.
</p>
<</message>>
</li>
<li>
<<message 'ABOUT THE MAKERS' 'Makers'>>
<p>Lily Higgins (USA) is an experience designer and play expert.<br>
<a href="https://www.instagram.com/lilyobserves/" target='_blank'>@lilyobserves</a><br>
<a href="https://theinterventionbureau.com" target='_blank'>theinterventionbureau.com</a>
</p>
<p>
Bruno Setola (NL) is a game thinker.<br>
<a href="https://www.instagram.com/playspacer/" target='_blank'>@playspacer</a><br>
<a href="https://playspace.cc" target='_blank'>playspace.cc</a>
</p>
<p>
Mats Tijmes (NL) is an alternative reality maker.<br>
<a href="https://www.instagram.com/matstijmes/" target='_blank'>@matstijmes</a><br>
<a href="https://matstijmes.com" target='_blank'>matstijmes.com</a>
</p>
<</message>>
</li>
<li>
<<link "RESTART GAME">><<run Engine.restart()>><</link>>
</li>
<li>
<<link "END GAME">><<goto "VideoAsk">><</link>>
</li>
<li>
<a href="#">SHARE</a>
</li>
</ul>
<p>Share your favorite challenges and tag us <a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>@urbanplaywalks</a>
</p>
<p>This digital Playwalk was especially designed for the Raum Der Lusten Exhibition 2021.</p>
</p><p class="menu">
<ul>
<li>
ABOUT
<br>URBAN PLAYWALKS
<p>An Urban Playwalk is a series of playful challenges and street games that play with the rules of city life.</p>
<<message 'Read more'>>
<p>This game is a part of the <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>Raum Der Lusten Exhibition 2021.</a> on display in Utrecht from May 1-August 29, 2021. Play the game while visiting the outdoor exhibition or any other urban environment you happen to find yourself in.</p>
<p>Urban Playwalks is a play-based city-making initiative founded by Lily Higgins & Bruno Setola in 2019. If you enjoyed this game, join our community of Playwalkers <a href="https://www.meetup.com/Urban-Playwalks-Rotterdam/" target='_blank'>here</a> and come play along at future live events in Rotterdam.
</p>
<</message>>
</li>
<li>
<<message 'ABOUT THE MAKERS' 'Makers'>>
<p>Lily Higgins (USA) is an experience designer and play expert.<br>
<a href="https://www.instagram.com/lilyobserves/" target='_blank'>@lilyobserves</a><br>
<a href="https://theinterventionbureau.com" target='_blank'>theinterventionbureau.com</a>
</p>
<p>
Bruno Setola (NL) is a game thinker.<br>
<a href="https://www.instagram.com/playspacer/" target='_blank'>@playspacer</a><br>
<a href="https://playspace.cc" target='_blank'>playspace.cc</a>
</p>
<p>
Mats Tijmes (NL) is an alternative reality maker.<br>
<a href="https://www.instagram.com/matstijmes/" target='_blank'>@matstijmes</a><br>
<a href="https://matstijmes.com" target='_blank'>matstijmes.com</a>
</p>
<</message>>
</li>
<li>
<<link "RESTART GAME">><<run Engine.restart()>><</link>>
</li>
<li>
<<link "END GAME">><<goto "VideoAsk">><</link>>
</li>
<li>
<a href="#">SHARE</a>
</li>
</ul>
<p>Share your favorite challenges and tag us <a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>@urbanplaywalks</a>
</p>
<p>This digital Playwalk was especially designed for the Raum Der Lusten Exhibition 2021.</p>
</p><<include "ProgressBar">>
<<include "SignSound">>
/* Open menu */
<div class="menu-place">
<a href="javascript:void(0)" class="black-btn" onclick="openNav();">
<img alt="menu-icon" src="./src/img/menu-black.svg" width="40" height="36">
</a>
</div>
/* The Overlay */
<div id="myNav" class="overlay">
<div class="overlay-border">
<div class="menu-place">
<a href="javascript:void(0)" class="black-btn" onclick="closeNav();">
<img alt="menu-icon" src="./src/img/menu-white.svg" width="40" height="36">
</a>
/* <a href="javascript:void(0)" class="menu-btn" onclick="closeNav();"></a> */
</div>
<div class="overlay-content items">
<<link "EN">>
<<replace "#overlay-menu-text">><<include "MENU_EN">><</replace>><</link>>
/
<<link "NL">><<replace "#overlay-menu-text">><<include "MENU_EN">><</replace>><</link>>
<span id="overlay-menu-text">
<p>
<ul>
<li>
ABOUT
<br>URBAN PLAYWALKS
<p>A Playwalk is a series of playful challenges and street games that play with the rules of city life.</p>
<p>The game you hold in your hand is a part of the Urban Playwalks initiative founded by Lily Higgins & Bruno Setola. If you enjoyed this game, join our community of Playwalkers <a href="https://www.meetup.com/Urban-Playwalks-Rotterdam/" target='_blank'>here</a> and come play along at future live events in Rotterdam.</p>
<p>This digital Playwalk was especially designed for the <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>Raum Der Lusten Exhibition 2021.</a></p>
</li>
<li>
<a href="#">HOW TO PLAY</a>
</li>
<li>
<<link "RESTART GAME">><<run Engine.restart()>><</link>>
</li>
<li>
<<link "END GAME">><<goto "VideoAsk">><</link>>
</li>
<li>
<<message 'ABOUT THE MAKERS' 'Makers'>>
<p>Lily Higgins (USA) is an experience designer and play expert.<br>
<a href="https://www.instagram.com/lilyobserves/" target='_blank'>@lilyobserves</a><br>
<a href="https://theinterventionbureau.com" target='_blank'>theinterventionbureau.com</a>
</p>
<p>
Bruno Setola (NL) is a game thinker.<br>
<a href="https://www.instagram.com/playspacer/" target='_blank'>@playspacer</a><br>
<a href="https://playspace.cc" target='_blank'>playspace.cc</a>
</p>
<p>
Mats Tijmes (NL) is an alternative reality designer, art director, creative developer and game designer.<br>
<a href="https://www.instagram.com/matstijmes/" target='_blank'>@matstijmes</a><br>
<a href="https://matstijmes.com" target='_blank'>matstijmes.com</a>
</p>
<</message>>
</li>
<li><<link "GIVE FEEDBACK">><<goto "VideoAsk">><</link>></li>
<li><a href="#">SHARE</a></li>
</ul>
Share your favorite challenges and tag us <a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>@urbanplaywalks</a>
</p>
</span>
</div>
</div>
</div>
<script>
function openNav() {
document.getElementById("myNav").style.height = "100%";
}
function closeNav() {
document.getElementById("myNav").style.height = "0%";
}
</script><<set $bgcolor to random(1, 10)>>
<<if $bgcolor eq 1>>
<<addclass "body" "purple">>
<</if>>
<<if $bgcolor eq 2>>
<<addclass "body" "brown">>
<</if>>
<<if $bgcolor eq 3>>
<<addclass "body" "blue">>
<</if>>
<<if $bgcolor eq 4>>
<<addclass "body" "green">>
<</if>>
<<if $bgcolor eq 5>>
<<addclass "body" "pink">>
<</if>>
<<if $bgcolor eq 6>>
<<addclass "body" "orange">>
<</if>><<include "DISCOTIME">>
<div class= "center">
<div id="Prompt1" class="card m-text centertext ending">
<div class="border-inset">
<<if $EN is true>>
<h4>Well played!</h4><br>
<h1>You gave it your all.<br><br>
Welcome to the Playwalker Club!</h1><</if>>
<<if $EN is false>>
<h4>Goed gespeeld!</h4><br>
<h1>Je hebt alles gegeven.<br><br> Welkom bij de Playwalkers Club!</h1><</if>></div>
</div>
<div id="next-long">
<div id="buttons">
<<if $EN is true>>
<<button "One last thing...">>
<<goto "VideoAsk">>
<</button>>
<<else>>
<<button "Nog één ding...">>
<<goto "VideoAsk">>
<</button>>
<</if>>
</div>
</div><<include "ColorDisco">><<repeat 1s>>
<<set $bgcolor to random(1, 10)>>
<<if $bgcolor eq 1>>
<<addclass "body" "purple">>
<</if>>
<<if $bgcolor eq 2>>
<<addclass "body" "brown">>
<</if>>
<<if $bgcolor eq 3>>
<<addclass "body" "blue">>
<</if>>
<<if $bgcolor eq 4>>
<<addclass "body" "green">>
<</if>>
<<if $bgcolor eq 5>>
<<addclass "body" "pink">>
<</if>>
<<if $bgcolor eq 6>>
<<addclass "body" "orange">>
<</if>>
<</repeat>><<repeat 0.4s>>
<<set $bgcolor to random(1, 6)>>
<<if $bgcolor eq 1>>
<<addclass "body" "purple">>
<<timed 0.2s>><<removeclass "body" "purple">><</timed>>
<<elseif $bgcolor eq 2>>
<<addclass "body" "brown">>
<<timed 0.4s>><<removeclass "body" "brown">><</timed>>
<<elseif $bgcolor eq 3>>
<<addclass "body" "blue">>
<<timed 0.4s>><<removeclass "body" "blue">><</timed>>
<<elseif $bgcolor eq 4>>
<<addclass "body" "green">>
<<timed 0.4s>><<removeclass "body" "green">><</timed>>
<<elseif $bgcolor eq 5>>
<<addclass "body" "pink">>
<<timed 0.4s>><<removeclass "body" "pink">><</timed>>
<<elseif $bgcolor eq 6>>
<<addclass "body" "orange">>
<<timed 0.4s>><<removeclass "body" "orange">><</timed>>
<</if>>
<</repeat>><<include "ProgressBar">>
<<include "SignSound">>
/* Open menu */
<div class="menu-place">
<a href="javascript:void(0)" class="black-btn" onclick="openNav();">
<img alt="menu-icon" src="./src/img/menu-black.svg" width="40" height="36">
</a>
</div>
/* The Overlay */
<div id="myNav" class="overlay">
<div class="overlay-border">
<div class="menu-place">
<a href="javascript:void(0)" class="black-btn" onclick="closeNav();">
<img alt="menu-icon" src="./src/img/menu-white.svg" width="40" height="36">
</a>
/* <a href="javascript:void(0)" class="menu-btn" onclick="closeNav();"></a> */
</div>
<div class="overlay-content items">
<<link "EN">>
<<replace "#overlay-menu-text">>
<p class="menu">
<ul>
<li>
ABOUT
<br>URBAN PLAYWALKS
<p>An Urban Playwalk is a series of playful challenges and street games that play with the rules of city life.</p>
<<message 'Read more'>>
<p>This game is a part of the <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>Raum Der Lusten Exhibition 2021.</a> on display in Utrecht from May 1-August 29, 2021. Play the game while visiting the outdoor exhibition or any other urban environment you happen to find yourself in.</p>
<p>Urban Playwalks is a play-based city-making initiative founded by Lily Higgins & Bruno Setola in 2019. If you enjoyed this game, join our community of Playwalkers <a href="https://www.meetup.com/Urban-Playwalks-Rotterdam/" target='_blank'>here</a> and come play along at future live events in Rotterdam.
</p>
<</message>>
</li>
<li>
<<message 'ABOUT THE MAKERS' 'Makers'>>
<p>Lily Higgins (USA) is an experience designer and play expert.<br>
<a href="https://www.instagram.com/lilyobserves/" target='_blank'>@lilyobserves</a><br>
<a href="https://theinterventionbureau.com" target='_blank'>theinterventionbureau.com</a>
</p>
<p>
Bruno Setola (NL) is a game thinker.<br>
<a href="https://www.instagram.com/playspacer/" target='_blank'>@playspacer</a><br>
<a href="https://playspace.cc" target='_blank'>playspace.cc</a>
</p>
<p>
Mats Tijmes (NL) is an alternative reality maker.<br>
<a href="https://www.instagram.com/matstijmes/" target='_blank'>@matstijmes</a><br>
<a href="https://matstijmes.com" target='_blank'>matstijmes.com</a>
</p>
<</message>>
</li>
<li>
<<link "RESTART GAME">><<run Engine.restart()>><</link>>
</li>
<li>
<<link "END GAME">><<goto "VideoAsk">><</link>>
</li>
<li>
<a href="#">SHARE</a>
</li>
</ul>
<p>Share your favorite challenges and tag us <a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>@urbanplaywalks</a>
</p>
<p>This digital Playwalk was especially designed for the Raum Der Lusten Exhibition 2021.</p>
</p>
<</replace>>
<</link>>
/
<<link "NL">>
<<replace "#overlay-menu-text">>
<<include "MENUNL">>
<</replace>>
<</link>>
</div>
<span id="overlay-menu-text">
<<if $ENMENU is true>>
<p class="menu">
<ul>
<li>
ABOUT
<br>URBAN PLAYWALKS
<p>An Urban Playwalk is a series of playful challenges and street games that play with the rules of city life.</p>
<<message 'Read more'>>
<p>This game is a part of the <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>Raum Der Lusten Exhibition 2021.</a> on display in Utrecht from May 1-August 29, 2021. Play the game while visiting the outdoor exhibition or any other urban environment you happen to find yourself in.</p>
<p>Urban Playwalks is a play-based city-making initiative founded by Lily Higgins & Bruno Setola in 2019. If you enjoyed this game, join our community of Playwalkers <a href="https://www.meetup.com/Urban-Playwalks-Rotterdam/" target='_blank'>here</a> and come play along at future live events in Rotterdam.
</p>
<</message>>
</li>
<li>
<<message 'ABOUT THE MAKERS' 'Makers'>>
<p>Lily Higgins (USA) is an experience designer and play expert.<br>
<a href="https://www.instagram.com/lilyobserves/" target='_blank'>@lilyobserves</a><br>
<a href="https://theinterventionbureau.com" target='_blank'>theinterventionbureau.com</a>
</p>
<p>
Bruno Setola (NL) is a game thinker.<br>
<a href="https://www.instagram.com/playspacer/" target='_blank'>@playspacer</a><br>
<a href="https://playspace.cc" target='_blank'>playspace.cc</a>
</p>
<p>
Mats Tijmes (NL) is an alternative reality maker.<br>
<a href="https://www.instagram.com/matstijmes/" target='_blank'>@matstijmes</a><br>
<a href="https://matstijmes.com" target='_blank'>matstijmes.com</a>
</p>
<</message>>
</li>
<li>
<<link "RESTART GAME">><<run Engine.restart()>><</link>>
</li>
<li>
<<link "END GAME">><<goto "VideoAsk">><</link>>
</li>
<li>
<a href="#">SHARE</a>
</li>
</ul>
<p>Share your favorite challenges and tag us <a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>@urbanplaywalks</a>
</p>
<p>This digital Playwalk was especially designed for the Raum Der Lusten Exhibition 2021.</p>
</p>
<<elseif $ENMENU is false>>
<<include "MENUNL">>
<</if>>
</span>
</div>
</div>
<script>
function openNav() {
document.getElementById("myNav").style.height = "100%";
}
function closeNav() {
document.getElementById("myNav").style.height = "0%";
}
</script><p class="menu">
<ul>
<li>
<<if $EN is true>>ABOUT
<br>URBAN PLAYWALKS
<<else>>
OVER
<br>URBAN PLAYWALKS
<</if>>
<p>
<<if $EN is true>>
An Urban Playwalk is a series of playful challenges and street games that play with the rules of city life.
<<else>>
Een Urban Playwalk is een serie speelse uitdagingen en straatspellen die spelen met de regels van het stadsleven.
<</if>>
</p>
<<if $EN is true>>
<<message 'Read more' 'read more'>>
<p>
This game is a part of <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>RAUM Der Lusten</a> on display in Utrecht from April 30-August 29, 2021. Play the game while visiting the outdoor exhibition or any other urban environment you happen to find yourself in.
</p>
<p>
<a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>Urban Playwalks</a> is a play-based city-making initiative founded by Lily Higgins & Bruno Setola in 2019. If you enjoyed this game, join our community of Playwalkers <a href="https://www.meetup.com/Urban-Playwalks-Rotterdam/" target='_blank'>here</a> and come play along at future live events in Rotterdam.
</p>
<</message>>
<<else>>
<<message 'Lees meer' 'read more NL'>>
<p>
Dit spel is onderdeel van <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>RAUM Der Lusten</a>, te zien in Utrecht van 30 april t/m 29 augustus 2021. Speel het spel tijdens je bezoek aan de openluchttentoonstelling of elke andere stedelijke omgeving waar je je momenteel in bevindt.
</p>
<p>
Urban Playwalks is een op spel gebaseerd <i>city-making</i> initiatief, in 2019 opgericht door Lily Higgins & Bruno Setola. Als je plezier hebt beleefd aan dit spel, doe dan <a href="https://www.meetup.com/Urban-Playwalks-Rotterdam/" target='_blank'>hier</a> mee met onze <i>community</i> van Playwalkers en kom meespelen tijdens onze live evenementen in Rotterdam.
</p>
<</message>>
<</if>>
</li>
<li><<if $EN is true>>
<<message 'ABOUT THE MAKERS' 'Makers'>>
<p>Lily Higgins (USA) is an experience designer and play expert.<br>
<a href="https://www.instagram.com/lilyobserves/" target='_blank'>@lilyobserves</a><br>
<a href="https://theinterventionbureau.com" target='_blank'>theinterventionbureau.com</a>
</p>
<p>
Bruno Setola (NL) is a game thinker.<br>
<a href="https://www.instagram.com/playspacer/" target='_blank'>@playspacer</a><br>
<a href="https://playspace.cc" target='_blank'>playspace.cc</a>
</p>
<p>
Mats Tijmes (NL) is an alternative reality creative.<br>
<a href="https://www.instagram.com/matstijmes/" target='_blank'>@matstijmes</a><br>
<a href="https://matstijmes.com" target='_blank'>matstijmes.com</a>
</p>
<</message>>
<<else>>
<<message 'OVER DE MAKERS' 'MakersNL'>>
<p>Lily Higgins (USA) is een <i>experience designer</i> en <i>play expert</i>.<br>
<a href="https://www.instagram.com/lilyobserves/" target='_blank'>@lilyobserves</a><br>
<a href="https://theinterventionbureau.com" target='_blank'>theinterventionbureau.com</a>
</p>
<p>
Bruno Setola (NL) is een <i>game thinker.</i>
<br>
<a href="https://www.instagram.com/playspacer/" target='_blank'>@playspacer</a><br>
<a href="https://playspace.cc" target='_blank'>playspace.cc</a>
</p>
<p>
Mats Tijmes (NL) is an <i>alternative reality designer/creative</i>.<br>
<a href="https://www.instagram.com/matstijmes/" target='_blank'>@matstijmes</a><br>
<a href="https://matstijmes.com" target='_blank'>matstijmes.com</a>
</p>
<</message>>
<</if>>
</li>
<li><<if $EN is true>>
<<link "RESTART GAME">><<run Engine.restart()>><</link>>
<<else>>
<<link "HERSTART SPEL">><<run Engine.restart()>><</link>>
<</if>>
</li>
<li>
<<if $EN is true>>
<<link "END GAME">><<goto "VideoAsk">><</link>>
<<else>>
<<link "BEËINDIG SPEL">><<goto "VideoAsk">><</link>>
<</if>>
</li>
<li>
<<if $EN is true>>
<a href="#">SHARE</a>
<<else>>
<a href="#">DEEL</a>
<</if>>
</li>
</ul>
<p><<if $EN is true>>
Share your favorite challenges and tag us <a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>@urbanplaywalks</a> Show us how you play the city!
<<else>>
Deel je favoriete uitdagingen en <i>tag</i> ons <a href="https://www.instagram.com/urbanplaywalks/" target='_blank'>@urbanplaywalks</a>. Laat ons zien hoe jij met de stad speelt!
<</if>>
</p>
<p>
<<if $EN is true>>
This digital Playwalk was commissioned by <a href="https://raumutrecht.nl/" target='_blank'>RAUM</a> for the <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>RAUM Der Lusten Exhibition</a>
<<else>>
Deze digitale Playwalk is gemaakt in opdracht van <a href="https://raumutrecht.nl/" target='_blank'>RAUM</a> voor de <a href="https://raumutrecht.nl/event/raumderlusten/" target='_blank'>RAUM Der Lusten Tentoonstelling</a>
<</if>>
</p>
</p><<set $tapsound to random(0, 8)>>
<<if $tapsound eq 0>>
<<audio "tap0" play>>
<<if $tapsound eq 1>>
<<audio "tap1" play>>
<<elseif $tapsound eq 2>>
<<audio "tap2" play>>
<<elseif $tapsound eq 3>>
<<audio "tap3" play>>
<<elseif $tapsound eq 4>>
<<audio "tap4" play>>
<<elseif $tapsound eq 5>>
<<audio "tap5" play>>
<<elseif $tapsound eq 6>>
<<audio "tap6" play>>
<<elseif $tapsound eq 7>>
<<audio "tap7" play>>
<<elseif $tapsound eq 8>>
<<audio "tap8" play>>
<</if>>
/*
<<on 'touchstart' '#next'>>
<<include "TapSounds">>
<</on>>
<<on 'click' '#next'>>
<<include "TapSounds">>
<</on>>
<<on 'click' '#buttons'>>
<<include "TapSounds">>
<</on>>
<<on 'click' '.magiccircle'>>
<<include "TapSounds">>
<</on>>
<<on 'click' '.card'>>
<<include "TapSounds">>
<</on>>
/*
/* <<on 'click' '#or'>>
<<if $orarrow is true>>
<<audio "tap" play>>
<<replace "#select-or">>
<div id="or" class="or-top"><<button "">><</button>></div>
<</replace>>
<<set $orarrow to false>>
<</if>>
<</on>>
<<on 'click' '#or'>>
<<if $orarrow is false>>
<<audio "tap" play>>
<<replace "#select-or">>
<div id="or" class="or-bottom"><<button "">><</button>></div>
<</replace>>
<<set $orarrow to true>>
<</if>>
<</on>> */
/*
<<on 'touchstart' '#or'>>
<<if $orarrow is false>>
<<audio "tap" play>>
<<replace "#select-or">>
<div id="or" class="or-bottom"><<button "">><</button>></div>
<</replace>>
<<set $orarrow to true>>
<</if>>
<</on>>*/