import { _ as _extends } from './extends-6d8e3924.js';
import { _ as _inherits, a as _classCallCheck, b as _possibleConstructorReturn, c as _Object$getPrototypeOf, d as _createClass } from './inherits-a6ba2ec4.js';
import React__default from 'react';
import { l as lib_3 } from './index-f0fc23eb.js';
import Container from 'react-bootstrap/Container';
import { V as VisibilitySensor } from './visibility-sensor-72fd8f8b.js';
import { I as IoIosArrowForward } from './index.esm-eb1e8e80.js';
import { m as moment } from './moment-bc12cb97.js';
import { withRouter } from 'next/router';
import YoutubeGroup from './YoutubeGroup.js';
import { d as debounce_1 } from './debounce-533d9748.js';
import { I as InfiniteScroll } from './index.es-a6137319.js';
import './_commonjsHelpers-0c4b6f40.js';
import './core.get-iterator-method-ea258bb1.js';
import './_object-pie-133f504a.js';
import './_object-sap-7cee6f84.js';
import './define-property-5f1bda73.js';
import './typeof-e9fc0c5d.js';
import './web.dom.iterable-ab4dea5c.js';
import './_is-array-8d21b9e3.js';
import './_library-528f1934.js';
import './events-6c3a7a63.js';
import 'prop-types';
import 'react-dom';
import './iconBase-ccc56b97.js';
import './slicedToArray-6ebcbfea.js';
import './index-c7e2ac95.js';
import './index-755f2cc2.js';
import './smoothscroll-fa4e3f8c.js';
import './urlFor.js';
import './index-3f5c03b2.js';
import './main-1894c974.js';
import './isSymbol-a7e9aafe.js';
import './toNumber-5aeba6e7.js';

