{"version":3,"file":"wH_VvmC0.js","sources":["../../../../pages/about/programs/[slug].vue"],"sourcesContent":["<script lang=\"ts\" setup>\n// COMPONENTS\nimport { NavBreadcrumb, BannerText, BannerHeader, SectionWrapper, DividerWayFinder, PageAnchor, FlexibleBlocks, ButtonMore, SectionTeaserCard } from '@ucla-library-monorepo/ucla-library-website-components'\n\nimport { onMounted } from 'vue'\n\n// HELPERS\nimport _get from 'lodash/get'\nimport removeTags from '../utils/removeTags'\n\n// GQL\nimport PROGRAM_DETAIL from '../gql/queries/ProgramDetail.gql'\n\nconst { $graphql, $getHeaders } = useNuxtApp()\n\nconst route = useRoute()\nconst hostname = ref('')\nhostname.value = useRuntimeConfig().public.hostName\nif (route.params.slug.indexOf('clicc') > 0)\n  console.log('hostname', useRuntimeConfig().public.hostName)\n\nconst { data, error } = await useAsyncData(`program-detail-${route.params.slug}`, async () => {\n  const data = await $graphql.default.request(PROGRAM_DETAIL, {\n    slug: route.params.slug,\n  })\n\n  return data\n})\n\n// console.log('Program preview test', data)\n\nif (error.value) {\n  throw createError({\n    ...error.value, statusMessage: 'Page not found.' + error.value, fatal: true\n  })\n}\n\nif (!data.value.entry) {\n  throw createError({ statusCode: 404, message: 'Page not found', fatal: true })\n}\n\nif (data.value.entry.slug && import.meta.prerender) {\n  const { index } = useIndexer()\n  await index(data.value.entry, route.params.slug)\n}\n\nconst page = ref(_get(data.value, 'entry', {}))\nconst associatedArticles = ref(_get(data.value, 'associatedArticles', {}))\nconst h2Array = ref([]) // anchor tags\n\nwatch(data, (newVal, oldVal) => {\n  // console.log('In watch preview enabled, newVal, oldVal', newVal, oldVal)\n  page.value = _get(newVal, 'entry', {})\n  associatedArticles.value = _get(newVal, 'associatedArticles', {})\n})\n\nuseHead({\n  title: page.value ? page.value.title : '... loading',\n  meta: [\n    {\n      hid: 'description',\n      name: 'description',\n      content: removeTags(page.value.text)\n    }\n  ]\n})\n\nconst parsedButtonText = computed(() => {\n  return _get(page.value, 'buttonUrl[0].buttonText', '')\n})\n\nconst parsedButtonTo = computed(() => {\n  return _get(page.value, 'buttonUrl[0].buttonUrl', '')\n})\n\nconst parsedStaffDirectory = computed(() => {\n  const showStaffDirectory = page.value.viewStaffDirectory\n  const staffDepartmentTitle = page.value.department && page.value.department.length > 0 && page.value.department[0]?.title ? page.value.department[0].title : null\n\n  if (showStaffDirectory === 'false') {\n    // if the showStaffDirectory is false, show nothing\n    return ''\n  } else if (staffDepartmentTitle !== null) {\n    // else if true & department title exists, show the department title\n    return '/about/staff/?q=&filters=departments.title.keyword:(' + staffDepartmentTitle.replaceAll(' ', '+') + ')'\n  } else {\n    // else if true & department title does not exist, show the page title instead\n    // (we implemented this fallback based on request from APPS-2159)\n    return '/about/staff/?q=&filters=departments.title.keyword:(' + page.value.title.replaceAll(' ', '+') + ')'\n  }\n})\n\nconst parsedArticles = computed(() => {\n  return associatedArticles.value.map((obj) => {\n    return {\n      ...obj,\n      to:\n        obj.externalResourceUrl != null\n          ? _get(obj, 'externalResourceUrl', '')\n          : `/${obj.to}`,\n      image: _get(obj, 'heroImage[0].image[0]', {}),\n      category: _get(obj, 'category', ''),\n      title: _get(obj, 'title', ''),\n      text: _get(obj, 'description', ''),\n      startDate: _get(obj, 'startDate', ''),\n    }\n  })\n})\n\nconst parsedSeeMore = computed(() => {\n  if (page.value.slug === 'preservation-conservation-program') {\n    return '/about/blogs/listing-preservation-and-conservation-blog/'\n  } else {\n    return '/about/news/'\n  }\n})\n\nonMounted(() => {\n  // for different environments iframe and parent page url should have the same hostname\n  const url = new URL(window.location.href)\n  hostname.value = `${url.protocol}//${url.hostname}:${url.port}`\n  console.log('In mounted: hostname.value:  ', hostname.value)\n  // Call the plugin method to get the .section-header2 and .section-header3 elements\n  h2Array.value = $getHeaders.getHeadersMethod()\n})\n</script>\n\n<template>\n  <main\n    id=\"main\"\n    class=\"page page-program-detail\"\n  >\n    <NavBreadcrumb\n      to=\"/about/programs/\"\n      :title=\"page.title\"\n      parent-title=\"Programs\"\n    />\n    <BannerText\n      v-if=\"!page.heroImage || page.heroImage.length == 0\"\n      :title=\"page.title\"\n      :text=\"page.text\"\n      :email=\"page.email\"\n      :phone=\"page.phoneNumber\"\n      :staff-directory-link=\"parsedStaffDirectory\"\n      :button-text=\"parsedButtonText\"\n      :to=\"parsedButtonTo\"\n    />\n\n    <SectionWrapper\n      v-if=\"page.heroImage && page.heroImage.length == 1\"\n      class=\"section-banner\"\n    >\n      <BannerHeader\n        :media=\"page.heroImage[0].image[0]\"\n        :title=\"page.title\"\n        :text=\"page.text\"\n        :email=\"page.email\"\n        :phone=\"page.phoneNumber\"\n        :staff-directory-link=\"parsedStaffDirectory\"\n        :prompt=\"parsedButtonText\"\n        :to=\"parsedButtonTo\"\n        :align-right=\"true\"\n      />\n    </SectionWrapper>\n\n    <SectionWrapper theme=\"divider\">\n      <DividerWayFinder\n        class=\"divider\"\n        color=\"about\"\n      />\n    </SectionWrapper>\n\n    <PageAnchor\n      v-if=\"h2Array.length >= 3\"\n      :section-titles=\"h2Array\"\n    />\n\n    <SectionWrapper>\n      <TheHours\n        v-if=\"\n          page.uri ==\n            'about/programs/campus-library-instructional-computing-commons-clicc'\n        \"\n        :src=\"`${hostname}/blockCliccHours.html?lid=0`\"\n      />\n\n      <DividerWayFinder\n        v-if=\"\n          page.uri ==\n            'about/programs/campus-library-instructional-computing-commons-clicc'\n        \"\n        class=\"divider\"\n        color=\"about\"\n      />\n    </SectionWrapper>\n\n    <FlexibleBlocks\n      class=\"flexible-content\"\n      :blocks=\"page.blocks\"\n    />\n\n    <SectionWrapper theme=\"divider\">\n      <DividerWayFinder\n        v-if=\"parsedArticles.length > 0\"\n        color=\"about\"\n        class=\"divider-way-finder\"\n      />\n    </SectionWrapper>\n\n    <SectionWrapper\n      v-if=\"parsedArticles.length > 0\"\n      class=\"associated-articles\"\n      section-title=\"Associated News\"\n    >\n      <SectionTeaserCard\n        class=\"section-teaser-card\"\n        :items=\"parsedArticles\"\n      />\n      <nuxt-link\n        v-if=\"associatedArticles\"\n        class=\"button-more\"\n        :to=\"parsedSeeMore\"\n      >\n        <ButtonMore text=\"See More Associated Articles\" />\n      </nuxt-link>\n    </SectionWrapper>\n  </main>\n</template>\n\n<style lang=\"scss\" scoped>\n.page-program-detail {\n  .section-teaser-card {\n    display: flex;\n    flex-direction: row;\n  }\n\n  .section-title {\n    margin-bottom: var(--space-xl);\n\n    .title {\n      @include step-3;\n      color: var(--color-primary-blue-03);\n      margin-bottom: var(--space-m);\n    }\n  }\n\n  .button-more {\n    margin: var(--space-2xl) auto;\n  }\n}\n</style>\n"],"names":["_withAsyncContext","data","PROGRAM_DETAIL"],"mappings":"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"}