<header class="standard">
<div class="header-item"></div>
<div class="header-item">
<h1>$title</h1>
<h3 class="subtitle">$location</h3>
<div class="multiple-icon-wrapper">
<<if $bathroom is true>>
<div class="multiple-icon-item">
<img src="assets/img/bathroom.png" >
</div>
<</if>>
<<if $wifi is true>>
<div class="multiple-icon-item">
<img src="assets/img/wifi.png" >
</div>
<</if>>
<<if $food is true>>
<div class="multiple-icon-item">
<img src="assets/img/food.png" >
</div>
<</if>>
<<if $charge is true>>
<div class="multiple-icon-item">
<img src="assets/img/charge.png" >
</div>
<</if>>
<<if $stepfree is true>>
<div class="multiple-icon-item">
<img src="assets/img/stepfree.png" >
</div>
<</if>>
<<if $caution is true>>
<div class="multiple-icon-item">
<img src="assets/img/caution.png" >
</div>
<</if>>
</div>
</div >
</header><header class="title">
<img src="assets/img/Wthbits-17.png" alt="Watching the House"/>
</header><header class="story">
<<if $showBackwards is true>>
<div class="nav-wrapper">
<div class="nav-item">
[img[Back|assets/img/back.png][$prevpass]]
</div>
</div>
<</if>>
<div id="headerinstmount"></div>
<div class="nav-wrapper" id="forIcon">
<div class="nav-item " >
[img[Forward|assets/img/for.png][$nextpass]]
</div>
</div>
</header><footer>
<<if $showBackwards is true>>
<div class="nav-wrapper">
<div class="nav-item">
[img[Back|assets/img/back.png][$prevpass]]
</div>
</div>
<</if>>
/* <<if $showRewind is true>>
<div class="nav-wrapper">
<div class="nav-item">
<<link [img[assets/img/backward.png]]>><<audio $audio time -5s>><</link>>
</div>
</div>
<</if>> */
<<if $showAudio is true>>
<div class="nav-wrapper">
<div class="nav-item">
<<link [img[assets/img/play.png]]>><<replace "#audio">><p>[audio playing...]</p><</replace>><</link>>
</div>
</div>
<</if>>
<<if $showReplay is true>>
<div class="nav-wrapper">
<div class="nav-item">
[img[Replay|assets/img/replay.png][$passage]]
</div>
</div>
<</if>>
/* <<if $showCredits is true>>
<div class="nav-wrapper">
<div class="nav-item">
[[Credits|credits]]
</div>
</div>
<</if>> */
/* <<if $showCaptionsIcon is true>>
<div class="nav-wrapper">
<div class="nav-item">
<<link [img[assets/img/captions.png]]>><<set $captions to !$captions>><<goto $passage>><</link>>
</div>
</div>
<</if>> */
/* <<if $showFF is true>>
<div class="nav-wrapper">
<div class="nav-item">
<<link [img[assets/img/forward.png]]>><<audio $audio time +10s>><</link>>
</div>
</div>
<</if>> */
<<if $showForwards is true>>
<div class="nav-wrapper" id="forIcon">
<div class="nav-item">
[img[Forward|assets/img/for.png][$nextpass]]
</div>
</div>
<</if>>
</footer><footer>
<div class="nav-wrapper">
<div class="nav-item">
[img[Back|assets/img/back.png][$prevpass]]
</div>
</div>
<div class="nav-wrapper" id="forIcon">
<div class="nav-item">
[img[Forward|assets/img/for.png][$nextpass]]
</div>
</div>
</footer><footer class="listen">
<div class="nav-wrapper">
<div class="nav-item">
[img[Back|assets/img/back.png][$prevpass]]
</div>
</div>
<div class="nav-wrapper" id="forIcon">
<div class="nav-item">
<<button "Listen to others">><<goto "listenenter">><</button>>
</div>
</div>
</footer><footer>
<div class="nav-wrapper">
<div class="nav-item">
[img[Back|assets/img/back.png][$prevpass]]
</div>
</div>
<div class="nav-wrapper">
<div class="nav-item">
[img[Replay|assets/img/replay.png][$passage]]
</div>
</div>
<div class="nav-wrapper" id="forIcon">
<div class="nav-item">
</div>
</div>
</footer><footer>
<div class="nav-wrapper">
<div class="nav-item">
[img[Back|assets/img/back.png][$prevpass]]
</div>
</div>
<div class="nav-wrapper">
</div>
</footer><footer>
<div></div>
<div class="nav-wrapper">
<div class="nav-item">
[img[Back|assets/img/for.png][$nextpass]]
</div>
</div>
</footer><footer>
<<if $showCaptionsIcon is true>>
<div class="nav-wrapper">
<div class="nav-item" id="capIcon">
<<link [img[assets/img/captions.png]]>>
<<if $captionToggle is true>>
<<toggleclass "#poster" "hide">>
<<toggleclass "#storyContainer" "captions">>
<<set $captionToggle to false>>
<<removeclass "#capIcon" "caphighlight">>
<<set $fn to setup.hideCap()>>
<<else>>
<<addclass "#capIcon" "caphighlight">>
<<toggleclass "#poster" "hide">>
<<toggleclass "#storyContainer" "captions">>
<<set $captionToggle to true>>
<<set $fn to setup.showCap()>>
<</if>>
<</link>>
</div>
</div>
<</if>>
<div class="nav-wrapper">
<div class="nav-item">
<<link "-10s">>
<<set $fn to setup.backTen()>>
<</link>>
</div>
</div>
<div class="nav-wrapper playpause-wrapper">
<div class="nav-item" id="playpause">
<<link [img[assets/img/playpause.png]]>>
<<if $playToggle is false>>
<<set $fn to setup.play()>>
<<set $playToggle to true>>
<<addclass "#playpause" "playhighlight">>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<else>>
<<set $fn to setup.pause()>>
<<set $playToggle to false>>
<<removeclass "#playpause" "playhighlight">>
<<replace "#headerinstmount">><</replace>>
<</if>>
<</link>>
</div>
</div>
<<if $showTranscriptIcon is true>>
<div class="nav-wrapper">
<div class="nav-item">
<<link [img[assets/img/transcript.png]]>>
<<if $transcript is false>>
<<set $transcript to true>>
<<replace "#transcript">>
<<include $transcriptname>>
<</replace>>
<<else>>
<<set $transcript to false>>
<<replace "#transcript">>
<</replace>>
<</if>>
<</link>>
</div>
</div>
<</if>>
<div class="nav-wrapper">
<div class="nav-item">
<<link "+10s">>
<<set $fn to setup.addTen()>>
<</link>>
</div>
</div>
<div class="nav-wrapper">
<div class="nav-item">
<<link [img[assets/img/replay.png]]>>
<<goto $passage>>
<</link>>
</div>
</div>
</footer>
/* captions */
<<done>>
<<if $captionToggle is true>>
<<addclass "#capIcon" "caphighlight">>
<<toggleclass "#poster" "hide">>
<<toggleclass "#storyContainer" "captions">>
<<set $fn to setup.showCap()>>
<</if>>
<</done>><<set $prevpass to "beginning">>
<<set $passage to "beginning">>
<<set $nextpass to "framing">>
<<set $transcript to false>>
<<set $playToggle to false>>
<<set $captionToggle to false>>
<<set $showForwards to true>>
<<set $showBackwards to false>>
<<set $showCaptionsIcon to true>>
<<addclass "body" "greengrad">>
/* <div class="comp-warning">Best experienced on a phone</div> */
<main class="beginning fadeIn" id="">
/* <h1 class="hide">Watching the House</h1> */
<img src="assets/img/Wthbits-16.png" alt="Watching the House" class="longtitle"/>
<img src="assets/img/Wthbits-17.png" alt="Watching the House" class="hide desktop"/>
<br/>
<div/>
<div class="menu-wrapper">
/* <br/> <br/> <br/> <br/> <br/> <br/> */
<<button "Start now">><<goto $nextpass>><</button>>
</div>
<div class="description-wrapper"><span class="description" >An interactive experience at Marble Hill </span></div>
</main><<set $prevpass to "beginning">>
<<set $passage to "framing">>
<<set $nextpass to "instructions1">>
<<set $transcript to false>>
<<set $playToggle to false>>
<<set $captionToggle to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
<main class="instructions" id="">
<div id="mount"></div>
<<timed 0.1s>><<replace "#mount">>
<p>Welcome to Marble Hill.</p>
<</replace>><</timed>>
<<timed 2s>><<append "#mount">>
<p>Today is your first day on the job as a Watcher for English Heritage. </p>
<</append>><</timed>>
<<timed 5s>><<append "#mount">>
<p>Your induction will be starting shortly, but first, some practical information. </p>
<</append>><</timed>>
<<timed 8s>><<append "#mount">>
<<button "Next">><<goto $nextpass>><</button>>
<</append>><</timed>>
</main>
<<include "footer">><<set $prevpass to "beginning">>
<<set $passage to "instructions1">>
<<set $nextpass to "testaudio">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>This is an interactive audio experience. </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>You can use your own headphones, or borrow a pair from the English Heritage team.</p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>Should we test if sound works?</p>
<</append>>
<</timed>>
<<timed 8s>>
<<append "#mount">>
<<button "Yes">><<goto "testaudio">><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions1">>
<<set $passage to "testaudio">>
<<set $nextpass to "instructions1sit">>
<<set $transcript to false>>
<<set $playToggle to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "premieretranscript">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story testaudio" id="storyContainer">
<audio id="audio" autoplay>
<source src="assets/audio/00soundcheck.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
</div>
<div id="caption" class="hide"></div>
/* <div id="transcript"></div> */
<div id="mount"></div>
<div id="buttons">
<<timed 2s>>
<div class="menu-wrapper col">
<<button "I can hear the audio">>
<<replace "#buttons">>
<</replace>>
<<replace "#mount">>
<<include "audioexplainer">>
<</replace>>
<</button>>
<<timed 2s>>
<br/><br/>
<<button "I can't hear anything">>
<<timed 1s>>
<<replace "#buttons">><</replace>>
<<replace "#mount">>
<p>Make sure that:</p>
<</replace>>
<</timed>>
<<timed 2s>>
<<append "#mount">>
<p>- You have plugged in headphones with the suitable adaptor (usb c or iphone) </p>
<p>- Your phone is not on mute</p>
<p>- Your phone is not paired with another bluetooth device </p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<<button "Try again">>
<<goto $passage>>
<</button>>
<</append>>
<</timed>>
<</button>>
<</timed>>
</div>
<</timed>>
</div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[testing audio...]</p><</replace>>
<<set $addC to setup.addCaptions("test")>>
<<addclass "#playpause" "playhighlight">>
<</done>><<timed 0.1s>>
<<replace "#mount">>
<p class="explainer">Audio sections can be paused by clicking the <<link [img[assets/img/playpause.png]]>><</link>> icon. </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p class="explainer"> You can move along within the audio by pressing the <span class="white">-10s</span> or <span class="white">+10s</span> icons. </p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p class="explainer">You can listen to the section again by pressing the <<link [img[assets/img/replay.png]]>><</link>> icon.
<br/>
<<timed 3s>>
<br/>
<<button "Okay">>
<<replace "#mount">>
<<include "captionsexplainer">>
<</replace>>
<</button>>
<</timed>>
</p>
<</append>>
<</timed>><<set $prevpass to "testaudio">>
<<set $passage to "testaudiodoesntwork">>
<<set $nextpass to "testaudio">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
<main class="instructions">
<div id="mount" class="onboarding"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>Best to ask a member of staff for help. </p>
<</replace>>
<<append "#mount">>
<<button "Back to Start">><<goto 'beginning'>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<timed 0.1s>>
<<append "#mount">>
<p class="explainer">Would you like to see captions? </p>
<<set $fn to setup.pause()>>
<</append>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p class="explainer">You can enable or disable them by clicking on the <<link [img[assets/img/captions.png]]>><</link>> icon below.
<<timed 2s>>
<br/> <br/>
<<button "Next">><<goto $nextpass>><</button>>
<</timed>>
</p>
<</append>>
<</timed>><<set $prevpass to "testaudio">>
<<set $passage to "instructions1sit">>
<<set $nextpass to "instructions1explainer">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<<audio ":all" stop>>
<audio id="audio" autoplay >
<source src="">
</audio>
<main class="instructions">
<div id="mount" class="onboarding"></div>
<<timed 0.1s>>
<<append "#mount">>
<p>This experience will invite you to explore Marble Hill's history and discover its secrets in unexpected places. </p>
<</append>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>Some of the collections are very delicate, but we will direct you towards the objects you can interact with and places where you can sit.</p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<<button "Next">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions1sit">>
<<set $passage to "instructions1explainer">>
<<set $nextpass to "instructions1d">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<<audio ":all" stop>>
<audio id="audio" autoplay >
<source src="">
</audio>
<main class="instructions">
<div id="mount" class="onboarding"></div>
<<timed 0.1s>>
<<append "#mount">>
<p>This adventure will take you through different rooms in the house. </p>
<</append>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>If you have any questions about the house or its history as you walk through, you can pause the audio and ask a Room Explainer, who will be more than happy to speak to you.</p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<<button "Next">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions1explainer">>
<<set $passage to "instructions1d">>
<<set $nextpass to "audio1">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<<audio ":all" stop>>
<audio id="audio" autoplay >
<source src="">
</audio>
<main class="instructions">
<div id="mount" class="onboarding"></div>
<<timed 0.1s>>
<<append "#mount">>
<p>Now that you are all set, please make your way outside the building. </p>
<</append>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>Find a quiet spot where you can have a good view of the house.</p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>If it is raining, feel free to move to the Welcome Room next door and look at the model of Marble Hill on the wall to your left.</p>
<</append>>
<</timed>>
<<timed 9s>>
<<append "#mount">>
<p>When you are in position, press start. </p>
<</append>>
<</timed>>
<<timed 10s>>
<<append "#mount">>
<<button "Start">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions1d">>
<<set $passage to "audio1">>
<<set $nextpass to "instructions2">>
<<set $transcript to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "audio1transcript">>
<<addclass "body" "green">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story" id="storyContainer">
<audio id="audio" autoplay >
<source src="assets/audio/01.OutsideTheHouseAudioFinal.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
<img class="poster" src="assets/img/house.png"/>
</div>
<div id="caption" class="hide"></div>
<div id="transcript"></div>
<div id="mount"></div>
<div id="buttons"></div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<set $addC to setup.addCaptions("audio1")>>
<<addclass "#playpause" "playhighlight">>
<</done>>
<<timed 100s>>
<<replace "#buttons">>
<<button "Next">><<goto $nextpass>><</button>>
<</replace>>
<</timed>>transcript<<set $prevpass to "audio1">>
<<set $passage to "instructions2">>
<<set $nextpass to "audio2">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>Your first shift will take place in the Great Room. </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>Walk back to the house, take the Great Stairs and go to the first floor. </p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>Ask one of the English Heritage Room Explainers if you get lost. They know the house like the back of their hand. </p>
<</append>>
<</timed>>
<<timed 9s>>
<<append "#mount">>
<p>When you are there, press the button below.</p>
<</append>>
<</timed>>
<<timed 10.5s>>
<<append "#mount">>
<div class="menu-wrapper">
<<button "I’m in the Great Room">><<goto $nextpass>><</button>>
</div>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions2">>
<<set $passage to "audio2">>
<<set $nextpass to "instructions3notebook">>
<<set $transcript to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "audio2transcript">>
<<addclass "body" "green">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story" id="storyContainer">
<audio id="audio" autoplay>
<source src="assets/audio/02.TheGreatRoomAudioFinal.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
<img class="poster" src="assets/img/house.png"/>
</div>
<div id="caption" class="hide"></div>
<div id="transcript"></div>
<div id="mount"></div>
<div id="buttons"></div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<set $addC to setup.addCaptions("audio2")>>
<<addclass "#playpause" "playhighlight">>
<</done>>
<<timed 93s>>
<<replace "#buttons">>
<div class="menu-wrapper">
<<button "I have found the notebook">><<goto "instructions3notebook">><</button>>
<<button "The notebook is not there">><<goto "instructions3nonotebook">><</button>>
</div>
<</replace>>
<</timed>>transcript<<set $prevpass to "audio2">>
<<set $passage to "instructions3notebook">>
<<set $nextpass to "instructions3b">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>I see you are one of those people who like to explore... </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>To look beyond appearances... </p>
<</append>>
<</timed>>
<<timed 5s>>
<<append "#mount">>
<p>To ask questions...</p>
<</append>>
<</timed>>
<<timed 7s>>
<<append "#mount">>
<p>That’s what we need. </p>
<</append>>
<</timed>>
<<timed 12s>>
<<replace "#mount">>
<p>In this notebook, you will find a series of questions your predecessors have asked on their first day on the job. </p>
<</replace>>
<</timed>>
<<timed 15s>>
<<append "#mount">>
<p>Have a read, and add yours. </p>
<</append>>
<</timed>>
<<timed 17s>>
<<append "#mount">>
<p>When you are done, press next.</p>
<</append>>
<</timed>>
<<timed 19s>>
<<append "#mount">>
<<button "Next">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "audio2">>
<<set $passage to "instructions3nonotebook">>
<<set $nextpass to "instructions3b">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>I’m not surprised. Objects tend to vanish. </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>Why, you may wonder?</p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>Because conveniently, uncomfortable secrets and questions are often hidden away. </p>
<</append>>
<</timed>>
<<timed 9s>>
<<append "#mount">>
<p>So today, your role will be to find them. </p>
<</append>>
<</timed>>
<<timed 12s>>
<<append "#mount">>
<p>Use your invisibility to search. To ask uncomfortable questions. </p>
<</append>>
<</timed>>
<<timed 15s>>
<<append "#mount">>
<<button "Next">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "audio2">>
<<set $passage to "instructions3b">>
<<set $nextpass to "audio3">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>The next part of your shift will be in Miss Hotham’s Bedchamber. </p>
<</replace>>
<</timed>>
<<timed 4s>>
<<append "#mount">>
<p>Face the window and take the door on your left, then walk through the next bedroom until you reach a small room with a dressing table and a mirror.</p>
<</append>>
<</timed>>
<<timed 7s>>
<<append "#mount">>
<p>Let me know when you are there.</p>
<</append>>
<</timed>>
<<timed 9s>>
<<append "#mount">>
<<button "I am in Miss Hotham’s Bedchamber">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions2">>
<<set $passage to "audio3">>
<<set $nextpass to "audio3b">>
<<set $transcript to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "audio3transcript">>
<<addclass "body" "green">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story" id="storyContainer">
<audio id="audio" autoplay>
<source src="assets/audio/03.MissHothamsBedchamberAudioPart1.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
<img class="poster" src="assets/img/house.png"/>
</div>
<div id="caption" class="hide"></div>
<div id="transcript"></div>
<div id="mount"></div>
<div id="buttons"></div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<set $addC to setup.addCaptions("audio3a")>>
<<addclass "#playpause" "playhighlight">>
<</done>>
<<timed 43s>>
<<replace "#buttons">>
<div class="menu-wrapper">
<<button "I have found the shells">><<goto $nextpass>><</button>>
</div>
<</replace>>
<</timed>>transcript<<set $prevpass to "audio3">>
<<set $passage to "audio3b">>
<<set $nextpass to "instructions4">>
<<set $transcript to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "audio3btranscript">>
<<addclass "body" "green">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story" id="storyContainer">
<audio id="audio" autoplay>
<source src="assets/audio/03.MissHothamsBedchamberAudioPart2.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
<img class="poster" src="assets/img/house.png"/>
</div>
<div id="caption" class="hide"></div>
<div id="transcript"></div>
<div id="mount"></div>
<div id="buttons"></div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<set $addC to setup.addCaptions("audio3b")>>
<<addclass "#playpause" "playhighlight">>
<</done>>
<<timed 60s>>
<<replace "#buttons">>
<div class="menu-wrapper">
<<button "Continue">><<goto $nextpass>><</button>>
</div>
<</replace>>
<</timed>>transcript<<set $prevpass to "audio3b">>
<<set $passage to "instructions4">>
<<set $nextpass to "audio4">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>Please close the drawer and make your way to the Dressing Room. </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>Walk back to the Great Room and take the door right in front of you, until you are in a room with red walls and curtains.</p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>Let me know when you are there. </p>
<</append>>
<</timed>>
<<timed 8s>>
<<append "#mount">>
<<button "I am in the Dressing Room">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions4">>
<<set $passage to "audio4">>
<<set $nextpass to "instructions5noletter">>
<<set $transcript to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "audio4transcript">>
<<addclass "body" "green">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story" id="storyContainer">
<audio id="audio" autoplay>
<source src="assets/audio/04.DressingRoomAudio.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
<img class="poster" src="assets/img/house.png"/>
</div>
<div id="caption" class="hide"></div>
<div id="transcript"></div>
<div id="mount"></div>
<div id="buttons"></div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<set $addC to setup.addCaptions("audio4")>>
<<addclass "#playpause" "playhighlight">>
<</done>>
<<timed 55s>>
<<replace "#buttons">>
<div class="menu-wrapper">
<<button "I have found the brown folder">><<goto "instructions5letter">><</button>>
<<button "I didn't find the brown folder">><<goto "instructions5noletter">><</button>>
</div>
<</replace>>
<</timed>>transcript<<set $prevpass to "audio4">>
<<set $passage to "instructions5letter">>
<<set $nextpass to "instructions5b">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>In this letter Elizabeth Molesworth congratulates Henrietta on the success of her investments in the South Sea Company. She also writes of her own desire to buy further stock to increase her profits after having had a ‘taste of fortune'.</p>
<</replace>>
<</timed>>
<<timed 8s>>
<<append "#mount">>
<p>In 1720, seeking greater financial independence from her husband and the royal household, Henrietta invested in the South Sea Company, a British company that was granted a monopoly to supply enslaved Africans to South America. In 1723, she then received a gift from the Prince of Wales (later George II), of which 70% were shares in the South Sea Company. </p>
<</append>>
<</timed>>
<<timed 14s>>
<<append "#mount">>
<p>The transatlantic slave trade was crucial in funding both the purchase of the land and the building of Marble Hill. </p>
<</append>>
<</timed>>
<<timed 16s>>
<<append "#mount">>
<p>Now put this letter back in its folder and place it in the desk drawer.</p>
<</append>>
<</timed>>
<<timed 18s>>
<<append "#mount">>
<<button "Next">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "audio4">>
<<set $passage to "instructions5noletter">>
<<set $nextpass to "instructions5noletterexplain">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>Not to worry. I've saved a transcript for you.</p>
/* <img src="assets/img/letter.jpeg"/> */
<</replace>>
<</timed>>
<<timed 2s>>
<<append "#mount">>
<div id="letter" class="letter fadeIn">
<span class="date">Axminster, June 25 1720</span>
<p> I hope I need not tell you, my dear Mrs. Howard, that I heartily rejoice at your success in the South Sea, for you would have reason to think me void of friendship and gratitude if I did not. Certainly fortune never bestowed her gifts on one who deserved them more, or had a more just or elegant taste for enjoying them. But since she is not always so nice in the choice of her favourites, I cannot forbear repining that it is not in my power to put myself in her way, that I might share those bounties of which she is at present so profuse. To tell you the truth, I am almost South Sea mad, and I find that philosophical temper of mind which made me content under my circumstances, when there was no seeming probability of bettering them, forsakes me on this occasion; and I cannot, without great regret, reflect that, for want of a little money, I am forced to let slip an opportunity which is never like to happen again.</p>
<p>Perhaps you will think me unreasonable when I tell you that good Lady Sunderland was so mindful of her absent friends as to secure us a five-hundred pound subscription, which money my father laid down for us, and it is now doubled; but this has but given me a taste of fortune, which makes me more eager to pursue it. As greedy as I seem, I should have been satisfied if I could by any means have raised the sum of five hundred or a thousand pounds more, but the vast price that money bears, and our being not able to make any security according to law, has made me reject a scheme I had laid of borrowing such a sum of some monied friend; but since I have given that over I shall endeavour to be content with the share I have in the good fortune of my friends, among whom I am proud to rank my dear Mrs Howard.</p>
<p>And I am, &c.</p>
<br/>
<p>E. Molesworth</p>
</div>
<</append>>
<</timed>>
<<timed 4s>>
<<append "#mount">>
<br/><br/>
<<button "What does it mean?">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions5noletter">>
<<set $passage to "instructions5noletterexplain">>
<<set $nextpass to "instructions5b">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>In this letter Elizabeth Molesworth congratulates Henrietta on the success of her investments in the South Sea Company. She also writes of her own desire to buy further stock to increase her profits after having had a ‘taste of fortune'.</p>
<</replace>>
<</timed>>
<<timed 8s>>
<<append "#mount">>
<p>In 1720, seeking greater financial independence from her husband and the royal household, Henrietta invested in the South Sea Company, a British company that was granted a monopoly to supply enslaved Africans to South America. In 1723, she then received a gift from the Prince of Wales (later George II), of which 70% were shares in the South Sea Company. </p>
<</append>>
<</timed>>
<<timed 14s>>
<<append "#mount">>
<p>The transatlantic slave trade was crucial in funding both the purchase of the land and the building of Marble Hill. </p>
<</append>>
<</timed>>
<<timed 16s>>
<<append "#mount">>
<<button "Next">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "audio4">>
<<set $passage to "instructions5b">>
<<set $nextpass to "audio5">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>The next part of your shift will be at the top of the Great Stairs. </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>Let me know when you are there. </p>
<</append>>
<</timed>>
<<timed 5s>>
<<append "#mount">>
<<button "I’m at the top of the staircase">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions5b">>
<<set $passage to "audio5">>
<<set $nextpass to "instructions6">>
<<set $transcript to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "audio5transcript">>
<<addclass "body" "green">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story" id="storyContainer">
<audio id="audio" autoplay>
<source src="assets/audio/05.StaircaseAudioFinal.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
<img class="poster" src="assets/img/house.png"/>
</div>
<div id="caption" class="hide"></div>
<div id="transcript"></div>
<div id="mount"></div>
<div id="buttons"></div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<set $addC to setup.addCaptions("audio5")>>
<<addclass "#playpause" "playhighlight">>
<</done>>
<<timed 168s>>
<<replace "#buttons">>
<div class="menu-wrapper">
<<button "Continue">><<goto $nextpass>><</button>>
</div>
<</replace>>
<</timed>>transcript<<set $prevpass to "audio5">>
<<set $passage to "instructions6">>
<<set $nextpass to "audio6">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>You are almost at the end of your shift. </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>Walk to the Hall next door, then enter the Breakfast Parlour on your left. Against the wall in front of you, you'll find a low wooden tea tray with a map on it.</p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>Let me know when you are there.</p>
<</append>>
<</timed>>
<<timed 9s>>
<<append "#mount">>
<div class="menu-wrapper">
<<button "I’m in the Breakfast Parlour">><<goto $nextpass>><</button>>
</div>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions6">>
<<set $passage to "audio6">>
<<set $nextpass to "instructions7">>
<<set $transcript to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "audio6transcript">>
<<addclass "body" "green">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story" id="storyContainer">
<audio id="audio" autoplay>
<source src="assets/audio/06.BreakfastPalourAudioFinal.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
<img class="poster" src="assets/img/house.png"/>
</div>
<div id="caption" class="hide"></div>
<div id="transcript"></div>
<div id="mount"></div>
<div id="buttons"></div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<set $addC to setup.addCaptions("audio6")>>
<<addclass "#playpause" "playhighlight">>
<</done>>
<<timed 64s>>
<<replace "#buttons">>
<div class="menu-wrapper">
<<button "Next">><<goto $nextpass>><</button>>
</div>
<</replace>>
<</timed>>transcript<<set $prevpass to "audio6">>
<<set $passage to "instructions7">>
<<set $nextpass to "audio7">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>This place is full of stories.</p>
<</replace>>
<</timed>>
<<timed 2s>>
<<append "#mount">>
<p>Invisible and visible. </p>
<</append>>
<</timed>>
<<timed 4s>>
<<append "#mount">>
<p>Go back to the Hall.</p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>By the fireplace, you’ll see a card table with a map. </p>
<</append>>
<</timed>>
<<timed 9s>>
<<append "#mount">>
<p>Come closer, and if you can, sit at that table.</p>
<</append>>
<</timed>>
<<timed 11s>>
<<append "#mount">>
<<button "I see the map">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions7">>
<<set $passage to "audio7">>
<<set $nextpass to "instructions7change">>
<<set $transcript to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "audio7transcript">>
<<addclass "body" "green">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story" id="storyContainer">
<audio id="audio" autoplay>
<source src="assets/audio/07.TheHallAudioFinalPart1.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
<img class="poster" src="assets/img/house.png"/>
</div>
<div id="caption" class="hide"></div>
<div id="transcript"></div>
<div id="mount"></div>
<div id="buttons"></div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<set $addC to setup.addCaptions("audio7a")>>
<<addclass "#playpause" "playhighlight">>
<</done>>
<<timed 33s>>
<<replace "#buttons">>
<div class="menu-wrapper">
<<button "Add someone">><<goto "instructions7change">><</button>>
<<button "Leave things as they are">><<goto "instructions7nochange">><</button>>
</div>
<</replace>>
<</timed>>transcript<<set $prevpass to "audio7">>
<<set $passage to "instructions7change">>
<<set $nextpass to "instructions7cards">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>Have a look at the fireplace. </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>Above it you have a portrait of King George II, one of the many people associated with this house. </p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>Now look at the fireplace floor. </p>
<</append>>
<</timed>>
<<timed 8s>>
<<append "#mount">>
<p>Can you find a wooden box containing a deck of cards?</p>
<</append>>
<</timed>>
<<timed 10s>>
<<append "#mount">>
<div class="menu-wrapper">
<<button "I have found the cards">><<goto "instructions7cards">><</button>>
<<button "I haven't found the cards">><<goto "instructions7nocards">><</button>>
</div>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "instructions7change">>
<<set $passage to "instructions7cards">>
<<set $nextpass to "audio7b">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>The map includes Henrietta’s friends and neighbours, house owners from the Richmond aristocracy. </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>But who else should be remembered in the history of this place? </p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>With the pencil provided, draw their portrait, write who they are and what makes them great. </p>
<</append>>
<</timed>>
<<timed 9s>>
<<append "#mount">>
<p>You can write about real people, or imagine people whose names and faces have been forgotten. </p>
<</append>>
<</timed>>
<<timed 12s>>
<<append "#mount">>
<p>Feel free to flick through the other cards before drawing yours. </p>
<</append>>
<</timed>>
<<timed 15s>>
<<append "#mount">>
<p>Feel free to sit on one of the red-top benches by the window to draw your card. When you are done, place your drawing back in the box.</p>
<</append>>
<</timed>>
<<timed 16s>>
<<append "#mount">>
<<button "I am done">><<goto $nextpass>><</button>>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "audio7">>
<<set $passage to "instructions7nochange">>
<<set $nextpass to "infopledge">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>That’s fine. Sometimes it’s easier not to shake things off. </p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>You can terminate your training here. </p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>Otherwise, just in case you are a little bit curious, you can look for some hidden stories among the ashes.</p>
<</append>>
<</timed>>
<<timed 9s>>
<<append "#mount">>
<div class="menu-wrapper">
<<button "Look for hidden stories">><<goto "instructions7change">><</button>>
<<button "Terminate your training">><<goto "instructions8">><</button>>
</div>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "audio7">>
<<set $passage to "instructions7nocards">>
<<set $nextpass to "instructions8">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>Strange, this is not the first time objects have disappeared.
</p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>But let me ask you a question.</p>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#mount">>
<p>The map includes Henrietta’s friends and neighbours, house owners from the Richmond aristocracy. But who else should be remembered in the history of this place?</p>
<</append>>
<</timed>>
<<timed 12s>>
<<append "#mount">>
<p>In the text box below, tell us about a person from the past that should be remembered.</p>
<</append>>
<</timed>>
<<timed 14s>>
<<append "#mount">>
<p>You can write about real people, or imagine people whose names and faces have been forgotten. </p>
<</append>>
<</timed>>
<<timed 16s>>
<<append "#mount">>
<div class="form-container">
<<textarea "$writing""">>
<<button "Submit">><<goto "writingSubmitted">><</button>>
</div>
<</append>>
<</timed>>
</main>
<<include "footer">>
<<done>>
<<set $setup to setup.initEmail()>>
<</done>><<set $prevpass to "instructions7nocards">>
<<set $pass to "writingSubmitted">>
<<set $nextpass to "audio7b">>
<main class="main-section">
<div class="review-container">
/* print star rating */
<p><em>$writing</em></p>
<br/><br/>
<div class="confirmation" id="confirmation"><<type 60ms>><p>Sending...</p><</type>></div>
</div>
</main>
<form id="contactForm" class="hide" >
<label for="writing">Written Contribution from Watching the House:</label>
<textarea id="writing" name="writing" rows="4" required>$writing</textarea>
<button type="submit">Submit</button>
</form>
<<timed 4s>>
<<replace "#confirmation">><p>Sent.</p>
<div id="mount"></div>
<</replace>>
<</timed>>
<<timed 6.5s>>
<<replace "#mount">>
<br/><br/>
<<button "Next">>
<<goto $nextpass>>
<</button>>
<</replace>>
<</timed>>
<<done>>
<<set $s to setup.test()>>
<</done>>
<<include "footersimple">><<set $prevpass to "audio7">>
<<set $passage to "audio7b">>
<<set $nextpass to "instructions8">>
<<set $transcript to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "audio7btranscript">>
<<addclass "body" "green">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story" id="storyContainer">
<audio id="audio" autoplay>
<source src="assets/audio/07.TheHallAudioFinalPart2.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
<img class="poster" src="assets/img/house.png"/>
</div>
<div id="caption" class="hide"></div>
<div id="transcript"></div>
<div id="mount"></div>
<div id="buttons"></div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<set $addC to setup.addCaptions("audio7b")>>
<<addclass "#playpause" "playhighlight">>
<</done>>
<<timed 17s>>
<<goto $nextpass>>
<</timed>>transcript<<set $prevpass to "audio7">>
<<set $passage to "instructions8">>
<<set $nextpass to "audio8">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>Go back to the front of the house, and let me know when you are there. </p>
<</replace>>
<</timed>>
<<timed 2s>>
<<append "#mount">>
<div class="menu-wrapper">
<<button "I am at the front of the house">><<goto $nextpass>><</button>>
</div>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "audio7b">>
<<set $passage to "audio8">>
<<set $nextpass to "infopledge">>
<<set $transcript to false>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to true>>
<<set $showTranscriptIcon to false>>
<<set $sendOn to false>>
<<set $transcriptname to "audio8transcript">>
<<addclass "body" "green">>
<<include "headeraudio">>
<<audio ":all" stop>>
<main class="story" id="storyContainer">
<audio id="audio" autoplay>
<source src="assets/audio/08.TheEndFinal.mp3">
/* <track kind="captions" srclang="en" label="English captions" id="captrack" default> */
</audio>
<div class="poster-wrapper" id="poster">
<img class="poster" src="assets/img/house.png"/>
</div>
<div id="caption" class="hide"></div>
<div id="transcript"></div>
<div id="mount"></div>
<div id="buttons"></div>
/* <<timed 30s>>
<<replace "#headerinstmount">>
<p class="comment"> When you're finished listening, let me know <div class="inline-btn-wrapper"><<button "I'm finished">><<goto $nextpass>><</button>></div></p>
<</replace>>
<</timed>> */
</main>
<<include "footeraudio">>
<<done>>
<<replace "#headerinstmount">><p class="note">[audio playing...]</p><</replace>>
<<set $addC to setup.addCaptions("audio8")>>
<<addclass "#playpause" "playhighlight">>
<</done>>
<<timed 42s>>
<<replace "#buttons">>
<div class="menu-wrapper">
<<button "Next">><<goto $nextpass>><</button>>
</div>
<</replace>>
<</timed>>transcript<<set $prevpass to "audio8">>
<<set $passage to "infopledge">>
<<set $nextpass to "record">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions">
<div id="mount"></div>
<<timed 0.1s>>
<<replace "#mount">>
<p>Now you’ve spent the day watching the house, and taking note of the stories that have been hidden here, we’d like you to do one last thing.</p>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#mount">>
<p>It’s time to record your Watcher pledge, to share with others.</p>
<</append>>
<</timed>>
<<timed 5s>>
<<append "#mount">>
<p>For this, think of the following questions.</p>
<</append>>
<</timed>>
<<timed 7s>>
<<append "#mount">>
<p class="finalq">What is something you can do in your daily life to make sure that certain histories and stories aren’t forgotten or left in the sidelines?</p>
<</append>>
<</timed>>
<<timed 10s>>
<<append "#mount">>
<p class="finalq">What parts of history do you want to learn more of now?</p>
<</append>>
<</timed>>
<<timed 12s>>
<<append "#mount">>
<p class="finalq">Or do you want to share a reflection after your induction as a Watcher?</p>
<</append>>
<</timed>>
<<timed 14s>>
<<append "#mount">>
<p>If it's raining, feel free to pick a quiet spot inside the house to do the recording.</p>
<</append>>
<</timed>>
<<timed 16s>>
<<append "#mount">>
<div class="menu-wrapper">
<<button "Record your pledge">><<goto "record">><</button>>
<<button "Skip and listen to others">><<goto "listen">><</button>>
<<button "End experience">><<goto "end">><</button>>
</div>
<</append>>
<</timed>>
</main>
<<include "footer">><<set $prevpass to "infopledge">>
<<set $passage to "end">>
<<set $nextpass to "end">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions thanks">
<div id="mount"></div>
<img src="assets/img/Wthbits-17.png" alt="Watching the House" class="hide desktop"/>
<<timed 0.1s>>
<<replace "#mount">>
<p>Watching the House is the result of a new collaboration between Coney and English Heritage’s youth engagement programme, Shout Out Loud.</p>
<</replace>>
<</timed>>
<<timed 2s>>
<<append "#mount">>
<p>Please return your headphones and adapter to the Marble Hill entrance.</p>
<</append>>
<</timed>>
<<timed 5s>>
<<append "#mount">>
<p>To find out more about the project click <a href="https://coneyhq.org/project/watching-the-house/" target="_blank" rel="noreferrer" class="hlght">here</a>. </p>
<</append>>
<</timed>>
<<timed 8s>>
<<append "#mount">>
<p>For more historical background about Marble Hill’s colonial history, click <<link "here">><<goto "history">><</link>>.</p>
<</append>>
<</timed>>
<<timed 11s>>
<<append "#mount">>
<p>If you want to find out more about the next Coney projects, please sign up for our <a href="https://coneyhq.org/sign-up-to-our-mailing-list/" target="_blank" rel="noreferrer">newsletter</a> or follow us on social media.</p>
<</append>>
<</timed>>
<<timed 14s>>
<<append "#mount">>
<div class="icon-container socials fadeIn">
<a href="https://www.instagram.com/agencyofconey/" target="_blank">
<img src="assets/img/socials/insta-black.png" alt="instagram icon"></a>
<a href="https://www.facebook.com/coneyhq/" target="_blank">
<img src="assets/img/socials/fb-black.png" alt="facebook logo" /></a>
<a href="https://twitter.com/agencyofconey" alt="twitter logo" target="_blank">
<img src="assets/img/socials/twitter-black.png" /></a>
</div>
<</append>>
<</timed>>
<<timed 16s>>
<<append "#mount">>
<br/>
<p>We would also appreciate if you could fill in a very short feedback form, to tell us your thoughts about the experience, by clicking <a href="https://docs.google.com/forms/d/e/1FAIpQLScB_bdRpG8ST3qWnvuF6QK0sNSMUzEvfDWVcANXyogJiZ_N9w/viewform" target="_blank" rel="noreferrer">here</a>.</p>
<</append>>
<</timed>>
<<timed 19s>>
<<append "#mount">>
<br/>
<div class="icon-container logos fadeIn">
<a href="https://coneyhq.org/" target="_blank">
<img src="assets/img/logos/coney-logo.jpeg" alt="Coney logo"></a>
<a href="https://www.english-heritage.org.uk/" target="_blank">
<img src="assets/img/logos/engher.png" alt="English Heritage logo"></a>
<a href="https://www.artscouncil.org.uk/" target="_blank">
<img src="assets/img/logos/ace.png" alt="ACE Logo"></a>
</div>
<</append>>
<</timed>>
</main>
<<include "footerfinal">><<set $prevpass to "infopledge">>
<<set $passage to "end">>
<<set $nextpass to "end">>
<<set $showAudio to false>>
<<set $showReplay to true>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<audio id="audio" autoplay >
<source src="">
</audio>
/* <<include "header">> */
<main class="instructions history">
<<timed 0.1s>>
<h2>Historical background</h2>
<</timed>>
<br/>
<<timed 1s>>
<div class="fadeIn historyLinks">
<p><span class="type">Website</span><br/> Traces of the Transatlantic Slave Economy in the National Heritage Collection. <a href="https://www.english-heritage.org.uk/learn/histories/transatlantic-slavery-abolition/traces-transatlantic-slave-economy/" target="_blank" rel="noreferrer">Visit.</a></p>
<p><span class="type">Report</span> <br/>The slavery connections of Marble Hill House. <a href="https://www.english-heritage.org.uk/siteassets/home/learn/research/the-slavery-connections-of-marble-hill-house.pdf" target="_blank" rel="noreferrer">Read.</a></p>
<p><span class="type">Lecture</span> <br/>Teaching and learning about enslavement history. <a href="https://www.youtube.com/watch?v=kMUpkqITtAc" target="_blank" rel="noreferrer">Watch.</a></p>
<p><span class="type">Website</span><br/> Black History & English Heritage. <a href="https://www.english-heritage.org.uk/learn/histories/black-history/" target="_blank" rel="noreferrer">Visit.</a></p>
<p><span class="type">Website</span><br/>Marble Hill - History and stories.<a href="https://www.english-heritage.org.uk/visit/places/marble-hill/history-and-stories/" target="_blank" rel="noreferrer">Visit.</a></p>
</div>
<</timed>>
</main>
<<include "footerback">><<set $prevpass to "infopledge">>
<<set $passage to "record">>
<<set $nextpass to "listen">>
<<set $showAudio to false>>
<<set $showReplay to false>>
<<set $showForwards to true>>
<<set $showBackwards to true>>
<<set $showCaptionsIcon to false>>
<main class="instructions">
<h2>Record</h2>
<p class="nofade">By clicking Record, you consent for your recording to be published online as part of the project.</p>
<p class="nofade"> You can withdraw that consent at any time. More info can be found in our <a href="TCsWTHouse.pdf" target="_blank" rel="noreferrer" class="hlght">here</a>. </p>
<p class="nofade"> Please try to keep your recording to 60 sec or less.</p>
<p class="nofade">By submitting a recording here, you agree to the <a
href="" target="_blank" rel="no-referrer"
class="hlght">terms and
conditions</a>.</p>
<br>
<iframe src="https://www.speakpipe.com/widget/inline/2iawuy25u8ynlcssocfc003zmfcl529u" allow="microphone" width="100%" height="200" frameborder="0"></iframe>
<br/>
</main>
<<include "footerrecord">><<set $prevpass to "infopledge">>
<<set $passage to "listenenter">>
<<set $nextpass to "listen">>
<<set $captions to false>>
<<set $sound to true>>
<<set $showForwards to false>>
<<addclass "body" "green">>
<<set $audiooptions to ["listen1", "listen2", "listen3", "listen4", "listen5", "listen6"]>>
<<set $audiooptionscopy to $audiooptions>>
/* <header/> */
<main class="main-section listen entrance " id="main">
/* <<button "Start">>
<<set $source to $audiooptions[random(0, $audiooptions.length - 1)]>>
<<goto "listen">><</button>> */
<<button "Listen">>
<<if $audiooptionscopy.length > 0>>
<<set $source to $audiooptionscopy.splice(random(0, $audiooptionscopy.length - 1), 1)[0]>>
<<goto "listen">>
<</if>>
<</button>>
</main>
<<include "footer">><<set $showCaptionsIcon to true>>
<<set $showAudioIcon to true>>
<<set $showBackwards to true>>
/* <<set $sound to true>> */
<<set $showMenu to false>>
<<set $menuOpen to false>>
<<set $prevpass to "record">>
<<set $passage to "listen">>
/* <<set $source to "audio3">> */
<<include "headerlisten">>
<main class="main-section listen player " id="main">
<audio id="audio" autoplay>
<<if $sound is true>>
<<include $source>>
<</if>>
</audio>
<<if $captions is true>>
<div id="caption">
</div>
<<include `$source + "cap"`>>
<</if>>
</main>
<<include "footerlisten">><header class="listen player" >
<div class="nav-item">
[img[Back|assets/img/back-black.png][infopledge]]
</div>
<div class="nav-item">
<<button "Next recording">>
<<if $audiooptionscopy.length > 0>>
<<set $source to $audiooptionscopy.splice(random(0, $audiooptionscopy.length - 1), 1)[0]>>
<<goto $passage>>
<<else>>
<<replace "#main">>
<div id="endMsgMount"> <<button "Listen again?">>
<<replace "#endMsgMount">>
<<set $audiooptionscopy to $audiooptions>>
<<goto "listen">><</replace>>
<</button>></div>
<</replace>>
<</if>>
<</button>>
</div>
</header><footer class="listen">
<div class="nav-container">
<<if $showCaptionsIcon is true>>
<div class="nav-wrapper">
<div class="nav-item" id="capIconContainer">
<<link [img[assets/img/captions.png]]>>
<<if $captions is true>>
<<set $captions to false>>
<<goto $passage>>
<<else>>
<<set $captions to true>>
<<goto $passage>>
<</if>>
<</link>>
</div>
</div>
<</if>>
</div>
<div class="nav-wrapper">
<div class="nav-item" id="">
<<button "Record">>
<<goto "record">>
<</button>>
</div>
</div>
<div class="nav-wrapper">
<div class="nav-item" id="">
<<button "End experience">>
<<goto "end">>
<</button>>
</div>
</div>
</footer>
<<done>>
<<if $captions is true>>
<<addclass "#capIconContainer" "activeIcon">>
<</if>>
<<if $sound is true>>
/* <<addclass "#audioContainer" "activeIcon">> */
<</if>>
<</done>><source src="assets/listen/audio1.mp3"><<timed 1s>>
<<replace "#caption">>
<<type 60ms>>
I can continue to listen
<</type>>
<</replace>>
<</timed>>
<<timed 3s>>
<<append "#caption">>
<<type 60ms>>
even when it can be difficult,
<</type>>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#caption">>
<<type 60ms>>
and continue to educate myself
<</type>>
<</append>>
<</timed>>
<<timed 9s>>
<<append "#caption">>
<<type 60ms>>
even when those new things you learn can be hard,
<</type>>
<</append>>
<</timed>>
<<timed 14s>>
<<replace "#caption">>
<<type 60ms>>
I can continue to amplify other voices and other stories
<</type>>
<</replace>>
<</timed>>
<<timed 19s>>
<<append "#caption">>
<<type 40ms>>
that will help others to be more comfortable with histories and stories
<</type>>
<</append>>
<</timed>>
<<timed 24s>>
<<append "#caption">>
<<type 40ms>>
that they might not know about,
<</type>>
<</append>>
<</timed>>
<<timed 26.5s>>
<<replace "#caption">>
<<type 60ms>>
but will help further
<</type>>
<</replace>>
<</timed>>
<<timed 29.5s>>
<<append "#caption">>
<<type 60ms>>
our own identity in this country
<</type>>
<</append>>
<</timed>>
<<timed 31s>>
<<append "#caption">>
<<type 60ms>>
and further all of our understandings
<</type>>
<</append>>
<</timed>>
<<timed 34s>>
<<append "#caption">>
<<type 60ms>>
on how we can live together in this world.
<</type>>
<</append>>
<</timed>><source src="assets/listen/audio2.mp3"><<timed 01s>>
<<replace "#caption">>
<<type 60ms>>
Be curious.
<</type>>
<</replace>>
<</timed>>
<<timed 03s>>
<<append "#caption">>
<<type 60ms>>
Especially when things are presented as just one thing
<</type>>
<</append>>
<</timed>>
<<timed 06s>>
<<append "#caption">>
<<type 60ms>>
so... "British" or "simple" or "beautiful",
<</type>>
<</append>>
<</timed>>
<<timed 13s>>
<<replace "#caption">>
<<type 60ms>>
and keep asking questions
<</type>>
<</replace>>
<</timed>>
<<timed 16s>>
<<append "#caption">>
<<type 60ms>>
about what might be behind those
<</type>>
<</append>>
<</timed>>
<<timed 19s>>
<<append "#caption">>
<<type 60ms>>
seemingly simple things.<</type>>
<</append>>
<</timed>><source src="assets/listen/audio3.mp3"><<timed 1s>>
<<append "#caption">>
<<type 40ms>>
I would like to<</type>>
<</append>>
<</timed>>
<<timed 4s>>
<<append "#caption">>
<<type 60ms>>
completely immerse myself in history <</type>>
<</append>>
<</timed>>
<<timed 6s>>
<<append "#caption">>
<<type 40ms>>
when I'm thinking about it, <</type>>
<</append>>
<</timed>>
<<timed 9s>>
<<replace "#caption">>
<<type 40ms>>
and go into all the nooks and crannies because<</type>>
<</replace>>
<</timed>>
<<timed 10s>>
<<append "#caption">>
<<type 40ms>>
the darkness and layers and the complexity <</type>>
<</append>>
<</timed>>
<<timed 14s>>
<<append "#caption">>
<<type 40ms>>
are what make history.<</type>>
<</append>>
<</timed>>
<<timed 16s>>
<<replace "#caption">>
<<type 40ms>>
It's why we should study it and what makes it interesting,<</type>>
<</replace>>
<</timed>>
<<timed 18s>>
<<append "#caption">>
<<type 50ms>>
and what makes it a tool to help us <</type>>
<</append>>
<</timed>>
<<timed 21s>>
<<append "#caption">>
<<type 60ms>>
be better, today.<</type>>
<</append>>
<</timed>><source src="assets/listen/audio4.mp3"><<timed 0s>>
<<replace "#caption">>
<<type 60ms>>
Watching the House has been peaceful yet also depressing,
<</type>>
<</replace>>
<</timed>>
<<timed 4s>>
<<append "#caption">>
<<type 40ms>>
as there are many hidden secrets of the house.
<</type>>
<</append>>
<</timed>>
<<timed 8s>>
<<replace "#caption">>
<<type 60ms>>
When you go to the bed chamber
<</type>>
<</replace>>
<</timed>>
<<timed 12s>>
<<append "#caption">>
<<type 60ms>>
or the breakfast room,
<</type>>
<</append>>
<</timed>>
<<timed 15s>>
<<append "#caption">>
<<type 40ms>>
you will find a kettle.
<</type>>
<</append>>
<</timed>>
<<timed 17.5s>>
<<replace "#caption">>
<<type 40ms>>
Open the lid of the kettle
<</type>>
<</replace>>
<</timed>>
<<timed 19s>>
<<append "#caption">>
<<type 60ms>>
and you'll find a piece of paper.
<</type>>
<</append>>
<</timed>>
<<timed 21s>>
<<append "#caption">>
<<type 60ms>>
A miniature version of the table on which it is on.
<</type>>
<</append>>
<</timed>><source src="assets/listen/audio5.mp3"><<timed 03s>>
<<replace "#caption">>
<<type 60ms>>
To always think
<</type>>
<</replace>>
<</timed>>
<<timed 04s>>
<<append "#caption">>
<<type 60ms>>
when you're looking at history.
<</type>>
<</append>>
<</timed>>
<<timed 09s>>
<<replace "#caption">>
<<type 40ms>>
To look underneath
<</type>>
<</replace>>
<</timed>>
<<timed 11s>>
<<append "#caption">>
<<type 60ms>>
and to try to remember who was really involved,
<</type>>
<</append>>
<</timed>>
<<timed 16s>>
<<append "#caption">>
<<type 40ms>>
particularly not the people that had all the wealth.
<</type>>
<</append>>
<</timed>>
<<timed 22s>>
<<replace "#caption">>
<<type 40ms>>
But how did that wealth move into their hands?
<</type>>
<</replace>>
<</timed>>
<<timed 25s>>
<<append "#caption">>
<<type 40ms>>
And who had to suffer
<</type>>
<</append>>
<</timed>>
<<timed 26.5s>>
<<append "#caption">>
<<type 40ms>>
as a result of that wealth moving into their hands?
<</type>>
<</append>>
<</timed>><source src="assets/listen/audio6.mp3"><<timed 01s>>
<<replace "#caption">>
<<type 50ms>>
I can continue to be curious and ask questions.
<</type>>
<</replace>>
<</timed>>
<<timed 6s>>
<<replace "#caption">>
<<type 50ms>>
Continue to be dedicated in my practice
<</type>>
<</replace>>
<</timed>>
<<timed 7.5s>>
<<append "#caption">>
<<type 40ms>>
to uncovering stories that are untold
<</type>>
<</append>>
<</timed>>
<<timed 9.5s>>
<<append "#caption">>
<<type 40ms>>
and retelling stories that should be seen and heard.
<</type>>
<</append>>
<</timed>>
<<timed 15s>>
<<replace "#caption">>
<<type 40ms>>
Making the invisible visible.
<</type>>
<</replace>>
<</timed>>