{"version":3,"sources":["webpack:///./src/components/molecules/ExploreTopics/ExploreTopics.tsx","webpack:///./src/components/molecules/PopularPosts/PopularPosts.tsx","webpack:///./src/components/organisms/aside/AsideBar.tsx","webpack:///./src/components/organisms/grid-layout/GridLayout.tsx","webpack:///./src/components/organisms/videos-carousel/videos-carousel.tsx","webpack:///./src/templates/videosTemplate.tsx","webpack:///./src/components/molecules/PreviewCard/PreviewCard.tsx","webpack:///./src/components/molecules/paginator/Paginator.tsx","webpack:///./src/utils/arrayUtilities.ts"],"names":["ExploreTopics","topics","useStaticQuery","allContentfulSubcategoria","nodes","referenciaSubcategorias","className","map","topic","key","to","slug","nombreSubcategoria","PopularPosts","useState","posts","setPosts","data","useEffect","allContentfulHome","process","shuffleArray","node","filter","item","tipoContenido","length","flat","titulo","referenciaInterna","referenciaCabecera","tituloPrincipal","imagen","imagenHeader","file","url","fecha","dateToRelativeFormat","createdAt","slice","post","withPrefix","src","alt","AsideBar","GridLayout","props","children","compClass","trim","style","gridTemplateColumns","columns","gap","padding","VideosCarousel","actualVideo","setActualVideo","videos","carouselRef","useRef","actualIndex","setActualIndex","showPopUp","setShowPopUp","scrollCarousel","direction","carousel","current","newActualIndex","video","image","indexOf","valueToScroll","scrollLeft","scroll","scrollWidth","onClick","ref","index","updateActualVideo","dangerouslySetInnerHTML","__html","span","VideosTemplate","pageData","pageContext","pageContent","numPages","currentPage","elements","redireccionBoton","tituloSpan","migaDePan","hideHeaderDesktop","hideHeaderMobile","isNotRoot","title","metaTitulo","nombreCategoria","description","metaDescripcion","json","content","value","lang","element","i","imageUrl","leftSub","link","replace","external","rightSub","icon","PreviewCard","Paginator","quantity","adapterSuscribe","target","next","back","Array","from","_","active","array","randomIndex","currentIndex","Math","floor","random"],"mappings":"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","file":"component---src-templates-videos-template-tsx-41f1df746fe2fdaeaf3d.js","sourcesContent":["import React, { useState } from \"react\";\r\nimport { useStaticQuery, graphql, Link } from \"gatsby\";\r\nimport \"./ExploreTopics.scss\";\r\n\r\nconst ExploreTopics = () => {\r\n  const data = useStaticQuery(graphql`\r\n    query exploreQuery {\r\n      allContentfulSubcategoria(\r\n        filter: { contentful_id: { eq: \"409cITTPuyHorR4bnTIBWl\" } }\r\n      ) {\r\n        nodes {\r\n          titulo\r\n          referenciaSubcategorias {\r\n            slug\r\n            nombreSubcategoria\r\n          }\r\n          id\r\n          contentful_id\r\n        }\r\n      }\r\n    }\r\n  `);\r\n\r\n  const topics =\r\n    data.allContentfulSubcategoria.nodes[0].referenciaSubcategorias;\r\n    \r\n  return (\r\n    <div className=\"explore-topics\">\r\n      <div className=\"explore-topics__title\">\r\n        <h3>Explorar temas</h3>\r\n      </div>\r\n      <ul>\r\n        {topics.map((topic, key) => (\r\n          <li key={key}>\r\n            <Link to={\"/\" + topic.slug}>\r\n              {topic.nombreSubcategoria}\r\n            </Link>\r\n          </li>\r\n        ))}\r\n      </ul>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default ExploreTopics;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport { useStaticQuery, graphql, Link, withPrefix } from \"gatsby\";\r\n\r\nimport \"./PopularPosts.scss\";\r\nimport { shuffleArray } from \"../../../utils/arrayUtilities\";\r\nimport { dateToRelativeFormat } from \"../../../utils/dateToRelativeFormat\";\r\n\r\nconst PopularPosts = () => {\r\n  const [posts, setPosts] = useState<any>([]);\r\n  const data = useStaticQuery(graphql`\r\n    query data2 {\r\n      allContentfulHome {\r\n        nodes {\r\n          referenciaSubcategorias {\r\n            titulo\r\n            slug\r\n            referenciaSubcategorias {\r\n              titulo\r\n              slug\r\n              tipoContenido\r\n              createdAt\r\n              referenciaInterna {\r\n                referenciaCabecera {\r\n                  imagenHeader {\r\n                    file {\r\n                      url\r\n                    }\r\n                  }\r\n                  tituloPrincipal\r\n                }\r\n              }\r\n            }\r\n          }\r\n        }\r\n      }\r\n    }\r\n  `);\r\n\r\n  useEffect(() => {\r\n    if(!data.allContentfulHome?.nodes[0]?.referenciaSubcategorias) return;\r\n    const process = shuffleArray(\r\n      data.allContentfulHome.nodes[0].referenciaSubcategorias\r\n        .map((node) => {\r\n          const articles = node.referenciaSubcategorias\r\n            ?.filter((item) => item.tipoContenido === \"Articulo\")\r\n            .map((item) => ({ ...item, slug: node.slug + item.slug }));\r\n          return articles;\r\n        })\r\n        .filter((item) => (item ? item.length >= 1 : false))\r\n        .flat()\r\n        .map((item) => ({\r\n          slug: item.slug,\r\n          titulo: item.referenciaInterna.referenciaCabecera.tituloPrincipal,\r\n          imagen:\r\n            item.referenciaInterna.referenciaCabecera.imagenHeader.file.url,\r\n          fecha: dateToRelativeFormat(item.createdAt),\r\n        }))\r\n    );\r\n    setPosts(process.slice(0, 3));\r\n  }, []);\r\n\r\n  return (\r\n    <div className=\"popular-posts\">\r\n      <div className=\"popular-posts__title\">\r\n        <h3>Entradas populares</h3>\r\n      </div>\r\n      {posts.map((post, key) => (\r\n        <Link to={withPrefix(post.slug)} key={key}>\r\n          <div className=\"popular-posts__content\">\r\n            <div className=\"popular-posts__items\">\r\n              <img src={post.imagen} alt=\"\" />\r\n              <div className=\"popular-posts__items-content\">\r\n                <div className=\"popular-posts__items-title\">\r\n                  <h3>{post.titulo}</h3>\r\n                </div>\r\n                <div className=\"popular-posts__items-date\">\r\n                  <span>{post.fecha}</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </Link>\r\n      ))}\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default PopularPosts;\r\n","import React from 'react'\r\nimport ExploreTopics from '../../molecules/ExploreTopics/ExploreTopics'\r\nimport PopularPosts from '../../molecules/PopularPosts/PopularPosts'\r\n\r\nimport \"./AsideBar.scss\"\r\n\r\nconst AsideBar = () => {\r\n  return (\r\n    <aside>\r\n      <PopularPosts />\r\n      <ExploreTopics />\r\n    </aside>\r\n  )\r\n}\r\n\r\nexport default AsideBar\r\n","import React from \"react\";\r\nimport \"./grid-layout.scss\";\r\n\r\ntype GridLayoutProps = {\r\n  columns?: string;\r\n  gap?: string;\r\n  padding?: string;\r\n  children?: React.ReactNode;\r\n  className?: string;\r\n};\r\n\r\nconst GridLayout = (props: GridLayoutProps) => {\r\n  const { children } = props;\r\n  const compClass = \"o-gridLayout\";\r\n  return (\r\n    <section className={`${compClass} ${\r\n      props.className ? props.className : \"\"\r\n    }`.trim()}>\r\n      <div\r\n        className={`${compClass}__grid`}\r\n        style={{\r\n          gridTemplateColumns: props.columns || \"1fr 1fr\",\r\n          gap: props.gap || \"1rem\",\r\n          padding: props.padding || \"3rem 0\",\r\n        }}\r\n      >\r\n        {children}\r\n      </div>\r\n    </section>\r\n  );\r\n};\r\n\r\nexport default GridLayout;\r\n","import React, { useRef, useEffect, useState } from \"react\";\r\nimport { FaLongArrowAltLeft, FaLongArrowAltRight } from \"react-icons/fa\";\r\nimport VideosPopUp from \"../videos-popup/videos-popup\";\r\nimport \"./videos-carousel.scss\";\r\n\r\nconst VideosCarousel = ({ actualVideo, setActualVideo, videos }) => {\r\n  const carouselRef = useRef();\r\n  const scrollStep = 200;\r\n  const [actualIndex, setActualIndex] = useState(0);\r\n  const [showPopUp, setShowPopUp] = useState(false);\r\n\r\n  const scrollCarousel = (direction) => {\r\n    const carousel = carouselRef.current;\r\n    const newActualIndex = videos\r\n      .map((video) => video.image)\r\n      .indexOf(actualVideo.image);\r\n    if (direction === \"left\") {\r\n      setActualIndex(newActualIndex - 1);\r\n      setActualIndex(newActualIndex === 0 ? 0 : newActualIndex - 1);\r\n      setActualVideo(\r\n        newActualIndex === 0 ? videos[0] : videos[newActualIndex - 1]\r\n      );\r\n      const valueToScroll =\r\n        carousel.scrollLeft - scrollStep < 0\r\n          ? 0\r\n          : carousel.scrollLeft - scrollStep;\r\n      carousel.scroll(valueToScroll, 0);\r\n    } else {\r\n      setActualIndex(\r\n        newActualIndex === videos.length - 1\r\n          ? videos.length - 1\r\n          : newActualIndex + 1\r\n      );\r\n      setActualVideo(\r\n        newActualIndex === videos.length - 1\r\n          ? videos[videos.length - 1]\r\n          : videos[newActualIndex + 1]\r\n      );\r\n      const valueToScroll =\r\n        carousel.scrollLeft + scrollStep >= carousel.scrollWidth\r\n          ? carousel.scrollWidth\r\n          : carousel.scrollLeft + scrollStep;\r\n      carousel.scroll(valueToScroll, 0);\r\n    }\r\n  };\r\n  const compClass = \"o-carousel-videos\";\r\n  const updateActualVideo = (video, index) => {\r\n    setActualVideo(video);\r\n    setActualIndex(index);\r\n  };\r\n  useEffect(() => {\r\n    setActualVideo(videos[0]);\r\n  }, []);\r\n\r\n  return (\r\n    <>\r\n      <VideosPopUp\r\n        setShowPopUp={setShowPopUp}\r\n        showPopUp={showPopUp}\r\n        actualVideo={actualVideo}\r\n      />\r\n      <div className={compClass}>\r\n        <div className={`${compClass}-left`}>\r\n          <span>\r\n            Videos\r\n            <br />\r\n            <b>más recientes</b>\r\n          </span>\r\n          <div className={`${compClass}__arrows`}>\r\n            <FaLongArrowAltLeft onClick={() => scrollCarousel(\"left\")} />\r\n            <FaLongArrowAltRight onClick={() => scrollCarousel(\"right\")} />\r\n          </div>\r\n        </div>\r\n        <div ref={carouselRef} className={`${compClass}-right`}>\r\n          {videos.map((video, index) => (\r\n            <div\r\n              key={index}\r\n              onClick={() => updateActualVideo(video, index)}\r\n              className={`${compClass}__iframeWrapper ${\r\n                index === actualIndex\r\n                  ? `${compClass}__iframeWrapper-active`\r\n                  : \"\"\r\n              } `}\r\n            >\r\n              <img\r\n                src={video?.imagen || video?.image}\r\n                alt={`${video?.imagen || video?.image}-${index}`}\r\n                onClick={() => setShowPopUp(true)}\r\n              />\r\n              <div className={`${compClass}__iframeWrapper__text`}>\r\n                <span\r\n                  dangerouslySetInnerHTML={{\r\n                    __html: video?.titulo || \"Titulo\",\r\n                  }}\r\n                  onClick={() => setShowPopUp(true)}\r\n                ></span>\r\n                <p>{video?.span || \"Span\"}</p>\r\n              </div>\r\n            </div>\r\n          ))}\r\n        </div>\r\n      </div>\r\n    </>\r\n  );\r\n};\r\n\r\nexport default VideosCarousel;\r\n","import React, { useState } from \"react\";\r\nimport { FaYoutube } from \"react-icons/fa\";\r\nimport Disclaimer from \"../components/molecules/disclaimer/disclaimer\";\r\nimport Paginator from \"../components/molecules/paginator/Paginator\";\r\nimport PreviewCard, {\r\n  PreviewCardProps,\r\n} from \"../components/molecules/PreviewCard/PreviewCard\";\r\nimport Suscribe from \"../components/molecules/suscribe/suscribe\";\r\nimport AsideBar from \"../components/organisms/aside/AsideBar\";\r\nimport GridLayout from \"../components/organisms/grid-layout/GridLayout\";\r\nimport Layout from \"../components/organisms/layout/layout\";\r\nimport VideosCarousel from \"../components/organisms/videos-carousel/videos-carousel\";\r\nimport VideosHeader from \"../components/organisms/videos-header/videos-header\";\r\nimport { adapterSuscribe } from \"../components/templates/library-components/adapters\";\r\nimport SEO from \"../shared/seo\";\r\nimport { dateToRelativeFormat } from \"../utils/dateToRelativeFormat\";\r\nimport \"./../styles/index.scss\";\r\n\r\nconst VideosTemplate = (props: any) => {\r\n  const pageData = props.pageContext.pageContent;\r\n  const { slug, numPages, currentPage, elements } = props.pageContext;\r\n  const videos = elements.map((node) => {\r\n    return {\r\n      imagen: node.referenciaInterna.referenciaCabecera.imagenHeader.file.url,\r\n      video: node.referenciaInterna.referenciaCabecera.redireccionBoton,\r\n      titulo: node.referenciaInterna.referenciaCabecera.tituloPrincipal,\r\n      span: node.referenciaInterna.referenciaCabecera.tituloSpan,\r\n      migaDePan: node.referenciaInterna.referenciaCabecera.migaDePan,\r\n      slug: node.slug,\r\n      fecha: node.createdAt,\r\n    };\r\n  });\r\n  const [actualVideo, setActualVideo] = useState(videos[0]);\r\n\r\n  return (\r\n    <Layout hideHeaderDesktop={false} hideHeaderMobile={false} isNotRoot={true}>\r\n      <SEO\r\n        title={pageData.metaTitulo || pageData.nombreCategoria}\r\n        slug={slug}\r\n        description={\r\n          pageData.metaDescripcion &&\r\n          pageData.metaDescripcion.json.content[0].content[0].value\r\n        }\r\n        image={\r\n          pageData.referenciaCabecera.imagenHeader &&\r\n          pageData.referenciaCabecera.imagenHeader.file.url\r\n        }\r\n        lang=\"es\"\r\n      />\r\n      <VideosHeader\r\n        actualVideo={actualVideo}\r\n        videos={videos}\r\n        setActualVideo={setActualVideo}\r\n      />\r\n      <VideosCarousel\r\n        videos={videos}\r\n        actualVideo={actualVideo}\r\n        setActualVideo={setActualVideo}\r\n      />\r\n      <GridLayout columns=\"2fr 1fr\" gap=\"2rem\" padding=\"1rem 0\">\r\n        <div>\r\n          {videos.map((element, i) => {\r\n            let process: PreviewCardProps = {\r\n              description: element.span,\r\n              imageUrl: element.imagen,\r\n              leftSub: \"Video\",\r\n              link: element.video?.replace(\"embed/\", \"watch?v=\"),\r\n              external: true,\r\n              rightSub: dateToRelativeFormat(element.fecha),\r\n              title: element.titulo,\r\n              icon: <FaYoutube />,\r\n            };\r\n            return <PreviewCard {...process} key={i} />;\r\n          })}\r\n        </div>\r\n        <AsideBar />\r\n      </GridLayout>\r\n      <Paginator slug={slug} quantity={numPages} currentPage={currentPage} />\r\n      <Suscribe {...adapterSuscribe()} />\r\n      <Disclaimer />\r\n    </Layout>\r\n  );\r\n};\r\n\r\nexport default VideosTemplate;\r\n","import React from \"react\";\r\nimport { Link } from \"gatsby\";\r\nimport \"./previewCard.scss\";\r\n\r\nexport type PreviewCardProps = {\r\n  link: string;\r\n  external?: boolean;\r\n  imageUrl: string;\r\n  leftSub?: string;\r\n  rightSub?: string;\r\n  title: string;\r\n  description?: string;\r\n  icon?: React.ReactNode;\r\n};\r\n\r\nconst PreviewCard = (props: PreviewCardProps) => {\r\n  const compClass = \"m-previewCard\";\r\n  const {\r\n    link,\r\n    external,\r\n    description,\r\n    imageUrl,\r\n    leftSub,\r\n    rightSub,\r\n    title,\r\n    icon,\r\n  } = props;\r\n  return (\r\n    <Link to={link || \"#\"} target={external ? \"_blank\" : \"self\"}>\r\n      <div className={`${compClass}__card`}>\r\n        <div className={`${compClass}__thumb`}>\r\n          <img src={imageUrl || \"\"} alt={title || \"\"} />\r\n        </div>\r\n        <div className={`${compClass}__content`}>\r\n          <div className={`${compClass}__meta`}>\r\n            <span className={`${compClass}__metaLeft`}>\r\n              {icon && icon} {leftSub}\r\n            </span>\r\n            <span className={`${compClass}__metaRight`}>{rightSub}</span>\r\n          </div>\r\n          <h2\r\n            className={`${compClass}__title`}\r\n            dangerouslySetInnerHTML={{ __html: title }}\r\n          ></h2>\r\n          <p className={`${compClass}__description`}>\r\n            {description || \"Ver más.\"}\r\n          </p>\r\n        </div>\r\n      </div>\r\n    </Link>\r\n  );\r\n};\r\n\r\nexport default PreviewCard;\r\n","import { Link } from \"gatsby\";\r\nimport React from \"react\";\r\nimport \"./paginator.scss\";\r\n\r\nexport interface IPaginator {\r\n  quantity: number;\r\n  currentPage: number;\r\n  slug: string;\r\n}\r\n\r\nconst Paginator = (props: IPaginator) => {\r\n  const { quantity, currentPage, slug } = props;\r\n  const compClass = \"m-paginator\";\r\n  const itemClass = (active) => {\r\n    return `${compClass}__item ${\r\n      active ? `${compClass}__item--active` : \"\"\r\n    }`.trim();\r\n  };\r\n  let next = currentPage + 1;\r\n  let back = currentPage - 1;\r\n  return (\r\n    <div className={compClass}>\r\n      <Link\r\n        to={`${currentPage === 2 ? slug : slug + back}`}\r\n        className={currentPage < 2 ? \"inactive\" : \"active\"}\r\n      >\r\n        Atrás\r\n      </Link>\r\n      <div className={`${compClass}__desktop`}>\r\n        {Array.from({ length: quantity }).map((_, index) => {\r\n          if (index < currentPage - 3 && index !== 0) return \".\";\r\n          if (index > currentPage + 2 && index !== quantity - 1) return \".\";\r\n          return (\r\n            <span\r\n              className={itemClass(index + 1 === currentPage ? true : false)}\r\n              key={index}\r\n            >\r\n              {index === 0 ? (\r\n                <Link to={slug}>{index + 1}</Link>\r\n              ) : (\r\n                <Link to={slug + (index + 1)}>{index + 1}</Link>\r\n              )}\r\n            </span>\r\n          );\r\n        })}\r\n      </div>\r\n      <div className={`${compClass}__mobile`}>\r\n        <span>{currentPage}</span>\r\n        <span>de</span>\r\n        <span>{quantity}</span>\r\n      </div>\r\n      <Link\r\n        to={`${slug + next}`}\r\n        className={currentPage < quantity ? \"active\" : \"inactive\"}\r\n      >\r\n        Siguiente\r\n      </Link>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default Paginator;\r\n","export const shuffleArray = (array) => {\r\n  if(!array) return [];\r\n  let currentIndex = array.length,\r\n    randomIndex;\r\n  while (currentIndex != 0) {\r\n    randomIndex = Math.floor(Math.random() * currentIndex);\r\n    currentIndex--;\r\n    [array[currentIndex], array[randomIndex]] = [\r\n      array[randomIndex],\r\n      array[currentIndex],\r\n    ];\r\n  }\r\n  return array;\r\n};\r\n"],"sourceRoot":""}