var VideoSeriesListing = function (_React$Component) {
  _inherits(VideoSeriesListing, _React$Component);

  function VideoSeriesListing() {
    var _ref;

    var _temp, _this, _ret;

    _classCallCheck(this, VideoSeriesListing);

    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = VideoSeriesListing.__proto__ || _Object$getPrototypeOf(VideoSeriesListing)).call.apply(_ref, [this].concat(args))), _this), _this.page = _this.props.page, _this.mapping = _this.props.mapping, _this.data = _this.props.dataRecord, _this.query = _this.props.query, _this.params = _this.props.params, _this.today = moment().utc().format(), _this.dataArr = [_this.data], _this.defaultImage = _this.props.defaultImage ? _this.props.defaultImage : '/placeholder.jpg', _this.state = {
      data: _this.dataArr.map(function (item) {
        var tempObj = item.map(function (arrItem) {
          if (arrItem.body) {
            var filteredBody = arrItem.body.map(function (item) {
              if (item._type === 'youtubeGallery') {
                var innerObj = item;
                var filteredArticles = innerObj.videos.filter(function (video) {
                  if ((video.is_visible === true || !video.hasOwnProperty('is_visible')) && (_this.today >= video.published || !video.hasOwnProperty('published'))) {
                    return video;
                  }
                });
                innerObj.videos = filteredArticles;
                return innerObj;
              } else {
                return item;
              }
            });

            arrItem.body = filteredBody;
          }
          return arrItem;
        });
        return tempObj;
      }),
      per: _this.params ? _this.params.itemsPerPage : 2,
      page: _this.props.currentPage || 1,
      from: _this.params ? _this.params.from : 0,
      to: _this.params ? _this.params.to : 2,
      total_pages: null,
      scrolling: true,
      query: _this.query,
      currentPage: _this.props.currentPage || 1,
      lastDataSize: _this.data ? _this.data.length : 0
    }, _this.loadMore = debounce_1(function () {
      _this.setState(function (state) {
        var page = state.page,
            from = state.from,
            per = state.per,
            to = state.to;

        return {
          page: page + 1,
          from: from + per,
          to: to + per
        };
      }, _this.loadData);
    }, 0), _this.loadData = function () {
      var _this$state = _this.state,
          from = _this$state.from,
          to = _this$state.to;
          _this$state.data;
          var query = _this$state.query,
          page = _this$state.page;
      var client = _this.props.client;
      //this.changePageNumber(page)

      var params = _extends({}, _this.params, { from: from, to: to
        // const queryUpdated = query.replace('$from', params.from).replace('$to', params.to)
        // const query = '*[_type == "article" && defined(title) && defined(thumbnail)][$from...$to] { title, summary, thumbnail { asset-> }, url }'
      });client.fetch(query, params).then(function (dataArr) {
        if (_this.pointer && _this.pointerArray) {
          var pointer = _this.pointer;
          dataArr = dataArr[_this.pointerArray][pointer];
        }
        dataArr = dataArr.map(function (item) {
          return _extends({}, item, {
            pageNumber: page
          });
        });

        _this.setState(function () {
          if (dataArr.length > 0) {
            var newDataArr = _this.state.data;
            newDataArr.push(dataArr);
            return {
              data: newDataArr,
              scrolling: true,
              lastDataSize: dataArr.length
            };
          } else {
            return {
              scrolling: false,
              lastDataSize: 0
            };
          }
        });
      });
    }, _this.changePageNumber = function (pageNumber) {
      var _this$props = _this.props,
          seoPaginate = _this$props.seoPaginate,
          pageview = _this$props.pageview,
          router = _this$props.router;
      var currentPage = _this.state.currentPage;

      if (seoPaginate) {
        var path = router.asPath;
        var qrIndex = path.indexOf('?');
        var pathname = router.pathname;
        var queryString = '';

        if (qrIndex > 0) {
          path = path.substring(1, qrIndex);

          var partialQS = router.asPath.substring(qrIndex + 1);
          var partialQSArr = partialQS.split('&');

          // exclude page=xxx from query string
          partialQSArr.map(function (item) {
            var itemArr = item.split('=');
            var key = itemArr[0];
            var val = itemArr[1];

            if (key !== 'page') {
              queryString += (queryString.length === 0 ? '' : '&') + key + '=' + val;
            }
          });
        }

        if (queryString.length > 0) {
          path += '?' + queryString;
        }

        pageNumber = parseInt(pageNumber);

        if (currentPage !== pageNumber) {
          lib_3.refresh();

          _this.setState({
            currentPage: pageNumber
          }, function () {
            if (path[0] !== '/') {
              path = '/' + path;
            }

            var newPath = pageNumber === 1 ? '' + path : '' + path + (path.includes('?') ? '&page=' + pageNumber : '?page=' + pageNumber);

            if (pageview) {
              pageview(newPath);
            }

            router.push(pathname, newPath, {
              shallow: true
            });
          });
        }
      }
    }, _this.renderManualPagination = function (_ref2) {
      var nextPagePostsCount = _ref2.nextPagePostsCount;
      var currentPage = _this.state.currentPage;


      return React__default.createElement(
        'div',
        { className: 'd-flex justify-content-between' },
        currentPage && currentPage > 1 && React__default.createElement(
          'a',
          { href: '?page=' + (currentPage - 1) },
          '<< Previous'
        ),
        !(_this.state.lastDataSize < _this.state.per) && nextPagePostsCount > 0 && React__default.createElement(
          'a',
          { href: '?page=' + (currentPage + 1) },
          'Next >>'
        )
      );
    }, _this.renderSeries = function (seriesData) {
      var itemCounter = 0;

      return React__default.createElement(
        'div',
        null,
        seriesData && seriesData.map(function (docSeries, index) {
          if (docSeries.body && docSeries.body.length > 0 && docSeries.body[0].videos) {
            docSeries.body[0].videos.map(function (singleVideo, indexInner) {
              singleVideo.link = '/view/' + docSeries.url.current + '?seriesVid=' + (indexInner + 1);
            });
          }

          return React__default.createElement(
            'div',
            { key: index, style: { marginBottom: '2rem' }, counter: itemCounter++ },
            React__default.createElement(
              'div',
              {
                className: 'video-title-banner',
                style: { fontWeight: 'bold', color: 'var(--primary)', padding: '.25rem 0', fontSize: '1.25rem', borderBottom: '1px solid #d4a64d' } },
              React__default.createElement(
                'a',
                { href: '/' + _this.props.page + '/' + docSeries.url.current },
                docSeries.title,
                React__default.createElement(
                  'span',
                  { style: { fontSize: '.9rem', color: 'grey', marginLeft: '1rem', transform: 'translateY(-2px)' } },
                  React__default.createElement(IoIosArrowForward, null)
                )
              )
            ),
            docSeries.body && docSeries.body.length > 0 && docSeries.body[0].videos ? React__default.createElement(YoutubeGroup, _extends({ displayEpisodeNumber: true, key: index, dataset: docSeries.body[0].videos }, _this.props)) : React__default.createElement(
              'p',
              null,
              'No Video Found.'
            )
          );
        })
      );
    }, _temp), _possibleConstructorReturn(_this, _ret);
  }

  _createClass(VideoSeriesListing, [{
    key: 'componentDidMount',
    value: function componentDidMount() {
      // console.log(this.state)
    }
  }, {
    key: 'render',
    value: function render() {
      var _this2 = this;

      var _props = this.props,
          _props$autoScroll = _props.autoScroll,
          autoScroll = _props$autoScroll === undefined ? true : _props$autoScroll,
          _props$nextPagePostsC = _props.nextPagePostsCount,
          nextPagePostsCount = _props$nextPagePostsC === undefined ? 3 : _props$nextPagePostsC;


      if (autoScroll) {
        return React__default.createElement(
          React__default.Fragment,
          null,
          this.state.data.length >= 1 && this.state.data[0].length > 0 ?
          //Check if any Video Groups available
          React__default.createElement(
            InfiniteScroll,
            { dataLength: this.state.data.length, next: this.loadMore, hasMore: this.state.scrolling, scrollThreshold: 0.8 },
            React__default.createElement(
              Container,
              null,
              this.state.data && this.state.data.map(function (series, index) {
                var page = series && series.length > 0 && series[0].pageNumber !== 1 ? series[0].pageNumber : 1;

                return React__default.createElement(
                  React__default.Fragment,
                  { key: index },
                  React__default.createElement(
                    VisibilitySensor,
                    {
                      onChange: function onChange(isVisible) {
                        isVisible && _this2.changePageNumber(page);
                      } },
                    React__default.createElement('div', { className: 'visibility-sensor', style: { minHeight: '.25rem' } })
                  ),
                  React__default.createElement(
                    'div',
                    null,
                    _this2.renderSeries(series)
                  )
                );
              }),
              React__default.createElement(
                'noscript',
                null,
                this.renderManualPagination({ nextPagePostsCount: nextPagePostsCount })
              )
            )
          ) : React__default.createElement(
            'div',
            { style: { marginTop: '10px' } },
            React__default.createElement(
              'h5',
              null,
              React__default.createElement(
                'em',
                null,
                'New content coming soon, please check back later.'
              )
            )
          )
        );
      }
      if (!autoScroll) {
        return React__default.createElement(
          React__default.Fragment,
          null,
          this.state.data.length >= 1 && this.state.data[0].length > 0 ?
          //Check if any Video Groups available
          React__default.createElement(
            Container,
            null,
            this.state.data && this.state.data.map(function (series, index) {
              var page = series && series.length > 0 && series[0].pageNumber !== 1 ? series[0].pageNumber : 1;

              return React__default.createElement(
                React__default.Fragment,
                { key: index },
                React__default.createElement(
                  VisibilitySensor,
                  {
                    onChange: function onChange(isVisible) {
                      isVisible && _this2.changePageNumber(page);
                    } },
                  React__default.createElement('div', { className: 'visibility-sensor', style: { minHeight: '.25rem' } })
                ),
                React__default.createElement(
                  'div',
                  null,
                  _this2.renderSeries(series)
                ),
                _this2.state.scrolling ? React__default.createElement(
                  'button',
                  {
                    className: 'btn',
                    style: {
                      margin: '0 auto 2rem',
                      display: 'block',
                      fontSize: '18px',
                      padding: '.5rem 1.5rem',
                      boxShadow: '1px 2px 4px 4px rgba(0,0,0,.15)',
                      background: 'var(--primary)',
                      color: '#fff',
                      borderRadius: '5px'
                    },
                    onClick: function onClick(e) {
                      e.target.style.display = 'none';
                      _this2.loadMore();
                    } },
                  'Load More'
                ) : React__default.createElement(
                  'p',
                  { style: { textAlign: 'center' } },
                  React__default.createElement(
                    'b',
                    null,
                    'End of data'
                  )
                ),
                React__default.createElement(
                  'noscript',
                  null,
                  _this2.renderManualPagination({ nextPagePostsCount: nextPagePostsCount })
                )
              );
            })
          ) : React__default.createElement(
            'div',
            { style: { marginTop: '10px' } },
            React__default.createElement(
              'h5',
              null,
              React__default.createElement(
                'em',
                null,
                'New content coming soon, please check back later.'
              )
            )
          )
        );
      }
    }
  }]);

  return VideoSeriesListing;
}(React__default.Component);

var VideoSeriesListing$1 = withRouter(VideoSeriesListing);

export default VideoSeriesListing$1;
