{"version":3,"sources":["containers/CollectionsPage/CollectionLink.js","containers/CollectionsPage/Collections.js","containers/CollectionsPage/CategoryLink.js","containers/CollectionsPage/index.js","components/Img/index.js","actions/collectionAction.js","styles/svg-components/AssetPaginationPrev.js","styles/svg-components/AssetPaginationNext.js","components/Pagination/PageLink.js","components/Pagination/index.js","components/CollectionsTabs/index.js"],"names":["styled","Link","Collections","props","checkImage","bind","thumbnail_image","getImgixUrl","image_aws_url","PLACEHOLDER_IMG_URL","className","this","categoryId","title","collections","map","collection","CollectionLink","to","slug","id","Img","style","width","height","src","alt","name","short_description","React","Component","CollectionsPage","location","page","query","state","categories","latest","pagination","fetchCategoryCollections","then","data","setState","results","catch","err","fetchLatestCollections","fetchCategories","onCategorySelect","checkActive","loading","category","target","router","replace","event","push","currentTarget","dataset","collectionsContent","length","content","rel","href","CategoryLink","onClick","index","classname","pageCount","Pagination","url","onPageSelect","CollectionsTabs","active","mapDispatchToProps","dispatch","mapStateToProps","createStructuredSelector","connect","fetchHomeCollection","fetch","conditionallyGetCdnApi","method","res","json","fetchCollectionTrack","collectionName","headers","response","error","console","log","fetchCollection","collectionId","fetchAllCollections","energy","vocal","sort","styleFilters","fetchCollections","fetchStyleCollections","type","JsonStyleFilters","JSON","stringify","AssetPaginationPrev","AssetPaginationNext","handlePageSelect","firstPage","lastPage","currentPage","middlePages","previousPage","pages","getPaginationClasses","PageLink","forEach","middlePage","nextPage","contextTypes","PropTypes","object","withRouter"],"mappings":"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","file":"static/js/42.chunk.js?hash=9600c761","sourcesContent":["import { Link } from 'react-router';\nimport styled from 'styled-components';\n\nexport default styled(Link)``;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport Img from 'components/Img';\nimport CollectionLink from './CollectionLink';\nimport { PLACEHOLDER_IMG_URL } from 'components/ImgPlaceholder';\nimport {getImgixUrl} from \"../../utils/helpers\";\n\n\nexport default class Collections extends React.Component {\n  constructor(props) {\n    super(props);\n\n    this.checkImage = this.checkImage.bind(this);\n  }\n\n  checkImage(thumbnail_image) {\n    if (thumbnail_image) {\n      return getImgixUrl( thumbnail_image.image_aws_url, 440 );\n    }\n    return PLACEHOLDER_IMG_URL;\n  }\n  render() {\n    return (\n\n      <div className=\"container-fluid mb-4\">\n        {this.props.categoryId == 0 &&\n          <h3 className=\"collections-sub\">{this.props.title}</h3>\n          }\n        <div className=\"row\">\n          {this.props.collections && this.props.collections.map((collection) => (\n            <div key={collection.id} className=\"col-6 col-md-2 collections-breakpoints mb-4 mb-md-6\">\n              <div className=\"mb-3 mb-md-5\">\n                <CollectionLink to={`/browse/collection/${ collection.slug ? collection.slug : collection.id }`}>\n                  <div className=\"collections-block-image-wrapper mb-4\"><Img style={{ width: 205, height: 205 }} src={this.checkImage(collection.thumbnail_image)} alt={`${collection.name}`} /></div>\n                  <div className=\"mb-4\">\n                    <h5 className=\"collections-small-title mb-2\">{collection.name}</h5>\n                    <span>{collection.short_description}</span>\n                  </div>\n                </CollectionLink>\n              </div>\n            </div>\n              )) }\n        </div>\n      </div>\n    );\n  }\n}\n\nCollections.propTypes = {\n  collections: PropTypes.array,\n};\n","import { Link } from 'react-router';\nimport styled from 'styled-components';\n\nexport default styled(Link)`\n  display: inline-flex;\n  padding-right: 1rem;\n  margin-bottom: 2rem;\n  text-decoration: none;\n  border-radius: 4px;\n  -webkit-font-smoothing: antialiased;\n  -webkit-touch-callout: none;\n  user-select: none;\n  cursor: pointer;\n  outline: 0;\n  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\n  font-size: 13px;\n\n  &:active {\n    background: #41ADDD;\n    color: #FFF;\n  }\n`;\n","import React from 'react';\nimport { connect } from 'react-redux';\nimport Helmet from 'react-helmet';\nimport { createStructuredSelector } from 'reselect';\nimport {\n  fetchCategories,\n  fetchCategoryCollections,\n  fetchLatestCollections,\n} from 'actions/collectionAction';\nimport Collections from './Collections';\nimport CategoryLink from './CategoryLink';\nimport classname from 'classnames';\nimport Pagination from 'components/Pagination';\nimport CollectionsTabs from 'components/CollectionsTabs';\n\nclass CollectionsPage extends React.Component {\n  // eslint-disable-line react/prefer-stateless-function\n\n  constructor(props) {\n    super(props);\n    const { location } = props;\n    let page = 1;\n    if (this.props.location.query.page) {\n      page = this.props.location.query.page;\n    }\n\n    this.state = {\n      collections: [],\n      categories: [],\n      latest: [],\n      categoryId: 0,\n      pagination: false,\n      page,\n    };\n\n    fetchCategoryCollections(0, page)\n      .then((data) => {\n        this.setState({\n          collections: data.results,\n          pagination: data.pagination,\n        });\n      })\n      .catch((err) => err);\n\n    if (page == 1) {\n      fetchLatestCollections(0, page)\n        .then((data) => {\n          this.setState({ latest: data });\n        })\n        .catch((err) => err);\n    }\n\n    fetchCategories()\n      .then((data) => {\n        this.setState({ categories: data });\n      })\n      .catch((err) => err);\n\n    this.onCategorySelect = this.onCategorySelect.bind(this);\n    this.checkActive = this.checkActive.bind(this);\n  }\n\n  componentDidUpdate() {\n    let page = 1;\n    if (this.props.location.query.page) {\n      page = this.props.location.query.page;\n    }\n    const categoryId = this.state.categoryId;\n    if (page != this.state.page) {\n      this.setState({ page, loading: true });\n      fetchCategoryCollections(categoryId, page)\n        .then((data) => {\n          this.setState({\n            collections: data.results,\n            pagination: data.pagination,\n            loading: false,\n          });\n        })\n        .catch((err) => err);\n\n      if (categoryId == 0 && page == 1) {\n        fetchLatestCollections(categoryId, page)\n          .then((data) => {\n            this.setState({ latest: data, loading: false });\n          })\n          .catch((err) => err);\n      } else {\n        this.setState({ latest: [], loading: false });\n      }\n    }\n  }\n\n  onCategorySelect(category) {\n    const page = 1;\n    this.setState({\n      loading: true,\n    });\n    fetchCategoryCollections(category.target.id, page)\n      .then((data) => {\n        this.setState({\n          collections: data.results,\n          pagination: data.pagination,\n          loading: false,\n        });\n      })\n      .catch((err) => {\n        this.setState({\n          loading: false,\n        });\n      });\n\n    if (category.target.id == 0) {\n      fetchLatestCollections(category.target.id, page)\n        .then((data) => {\n          this.setState({ latest: data, loading: false });\n        })\n        .catch((err) => {\n          this.setState({\n            loading: false,\n          });\n        });\n    }\n\n    this.setState({ categoryId: category.target.id, page });\n\n    if (this.props.location.query.page) {\n      this.props.router.replace('/collections');\n    }\n  }\n\n  onPageSelect(event) {\n    this.router.push(`/collections?page=${event.currentTarget.dataset.page}`);\n  }\n\n  checkActive(categoryId) {\n    if (categoryId == this.state.categoryId) {\n      return 'active';\n    } else {\n      return '';\n    }\n  }\n\n  render() {\n    let collectionsContent;\n    if (this.state.collections.length >= 0 && !this.state.loading) {\n      collectionsContent = (\n        <div>\n          <div className=\"content-container content-max-width-sm\">\n            <div className=\"text-center collection-filter d-flex justify-content-center flex-wrap\">\n              <Helmet>\n                <title>Collections &bull; Music Licensing For Video & Film &bull; Music Vine</title>\n                <meta name=\"description\" content=\"Carefully curated by the Music Vine team, every one of our collections captures a distinctive theme or sound to help you find the perfect production music.\" />\n                <link rel=\"canonical\" href=\"https://musicvine.com/collections\" />\n              </Helmet>\n              <CategoryLink\n                className={`${this.checkActive(0)} mr-md-4`}\n                onClick={this.onCategorySelect}\n                id=\"0\"\n                key=\"0\"\n              >\n                All\n              </CategoryLink>\n              {this.state.categories &&\n                this.state.categories.map((category, index) => (\n                  <CategoryLink\n                    className={classname(`${this.checkActive(category.id)} mr-md-4`, {\n                      'd-none': (category.name === 'Demographics')\n                    })}\n                    onClick={this.onCategorySelect}\n                    id={category.id}\n                    key={index}\n                  >\n                    {category.name}\n                  </CategoryLink>\n                ))}\n            </div>\n          </div>\n          <div className=\"content-container content-max-width-sm\">\n            <div className=\"mb-5\">\n              {this.state.categoryId == 0 &&\n                this.state.page == 1 && (\n                  <Collections\n                    categoryId={this.state.categoryId}\n                    title={'Latest'}\n                    collections={this.state.latest}\n                  />\n                )}\n              <Collections\n                categoryId={this.state.categoryId}\n                title={'All'}\n                collections={this.state.collections}\n              />\n              {this.state.pagination &&\n                this.state.pagination.pageCount > 1 && (\n                  <Pagination\n                    url={'/collections'}\n                    pagination={this.state.pagination}\n                    onPageSelect={this.onPageSelect}\n                  />\n                )}\n              {this.state.collections.length === 0 ? (\n                <div className=\"music-loading-message music-loading-message--light\">\n                  <div className=\"music-loader-message-container\">\n                    <h3 className=\"music-loading-message-title\">We'll be adding some collections to this category very soon.</h3>\n                  </div>\n                </div>\n              ) : null}\n            </div>\n          </div>\n        </div>\n      );\n    } else {\n      collectionsContent = (\n        <div className=\"music-loading-message music-loading-message--light\">\n          <div className=\"music-loader-message-container\">\n            <h3 className=\"music-loading-message-title\">Loading Collections</h3>\n            <div className=\"circle-loader\">\n              <div className=\"bounce1\" />\n              <div className=\"bounce2\" />\n              <div className=\"bounce3\" />\n            </div>\n          </div>\n        </div>\n      );\n    }\n    return (\n      <div>\n        <section id=\"collections-page\">\n          <CollectionsTabs\n            active=\"collections\"\n          />\n          <div className=\"collections-header mb-5\">\n            <div className=\"collections-header-content\">\n              <h1 className=\"collections-title\">Discover Our Collections</h1>\n              <span className=\"collections-desc\">Carefully curated by the Music Vine team, every one of our collections is intrinsically geared toward a practical theme in filmmaking and video production.</span>\n            </div>\n          </div>\n          {collectionsContent}\n        </section>\n      </div>\n    );\n  }\n}\n\nexport function mapDispatchToProps(dispatch) {\n  return {};\n}\n\nconst mapStateToProps = createStructuredSelector({});\n\n// Wrap the component to inject dispatch and state into it\nexport default connect(\n  mapStateToProps,\n  mapDispatchToProps\n)(CollectionsPage);\n","/**\n *\n * Img.react.js\n *\n * Renders an image, enforcing the usage of the alt=\"\" tag\n */\n\nimport React from 'react';\nimport PropTypes from 'prop-types';\n\nfunction Img(props) {\n  return (\n    <img className={props.className} src={props.src} alt={props.alt} />\n  );\n}\n\n// We require the use of src and alt, only enforced by react in dev mode\nImg.propTypes = {\n  src: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.object,\n  ]).isRequired,\n  alt: PropTypes.string.isRequired,\n  className: PropTypes.string,\n};\n\nexport default Img;\n","import fetch from \"isomorphic-fetch\";\nimport Config, { API } from \"../constants\";\nimport {conditionallyGetCdnApi} from \"./generalAction\";\n\nexport function fetchHomeCollection() {\n  return fetch(`${conditionallyGetCdnApi()}homepage/collections`, {\n    method: \"GET\",\n    // mode: 'CORS',\n  })\n    .then((res) => res.json())\n    .catch((err) => err);\n}\n\nexport function fetchCollectionTrack(collectionName) {\n  return fetch(\n    `${conditionallyGetCdnApi()}tracks/collection/types/${collectionName}/ids/0/energies/0/vocals/As%20Curated/sorts/0/durations/[/stylefilters/-1/limits/[]/excludes/1`,\n    {\n      method: \"GET\",\n      headers: {\n        \"Content-Type\": \"application/json\",\n      },\n    }\n  )\n    .then(\n      (response) => response.json(),\n      (error) => console.log(\"An error occured.\", error)\n    )\n    .then((json) => json);\n}\n\nexport function fetchCollection(collectionId) {\n  return fetch(`${conditionallyGetCdnApi()}collections/${collectionId}`, {\n    method: \"GET\",\n    // mode: 'CORS',\n  })\n    .then((res) => res.json())\n    .catch((err) => err);\n}\n\nexport function fetchCategories() {\n  return fetch(`${conditionallyGetCdnApi()}collection/categories`, {\n    method: \"GET\",\n    // mode: 'CORS',\n  })\n    .then((res) => res.json())\n    .catch((err) => err);\n}\n\nexport function fetchCategoryCollections(categoryId, page) {\n  return fetch(`${conditionallyGetCdnApi()}collections/${categoryId}/categories/${page}`, {\n    method: \"GET\",\n    // mode: 'CORS',\n  })\n    .then((res) => res.json())\n    .catch((err) => err);\n}\n\nexport function fetchLatestCollections(categoryId, page) {\n  return fetch(`${conditionallyGetCdnApi()}collections/${categoryId}/latests/${page}`, {\n    method: \"GET\",\n    // mode: 'CORS',\n  })\n    .then((res) => res.json())\n    .catch((err) => err);\n}\n\nexport function fetchAllCollections(energy, vocal, sort, styleFilters, page) {\n  return fetchCollections(\"all\", 0, energy, vocal, sort, styleFilters, page);\n}\n\nexport function fetchArtistCollections(\n  id,\n  energy,\n  vocal,\n  sort,\n  styleFilters,\n  page\n) {\n  return fetchCollections(\n    \"artist\",\n    id,\n    energy,\n    vocal,\n    sort,\n    styleFilters,\n    page\n  );\n}\n\nexport function fetchStyleCollections(\n  id,\n  energy,\n  vocal,\n  sort,\n  styleFilters,\n  page\n) {\n  return fetchCollections(\"style\", id, energy, vocal, sort, styleFilters, page);\n}\n\nfunction fetchCollections(type, id, energy, vocal, sort, styleFilters, page) {\n  if (styleFilters == null) {\n    styleFilters = {};\n  }\n  const JsonStyleFilters = JSON.stringify(styleFilters);\n  return function (dispatch) {\n    dispatch(requestCollections());\n    return fetch(\n      `${conditionallyGetCdnApi()}collections/${type}/types/${id}/ids/${energy}/energies/${vocal}/vocals/${vocal}/sorts/${JsonStyleFilters}/stylefilters/${page}`,\n      {\n        method: \"GET\",\n        // mode: 'CORS',\n      }\n    )\n      .then(\n        (response) => response.json(),\n        (error) => console.log(\"An error occured.\", error)\n      )\n      .then((json) => {\n        dispatch(receiveCollections(json));\n      });\n  };\n}\n\n// ACTIONS\nfunction requestCollections() {\n  return { type: \"REQUEST_COLLECTIONS\" };\n}\n\nfunction receiveCollections(collections) {\n  return { type: \"RECEIVE_COLLECTIONS\", collections };\n}\n","import React from \"react\";\nimport InlineSVG from 'svg-inline-react';\n\nclass AssetPaginationPrev extends React.Component {\n    render() {\n        const assetPaginationPrev = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 34.4 34.4\"><style>.st9982{fill:none;stroke-width:5;stroke-miterlimit:10}</style><path class=\"st981\" d=\"M17.2 2.1C8.9 2.1 2.1 8.9 2.1 17.2s6.8 15.1 15.1 15.1 15.1-6.8 15.1-15.1S25.6 2.1 17.2 2.1zm0 28.4C9.9 30.5 4 24.5 4 17.2S9.9 4 17.2 4c7.3 0 13.3 5.9 13.3 13.2 0 7.3-6 13.3-13.3 13.3z\"/><path class=\"st981\" d=\"M19.3 9.7l-6.9 6.9c-.4.4-.4.9 0 1.3l6.9 6.9c.2.2.4.3.6.3.5 0 .9-.4.9-.9 0-.2-.1-.5-.3-.7l-6.3-6.3 6.3-6.3c.4-.4.4-.9 0-1.3-.2-.2-.4-.3-.6-.3-.2.1-.4.2-.6.4z\"/><path class=\"st9982\" d=\"M-413.2-939.5h882.7v1462h-882.7z\"/></svg>\n\n`;\n        return (\n            <InlineSVG src={assetPaginationPrev} />\n        );\n    }\n}\n\nexport default AssetPaginationPrev;\n","import React from \"react\";\nimport InlineSVG from 'svg-inline-react';\n\nclass AssetPaginationNext extends React.Component {\n    render() {\n        const assetPaginationNext = `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 34.4 34.4\"><style>.st89{fill:none;stroke-width:5;stroke-miterlimit:10}</style><path class=\"st88\" d=\"M17.2 32.3c8.3 0 15.1-6.8 15.1-15.1S25.5 2.1 17.2 2.1 2.1 8.9 2.1 17.2s6.8 15.1 15.1 15.1zm0-28.4c7.3 0 13.3 5.9 13.3 13.3s-5.9 13.3-13.3 13.3C9.9 30.5 4 24.5 4 17.2 4 9.9 9.9 4 17.2 3.9z\"/><path class=\"st88\" d=\"M15.1 24.7l6.9-6.9c.4-.4.4-.9 0-1.3l-6.9-6.9c-.2-.2-.4-.3-.6-.3-.5 0-.9.4-.9.9 0 .2.1.5.3.7l6.3 6.3-6.3 6.3c-.4.4-.4.9 0 1.3.2.2.4.3.6.3.2-.1.4-.2.6-.4z\"/><path class=\"st89\" d=\"M-413.2-939.5h882.7v1462h-882.7z\"/></svg>\n`;\n        return (\n            <InlineSVG src={assetPaginationNext} />\n        );\n    }\n}\n\nexport default AssetPaginationNext;\n","import { Link } from 'react-router';\nimport styled from 'styled-components';\n\nexport default styled(Link)`\n`;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport AssetPaginationPrev from 'styles/svg-components/AssetPaginationPrev.js';\nimport AssetPaginationNext from 'styles/svg-components/AssetPaginationNext.js';\nimport PageLink from './PageLink';\n\n\nimport { withRouter } from 'react-router';\nimport { createStructuredSelector } from 'reselect';\nimport { fetchCollection } from 'actions/collectionAction';\nimport { fetchCollectionTracks } from 'actions/trackAction';\n\n\nclass Pagination extends React.Component {\n  constructor(props) {\n    super(props);\n    this.handlePageSelect = this.handlePageSelect.bind(this);\n  }\n\n  handlePageSelect(event) {\n    this.props.onPageSelect(event);\n  }\n\n  render() {\n    const firstPage = this.props.pagination.firstPage;\n    const lastPage = this.props.pagination.lastPage;\n    const currentPage = this.props.pagination.currentPage;\n    const middlePages = this.props.pagination.middlePages;\n    const previousPage = this.props.pagination.previousPage;\n    const handlePageSelect = this.handlePageSelect;\n    const pages = [];\n\n    function getPaginationClasses(active) {\n      return `site-pagination__number site-pagination__number--${active ? 'active' : 'inactive'}`;\n    }\n\n    // Show leftmost number\n    if (firstPage) {\n      pages.push(<PageLink key={firstPage} onClick={handlePageSelect} data-page={firstPage}><span className={getPaginationClasses(currentPage == firstPage)}>{firstPage}</span></PageLink>);\n    }\n\n    // Show ellipsis if there's a gap between the leftmost number and the first middle number\n    if (currentPage !== firstPage && currentPage - 1 !== firstPage && middlePages[0] - 1 !== firstPage) {\n        pages.push(<span key={firstPage + 0.5} className=\"site-pagination__ellipses\">...</span>);\n    }\n\n    // Show middle numbers\n    if (middlePages) {\n      middlePages.forEach((middlePage, index) => {\n        pages.push(<PageLink key={middlePage} onClick={handlePageSelect} data-page={middlePage}><span className={getPaginationClasses(currentPage == middlePage)}>{middlePage}</span></PageLink>);\n      });\n    }\n\n    // Show ellipsis if there's a gap between the last middle number and the right most number \n    if (currentPage !== lastPage && currentPage + 1 !== lastPage && middlePages[ middlePages.length - 1 ] + 1 !== lastPage) {\n        pages.push(<span key={lastPage - 0.5} className=\"site-pagination__ellipses\">...</span>);\n    }\n\n    // Show rightmost number\n    if (lastPage > firstPage) {\n      pages.push(<PageLink key={lastPage} onClick={handlePageSelect} data-page={lastPage}><span className={getPaginationClasses(currentPage == lastPage)}>{lastPage}</span></PageLink>);\n    }\n\n    return (\n      <div className=\"site-pagination site-pagination--secondary\">\n        <div className=\"content-container\">\n          <div className=\"site-pagination__block\">\n            {/* Next page */}\n            {previousPage &&\n              <PageLink onClick={this.handlePageSelect} data-page={previousPage}>\n                <div className={'site-pagination__icon spacer-r site-pagination__icon--inactive'}>\n                  <div className=\"svg-xs\">\n                    <AssetPaginationPrev />\n                  </div>\n                </div>\n              </PageLink>\n            }\n            {pages}\n            {/* Next page */}\n            {this.props.pagination.nextPage &&\n              <PageLink onClick={this.handlePageSelect} data-page={this.props.pagination.nextPage}>\n                <div className={'site-pagination__icon spacer-l site-pagination__icon--inactive'}>\n                  <div className=\"svg-xs\">\n                    <AssetPaginationNext />\n                  </div>\n                </div>\n              </PageLink>\n            }\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\nPagination.contextTypes = {\n  router: PropTypes.object,\n};\n\nexport default withRouter(Pagination);\n","import React from 'react';\nimport A from '../../components/A';\n\nclass CollectionsTabs extends React.Component {\n    render() {\n        return (\n            <div className=\"collections-tabs text-center\">\n              <ul className=\"list-unstyled d-flex justify-content-around d-md-block\">\n                <li className={`collections-list-item mr-md-7${this.props.active === 'styles' ? ' active' : ''}`}><A to=\"/styles\">Styles</A></li>\n                <li className={`collections-list-item mr-md-7${this.props.active === 'collections' ? ' active' : ''}`}><A to=\"/collections\">Collections</A></li>\n                <li className={`collections-list-item${this.props.active === 'artists' ? ' active' : ''}`}><A to=\"/artists\">Artists</A></li>\n              </ul>\n            </div>\n        );\n    }\n}\n\nexport default CollectionsTabs;"],"sourceRoot":""}