"use strict";

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _vue = _interopRequireWildcard(require("vue"));

var _json2mq = _interopRequireDefault(require("json2mq"));

var _BaseMixin = _interopRequireDefault(require("../../_util/BaseMixin"));

var _vnode = require("../../_util/vnode");

var _innerSlider = _interopRequireDefault(require("./inner-slider"));

var _defaultProps = _interopRequireDefault(require("./default-props"));

var _innerSliderUtils = require("./utils/innerSliderUtils");

var _propsUtil = require("../../_util/props-util");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var _default = {
  name: 'Slider',
  props: _objectSpread({}, _defaultProps.default),
  inheritAttrs: false,
  mixins: [_BaseMixin.default],
  data: function data() {
    this._responsiveMediaHandlers = [];
    return {
      breakpoint: null
    };
  },
  methods: {
    innerSliderRefHandler: function innerSliderRefHandler(ref) {
      this.innerSlider = ref;
    },
    media: function media(query, handler) {
      // javascript handler for  css media query
      var mql = window.matchMedia(query);

      var listener = function listener(_ref) {
        var matches = _ref.matches;

        if (matches) {
          handler();
        }
      };

      mql.addListener(listener);
      listener(mql);

      this._responsiveMediaHandlers.push({
        mql: mql,
        query: query,
        listener: listener
      });
    },
    slickPrev: function slickPrev() {
      this.innerSlider.slickPrev();
    },
    slickNext: function slickNext() {
      this.innerSlider.slickNext();
    },
    slickGoTo: function slickGoTo(slide) {
      var dontAnimate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
      this.innerSlider.slickGoTo(slide, dontAnimate);
    },
    slickPause: function slickPause() {
      this.innerSlider.pause('paused');
    },
    slickPlay: function slickPlay() {
      this.innerSlider.handleAutoPlay('play');
    }
  },
  // handles responsive breakpoints
  beforeMount: function beforeMount() {
    var _this = this;

    if (this.responsive) {
      var breakpoints = this.responsive.map(function (breakpt) {
        return breakpt.breakpoint;
      }); // sort them in increasing order of their numerical value

      breakpoints.sort(function (x, y) {
        return x - y;
      });
      breakpoints.forEach(function (breakpoint, index) {
        // media query for each breakpoint
        var bQuery;

        if (index === 0) {
          bQuery = (0, _json2mq.default)({
            minWidth: 0,
            maxWidth: breakpoint
          });
        } else {
          bQuery = (0, _json2mq.default)({
            minWidth: breakpoints[index - 1] + 1,
            maxWidth: breakpoint
          });
        } // when not using server side rendering


        (0, _innerSliderUtils.canUseDOM)() && _this.media(bQuery, function () {
          _this.setState({
            breakpoint: breakpoint
          });
        });
      }); // Register media query for full screen. Need to support resize from small to large
      // convert javascript object to media query string

      var query = (0, _json2mq.default)({
        minWidth: breakpoints.slice(-1)[0]
      });
      (0, _innerSliderUtils.canUseDOM)() && this.media(query, function () {
        _this.setState({
          breakpoint: null
        });
      });
    }
  },
  beforeUnmount: function beforeUnmount() {
    this._responsiveMediaHandlers.forEach(function (obj) {
      obj.mql.removeListener(obj.listener);
    });
  },
  render: function render() {
    var _this2 = this;

    var settings;
    var newProps;

    if (this.breakpoint) {
      newProps = this.responsive.filter(function (resp) {
        return resp.breakpoint === _this2.breakpoint;
      });
      settings = newProps[0].settings === 'unslick' ? 'unslick' : _objectSpread(_objectSpread({}, this.$props), newProps[0].settings);
    } else {
      settings = _objectSpread({}, this.$props);
    } // force scrolling by one if centerMode is on


    if (settings.centerMode) {
      if (settings.slidesToScroll > 1 && process.env.NODE_ENV !== 'production') {
        console.warn("slidesToScroll should be equal to 1 in centerMode, you are using ".concat(settings.slidesToScroll));
      }

      settings.slidesToScroll = 1;
    } // force showing one slide and scrolling by one if the fade mode is on


    if (settings.fade) {
      if (settings.slidesToShow > 1 && process.env.NODE_ENV !== 'production') {
        console.warn("slidesToShow should be equal to 1 when fade is true, you're using ".concat(settings.slidesToShow));
      }

      if (settings.slidesToScroll > 1 && process.env.NODE_ENV !== 'production') {
        console.warn("slidesToScroll should be equal to 1 when fade is true, you're using ".concat(settings.slidesToScroll));
      }

      settings.slidesToShow = 1;
      settings.slidesToScroll = 1;
    } // makes sure that children is an array, even when there is only 1 child


    var children = (0, _propsUtil.getSlot)(this) || []; // Children may contain false or null, so we should filter them
    // children may also contain string filled with spaces (in certain cases where we use jsx strings)

    children = children.filter(function (child) {
      if (typeof child === 'string') {
        return !!child.trim();
      }

      return !!child;
    }); // rows and slidesPerRow logic is handled here

    if (settings.variableWidth && (settings.rows > 1 || settings.slidesPerRow > 1)) {
      console.warn("variableWidth is not supported in case of rows > 1 or slidesPerRow > 1");
      settings.variableWidth = false;
    }

    var newChildren = [];
    var currentWidth = null;

    for (var i = 0; i < children.length; i += settings.rows * settings.slidesPerRow) {
      var newSlide = [];

      for (var j = i; j < i + settings.rows * settings.slidesPerRow; j += settings.slidesPerRow) {
        var row = [];

        for (var k = j; k < j + settings.slidesPerRow; k += 1) {
          if (settings.variableWidth && children[k].props.style) {
            currentWidth = children[k].props.style.width;
          }

          if (k >= children.length) break;
          row.push((0, _vnode.cloneElement)(children[k], {
            key: 100 * i + 10 * j + k,
            tabindex: -1,
            style: {
              width: "".concat(100 / settings.slidesPerRow, "%"),
              display: 'inline-block'
            }
          }));
        }

        newSlide.push(_vue.createVNode("div", {
          "key": 10 * i + j
        }, [row]));
      }

      if (settings.variableWidth) {
        newChildren.push(_vue.createVNode("div", {
          "key": i,
          "style": {
            width: currentWidth
          }
        }, [newSlide]));
      } else {
        newChildren.push(_vue.createVNode("div", {
          "key": i
        }, [newSlide]));
      }
    }

    if (settings === 'unslick') {
      var className = 'regular slider ' + (this.className || '');
      return _vue.createVNode("div", {
        "class": className
      }, [newChildren]);
    } else if (newChildren.length <= settings.slidesToShow) {
      settings.unslick = true;
    }

    var sliderProps = _objectSpread(_objectSpread(_objectSpread({}, this.$attrs), settings), {}, {
      children: newChildren,
      ref: this.innerSliderRefHandler
    });

    return _vue.createVNode(_innerSlider.default, _vue.mergeProps(sliderProps, {
      "__propsSymbol__": []
    }), _objectSpread({}, this.$slots));
  }
};
exports.default = _default;