'use strict';

Object.defineProperty(exports, "__esModule", {
	value: true
});

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require('babel-runtime/helpers/createClass');

var _createClass3 = _interopRequireDefault(_createClass2);

var _utils = require('./utils.js');

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

var Indicator = function () {
	function Indicator(scroller) {
		var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
		(0, _classCallCheck3.default)(this, Indicator);

		this.wrapper = opts.el;
		this.wrapperStyle = this.wrapper.style;
		this.indicator = this.wrapper.children[0];
		this.indicatorStyle = this.indicator.style;
		this.scroller = scroller;
		this.direction = opts.direction;
		if (opts.fade) {
			this.visible = 0;
			this.wrapperStyle.opacity = '0';
		} else {
			this.visible = 1;
		}
	}
	/**
  * @public
  */


	(0, _createClass3.default)(Indicator, [{
		key: 'refresh',
		value: function refresh() {
			this.transitionTime();
			this.calculate();
			this.updatePosition();
		}
		/**
   * @public
   */

	}, {
		key: 'fade',
		value: function fade(visible, hold) {
			var _this = this;

			if (hold && !this.visible) {
				return;
			}

			var time = visible ? 250 : 500;

			visible = visible ? '1' : '0';

			this.wrapperStyle[_utils.style.transitionDuration] = time + 'ms';

			clearTimeout(this.fadeTimeout);
			this.fadeTimeout = setTimeout(function () {
				_this.wrapperStyle.opacity = visible;
				_this.visible = +visible;
			}, 0);
		}
		/**
   * @public
   */

	}, {
		key: 'updatePosition',
		value: function updatePosition() {
			if (this.direction === 'vertical') {
				var y = Math.round(this.sizeRatioY * this.scroller.y);

				if (y < 0) {
					this.transitionTime(500);
					var height = Math.max(this.indicatorHeight + y * 3, INDICATOR_MIN_LEN);
					this.indicatorStyle.height = height + 'px';
					y = 0;
				} else if (y > this.maxPosY) {
					this.transitionTime(500);
					var _height = Math.max(this.indicatorHeight - (y - this.maxPosY) * 3, INDICATOR_MIN_LEN);
					this.indicatorStyle.height = _height + 'px';
					y = this.maxPosY + this.indicatorHeight - _height;
				} else {
					this.indicatorStyle.height = this.indicatorHeight + 'px';
				}
				this.y = y;

				if (this.scroller.options.useTransform) {
					this.indicatorStyle[_utils.style.transform] = 'translateY(' + y + 'px)' + this.scroller.translateZ;
				} else {
					this.indicatorStyle.top = y + 'px';
				}
			} else {
				var x = Math.round(this.sizeRatioX * this.scroller.x);

				if (x < 0) {
					this.transitionTime(500);
					var width = Math.max(this.indicatorWidth + x * 3, INDICATOR_MIN_LEN);
					this.indicatorStyle.width = width + 'px';
					x = 0;
				} else if (x > this.maxPosX) {
					this.transitionTime(500);
					var _width = Math.max(this.indicatorWidth - (x - this.maxPosX) * 3, INDICATOR_MIN_LEN);
					this.indicatorStyle.width = _width + 'px';
					x = this.maxPosX + this.indicatorWidth - _width;
				} else {
					this.indicatorStyle.width = this.indicatorWidth + 'px';
				}

				this.x = x;

				if (this.scroller.options.useTransform) {
					this.indicatorStyle[_utils.style.transform] = 'translateX(' + x + 'px)' + this.scroller.translateZ;
				} else {
					this.indicatorStyle.left = x + 'px';
				}
			}
		}
		/**
   * @public
   */

	}, {
		key: 'transitionTime',
		value: function transitionTime() {
			var time = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;

			this.indicatorStyle[_utils.style.transitionDuration] = time + 'ms';
		}
		/**
   * 
   * @public
   */

	}, {
		key: 'transitionTimingFunction',
		value: function transitionTimingFunction(easing) {
			this.indicatorStyle[_utils.style.transitionTimingFunction] = easing;
		}
		/**
   * @public
   */

	}, {
		key: 'remove',
		value: function remove() {
			this.wrapper.parentNode.removeChild(this.wrapper);
		}
		/**
   * @private
   */

	}, {
		key: 'calculate',
		value: function calculate() {
			if (this.direction === 'vertical') {
				var wrapperHeight = this.wrapper.clientHeight;
				this.indicatorHeight = Math.max(Math.round(wrapperHeight * wrapperHeight / (this.scroller.scrollerHeight || wrapperHeight || 1)), INDICATOR_MIN_LEN);
				this.indicatorStyle.height = this.indicatorHeight + 'px';

				this.maxPosY = wrapperHeight - this.indicatorHeight;

				this.sizeRatioY = this.maxPosY / this.scroller.maxScrollY;
			} else {
				var wrapperWidth = this.wrapper.clientWidth;
				this.indicatorWidth = Math.max(Math.round(wrapperWidth * wrapperWidth / (this.scroller.scrollerWidth || wrapperWidth || 1)), INDICATOR_MIN_LEN);
				this.indicatorStyle.width = this.indicatorWidth + 'px';

				this.maxPosX = wrapperWidth - this.indicatorWidth;

				this.sizeRatioX = this.maxPosX / this.scroller.maxScrollX;
			}
		}
	}]);
	return Indicator;
}();

exports.default = Indicator;