"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = void 0;

var _unit = require("../utils/format/unit");

var _create = _interopRequireDefault(require("../utils/create"));

var _touch = _interopRequireDefault(require("../mixins/touch"));

function getRateStatus(value, index, allowHalf) {
  if (value >= index) {
    return 'full';
  }

  if (value + 0.5 >= index && allowHalf) {
    return 'half';
  }

  return 'void';
}

var _default = (0, _create.default)({
  render: function render() {
    var _vm = this;

    var _h = _vm.$createElement;

    var _c = _vm._self._c || _h;

    return _c('div', {
      class: _vm.b({
        readonly: _vm.readonly,
        disabled: _vm.disabled
      }),
      attrs: {
        "tabindex": "0"
      },
      on: {
        "touchstart": _vm.onTouchStart,
        "touchmove": function touchmove($event) {
          $event.stopPropagation();
          return _vm.onTouchMove($event);
        }
      }
    }, _vm._l(_vm.list, function (status, index) {
      return _c('div', {
        key: index,
        ref: "items",
        refInFor: true,
        class: _vm.b('item'),
        style: {
          paddingRight: _vm.gutterWithUnit
        },
        attrs: {
          "tabindex": "0",
          "aria-setsize": _vm.count,
          "aria-posinset": index + 1,
          "aria-checked": String(status !== 'void')
        }
      }, [_c('icon', {
        class: _vm.b('icon', {
          disabled: _vm.disabled,
          full: status === 'full'
        }),
        attrs: {
          "size": _vm.sizeWithUnit,
          "name": status === 'full' ? _vm.icon : _vm.voidIcon,
          "color": _vm.disabled ? _vm.disabledColor : status === 'full' ? _vm.color : _vm.voidColor,
          "classPrefix": _vm.iconPrefix,
          "data-score": index + 1
        },
        on: {
          "click": function click($event) {
            return _vm.select(index + 1);
          }
        }
      }), _vm.allowHalf ? _c('icon', {
        class: _vm.b('icon', ['half', {
          disabled: _vm.disabled,
          full: status !== 'void'
        }]),
        attrs: {
          "size": _vm.sizeWithUnit,
          "name": status === 'void' ? _vm.voidIcon : _vm.icon,
          "color": _vm.disabled ? _vm.disabledColor : status === 'void' ? _vm.voidColor : _vm.color,
          "classPrefix": _vm.iconPrefix,
          "data-score": index + 0.5
        },
        on: {
          "click": function click($event) {
            return _vm.select(index + 0.5);
          }
        }
      }) : _vm._e()], 1);
    }), 0);
  },
  name: "rate",
  mixins: [_touch.default],
  props: {
    size: [Number, String],
    color: String,
    gutter: [Number, String],
    readonly: Boolean,
    disabled: Boolean,
    allowHalf: Boolean,
    voidColor: String,
    iconPrefix: String,
    disabledColor: String,
    value: {
      type: Number,
      default: 0
    },
    icon: {
      type: String,
      default: 'star'
    },
    voidIcon: {
      type: String,
      default: 'star-o'
    },
    count: {
      type: [Number, String],
      default: 5
    },
    touchable: {
      type: Boolean,
      default: true
    }
  },
  computed: {
    list: function list() {
      var list = [];

      for (var i = 1; i <= this.count; i++) {
        list.push(getRateStatus(this.value, i, this.allowHalf));
      }

      return list;
    },
    sizeWithUnit: function sizeWithUnit() {
      return (0, _unit.addUnit)(this.size);
    },
    gutterWithUnit: function gutterWithUnit() {
      return (0, _unit.addUnit)(this.gutter);
    }
  },
  mounted: function mounted() {},
  methods: {
    select: function select(index) {
      if (!this.disabled && !this.readonly && index !== this.value) {
        this.$emit('input', index);
        this.$emit('change', index);
      }
    },
    onTouchStart: function onTouchStart(event) {
      var _this = this;

      if (this.readonly || this.disabled || !this.touchable) {
        return;
      }

      this.touchStart(event);
      var rects = this.$refs.items.map(function (item) {
        return item.getBoundingClientRect();
      });
      var ranges = [];
      rects.forEach(function (rect, index) {
        if (_this.allowHalf) {
          ranges.push({
            score: index + 0.5,
            left: rect.left
          }, {
            score: index + 1,
            left: rect.left + rect.width / 2
          });
        } else {
          ranges.push({
            score: index + 1,
            left: rect.left
          });
        }
      });
      this.ranges = ranges;
    },
    onTouchMove: function onTouchMove(event) {
      if (this.readonly || this.disabled || !this.touchable) {
        return;
      }

      this.touchMove(event);

      if (this.direction === 'horizontal') {
        var clientX = event.touches[0].clientX;
        this.select(this.getScoreByPosition(clientX));
      }
    },
    getScoreByPosition: function getScoreByPosition(x) {
      for (var i = this.ranges.length - 1; i > 0; i--) {
        if (x > this.ranges[i].left) {
          return this.ranges[i].score;
        }
      }

      return this.allowHalf ? 0.5 : 1;
    }
  }
});

exports.default = _default;