• Utilization of OOP principles and separation of functionality into classes (DropdownManager, SellerSlider, DataLoader, PageSearch)
• Exporting functions and classes for use in other modules
• Encapsulation of logic within classes
• Asynchronous functions (async/await)
• Working with Promise for parallel data loading
• Arrow functions
• Destructuring assignment
• Using try/catch blocks for error handling in asynchronous operations
• Logging error messages to the console
• Providing user-friendly error feedback
• Implementation of drag functionality in slider with corresponding visual indicators (cursor changes)
• Dropdown menu with outside click handling
• Highlighting search text in results
• Responsive slider adjustments for different screen sizes
• Dynamic calculation of element dimensions

export class AnimateCounter {
  constructor(target, endValue, duration) {
    this.startTime = performance.now();
    this.counterElement = target;
    this.endValue = endValue;
    this.duration = duration;
    this.startAnimation();
  }

  formatNumber(value) {
    if (value >= 10000) {
      const kValue = Math.floor(value / 1000);
      const remainder = value % 10000;
      return `${kValue}k${remainder > 0 ? '+' : ''}`;
    }
    return value;
  }

  update(currentTime) {
    const progress = Math.min((currentTime - this.startTime) / this.duration, 1);
    const currentValue = this.formatNumber(Math.floor(this.endValue * progress));

    this.counterElement.textContent = currentValue;
    if (progress < 1) {
      requestAnimationFrame((time) => this.update(time));
    }
  }

  startAnimation() {
    requestAnimationFrame((time) => this.update(time));
  }
}