class ActionBase {
  constructor($UD, context) {
    this.$UD = $UD;
    this.context = context;
    this.refreshTimer = null;
    this.debounceTimer = 0;
  }

  onClear() {
    if (this.refreshTimer) {
      clearInterval(this.refreshTimer);
      this.refreshTimer = null;
    }
    if (this.debounceTimer) {
      clearTimeout(this.debounceTimer);
      this.debounceTimer = 0;
    }
  }

  startTimer(fetchFn, refreshRate) {
    this.onClear();
    fetchFn();
    const duration = this.getRefreshDuration(refreshRate);
    if (duration > 0) {
      this.refreshTimer = setInterval(() => fetchFn(), duration * 60 * 1000);
    }
  }

  debounce(fn, delay = 300) {
    if (this.debounceTimer) clearTimeout(this.debounceTimer);
    this.debounceTimer = setTimeout(() => fn(), delay);
  }

  getRefreshDuration(refreshRate) {
    switch (refreshRate) {
      case '1': return 1;
      case '2': return 2;
      case '3': return 5;
      case '4': return 10;
      case '5': return 30;
      case '6': return 60;
      default:  return 0;
    }
  }

  createCanvas() {
    const canvas = document.createElement('canvas');
    canvas.width = 196;
    canvas.height = 196;
    const ctx = canvas.getContext('2d');
    ctx.fillStyle = '#000000';
    ctx.fillRect(0, 0, 196, 196);
    ctx.textBaseline = 'middle';
    ctx.textAlign = 'center';
    return { canvas, ctx };
  }

  setIcon(canvas) {
    this.$UD.setBaseDataIcon(this.context, canvas.toDataURL('image/png'));
  }
}