{"id":107,"date":"2026-09-06T19:06:32","date_gmt":"2026-09-06T19:06:32","guid":{"rendered":"https:\/\/itdd.au.dk\/the-house\/?page_id=107"},"modified":"2026-09-21T17:57:40","modified_gmt":"2026-09-21T17:57:40","slug":"gardenwindow","status":"publish","type":"page","link":"https:\/\/itdd.au.dk\/the-house\/gardenwindow\/","title":{"rendered":"Garden Window (4a)"},"content":{"rendered":"\n<style>\nbody {\n  background-image: url('https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/dolls-by-the-window-scaled.jpg');\n}\n<\/style>\n\n\n\n<p class=\"wp-block-paragraph\"><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-base-color\">Think of all the joy the once gave their owners.<\/mark><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-base-color\">Lost little dolls. So lonely they must be.<\/mark><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-base-color\">They simply long to play, with you and with me<\/mark>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/itdd.au.dk\/the-house\/sample-page\/\">I go back <\/a><\/div>\n<\/div>\n\n\n\n<div style=\"height:378px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<audio id=\"galleryAudio\" preload=\"auto\">\n  <source src=\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/Ghost-Children-Laughing-in-the-Shadows-Disturbing-Paranormal-Sound-Effect.mp3\" type=\"audio\/mpeg\">\n<\/audio>\n\n<script>\nconst photos = [\n  \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/1-modified.png\",\n  \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/2-modified.png\",\n  \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/3-modified.png\",\n  \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/postcard-1.jpg\",\n  \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/3.jpg\"\n];\n\nlet currentPhoto = 0;\n\nfunction openGallery() {\n\n  document.getElementById(\"photoGallery\").style.display = \"flex\";\n\n  document.getElementById(\"galleryImage\").src = photos[currentPhoto];\n\n  const audio = document.getElementById(\"galleryAudio\");\n  audio.currentTime = 0;\n  audio.play();\n\n  document.body.style.overflow = \"hidden\";\n}\n\nfunction closeGallery() {\n\n  document.getElementById(\"photoGallery\").style.display = \"none\";\n\n  const audio = document.getElementById(\"galleryAudio\");\n  audio.pause();\n  audio.currentTime = 0;\n\n  document.body.style.overflow = \"\";\n}\n\nfunction changePhoto(direction) {\n\n  currentPhoto += direction;\n\n  if (currentPhoto >= photos.length) {\n    currentPhoto = 0;\n  }\n\n  if (currentPhoto < 0) {\n    currentPhoto = photos.length - 1;\n  }\n\n  document.getElementById(\"galleryImage\").src = photos[currentPhoto];\n}\n<\/script>\n\n\n\n<audio id=\"galleryAudio\" preload=\"auto\">\n  <source src=\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/Ghost-Children-Laughing-in-the-Shadows-Disturbing-Paranormal-Sound-Effect.mp3\" type=\"audio\/mpeg\">\n<\/audio>\n\n<script>\nconst photos = [\n  \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/1-modified.png\",\n  \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/2-modified.png\",\n  \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/3-modified.png\",\n  \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/postcard-1.jpg\",\n  \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/3.jpg\"\n];\n\nlet currentPhoto = 0;\n\nfunction openGallery() {\n\n  document.getElementById(\"photoGallery\").style.display = \"flex\";\n\n  document.getElementById(\"galleryImage\").src = photos[currentPhoto];\n\n  const audio = document.getElementById(\"galleryAudio\");\n  audio.currentTime = 0;\n  audio.play();\n\n  document.body.style.overflow = \"hidden\";\n}\n\nfunction closeGallery() {\n\n  document.getElementById(\"photoGallery\").style.display = \"none\";\n\n  const audio = document.getElementById(\"galleryAudio\");\n  audio.pause();\n  audio.currentTime = 0;\n\n  document.body.style.overflow = \"\";\n}\n\nfunction changePhoto(direction) {\n\n  currentPhoto += direction;\n\n  if (currentPhoto >= photos.length) {\n    currentPhoto = 0;\n  }\n\n  if (currentPhoto < 0) {\n    currentPhoto = photos.length - 1;\n  }\n\n  document.getElementById(\"galleryImage\").src = photos[currentPhoto];\n}\n<\/script>\n\n\n\n<div class=\"house-gallery\">\n\n  <!-- PHOTO STACK BUTTON -->\n  <button type=\"button\" id=\"houseGalleryButton\" aria-label=\"Open photo gallery\">\n    <span class=\"stack-photo stack-back\"><\/span>\n    <span class=\"stack-photo stack-middle\"><\/span>\n    <span class=\"stack-photo stack-front\"><\/span>\n  <\/button>\n\n  <!-- GALLERY -->\n  <div id=\"houseGallery\" class=\"house-gallery-overlay\">\n\n    <button type=\"button\" id=\"houseGalleryClose\" class=\"gallery-close\">\n      \u00d7\n    <\/button>\n\n    <button type=\"button\" id=\"houseGalleryPrev\" class=\"gallery-arrow gallery-prev\">\n      \u2039\n    <\/button>\n\n    <img decoding=\"async\" id=\"houseGalleryImage\" class=\"gallery-image\" src=\"\" alt=\"Gallery photo\">\n\n    <button type=\"button\" id=\"houseGalleryNext\" class=\"gallery-arrow gallery-next\">\n      \u203a\n    <\/button>\n\n  <\/div>\n\n  <!-- AUDIO -->\n  <audio id=\"houseGalleryAudio\" preload=\"auto\">\n    <source\n      src=\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/Ghost-Children-Laughing-in-the-Shadows-Disturbing-Paranormal-Sound-Effect.mp3\"\n      type=\"audio\/mpeg\">\n  <\/audio>\n\n<\/div>\n\n\n<style>\n\n\/* =========================\n   PHOTO STACK BUTTON\n   ========================= *\/\n\n#houseGalleryButton {\n  position: relative;\n  width: 75px;\n  height: 75px;\n  padding: 0;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  display: block;\n}\n\n#houseGalleryButton .stack-photo {\n  position: absolute;\n  width: 55px;\n  height: 68px;\n  left: 10px;\n  top: 3px;\n\n  background-size: cover;\n  background-position: center;\n\n  border: 3px solid white;\n  box-shadow: 0 3px 10px rgba(0,0,0,0.35);\n\n  transition: transform 0.2s ease;\n}\n\n\/* Back photo *\/\n#houseGalleryButton .stack-back {\n  background-image: url(\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/1-modified.png\");\n  transform: rotate(-12deg);\n  z-index: 1;\n}\n\n\/* Middle photo *\/\n#houseGalleryButton .stack-middle {\n  background-image: url(\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/2-modified.png\");\n  transform: rotate(5deg);\n  z-index: 2;\n}\n\n\/* Front photo *\/\n#houseGalleryButton .stack-front {\n  background-image: url(\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/3-modified.png\");\n  transform: rotate(-2deg);\n  z-index: 3;\n}\n\n#houseGalleryButton:hover .stack-back {\n  transform: translate(-4px, -3px) rotate(-16deg);\n}\n\n#houseGalleryButton:hover .stack-middle {\n  transform: translate(3px, -4px) rotate(8deg);\n}\n\n#houseGalleryButton:hover .stack-front {\n  transform: translate(0, -5px) rotate(-2deg);\n}\n\n\n\/* =========================\n   GALLERY OVERLAY\n   ========================= *\/\n\n#houseGallery {\n  display: none;\n\n  position: fixed;\n  z-index: 999999;\n\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n\n  background: rgba(0,0,0,0.92);\n\n  align-items: center;\n  justify-content: center;\n}\n\n#houseGallery.is-open {\n  display: flex;\n}\n\n\n\/* Main image *\/\n\n#houseGalleryImage {\n  display: block;\n\n  max-width: 80vw;\n  max-height: 85vh;\n\n  width: auto;\n  height: auto;\n\n  object-fit: contain;\n\n  box-shadow: 0 10px 40px rgba(0,0,0,0.7);\n}\n\n\n\/* =========================\n   CLOSE BUTTON\n   ========================= *\/\n\n#houseGalleryClose {\n  position: absolute;\n\n  top: 20px;\n  right: 25px;\n\n  width: 45px;\n  height: 45px;\n\n  border: none;\n  background: transparent;\n\n  color: white;\n  font-size: 42px;\n  line-height: 40px;\n\n  cursor: pointer;\n\n  z-index: 10;\n}\n\n\n\/* =========================\n   ARROWS\n   ========================= *\/\n\n#houseGallery .gallery-arrow {\n  position: absolute;\n\n  top: 50%;\n  transform: translateY(-50%);\n\n  width: 55px;\n  height: 75px;\n\n  border: none;\n  background: rgba(0,0,0,0.35);\n\n  color: white;\n\n  font-size: 60px;\n  line-height: 60px;\n\n  cursor: pointer;\n\n  z-index: 10;\n\n  transition: background 0.2s ease;\n}\n\n#houseGallery .gallery-arrow:hover {\n  background: rgba(0,0,0,0.65);\n}\n\n#houseGallery .gallery-prev {\n  left: 20px;\n}\n\n#houseGallery .gallery-next {\n  right: 20px;\n}\n\n\n\/* =========================\n   MOBILE\n   ========================= *\/\n\n@media (max-width: 600px) {\n\n  #houseGalleryImage {\n    max-width: 85vw;\n    max-height: 80vh;\n  }\n\n  #houseGallery .gallery-arrow {\n    width: 45px;\n    height: 60px;\n    font-size: 48px;\n  }\n\n  #houseGallery .gallery-prev {\n    left: 5px;\n  }\n\n  #houseGallery .gallery-next {\n    right: 5px;\n  }\n\n  #houseGalleryClose {\n    top: 10px;\n    right: 12px;\n  }\n\n}\n\n<\/style>\n\n\n<script>\n\n(function () {\n\n  \/* =========================\n     PHOTOS\n     ========================= *\/\n\n  const photos = [\n\n    \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/1-modified.png\",\n\n    \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/2-modified.png\",\n\n    \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/3-modified.png\",\n\n    \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/postcard-1.jpg\",\n\n    \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/3.jpg\"\n\n  ];\n\n\n  \/* =========================\n     ELEMENTS\n     ========================= *\/\n\n  const button = document.getElementById(\"houseGalleryButton\");\n\n  const gallery = document.getElementById(\"houseGallery\");\n\n  const image = document.getElementById(\"houseGalleryImage\");\n\n  const closeButton = document.getElementById(\"houseGalleryClose\");\n\n  const prevButton = document.getElementById(\"houseGalleryPrev\");\n\n  const nextButton = document.getElementById(\"houseGalleryNext\");\n\n  const audio = document.getElementById(\"houseGalleryAudio\");\n\n\n  let currentPhoto = 0;\n\n\n  \/* =========================\n     SHOW PHOTO\n     ========================= *\/\n\n  function showPhoto() {\n\n    image.src = photos[currentPhoto];\n\n  }\n\n\n  \/* =========================\n     OPEN GALLERY\n     ========================= *\/\n\n  function openGallery() {\n\n    currentPhoto = 0;\n\n    showPhoto();\n\n    gallery.classList.add(\"is-open\");\n\n    document.body.style.overflow = \"hidden\";\n\n\n    \/* Start sound *\/\n\n    audio.currentTime = 0;\n\n    const playPromise = audio.play();\n\n    if (playPromise !== undefined) {\n\n      playPromise.catch(function () {\n\n        console.log(\"Audio playback was blocked by the browser.\");\n\n      });\n\n    }\n\n  }\n\n\n  \/* =========================\n     CLOSE GALLERY\n     ========================= *\/\n\n  function closeGallery() {\n\n    gallery.classList.remove(\"is-open\");\n\n    document.body.style.overflow = \"\";\n\n    audio.pause();\n\n    audio.currentTime = 0;\n\n  }\n\n\n  \/* =========================\n     NEXT PHOTO\n     ========================= *\/\n\n  function nextPhoto() {\n\n    currentPhoto++;\n\n    if (currentPhoto >= photos.length) {\n      currentPhoto = 0;\n    }\n\n    showPhoto();\n\n  }\n\n\n  \/* =========================\n     PREVIOUS PHOTO\n     ========================= *\/\n\n  function previousPhoto() {\n\n    currentPhoto--;\n\n    if (currentPhoto < 0) {\n      currentPhoto = photos.length - 1;\n    }\n\n    showPhoto();\n\n  }\n\n\n  \/* =========================\n     BUTTON EVENTS\n     ========================= *\/\n\n  button.addEventListener(\"click\", openGallery);\n\n  closeButton.addEventListener(\"click\", closeGallery);\n\n  nextButton.addEventListener(\"click\", nextPhoto);\n\n  prevButton.addEventListener(\"click\", previousPhoto);\n\n\n  \/* =========================\n     CLICK OUTSIDE PHOTO\n     ========================= *\/\n\n  gallery.addEventListener(\"click\", function (event) {\n\n    if (event.target === gallery) {\n      closeGallery();\n    }\n\n  });\n\n\n  \/* =========================\n     ESC KEY\n     ========================= *\/\n\n  document.addEventListener(\"keydown\", function (event) {\n\n    if (!gallery.classList.contains(\"is-open\")) {\n      return;\n    }\n\n    if (event.key === \"Escape\") {\n      closeGallery();\n    }\n\n    if (event.key === \"ArrowRight\") {\n      nextPhoto();\n    }\n\n    if (event.key === \"ArrowLeft\") {\n      previousPhoto();\n    }\n\n  });\n\n})();\n\n<\/script>\n\n\n<style>\n.house-side-menu {\n  position: fixed;\n  left: 18px;\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  flex-direction: column;\n  gap: 11px;\n  padding-left: 10px;\n  z-index: 999990;\n}\n\n.house-side-menu::before {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  width: 2px;\n  background: rgba(255,255,255,0.35);\n}\n\n.house-menu-button {\n  position: relative;\n  width: 70.5px;\n  height: 70.5px;\n  padding: 0;\n  margin: 0;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 2;\n}\n\n.house-menu-button img {\n  width: 64.5px;\n  height: 64.5px;\n  object-fit: contain;\n  display: block;\n  transition: transform 0.18s ease, filter 0.18s ease;\n}\n\n.house-menu-button.house-ear img {\n  width: 60px;\n  height: 69px;\n}\n\n.house-menu-button.house-eye img {\n  width: 120px;\n  height: 136.5px;\n}\n\n.house-menu-button:hover img {\n  transform: translateX(5px) scale(1.08);\n  filter: brightness(1.08);\n}\n\n.house-menu-label {\n  position: absolute;\n  left: 53px;\n  top: 50%;\n  transform: translateY(-50%);\n  white-space: nowrap;\n  font-family: Georgia, \"Times New Roman\", serif;\n  font-size: 14px;\n  line-height: 1;\n  color: #fff;\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.18s ease;\n}\n\n.house-menu-button:hover .house-menu-label {\n  opacity: 1;\n}\n\n\n\/* =========================================================\n   HELP POP-OUT\n   ========================================================= *\/\n\n.house-help-box {\n  position: fixed;\n  left: 82px;\n  top: 50%;\n  transform: translateY(-50%);\n\n  width: 240px;\n  max-width: calc(100vw - 110px);\n\n  padding: 18px 20px 20px;\n\n  background: rgba(245, 238, 216, 0.97);\n  color: #222;\n\n  border: 1px solid rgba(70, 55, 35, 0.45);\n  box-shadow: 0 5px 18px rgba(0,0,0,0.28);\n\n  font-family: Georgia, \"Times New Roman\", serif;\n  font-size: 15px;\n  line-height: 1.45;\n\n  z-index: 999995;\n\n  display: none;\n}\n\n.house-help-box.is-open {\n  display: block;\n}\n\n.house-help-close {\n  position: absolute;\n  top: 5px;\n  right: 8px;\n\n  border: 0;\n  background: transparent;\n\n  color: #333;\n  font-family: Arial, sans-serif;\n  font-size: 20px;\n  line-height: 1;\n\n  padding: 0;\n  cursor: pointer;\n}\n\n.house-help-close:hover {\n  opacity: 0.55;\n}\n\n.house-help-text {\n  padding-right: 12px;\n}\n\n\n\/* =========================================================\n   PAPER NOTE BOXES\n   ========================================================= *\/\n\n.house-note-box,\n.house-notes-box {\n  position: fixed;\n\n  left: 82px;\n  top: 50%;\n  transform: translateY(-50%);\n\n  width: 285px;\n  max-width: calc(100vw - 115px);\n\n  background: rgba(245, 238, 216, 0.98);\n  color: #222;\n\n  border: 1px solid rgba(70, 55, 35, 0.45);\n  box-shadow: 0 5px 20px rgba(0,0,0,0.30);\n\n  font-family: Georgia, \"Times New Roman\", serif;\n\n  z-index: 999996;\n\n  display: none;\n}\n\n.house-note-box.is-open,\n.house-notes-box.is-open {\n  display: block;\n}\n\n.house-note-header,\n.house-notes-header {\n  position: relative;\n\n  padding: 13px 38px 10px 17px;\n\n  border-bottom: 1px solid rgba(70,55,35,0.25);\n\n  font-size: 16px;\n  line-height: 1.2;\n}\n\n.house-note-close,\n.house-notes-close {\n  position: absolute;\n\n  top: 5px;\n  right: 8px;\n\n  border: 0;\n  background: transparent;\n\n  color: #333;\n\n  font-family: Arial, sans-serif;\n  font-size: 20px;\n  line-height: 1;\n\n  padding: 0;\n  cursor: pointer;\n}\n\n.house-note-close:hover,\n.house-notes-close:hover {\n  opacity: 0.55;\n}\n\n\n\/* =========================================================\n   NOTE FORM\n   ========================================================= *\/\n\n.house-note-content {\n  padding: 15px 17px 17px;\n}\n\n.house-note-content label {\n  display: block;\n  margin-bottom: 5px;\n  font-size: 14px;\n}\n\n.house-note-content input,\n.house-note-content textarea {\n  box-sizing: border-box;\n\n  width: 100%;\n\n  border: 1px solid rgba(70,55,35,0.35);\n\n  background: rgba(255,255,255,0.72);\n\n  color: #222;\n\n  font-family: Georgia, \"Times New Roman\", serif;\n  font-size: 14px;\n\n  padding: 8px;\n\n  outline: none;\n}\n\n.house-note-content input:focus,\n.house-note-content textarea:focus {\n  border-color: rgba(70,55,35,0.7);\n}\n\n.house-note-content textarea {\n  min-height: 105px;\n  resize: vertical;\n}\n\n.house-note-field {\n  margin-bottom: 12px;\n}\n\n.house-note-submit {\n  border: 1px solid rgba(70,55,35,0.45);\n\n  background: rgba(70,55,35,0.12);\n\n  color: #222;\n\n  font-family: Georgia, \"Times New Roman\", serif;\n  font-size: 14px;\n\n  padding: 7px 13px;\n\n  cursor: pointer;\n}\n\n.house-note-submit:hover {\n  background: rgba(70,55,35,0.20);\n}\n\n.house-note-submit:disabled {\n  opacity: 0.55;\n  cursor: wait;\n}\n\n.house-note-status {\n  margin-top: 10px;\n\n  font-size: 13px;\n  line-height: 1.4;\n}\n\n.house-note-status.success {\n  color: #315b35;\n}\n\n.house-note-status.error {\n  color: #8a3028;\n}\n\n\n\/* =========================================================\n   PAPER NOTES LIST\n   ========================================================= *\/\n\n.house-notes-content {\n  padding: 14px 17px 17px;\n  max-height: 55vh;\n  overflow-y: auto;\n}\n\n.house-notes-intro {\n  margin-bottom: 12px;\n\n  font-size: 13px;\n  line-height: 1.4;\n\n  opacity: 0.75;\n}\n\n.house-single-note {\n  padding: 10px 0;\n\n  border-bottom: 1px solid rgba(70,55,35,0.22);\n}\n\n.house-single-note:last-child {\n  border-bottom: 0;\n}\n\n.house-single-note-author {\n  margin-bottom: 4px;\n\n  font-size: 13px;\n  font-weight: bold;\n}\n\n.house-single-note-date {\n  margin-bottom: 6px;\n\n  font-size: 11px;\n\n  opacity: 0.6;\n}\n\n.house-single-note-text {\n  font-size: 14px;\n  line-height: 1.45;\n\n  white-space: pre-wrap;\n}\n\n.house-no-notes {\n  font-size: 14px;\n  line-height: 1.45;\n  opacity: 0.75;\n}\n\n\n\/* =========================================================\n   ARTWORK\n   ========================================================= *\/\n\n#house-art-overlay {\n  position: fixed;\n  inset: 0;\n  z-index: 999999;\n\n  display: none;\n\n  align-items: center;\n  justify-content: center;\n\n  background: rgba(0,0,0,0.96);\n}\n\n#house-art-overlay img {\n  max-width: 96vw;\n  max-height: 94vh;\n\n  width: auto;\n  height: auto;\n\n  object-fit: contain;\n\n  display: block;\n}\n\n#house-art-close {\n  position: absolute;\n\n  top: 16px;\n  right: 22px;\n\n  border: 0;\n  background: transparent;\n\n  color: #fff;\n\n  font-family: Arial, sans-serif;\n  font-size: 32px;\n  line-height: 1;\n\n  cursor: pointer;\n\n  z-index: 2;\n}\n\n#house-art-close:hover {\n  opacity: 0.7;\n}\n\n\n\/* =========================================================\n   MOBILE\n   ========================================================= *\/\n\n@media (max-width: 700px) {\n\n  .house-side-menu {\n    left: 6px;\n    gap: 7px;\n    padding-left: 7px;\n  }\n\n  .house-menu-button {\n    width: 54px;\n    height: 54px;\n  }\n\n  .house-menu-button img {\n    width: 48px;\n    height: 48px;\n  }\n\n  .house-menu-button.house-ear img {\n    width: 45px;\n    height: 51px;\n  }\n\n  .house-menu-button.house-eye img {\n    width: 91.5px;\n    height: 105px;\n  }\n\n  .house-menu-label {\n    display: none;\n  }\n\n  .house-help-box,\n  .house-note-box,\n  .house-notes-box {\n    left: 51px;\n    top: 50%;\n\n    width: 220px;\n    max-width: calc(100vw - 65px);\n  }\n\n  .house-help-box {\n    padding: 16px 17px 18px;\n    font-size: 14px;\n  }\n\n  .house-note-header,\n  .house-notes-header {\n    font-size: 15px;\n  }\n\n  .house-note-content {\n    padding: 14px;\n  }\n\n  .house-notes-content {\n    max-height: 52vh;\n  }\n\n  #house-art-overlay img {\n    max-width: 94vw;\n    max-height: 90vh;\n  }\n\n  #house-art-close {\n    top: 10px;\n    right: 14px;\n    font-size: 28px;\n  }\n}\n<\/style>\n\n\n<!-- =========================================================\n     THE HOUSE SIDE MENU\n     ========================================================= -->\n\n<div id=\"house-side-menu\" class=\"house-side-menu\">\n\n  <button type=\"button\" class=\"house-menu-button house-story\" aria-label=\"Listen to the Story\">\n\n    <img decoding=\"async\" src=\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/Antik-blomsterknap-100px.png\" alt=\"\">\n\n    <span class=\"house-menu-label\">\n      Listen to the Story\n    <\/span>\n\n  <\/button>\n\n\n  <button type=\"button\" class=\"house-menu-button house-eye\" aria-label=\"See the Art\">\n\n    <img decoding=\"async\" src=\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/eye_pendant-removebg-preview.png\" alt=\"\">\n\n    <span class=\"house-menu-label\">\n      See the Art\n    <\/span>\n\n  <\/button>\n\n\n  <button type=\"button\" class=\"house-menu-button house-ear\" aria-label=\"Listen to the House\">\n\n    <img decoding=\"async\" src=\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/ear-removebg-preview.png\" alt=\"\">\n\n    <span class=\"house-menu-label\">\n      Listen to the House\n    <\/span>\n\n  <\/button>\n\n\n  <button type=\"button\" class=\"house-menu-button house-help\" aria-label=\"Get Help\">\n\n    <img decoding=\"async\" src=\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/questionmark-removebg-preview-1.png\" alt=\"\">\n\n    <span class=\"house-menu-label\">\n      Get Help\n    <\/span>\n\n  <\/button>\n\n\n  <button type=\"button\" class=\"house-menu-button house-note\" aria-label=\"Leave a note behind\">\n\n    <img decoding=\"async\" src=\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/Inkpot-removebg-preview.png\" alt=\"\">\n\n    <span class=\"house-menu-label\">\n      leave a note behind\n    <\/span>\n\n  <\/button>\n\n\n  <button type=\"button\" class=\"house-menu-button house-notes\" aria-label=\"Search for paper notes\">\n\n    <img decoding=\"async\" src=\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/Louope-removebg-preview.png\" alt=\"\">\n\n    <span class=\"house-menu-label\">\n      search for paper notes\n    <\/span>\n\n  <\/button>\n\n<\/div>\n\n\n<!-- =========================================================\n     HELP\n     ========================================================= -->\n\n<div id=\"house-help-box\" class=\"house-help-box\" role=\"dialog\" aria-hidden=\"true\">\n\n  <button type=\"button\" id=\"house-help-close\" class=\"house-help-close\" aria-label=\"Close help\">\n    \u00d7\n  <\/button>\n\n  <div id=\"house-help-text\" class=\"house-help-text\">\n  <\/div>\n\n<\/div>\n\n\n<!-- =========================================================\n     LEAVE A NOTE\n     ========================================================= -->\n\n<div id=\"house-note-box\" class=\"house-note-box\" role=\"dialog\" aria-hidden=\"true\">\n\n  <div class=\"house-note-header\">\n\n    Leave a note behind\n\n    <button type=\"button\" id=\"house-note-close\" class=\"house-note-close\" aria-label=\"Close note box\">\n      \u00d7\n    <\/button>\n\n  <\/div>\n\n\n  <div class=\"house-note-content\">\n\n    <form id=\"house-note-form\">\n\n      <div class=\"house-note-field\">\n\n        <label for=\"house-note-author\">\n          Name\n        <\/label>\n\n        <input type=\"text\" id=\"house-note-author\" name=\"author\" maxlength=\"245\" autocomplete=\"name\" required=\"\">\n\n      <\/div>\n\n\n      <div class=\"house-note-field\">\n\n        <label for=\"house-note-email\">\n          Email\n        <\/label>\n\n        <input type=\"email\" id=\"house-note-email\" name=\"email\" autocomplete=\"email\" required=\"\">\n\n      <\/div>\n\n\n      <div class=\"house-note-field\">\n\n        <label for=\"house-note-comment\">\n          Note\n        <\/label>\n\n        <textarea id=\"house-note-comment\" name=\"comment\" required=\"\"><\/textarea>\n\n      <\/div>\n\n\n      <button type=\"submit\" id=\"house-note-submit\" class=\"house-note-submit\">\n        Leave note\n      <\/button>\n\n\n      <div id=\"house-note-status\" class=\"house-note-status\"><\/div>\n\n    <\/form>\n\n  <\/div>\n\n<\/div>\n\n\n<!-- =========================================================\n     SHOW PAPER NOTES\n     ========================================================= -->\n\n<div id=\"house-notes-box\" class=\"house-notes-box\" role=\"dialog\" aria-hidden=\"true\">\n\n  <div class=\"house-notes-header\">\n\n    Paper notes\n\n    <button type=\"button\" id=\"house-notes-close\" class=\"house-notes-close\" aria-label=\"Close paper notes\">\n      \u00d7\n    <\/button>\n\n  <\/div>\n\n\n  <div id=\"house-notes-content\" class=\"house-notes-content\">\n\n    <div class=\"house-notes-intro\">\n      Notes left behind on this page:\n    <\/div>\n\n    <div id=\"house-notes-list\">\n      Loading\u2026\n    <\/div>\n\n  <\/div>\n\n<\/div>\n\n\n<!-- =========================================================\n     ARTWORK\n     ========================================================= -->\n\n<div id=\"house-art-overlay\">\n\n  <button id=\"house-art-close\" type=\"button\" aria-label=\"Close artwork\">\n    \u00d7\n  <\/button>\n\n  <img decoding=\"async\" id=\"house-art-image\" src=\"\" alt=\"\">\n\n<\/div>\n\n\n<script>\n(function () {\n\n  function initHouseMenu() {\n\n    const menu =\n      document.getElementById(\"house-side-menu\");\n\n    if (!menu) {\n      return;\n    }\n\n    if (menu.dataset.houseMenuReady === \"true\") {\n      return;\n    }\n\n    menu.dataset.houseMenuReady = \"true\";\n\n\n    \/* =======================================================\n       PAGE SETTINGS\n       ======================================================= *\/\n\n    function getFiles() {\n\n      return window.houseMenuFiles || {\n\n        story: \"\",\n        art: \"\",\n        house: \"\",\n        help: \"\"\n\n      };\n\n    }\n\n\n    \/* =======================================================\n       CURRENT WORDPRESS PAGE \/ POST ID\n       ======================================================= *\/\n\n    let currentPostId = null;\n\n\n    \/*\n     * WordPress normally places one of these classes\n     * on the <body> element:\n     *\n     * page-id-123\n     * postid-123\n     *\n     * We support both.\n     *\/\n\n    function findPostIdFromBody() {\n\n      const bodyClasses =\n        document.body.className || \"\";\n\n\n      \/*\n       * Regular WordPress Page\n       *\/\n\n      const pageMatch =\n        bodyClasses.match(\n          \/(?:^|\\s)page-id-(\\d+)(?:\\s|$)\/\n        );\n\n\n      if (pageMatch && pageMatch[1]) {\n\n        return parseInt(\n          pageMatch[1],\n          10\n        );\n\n      }\n\n\n      \/*\n       * Regular WordPress Post\n       *\/\n\n      const postMatch =\n        bodyClasses.match(\n          \/(?:^|\\s)postid-(\\d+)(?:\\s|$)\/\n        );\n\n\n      if (postMatch && postMatch[1]) {\n\n        return parseInt(\n          postMatch[1],\n          10\n        );\n\n      }\n\n\n      return null;\n\n    }\n\n\n    \/*\n     * Find the current WordPress Page\/Post ID.\n     *\n     * The body class is the preferred method.\n     *\n     * REST API URL matching is retained as a fallback\n     * for unusual WordPress templates.\n     *\/\n\n    async function findCurrentPostId() {\n\n      if (currentPostId) {\n\n        return currentPostId;\n\n      }\n\n\n      \/* -----------------------------------------------------\n         FIRST: BODY CLASS\n         ----------------------------------------------------- *\/\n\n      const bodyId =\n        findPostIdFromBody();\n\n\n      if (bodyId) {\n\n        currentPostId =\n          bodyId;\n\n        return currentPostId;\n\n      }\n\n\n      \/* -----------------------------------------------------\n         SECOND: CURRENT URL \u2192 WORDPRESS PAGES\n         ----------------------------------------------------- *\/\n\n      const currentUrl =\n        window.location.href.split(\"#\")[0];\n\n      const cleanCurrentUrl =\n        currentUrl.replace(\/\\\/$\/, \"\");\n\n\n      try {\n\n        const pageResponse =\n          await fetch(\n            \"\/the-house\/wp-json\/wp\/v2\/pages\" +\n            \"?per_page=100\" +\n            \"&status=publish\",\n            {\n              credentials: \"same-origin\"\n            }\n          );\n\n\n        if (pageResponse.ok) {\n\n          const pages =\n            await pageResponse.json();\n\n\n          if (Array.isArray(pages)) {\n\n            const matchingPage =\n              pages.find(function (page) {\n\n                if (!page.link) {\n                  return false;\n                }\n\n                return (\n                  page.link.replace(\/\\\/$\/, \"\") ===\n                  cleanCurrentUrl\n                );\n\n              });\n\n\n            if (matchingPage) {\n\n              currentPostId =\n                parseInt(\n                  matchingPage.id,\n                  10\n                );\n\n              return currentPostId;\n\n            }\n\n          }\n\n        }\n\n      } catch (error) {\n\n        console.warn(\n          \"Could not identify the current WordPress page.\",\n          error\n        );\n\n      }\n\n\n      \/* -----------------------------------------------------\n         THIRD: CURRENT URL \u2192 WORDPRESS POSTS\n         ----------------------------------------------------- *\/\n\n      try {\n\n        const postResponse =\n          await fetch(\n            \"\/the-house\/wp-json\/wp\/v2\/posts\" +\n            \"?per_page=100\" +\n            \"&status=publish\",\n            {\n              credentials: \"same-origin\"\n            }\n          );\n\n\n        if (postResponse.ok) {\n\n          const posts =\n            await postResponse.json();\n\n\n          if (Array.isArray(posts)) {\n\n            const matchingPost =\n              posts.find(function (post) {\n\n                if (!post.link) {\n                  return false;\n                }\n\n                return (\n                  post.link.replace(\/\\\/$\/, \"\") ===\n                  cleanCurrentUrl\n                );\n\n              });\n\n\n            if (matchingPost) {\n\n              currentPostId =\n                parseInt(\n                  matchingPost.id,\n                  10\n                );\n\n              return currentPostId;\n\n            }\n\n          }\n\n        }\n\n      } catch (error) {\n\n        console.warn(\n          \"Could not identify the current WordPress post.\",\n          error\n        );\n\n      }\n\n\n      return null;\n\n    }\n\n\n    \/* =======================================================\n       AUDIO\n       ======================================================= *\/\n\n    let storyAudio = null;\n    let houseAudio = null;\n\n\n    function toggleAudio(type) {\n\n      const files =\n        getFiles();\n\n\n      const source =\n        type === \"story\"\n          ? files.story\n          : files.house;\n\n\n      if (!source) {\n        return;\n      }\n\n\n      let audio;\n\n\n      if (type === \"story\") {\n\n        if (!storyAudio) {\n\n          storyAudio =\n            new Audio(source);\n\n          storyAudio.loop =\n            false;\n\n        }\n\n        audio =\n          storyAudio;\n\n      } else {\n\n        if (!houseAudio) {\n\n          houseAudio =\n            new Audio(source);\n\n          houseAudio.loop =\n            false;\n\n        }\n\n        audio =\n          houseAudio;\n\n      }\n\n\n      \/*\n       * Only one house\/story audio track\n       * should play at a time.\n       *\/\n\n      if (\n        type === \"story\" &&\n        houseAudio\n      ) {\n\n        houseAudio.pause();\n\n        houseAudio.currentTime =\n          0;\n\n      }\n\n\n      if (\n        type === \"house\" &&\n        storyAudio\n      ) {\n\n        storyAudio.pause();\n\n        storyAudio.currentTime =\n          0;\n\n      }\n\n\n      if (audio.paused) {\n\n        audio.play()\n          .catch(function (error) {\n\n            console.warn(\n              \"Audio could not be played.\",\n              error\n            );\n\n          });\n\n      } else {\n\n        audio.pause();\n\n        audio.currentTime =\n          0;\n\n      }\n\n    }\n\n\n    \/* =======================================================\n       HELP\n       ======================================================= *\/\n\n    const helpBox =\n      document.getElementById(\n        \"house-help-box\"\n      );\n\n    const helpText =\n      document.getElementById(\n        \"house-help-text\"\n      );\n\n    const helpClose =\n      document.getElementById(\n        \"house-help-close\"\n      );\n\n\n    function openHelp() {\n\n      const files =\n        getFiles();\n\n\n      if (\n        !helpBox ||\n        !helpText\n      ) {\n        return;\n      }\n\n\n      helpText.textContent =\n        files.help ||\n        \"There is nothing for you to find here right now.\";\n\n\n      helpBox.classList.add(\n        \"is-open\"\n      );\n\n\n      helpBox.setAttribute(\n        \"aria-hidden\",\n        \"false\"\n      );\n\n    }\n\n\n    function closeHelp() {\n\n      if (!helpBox) {\n        return;\n      }\n\n\n      helpBox.classList.remove(\n        \"is-open\"\n      );\n\n\n      helpBox.setAttribute(\n        \"aria-hidden\",\n        \"true\"\n      );\n\n    }\n\n\n    if (helpClose) {\n\n      helpClose.addEventListener(\n        \"click\",\n        function (event) {\n\n          event.stopPropagation();\n\n          closeHelp();\n\n        }\n      );\n\n    }\n\n\n    \/* =======================================================\n       NOTE FORM\n       ======================================================= *\/\n\n    const noteBox =\n      document.getElementById(\n        \"house-note-box\"\n      );\n\n    const noteClose =\n      document.getElementById(\n        \"house-note-close\"\n      );\n\n    const noteForm =\n      document.getElementById(\n        \"house-note-form\"\n      );\n\n    const noteAuthor =\n      document.getElementById(\n        \"house-note-author\"\n      );\n\n    const noteComment =\n      document.getElementById(\n        \"house-note-comment\"\n      );\n\n    const noteSubmit =\n      document.getElementById(\n        \"house-note-submit\"\n      );\n\n    const noteStatus =\n      document.getElementById(\n        \"house-note-status\"\n      );\n\n\n    function openNoteBox() {\n\n      if (!noteBox) {\n        return;\n      }\n\n\n      if (noteStatus) {\n\n        noteStatus.textContent =\n          \"\";\n\n        noteStatus.className =\n          \"house-note-status\";\n\n      }\n\n\n      noteBox.classList.add(\n        \"is-open\"\n      );\n\n\n      noteBox.setAttribute(\n        \"aria-hidden\",\n        \"false\"\n      );\n\n\n      setTimeout(function () {\n\n        if (noteAuthor) {\n\n          noteAuthor.focus();\n\n        }\n\n      }, 50);\n\n    }\n\n\n    function closeNoteBox() {\n\n      if (!noteBox) {\n        return;\n      }\n\n\n      noteBox.classList.remove(\n        \"is-open\"\n      );\n\n\n      noteBox.setAttribute(\n        \"aria-hidden\",\n        \"true\"\n      );\n\n    }\n\n\n    if (noteClose) {\n\n      noteClose.addEventListener(\n        \"click\",\n        function (event) {\n\n          event.stopPropagation();\n\n          closeNoteBox();\n\n        }\n      );\n\n    }\n\n\n    \/* =======================================================\n       SAVE NOTE TO WORDPRESS COMMENTS\n       ======================================================= *\/\n\n    if (noteForm) {\n\n      noteForm.addEventListener(\n        \"submit\",\n        async function (event) {\n\n          event.preventDefault();\n\n          if (noteSubmit) {\n            noteSubmit.disabled = true;\n            noteSubmit.textContent = \"Finding page\u2026\";\n          }\n\n          if (noteStatus) {\n            noteStatus.textContent = \"Finding this page\u2026\";\n            noteStatus.className = \"house-note-status\";\n          }\n\n          try {\n\n            const postId = await findCurrentPostId();\n\n            if (!postId) {\n              throw new Error(\n                \"I couldn't identify this WordPress page. Please try refreshing the page.\"\n              );\n            }\n\n            const author = noteAuthor ? noteAuthor.value.trim() : \"\";\n            const comment = noteComment ? noteComment.value.trim() : \"\";\n            const emailField = document.getElementById(\"house-note-email\");\n            const email = emailField ? emailField.value.trim() : \"\";\n\n            if (!author) {\n              throw new Error(\"Please add your name.\");\n            }\n\n            if (!email) {\n              throw new Error(\"Please add your email address.\");\n            }\n\n            if (!emailField || !emailField.checkValidity()) {\n              throw new Error(\"Please enter a valid email address.\");\n            }\n\n            if (!comment) {\n              throw new Error(\"Please add your note.\");\n            }\n\n            if (noteStatus) {\n              noteStatus.textContent = \"Leaving your note\u2026\";\n              noteStatus.className = \"house-note-status\";\n            }\n\n            if (noteSubmit) {\n              noteSubmit.textContent = \"Leaving note\u2026\";\n            }\n\n            \/*\n             * Use WordPress's normal comment form endpoint rather than the\n             * REST API. This allows the site's existing anonymous-comment\n             * settings and moderation rules to handle the note.\n             *\n             * The form is submitted into a hidden same-origin iframe so the\n             * visitor stays on the current page.\n             *\/\n\n            let commentFrame = document.getElementById(\"house-comment-frame\");\n\n            if (!commentFrame) {\n              commentFrame = document.createElement(\"iframe\");\n              commentFrame.id = \"house-comment-frame\";\n              commentFrame.name = \"house-comment-frame\";\n              commentFrame.title = \"\";\n              commentFrame.setAttribute(\"aria-hidden\", \"true\");\n              commentFrame.style.position = \"fixed\";\n              commentFrame.style.width = \"1px\";\n              commentFrame.style.height = \"1px\";\n              commentFrame.style.border = \"0\";\n              commentFrame.style.opacity = \"0\";\n              commentFrame.style.pointerEvents = \"none\";\n              document.body.appendChild(commentFrame);\n            }\n\n            let postIdField = noteForm.querySelector('input[name=\"comment_post_ID\"]');\n            if (!postIdField) {\n              postIdField = document.createElement(\"input\");\n              postIdField.type = \"hidden\";\n              postIdField.name = \"comment_post_ID\";\n              noteForm.appendChild(postIdField);\n            }\n            postIdField.value = String(postId);\n\n            let parentField = noteForm.querySelector('input[name=\"comment_parent\"]');\n            if (!parentField) {\n              parentField = document.createElement(\"input\");\n              parentField.type = \"hidden\";\n              parentField.name = \"comment_parent\";\n              noteForm.appendChild(parentField);\n            }\n            parentField.value = \"0\";\n\n            let urlField = noteForm.querySelector('input[name=\"url\"]');\n            if (!urlField) {\n              urlField = document.createElement(\"input\");\n              urlField.type = \"hidden\";\n              urlField.name = \"url\";\n              noteForm.appendChild(urlField);\n            }\n            urlField.value = \"\";\n\n            noteForm.action = \"\/the-house\/wp-comments-post.php\";\n            noteForm.method = \"post\";\n            noteForm.target = \"house-comment-frame\";\n\n            \/*\n             * Submit the form into the hidden iframe. We wait for the\n             * WordPress response and inspect its URL\/body before telling\n             * the visitor that the note was saved.\n             *\/\n            const handleCommentResponse = function () {\n              try {\n                const frameWindow = commentFrame.contentWindow;\n                const currentUrl = frameWindow.location.href || \"\";\n\n                if (\n                  !currentUrl ||\n                  currentUrl === \"about:blank\" ||\n                  currentUrl.indexOf(\"about:blank\") === 0\n                ) {\n                  return;\n                }\n\n                const frameText = frameWindow.document.body\n                  ? frameWindow.document.body.innerText || \"\"\n                  : \"\";\n\n                const lowerUrl = currentUrl.toLowerCase();\n                const lowerText = frameText.toLowerCase();\n\n                \/*\n                 * WordPress sends the visitor to an error page when the\n                 * comment cannot be accepted. Catch that before success.\n                 *\/\n                if (\n                  lowerUrl.indexOf(\"wp-comments-post.php\") !== -1 &&\n                  (\n                    lowerUrl.indexOf(\"error\") !== -1 ||\n                    lowerText.indexOf(\"error:\") !== -1 ||\n                    lowerText.indexOf(\"sorry\") !== -1\n                  )\n                ) {\n                  const lines = frameText\n                    .split(\/\\r?\\n\/)\n                    .map(function (line) { return line.trim(); })\n                    .filter(Boolean);\n\n                  throw new Error(\n                    lines.length\n                      ? lines[0]\n                      : \"WordPress could not save the note.\"\n                  );\n                }\n\n                if (noteStatus) {\n                  noteStatus.textContent =\n                    \"Your note has been submitted. It may need approval before it appears in Paper notes.\";\n                  noteStatus.className = \"house-note-status success\";\n                }\n\n                if (noteComment) {\n                  noteComment.value = \"\";\n                }\n\n                if (notesBox && notesBox.classList.contains(\"is-open\")) {\n                  loadPageNotes();\n                }\n\n                setTimeout(function () {\n                  closeNoteBox();\n                }, 2200);\n\n              } catch (responseError) {\n                console.error(\"House note response error:\", responseError);\n\n                if (noteStatus) {\n                  noteStatus.textContent =\n                    responseError.message || \"WordPress could not save the note.\";\n                  noteStatus.className = \"house-note-status error\";\n                }\n              } finally {\n                commentFrame.removeEventListener(\"load\", handleCommentResponse);\n              }\n            };\n\n            commentFrame.addEventListener(\"load\", handleCommentResponse);\n\n            \/*\n             * HTMLFormElement.submit() sends the exact fields assembled\n             * above without triggering this submit listener again.\n             *\/\n            HTMLFormElement.prototype.submit.call(noteForm);\n\n          } catch (error) {\n\n            console.error(\"House note error:\", error);\n\n            if (noteStatus) {\n              noteStatus.textContent =\n                error.message || \"The note could not be saved.\";\n              noteStatus.className = \"house-note-status error\";\n            }\n\n          } finally {\n\n            if (noteSubmit) {\n              noteSubmit.disabled = false;\n              noteSubmit.textContent = \"Leave note\";\n            }\n\n          }\n\n        }\n      );\n\n    }\n\n\n    \/* =======================================================\n       SHOW PAPER NOTES\n       ======================================================= *\/\n\n    const notesBox =\n      document.getElementById(\n        \"house-notes-box\"\n      );\n\n    const notesClose =\n      document.getElementById(\n        \"house-notes-close\"\n      );\n\n    const notesList =\n      document.getElementById(\n        \"house-notes-list\"\n      );\n\n\n    function openNotesBox() {\n\n      if (!notesBox) {\n        return;\n      }\n\n\n      notesBox.classList.add(\n        \"is-open\"\n      );\n\n\n      notesBox.setAttribute(\n        \"aria-hidden\",\n        \"false\"\n      );\n\n\n      loadPageNotes();\n\n    }\n\n\n    function closeNotesBox() {\n\n      if (!notesBox) {\n        return;\n      }\n\n\n      notesBox.classList.remove(\n        \"is-open\"\n      );\n\n\n      notesBox.setAttribute(\n        \"aria-hidden\",\n        \"true\"\n      );\n\n    }\n\n\n    if (notesClose) {\n\n      notesClose.addEventListener(\n        \"click\",\n        function (event) {\n\n          event.stopPropagation();\n\n          closeNotesBox();\n\n        }\n      );\n\n    }\n\n\n    \/* =======================================================\n       LOAD WORDPRESS COMMENTS FOR CURRENT PAGE\n       ======================================================= *\/\n\n    async function loadPageNotes() {\n\n      if (!notesList) {\n        return;\n      }\n\n\n      notesList.innerHTML =\n        '<div class=\"house-no-notes\">' +\n        'Finding the notes\u2026' +\n        '<\/div>';\n\n\n      try {\n\n        \/*\n         * Find the same WordPress page ID\n         * used when saving the note.\n         *\/\n\n        const postId =\n          await findCurrentPostId();\n\n\n        if (!postId) {\n\n          throw new Error(\n            \"I couldn't identify this page.\"\n          );\n\n        }\n\n\n        \/*\n         * Ask WordPress for comments belonging\n         * specifically to this page.\n         *\n         * status=approve means we only show\n         * comments that WordPress has made public.\n         *\/\n\n        let comments = [];\n\n        \/*\n         * First try the WordPress REST API.\n         * This is the cleanest way to get only comments\n         * attached to the current page.\n         *\/\n        try {\n\n          const response =\n            await fetch(\n              \"\/the-house\/wp-json\/wp\/v2\/comments\" +\n              \"?post=\" +\n              encodeURIComponent(\n                postId\n              ) +\n              \"&status=approve\" +\n              \"&per_page=100\" +\n              \"&orderby=date\" +\n              \"&order=desc\",\n              {\n                method: \"GET\",\n                credentials: \"same-origin\"\n              }\n            );\n\n\n          if (response.ok) {\n\n            const data =\n              await response.json();\n\n            if (Array.isArray(data)) {\n              comments = data;\n            }\n\n          }\n\n        } catch (error) {\n\n          console.warn(\n            \"The WordPress comments API could not be read.\",\n            error\n          );\n\n        }\n\n\n        \/*\n         * Fallback: WordPress also prints approved comments\n         * directly into the page. If the REST API is blocked\n         * by the site's configuration, read those visible\n         * comments instead. This still keeps the notes limited\n         * to the current page.\n         *\/\n        if (comments.length === 0) {\n\n          const nativeComments =\n            Array.from(\n              document.querySelectorAll(\n                \"#comments li.comment, .comment-list li.comment, li.comment\"\n              )\n            );\n\n\n          comments = nativeComments.map(function (item) {\n\n            const authorElement =\n              item.querySelector(\n                \".comment-author, .fn, .commentmetadata .fn\"\n              );\n\n            const dateElement =\n              item.querySelector(\n                \"time, .comment-metadata, .comment-meta\"\n              );\n\n            const contentElement =\n              item.querySelector(\n                \".comment-content\"\n              );\n\n            return {\n              author_name: authorElement\n                ? authorElement.textContent.trim()\n                : \"Anonymous\",\n              date: dateElement\n                ? (dateElement.getAttribute(\"datetime\") || dateElement.textContent.trim())\n                : \"\",\n              content: {\n                rendered: contentElement\n                  ? contentElement.innerHTML\n                  : item.textContent\n              }\n            };\n\n          });\n\n        }\n\n\n        \/*\n         * No approved comments.\n         *\/\n\n        if (\n          !Array.isArray(\n            comments\n          ) ||\n          comments.length === 0\n        ) {\n\n          notesList.innerHTML =\n            '<div class=\"house-no-notes\">' +\n            'No paper notes have been left on this page yet.' +\n            '<\/div>';\n\n          return;\n\n        }\n\n\n        \/*\n         * Empty the loading message.\n         *\/\n\n        notesList.innerHTML =\n          \"\";\n\n\n        \/*\n         * Build each paper note safely\n         * using textContent rather than injecting\n         * comment HTML directly.\n         *\/\n\n        comments.forEach(\n          function (comment) {\n\n            const note =\n              document.createElement(\n                \"div\"\n              );\n\n            note.className =\n              \"house-single-note\";\n\n\n            const author =\n              document.createElement(\n                \"div\"\n              );\n\n            author.className =\n              \"house-single-note-author\";\n\n\n            author.textContent =\n              comment.author_name ||\n              \"Anonymous\";\n\n\n            const date =\n              document.createElement(\n                \"div\"\n              );\n\n            date.className =\n              \"house-single-note-date\";\n\n\n            if (comment.date) {\n\n              const parsedDate =\n                new Date(\n                  comment.date\n                );\n\n\n              if (\n                !isNaN(\n                  parsedDate.getTime()\n                )\n              ) {\n\n                date.textContent =\n                  parsedDate.toLocaleDateString(\n                    undefined,\n                    {\n                      year:\n                        \"numeric\",\n\n                      month:\n                        \"long\",\n\n                      day:\n                        \"numeric\"\n                    }\n                  );\n\n              }\n\n            }\n\n\n            const text =\n              document.createElement(\n                \"div\"\n              );\n\n            text.className =\n              \"house-single-note-text\";\n\n\n            \/*\n             * WordPress gives us rendered HTML\n             * for comment.content.\n             *\n             * We convert it to plain text so that\n             * visitors' comments cannot inject\n             * arbitrary HTML into the menu.\n             *\/\n\n            if (\n              comment.content &&\n              comment.content.rendered\n            ) {\n\n              text.textContent =\n                stripHtml(\n                  comment.content.rendered\n                );\n\n            } else {\n\n              text.textContent =\n                \"\";\n\n            }\n\n\n            note.appendChild(\n              author\n            );\n\n\n            if (\n              date.textContent\n            ) {\n\n              note.appendChild(\n                date\n              );\n\n            }\n\n\n            note.appendChild(\n              text\n            );\n\n\n            notesList.appendChild(\n              note\n            );\n\n          }\n        );\n\n\n      } catch (error) {\n\n        console.error(\n          \"House notes error:\",\n          error\n        );\n\n\n        notesList.innerHTML =\n          '<div class=\"house-no-notes\">' +\n          'The paper notes could not be loaded right now.' +\n          '<\/div>';\n\n      }\n\n    }\n\n\n    \/* =======================================================\n       REMOVE HTML FROM WORDPRESS COMMENT CONTENT\n       ======================================================= *\/\n\n    function stripHtml(html) {\n\n      const temporary =\n        document.createElement(\n          \"div\"\n        );\n\n\n      temporary.innerHTML =\n        html;\n\n\n      return (\n        temporary.textContent ||\n        temporary.innerText ||\n        \"\"\n      );\n\n    }\n\n\n    \/* =======================================================\n       ARTWORK\n       ======================================================= *\/\n\n    const artOverlay =\n      document.getElementById(\n        \"house-art-overlay\"\n      );\n\n    const artImage =\n      document.getElementById(\n        \"house-art-image\"\n      );\n\n    const artClose =\n      document.getElementById(\n        \"house-art-close\"\n      );\n\n\n    function openArtwork() {\n\n      const files =\n        getFiles();\n\n\n      if (\n        !files.art ||\n        !artOverlay ||\n        !artImage\n      ) {\n\n        return;\n\n      }\n\n\n      artImage.src =\n        files.art;\n\n\n      artOverlay.style.display =\n        \"flex\";\n\n\n      if (\n        artOverlay.requestFullscreen\n      ) {\n\n        artOverlay\n          .requestFullscreen()\n          .catch(function () {});\n\n      } else if (\n        artOverlay.webkitRequestFullscreen\n      ) {\n\n        artOverlay.webkitRequestFullscreen();\n\n      }\n\n    }\n\n\n    function closeArtwork() {\n\n      if (!artOverlay) {\n        return;\n      }\n\n\n      artOverlay.style.display =\n        \"none\";\n\n\n      if (artImage) {\n\n        artImage.src =\n          \"\";\n\n      }\n\n\n      if (\n        document.fullscreenElement\n      ) {\n\n        document\n          .exitFullscreen()\n          .catch(function () {});\n\n      } else if (\n        document.webkitFullscreenElement\n      ) {\n\n        document.webkitExitFullscreen();\n\n      }\n\n    }\n\n\n    if (artClose) {\n\n      artClose.addEventListener(\n        \"click\",\n        function (event) {\n\n          event.stopPropagation();\n\n          closeArtwork();\n\n        }\n      );\n\n    }\n\n\n    if (artOverlay) {\n\n      artOverlay.addEventListener(\n        \"click\",\n        function (event) {\n\n          if (\n            event.target ===\n            artOverlay\n          ) {\n\n            closeArtwork();\n\n          }\n\n        }\n      );\n\n    }\n\n\n    \/* =======================================================\n       ESCAPE KEY\n       ======================================================= *\/\n\n    document.addEventListener(\n      \"keydown\",\n      function (event) {\n\n        if (\n          event.key !==\n          \"Escape\"\n        ) {\n\n          return;\n\n        }\n\n\n        closeHelp();\n\n        closeNoteBox();\n\n        closeNotesBox();\n\n\n        if (\n          artOverlay &&\n          artOverlay.style.display ===\n          \"flex\"\n        ) {\n\n          closeArtwork();\n\n        }\n\n      }\n    );\n\n\n    \/* =======================================================\n       MENU BUTTONS\n       ======================================================= *\/\n\n    menu.addEventListener(\n      \"click\",\n      function (event) {\n\n        const button =\n          event.target.closest(\n            \".house-menu-button\"\n          );\n\n\n        if (\n          !button ||\n          !menu.contains(\n            button\n          )\n        ) {\n\n          return;\n\n        }\n\n\n        \/* ---------------------------------------------------\n           STORY\n           --------------------------------------------------- *\/\n\n        if (\n          button.classList.contains(\n            \"house-story\"\n          )\n        ) {\n\n          toggleAudio(\n            \"story\"\n          );\n\n          return;\n\n        }\n\n\n        \/* ---------------------------------------------------\n           ART\n           --------------------------------------------------- *\/\n\n        if (\n          button.classList.contains(\n            \"house-eye\"\n          )\n        ) {\n\n          openArtwork();\n\n          return;\n\n        }\n\n\n        \/* ---------------------------------------------------\n           HOUSE AUDIO\n           --------------------------------------------------- *\/\n\n        if (\n          button.classList.contains(\n            \"house-ear\"\n          )\n        ) {\n\n          toggleAudio(\n            \"house\"\n          );\n\n          return;\n\n        }\n\n\n        \/* ---------------------------------------------------\n           HELP\n           --------------------------------------------------- *\/\n\n        if (\n          button.classList.contains(\n            \"house-help\"\n          )\n        ) {\n\n          openHelp();\n\n          return;\n\n        }\n\n\n        \/* ---------------------------------------------------\n           LEAVE A NOTE\n           --------------------------------------------------- *\/\n\n        if (\n          button.classList.contains(\n            \"house-note\"\n          )\n        ) {\n\n          openNoteBox();\n\n          return;\n\n        }\n\n\n        \/* ---------------------------------------------------\n           SEARCH PAPER NOTES\n           --------------------------------------------------- *\/\n\n        if (\n          button.classList.contains(\n            \"house-notes\"\n          )\n        ) {\n\n          openNotesBox();\n\n          return;\n\n        }\n\n      }\n    );\n\n  }\n\n\n  \/* =========================================================\n     INITIALISE\n     ========================================================= *\/\n\n  if (\n    document.readyState ===\n    \"loading\"\n  ) {\n\n    document.addEventListener(\n      \"DOMContentLoaded\",\n      initHouseMenu\n    );\n\n  } else {\n\n    initHouseMenu();\n\n  }\n\n})();\n<\/script>\n\n\n<script>\nwindow.houseMenuFiles = {\n\n  story: \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/MConverter.eu_doll-window-2.mp3\",\n\n  art: \"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/dolls-by-the-window-scaled.jpg\",\n\n  house: \"\",\n\n  help: \"If you look closely, there is something hidden here - try scrolling\"\n\n};\n<\/script>\n\n\n\n<a\n  href=\"https:\/\/itdd.au.dk\/the-house\/a-friendly-robot\/\"\n  class=\"robot-link-button\"\n  aria-label=\"Open robot\"\n>\n  <img decoding=\"async\"\n    src=\"https:\/\/itdd.au.dk\/the-house\/wp-content\/uploads\/sites\/112\/2026\/09\/IMG_7988-scaled.jpeg\"\n    alt=\"Robot\"\n  >\n<\/a>\n\n<style>\n.robot-link-button {\n    display: inline-block;\n    width: 65px;\n    height: 65px;\n    overflow: hidden;\n    border-radius: 8px;\n\n    \/* Removes the white background visually *\/\n    mix-blend-mode: multiply;\n\n    transition:\n        transform 0.2s ease,\n        filter 0.2s ease;\n}\n\n.robot-link-button img {\n    display: block;\n    width: 100%;\n    height: 100%;\n\n    object-fit: cover;\n    object-position: center;\n\n    transition:\n        filter 0.2s ease,\n        transform 0.2s ease;\n}\n\n\/* Hover effect *\/\n\n.robot-link-button:hover {\n    transform: scale(1.06);\n    filter:\n        drop-shadow(0 0 5px rgba(255,255,255,0.8))\n        drop-shadow(0 0 10px rgba(255,255,255,0.4));\n}\n\n.robot-link-button:hover img {\n    filter: brightness(1.18);\n}\n\n\/* Mobile\/touch *\/\n\n.robot-link-button:active {\n    transform: scale(0.96);\n}\n<\/style>\n","protected":false},"excerpt":{"rendered":"<p>Think of all the joy the once gave their owners. Lost little dolls. So lonely they must be. They simply long to play, with you and with me. \u00d7 \u2039 \u203a<\/p>\n","protected":false},"author":224,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-107","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/itdd.au.dk\/the-house\/wp-json\/wp\/v2\/pages\/107","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/itdd.au.dk\/the-house\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/itdd.au.dk\/the-house\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/itdd.au.dk\/the-house\/wp-json\/wp\/v2\/users\/224"}],"replies":[{"embeddable":true,"href":"https:\/\/itdd.au.dk\/the-house\/wp-json\/wp\/v2\/comments?post=107"}],"version-history":[{"count":20,"href":"https:\/\/itdd.au.dk\/the-house\/wp-json\/wp\/v2\/pages\/107\/revisions"}],"predecessor-version":[{"id":1261,"href":"https:\/\/itdd.au.dk\/the-house\/wp-json\/wp\/v2\/pages\/107\/revisions\/1261"}],"wp:attachment":[{"href":"https:\/\/itdd.au.dk\/the-house\/wp-json\/wp\/v2\/media?parent=107"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}