{"version":3,"file":"js/explore-by-director-detail.min.js","mappings":"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","sources":["webpack:///./src/js/wc/explore-by/director/NFBExploreByDirectorFilmList.ts","webpack:///./src/js/sections/explore-by/read-more-collapsable.ts","webpack:///./src/sass/wc/NFBExploreByPages.sass"],"sourcesContent":["/**\n * Class NFBExploreByDirectorFilmList.\n *\n */\n\nimport { LitElement, html, nothing, PropertyValues } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { store, RootState } from '@src/js/redux/store'\nimport { selectWorkById } from '@src/js/redux/worksReducer'\nimport { GTM_EVENTS, GTM_LIST_CATEGORY, GTM_LIST_TYPE, DEFAULT_GRID_LIST_LENGTH, ERROR_MESSAGE } from '@src/js/constants'\nimport { GTMSelectWork } from '@src/js/types/GTM'\nimport { setCurrentOpenCard } from '@src/js/redux/animatedHoverCardReducer'\nimport { bookmarkButtonType } from '@src/js/wc/cards/NFBDisplayWorkCard'\n\nimport { fetchWorkListByDirector, setCurrentPage, resetList } from '@src/js/redux/directorsPageReducer'\n\n// @ts-expect-error Lit Sass import\nimport style from '@src/sass/wc/NFBExploreByPages.sass?lit'\n// @ts-expect-error Lit Sass import\nimport gridListStyles from '@web-nfb/frontend-static/design-system/sass/layout/grid-list.sass?lit'\n\n@customElement('nfb-explore-by-director-film-list')\nexport default class NFBExploreByDirectorFilmList extends LitElement {\n  @property({ type: String })\n  language = ''\n\n  @property({ type: String })\n  title: string\n\n  @property({ type: String })\n  slug: string\n\n  @state()\n  isLoading: boolean = true\n\n  @state()\n  workIdList: number[] | null\n\n  @state()\n  showSeeMore = false\n\n  @state()\n  seeMoreLoading = false\n\n  @state()\n  errorMessage: string | null = null\n\n  static get styles () {\n    return [gridListStyles, style]\n  }\n\n  _rootState: RootState\n  _defaultSeeMoreCardText = window.gettext('See more')\n  gtmAttribute: object = {}\n\n  constructor () {\n    super()\n    this.onStateChanged = this.onStateChanged.bind(this)\n    store.subscribe(this.onStateChanged)\n  }\n\n  protected firstUpdated (): void {\n    document.addEventListener('nfbselect:valuehaschanged', (event) => {\n      event.preventDefault()\n      this.updateURL()\n    })\n  }\n\n  async updated (_changedProperties: PropertyValues) {\n    if (_changedProperties.has('language') && this.language) {\n      this.isLoading = true\n      if (this.language === 'all') this.language = ''\n\n      store.dispatch(resetList(this.slug))\n      await store.dispatch(fetchWorkListByDirector({\n        slug: this.slug,\n        size: DEFAULT_GRID_LIST_LENGTH,\n        language: this.language\n      }))\n\n      this._rootState = store.getState()\n      this.workIdList = this._rootState.directorsPage.list[this.slug]\n      this.errorMessage = this._rootState.directorsPage.apiError\n      store.dispatch(setCurrentOpenCard(null))\n      store.dispatch(setCurrentPage(1))\n      this.isLoading = false\n    }\n  }\n\n  updateURL = (): void => {\n    const options: HTMLElement[] = Array.from(document.querySelector('[data-ui-el=\"nfb-form-select-trigger\"]')?.querySelectorAll('[role=\"option\"]') ?? [])\n    const selectedValue = options.find((o) => o.dataset.uiSelected === 'true')\n    this.language = selectedValue?.dataset.value ?? ''\n\n    const searchParams = new URLSearchParams(window.location.search)\n    searchParams.set('language', this.language)\n    window.history.replaceState(null, '', `?${searchParams.toString()}`)\n  }\n\n  onStateChanged () {\n    this._rootState = store.getState()\n\n    if (store.getState().works.status === 'succeeded') {\n      const { directorsPage } = this._rootState\n\n      this.workIdList = directorsPage.list[this.slug]\n\n      if (this.workIdList?.length < directorsPage.totalCount[this.slug]) {\n        this.showSeeMore = true\n      } else {\n        this.showSeeMore = false\n      }\n    }\n  }\n\n  shouldShowSeeMoreCard () {\n    if (!this.workIdList?.length || !this.showSeeMore) return nothing\n\n    return html`\n      <nfb-see-more\n        is-loading=\"${this.seeMoreLoading}\"\n        data-ui-el=\"carousel-card\"\n        .seeMoreClick=\"${this.loadMoreButtonClick}\"\n        text=\"${window.gettext('See more')}\"\n        is-dark=\"true\"\n        is-rounded=\"true\"\n      ></nfb-see-more>`\n  }\n\n  buildGTMAttributes (id: number, index: number) {\n    const gtmAttrs: GTMSelectWork = {\n      nfb_list_type: GTM_LIST_TYPE.GRID,\n      nfb_list_category: GTM_LIST_CATEGORY.FILMOGRAPHY,\n      nfb_list_name: this.title,\n      nfb_list_id: this.slug,\n      event: GTM_EVENTS.SELECT_WORK,\n      nfb_version_title: selectWorkById(this._rootState.works, id)?.title,\n      nfb_position: (index + 1).toString()\n    }\n\n    return JSON.stringify(gtmAttrs)\n  }\n\n  loadMoreButtonClick = async () => {\n    this.seeMoreLoading = true\n    const nextPage = store.getState().directorsPage.currentPage + 1\n    store.dispatch(setCurrentPage(nextPage))\n    await store.dispatch(fetchWorkListByDirector({\n      slug: this.slug,\n      size: DEFAULT_GRID_LIST_LENGTH,\n      language: this.language,\n      page: nextPage\n    }))\n    this.seeMoreLoading = false\n  }\n\n  render () {\n    if (this.errorMessage) {\n      return html`\n        <div class=\"nfb-error\" data-cy=\"error-message\">\n        ${this.errorMessage}\n        </div>\n      `\n    } else if (this.workIdList?.length === 0 && !this.isLoading) {\n      return html`<span data-cy=\"no-result-error\" class=\"nfb-error\">${ERROR_MESSAGE.NO_RESULT}</span>`\n    }\n\n    if (this.isLoading) {\n      return html`<nfb-spinner is-loading=\"true\" size=\"sm\"></nfb-spinner>`\n    }\n\n    return html`\n      <div class=\"nfb-grid-list nfb-grid-list--dark\">\n    ${this.workIdList?.map((id, index) => {\n    return html`\n      <nfb-animated-hover-card\n        registry-id=\"${id}\"\n        bookmark-button-type=\"${bookmarkButtonType.add}\"\n        is-dark=\"true\"\n        gtm-attributes=\"${this.buildGTMAttributes(id, index)}\"\n      >\n      </nfb-animated-hover-card>\n      `\n  })}\n    ${this.shouldShowSeeMoreCard()}\n    </div>`\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nfb-explore-by-director-film-list': NFBExploreByDirectorFilmList\n  }\n}\n","/* Read more collapsable class (in explore by directors)\n  ========================================================================== */\n\nimport throttle from 'lodash/throttle'\n\nexport default class ReadMoreCollapsable {\n  targetElement: HTMLElement\n  triggerElement: HTMLElement\n\n  clampedHeight: number\n\n  private _isExpanded: boolean = false\n\n  init () {\n    this.targetElement = document.querySelector('[data-ui-el=\"nfb-read-more-target\"]') as HTMLElement\n    this.triggerElement = document.querySelector('[data-ui-el=\"nfb-read-more-trigger\"]') as HTMLElement\n\n    if (this.targetElement && this.triggerElement) {\n      this.handletriggerElementDisplay()\n      window.addEventListener('resize', this.handleResize)\n\n      this.triggerElement.addEventListener('click', () => {\n        if (this.triggerElement.getAttribute('aria-expanded') === 'false') {\n          this.targetElement.removeAttribute('data-is-clamped')\n          this.targetElement.style.setProperty('--max-height', `${this.clampedHeight}px`)\n          this.targetElement.style.setProperty('--max-height-expanded', `${this.targetElement.scrollHeight}px`)\n          window.requestAnimationFrame(() => {\n            this.targetElement.setAttribute('aria-expanded', 'true')\n          })\n        } else {\n          this.targetElement.removeAttribute('aria-expanded')\n\n          // here there is a setTimeout of 500 because of the transition animation of 0.5s in css\n          setTimeout(() => {\n            this.targetElement.setAttribute('data-is-clamped', 'true')\n            this.targetElement.style.setProperty('--max-height', '')\n          }, 500)\n        }\n        this.isExpanded = !this.isExpanded\n      })\n    }\n  }\n\n  /* Setters & Getters */\n\n  get isExpanded (): boolean { return this._isExpanded }\n\n  set isExpanded (value: boolean) {\n    this._isExpanded = value\n    this.triggerElement?.setAttribute('aria-expanded', value.toString())\n    this.targetElement?.setAttribute('aria-expanded', value.toString())\n  }\n\n  handletriggerElementDisplay = () => {\n    const totalHeight = this.targetElement.scrollHeight\n    this.targetElement.setAttribute('data-is-clamped', 'true')\n    this.clampedHeight = this.targetElement.clientHeight\n    const isClamped = totalHeight > this.clampedHeight\n\n    if (!isClamped) {\n      this.triggerElement.style.display = 'none'\n    } else {\n      this.triggerElement.style.display = 'flex'\n    }\n  }\n\n  watchResize = () => {\n    this.handletriggerElementDisplay()\n    if (this.triggerElement.getAttribute('aria-expanded') === 'true') {\n      this.targetElement.removeAttribute('data-is-clamped')\n    }\n  }\n\n  handleResize = throttle(this.watchResize, 200)\n}\n\n/* Init\n  ========================================================================== */\n\nconst readMoreCollapsable = new ReadMoreCollapsable()\n\ndocument.addEventListener('DOMContentLoaded', () => {\n  readMoreCollapsable.init()\n})\n","import {css} from 'lit';\nexport const styles = css`nfb-see-more::part(card) {\n  aspect-ratio: 16/9;\n  height: fit-content;\n  padding-bottom: 0;\n}\n\n.nfb-error {\n  color: #fff;\n}`;\nexport default styles;\n"],"names":["NFBExploreByDirectorFilmList","selectedValue","o","searchParams","nextPage","store","event","_changedProperties","directorsPage","id","index","gtmAttrs","ReadMoreCollapsable","totalHeight","value","readMoreCollapsable"],"sourceRoot":""}