{"version":3,"mappings":"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","names":["modals","useModalStore","store","useSongSearchStore","t","useI18n","removeFilter","filter","newSelectedFilters","f","sortByOptions","computed","props","__props","emit","__emit","value","val","Error","defineAsyncComponent","__vitePreload","translate","useTranslationStore","appStore","useAppStore","date","useDateStore","route","useRoute","songsByLanguage","ref","emitter","mounted","runningWatch","activatedWatch","betaStore","onActivated","nextTick","router","useBetaStore","onMounted","results","_a","onBeforeUnmount","language","findSongsByLanguageTitle","d","isMassSettingSearch","profileStore","useProfileStore","formatter","_b","search"],"ignoreList":[],"sources":["../../Vue/src/components/Common/AddFilterDropdown.vue","../../Vue/src/components/SearchResults/SongFiltersAndSort.vue","../../Vue/src/components/SearchResults/ExpandSearchResults.vue","../../Vue/src/pages/SearchResultsPage.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nconst modals = useModalStore();\r\n</script>\r\n\r\n<template>\r\n  <div>\r\n    <Button\r\n      type=\"button\"\r\n      variant=\"light\"\r\n      icon-start=\"fa-light fa-filter\"\r\n      small\r\n      class=\"me-2\"\r\n      @click=\"modals.showModal('AddFilterDropdownModal')\"\r\n    >\r\n      {{ $t(\"SV.LIT_Filters\") }}\r\n    </Button>\r\n  </div>\r\n</template>\r\n\r\n<style scoped lang=\"postcss\"></style>\r\n","<script setup lang=\"ts\">\r\nimport { SelectedSongSearchFilter } from \"@/models/SelectedSongSearchFilter\";\r\nimport { SelectOption } from \"@/models/frontend-only/SelectOption\";\r\n\r\ndefineProps<{\r\n  placeholder?: boolean;\r\n}>();\r\n\r\nconst store = useSongSearchStore();\r\nconst { t } = useI18n();\r\n\r\nfunction removeFilter(filter: SelectedSongSearchFilter) {\r\n  if (!store.responseData) {\r\n    return;\r\n  }\r\n  const newSelectedFilters = store.responseData.selectedFilters\r\n    .filter((f) => !(f.id === filter.id && f.categoryId === filter.categoryId))\r\n    .map((f) => ({ id: f.id, catId: f.categoryId }));\r\n\r\n  store.updateFilters(newSelectedFilters, store.responseData.expandToAllSongs);\r\n}\r\n\r\nconst sortByOptions = computed<SelectOption[]>(() => [\r\n  {\r\n    label: t(\"G.LIT_MostRelevant\"),\r\n    value: \"relevant\",\r\n  },\r\n  {\r\n    label: t(\"G.LIT_Popularity\"),\r\n    value: \"popularity\",\r\n  },\r\n  {\r\n    label: t(\"G.LIT_CCLIRank\"),\r\n    value: \"rank\",\r\n  },\r\n  {\r\n    label: t(\"G.LIT_DateAdded\"),\r\n    value: \"date\",\r\n  },\r\n  {\r\n    label: t(\"G.LIT_Title\"),\r\n    value: \"title\",\r\n  },\r\n]);\r\n</script>\r\n\r\n<template>\r\n  <div class=\"flex w-full flex-wrap items-center justify-between gap-2\">\r\n    <div>\r\n      <div\r\n        class=\"filters\"\r\n        v-if=\"placeholder\"\r\n      >\r\n        <Button\r\n          placeholder\r\n          style=\"width: 200px; height: 1.5em\"\r\n        />\r\n      </div>\r\n      <div\r\n        class=\"filters\"\r\n        v-else\r\n      >\r\n        <label class=\"sr-only\">{{ $t(\"SV.LIT_Filters\") }}</label>\r\n\r\n        <AddFilterDropdown />\r\n\r\n        <Button\r\n          v-for=\"f of store.responseData?.selectedFilters\"\r\n          :key=\"f.id\"\r\n          type=\"button\"\r\n          class=\"filter-btn\"\r\n          @click=\"removeFilter(f)\"\r\n        >\r\n          <FAIcon class=\"fa-solid fa-times close-icon\" />\r\n          <div>\r\n            <div class=\"type\">\r\n              {{ f.categoryTitle }}\r\n            </div>\r\n            <div>{{ f.title }}</div>\r\n          </div>\r\n        </Button>\r\n      </div>\r\n    </div>\r\n    <div class=\"flex-shrink-0\">\r\n      <FormSelect\r\n        id=\"SortSearchResultsSelect\"\r\n        inline\r\n        v-if=\"placeholder\"\r\n        placeholder\r\n        style=\"width: 250px\"\r\n      />\r\n      <FormSelect\r\n        v-else\r\n        :model-value=\"store.responseData?.sortBy || 'relevant'\"\r\n        :label=\"$t('G.LIT_SortBy')\"\r\n        :options=\"sortByOptions\"\r\n        id=\"SortSearchResultsSelect\"\r\n        inline\r\n        @update:model-value=\"store.onSortByUpdate\"\r\n        data-user-search-activity=\"Sort Results\"\r\n      />\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<style scoped lang=\"postcss\">\r\n#SortSearchResultsSelect {\r\n  :deep() {\r\n    select {\r\n      @apply w-full;\r\n    }\r\n  }\r\n}\r\n\r\n.fliters {\r\n  @apply flex flex-wrap items-center gap-2;\r\n}\r\n\r\n.filter-btn {\r\n  letter-spacing: unset;\r\n  text-transform: unset;\r\n  font-weight: normal;\r\n\r\n  @apply mr-1 mt-1 rounded-lg p-2 px-4 font-sans hover:bg-light-700;\r\n  text-align: left;\r\n  .type {\r\n    @apply text-xs uppercase text-gray-500;\r\n  }\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nconst props = defineProps<{\r\n  modelValue: boolean;\r\n}>();\r\n\r\nconst emit = defineEmits<{\r\n  (e: \"update:modelValue\", value: boolean): void;\r\n}>();\r\n\r\nconst value = computed({\r\n  get: () => {\r\n    return props.modelValue;\r\n  },\r\n  set: (val: boolean) => {\r\n    emit(\"update:modelValue\", val);\r\n  },\r\n});\r\n</script>\r\n\r\n<template>\r\n  <div class=\"expand-search flex items-center py-2\">\r\n    <FormCheck\r\n      v-model=\"value\"\r\n      name=\"expandAllSongs\"\r\n      :label=\"$t('SV.MES_SelectBoxExpand')\"\r\n      class=\"apply-filter-checkbox\"\r\n      data-user-search-activity=\"Expanded Search\"\r\n    />\r\n    <Tooltip\r\n      :text=\"$t('SV.MES_ExpandSearchTooltip')\"\r\n      class=\"ms-1\"\r\n    >\r\n      <FAIcon class=\"fa-light fa-question-circle text-primary\" />\r\n    </Tooltip>\r\n  </div>\r\n</template>\r\n\r\n<style scoped lang=\"postcss\"></style>\r\n","<script setup lang=\"ts\">\r\nimport { SongsByLanguageCategory } from \"@/models/SongsByLanguageCategory\";\r\n\r\nconst Error = defineAsyncComponent(() => import(\"@/components/Error.vue\"));\r\nconst translate = useTranslationStore();\r\nconst store = useSongSearchStore();\r\nconst appStore = useAppStore();\r\nconst { t } = useI18n();\r\nconst date = useDateStore();\r\nconst route = useRoute();\r\nconst songsByLanguage = ref<SongsByLanguageCategory[]>([]);\r\nemitter.on(\"languageUpdated\", store.updateTitleAndDescription);\r\nlet mounted = false;\r\n\r\nlet runningWatch = false;\r\n\r\nactivatedWatch(\r\n  () => [route.query, translate.currentLanguageCode],\r\n  async () => {\r\n    if (!mounted) {\r\n      return;\r\n    }\r\n    runningWatch = true;\r\n    if (route.query.list === \"popular\" && betaStore.features.ccliTop100New) {\r\n      return;\r\n    }\r\n    await store.loadSongs();\r\n    store.updateTitleAndDescription();\r\n    runningWatch = false;\r\n  },\r\n);\r\n\r\nonActivated(async () => {\r\n  /**\r\n   * Ensures that if the user types the same song number twice, it will redirect to the song page.\r\n   */\r\n  await nextTick();\r\n  if (!runningWatch) {\r\n    if (\r\n      store.responseData &&\r\n      store.responseData.numResults === 1 &&\r\n      store.responseData.page === 1 &&\r\n      store.responseData.items[0].songNumber\r\n    ) {\r\n      router.replace({\r\n        path: `/songs/${store.responseData.items[0].songNumber}/${store.responseData.items[0].slug}`,\r\n        query: {},\r\n      });\r\n    }\r\n  }\r\n});\r\n\r\nconst betaStore = useBetaStore();\r\n\r\nonMounted(async () => {\r\n  if (route.query.list === \"popular\" && betaStore.features.ccliTop100New) {\r\n    router.push({\r\n      path: \"/ccli-top-100\",\r\n    });\r\n    return;\r\n  }\r\n\r\n  const results = await Promise.all([\r\n    store.resetSearch(),\r\n    await store.getSongsByLanguageData(),\r\n  ]);\r\n\r\n  if (!songsByLanguage.value.length) {\r\n    songsByLanguage.value = results[1];\r\n  }\r\n\r\n  if (route.query.list?.includes(\"custom_\")) {\r\n    appStore.updateTitle(`${store.title} | ${t(\"S.PageTabTitle\")}`);\r\n  }\r\n  mounted = true;\r\n});\r\n\r\nonBeforeUnmount(() => {\r\n  store.abort();\r\n});\r\n\r\nconst language = computed(() => {\r\n  return Array.isArray(route.query.language)\r\n    ? route.query.language[0]\r\n    : route.query.language;\r\n});\r\n\r\nconst findSongsByLanguageTitle = computed(() => {\r\n  return language.value\r\n    ? songsByLanguage.value.find(\r\n        (d) => d.language.toLowerCase() === language.value?.toLowerCase(),\r\n      )?.label || null\r\n    : null;\r\n});\r\nconst isMassSettingSearch = computed(() => {\r\n  return (route.query.seo as string)?.toLowerCase() === \"masssettings\";\r\n});\r\n\r\nconst profileStore = useProfileStore();\r\nconst formatter = Intl.NumberFormat(profileStore.profile?.language ?? \"en-US\");\r\n\r\nconst search = computed(() => store.queryData.search as string);\r\n</script>\r\n\r\n<template>\r\n  <Error v-if=\"store.status === LoadStatus.Error\" />\r\n  <div\r\n    v-else\r\n    :class=\"{ 'placeholder-glow': store.status === LoadStatus.Loading }\"\r\n  >\r\n    <PageHeader\r\n      v-if=\"store.responseData\"\r\n      :img=\"store.responseData.img || undefined\"\r\n      :img-alt=\"store.responseData.imgAlt || undefined\"\r\n      :songs-by-language-title=\"findSongsByLanguageTitle || undefined\"\r\n    >\r\n      <template #h1>\r\n        <span\r\n          v-if=\"!store.noResults\"\r\n          v-html=\"store.title\"\r\n        />\r\n        <span v-else-if=\"store.noResults\">\r\n          {{ $t(\"S.SearchResultsNoResultsTitle1\") }} '{{\r\n            store.queryData.search\r\n          }}'\r\n        </span>\r\n        <span v-else>\r\n          <span\r\n            class=\"placeholder\"\r\n            style=\"width: 200px\"\r\n          />\r\n        </span>\r\n      </template>\r\n\r\n      <div>\r\n        <div v-if=\"!store.noResults\">\r\n          <div class=\"mb-3 mt-0\">\r\n            <p\r\n              v-if=\"store.responseData.copyright\"\r\n              class=\"mb-2 mt-0\"\r\n            >\r\n              {{ store.responseData.copyright }}\r\n            </p>\r\n            <p class=\"m-0\">{{ store.responseData.subtitle }}</p>\r\n          </div>\r\n          <div v-html=\"store.responseData.description || ''\" />\r\n          <div\r\n            v-if=\"store.responseData.rankPublishDisplayDate\"\r\n            class=\"mt-2\"\r\n          >\r\n            {{\r\n              $t(\"SV.LIT_ReleasedOnDate\", {\r\n                date: date.formatDate(\r\n                  store.responseData.rankPublishDisplayDate,\r\n                ),\r\n              })\r\n            }}\r\n          </div>\r\n          <LiturgyMassSettingSelect\r\n            v-if=\"isMassSettingSearch\"\r\n            enable-see-all\r\n            class=\"max-w-md\"\r\n          />\r\n        </div>\r\n        <div v-else-if=\"store.status !== LoadStatus.Ready\">\r\n          <span\r\n            class=\"placeholder\"\r\n            style=\"width: 100%\"\r\n          />\r\n        </div>\r\n      </div>\r\n\r\n      <ExpandSearchResults\r\n        :model-value=\"store.queryData.expandToAllSongs\"\r\n        @update:model-value=\"store.toggleExpandOnNoResults()\"\r\n      />\r\n    </PageHeader>\r\n\r\n    <Container>\r\n      <Card\r\n        v-if=\"\r\n          store.showCategoryAll &&\r\n          store.filteredVideos.length &&\r\n          store.queryData.page === 1 &&\r\n          store.status === LoadStatus.Ready\r\n        \"\r\n        class=\"mb-4\"\r\n      >\r\n        <div>\r\n          <h2 class=\"mr-3 inline-block text-3xl text-primary\">Lyric Videos</h2>\r\n          <span class=\"ml-3\"> {{ store.filteredVideos.length }} results </span>\r\n          <span class=\"ml-3\"></span>\r\n        </div>\r\n        <div class=\"flex gap-4 overflow-x-auto overflow-y-hidden\">\r\n          <BrowseLVItem\r\n            v-for=\"video in store.filteredVideos\"\r\n            :key=\"video.videoId\"\r\n            :data=\"video\"\r\n            class=\"video-item\"\r\n          />\r\n        </div>\r\n        <router-link\r\n          :to=\"`/lyric-videos/videos?search=${search}`\"\r\n          class=\"uppercase text-primary\"\r\n        >\r\n          View All <i class=\"fa-light fa-chevron-right\"\r\n        /></router-link>\r\n      </Card>\r\n      <SearchResults\r\n        v-if=\"store.responseData\"\r\n        :songs=\"store.items\"\r\n        show-rank\r\n        disable-pagination\r\n      >\r\n        <template\r\n          v-if=\"store.status !== LoadStatus.Ready || !store.noResults\"\r\n          #header\r\n        >\r\n          <div\r\n            v-if=\"!store.noResults\"\r\n            class=\"flex items-center gap-10\"\r\n          >\r\n            <div\r\n              v-if=\"store.showCategoryAll\"\r\n              class=\"shrink-0\"\r\n            >\r\n              <h2 class=\"mr-3 inline-block text-3xl text-primary\">Songs</h2>\r\n              <span class=\"ml-3\">\r\n                {{ formatter.format(store.responseData.numResults) }} results\r\n              </span>\r\n            </div>\r\n            <SongFiltersAndSort />\r\n          </div>\r\n          <div v-else-if=\"store.status !== LoadStatus.Ready\">\r\n            <SongFiltersAndSort placeholder />\r\n          </div>\r\n        </template>\r\n        <SongListTable\r\n          v-if=\"store.status !== LoadStatus.Ready || !store.noResults\"\r\n          :songs=\"store.items\"\r\n          :show-rank=\"store.responseData.showRanking\"\r\n          :loading-number=\"\r\n            (store.status !== LoadStatus.Ready && 10) || undefined\r\n          \"\r\n        />\r\n        <div\r\n          v-else\r\n          class=\"search-tips\"\r\n        >\r\n          <h2 class=\"mb-3 text-2xl text-primary\">\r\n            {{ $t(\"S.SearchResultsNoResultsTitle2\") }}\r\n          </h2>\r\n          <ul class=\"list-disc pl-5\">\r\n            <li>{{ $t(\"S.SearchResultsNoResultsBroaden1\") }}</li>\r\n            <li>{{ $t(\"S.SearchResultsNoResultsBroaden2\") }}</li>\r\n            <li>\r\n              {{\r\n                $t(\"S.SearchResultsNoResultsBroaden3\", [\r\n                  $t(\"SV.MES_SelectBoxExpand\"),\r\n                ])\r\n              }}\r\n            </li>\r\n          </ul>\r\n        </div>\r\n\r\n        <BasePagination\r\n          v-if=\"!store.noResults\"\r\n          :num-per-page=\"store.queryData.numPerPage\"\r\n          :page=\"store.queryData.page\"\r\n          :count=\"store.responseData.numResults\"\r\n          @update:num-per-page=\"(e) => store.updateNumPerPage(e)\"\r\n          @update:page=\"(e) => store.updatePage(e)\"\r\n        />\r\n      </SearchResults>\r\n    </Container>\r\n  </div>\r\n</template>\r\n\r\n<style scoped lang=\"postcss\">\r\n.search-tips {\r\n  @apply px-6 py-5;\r\n}\r\n:deep() {\r\n  .pagination {\r\n    @apply rounded-b-xl;\r\n  }\r\n}\r\n.video-item {\r\n  @apply mr-2 block w-[300px] shrink-0;\r\n}\r\n</style>\r\n"],"file":"assets/SearchResultsPage-C-rCr-TD.js"}