import $ from 'jquery';
import '../../node_modules/waypoints/lib/jquery.waypoints';

class StatisticsOne {
	constructor(element) {
		this.$element = $(element);
		this.$counter = this.$element.find('.counter__count');
		this.init();
	}

	init() {
		this.$counter.each((index, element) => {
			let $this = $(element);
			let countTo = $this.attr('data-count');

			$this.waypoint({
				handler: function (direction) {
					$({ countNum: $this.text() }).animate(
						{
							countNum: countTo,
						},
						{
							duration: 3000,
							easing: 'linear',
							step: function () {
								$this.text(Math.floor(this.countNum));
							},
							complete: function () {
								$this.text(
									Math.abs(this.countNum) > 999
										? Math.sign(this.countNum) *
												(Math.abs(this.countNum) / 1000).toFixed(1) +
												'K+'
										: Math.sign(this.countNum) * Math.abs(this.countNum) + '+',
								);
								Waypoint.destroyAll();
							},
						},
					);
				},
				offset: '90%',
			});
		});
	}
}

$('[data-statistics-one]').each((index, element) => new StatisticsOne(element));