lifepartner/src/app/countdown/countdown.page.ts

import { Component, OnInit, OnDestroy } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { IonicModule, NavController } from '@ionic/angular';
import { ActivatedRoute } from '@angular/router';
import { addIcons } from 'ionicons';
import { 
  schoolOutline, 
  briefcaseOutline, 
  moonOutline,
  barbellOutline,
  bookOutline,
  codeSlashOutline,
  leafOutline,
  musicalNotesOutline,
  languageOutline,
  pencilOutline,
  pauseOutline,
  playOutline,
  stopOutline,
  exitOutline,
  trashOutline
} from 'ionicons/icons';

@Component({
  selector: 'app-countdown',
  templateUrl: './countdown.page.html',
  styleUrls: ['./countdown.page.scss'],
  standalone: true,
  imports: [IonicModule, CommonModule, FormsModule]
})
export class CountdownPage implements OnInit, OnDestroy {
  remainingTime: string = '';
  activityType: string = '';
  activityName: string = '';
  duration: number = 0;
  timer: any;
  isRunning: boolean = false;
  progress: number = 1;
  remainingSeconds: number = 0;
  alertAudio: HTMLAudioElement;

  constructor(private route: ActivatedRoute, private navCtrl: NavController) {
    addIcons({
      'school-outline': schoolOutline,
      'briefcase-outline': briefcaseOutline,
      'moon-outline': moonOutline,
      'barbell-outline': barbellOutline,
      'book-outline': bookOutline,
      'code-slash-outline': codeSlashOutline,
      'leaf-outline': leafOutline,
      'musical-notes-outline': musicalNotesOutline,
      'language-outline': languageOutline,
      'pencil-outline': pencilOutline,
      'pause-outline': pauseOutline,
      'play-outline': playOutline,
      'stop-outline': stopOutline,
      'exit-outline': exitOutline,
      'trash-outline': trashOutline
    });

    // 初始化音频
    this.alertAudio = new Audio('assets/alert.mp3');
  }

  ngOnInit() {
    this.route.queryParams.subscribe(params => {
      this.activityType = params['type'];
      this.activityName = params['name'];
      this.duration = parseInt(params['duration']);
      this.remainingSeconds = this.duration * 60; // 转换为秒
      this.startCountdown();
    });
  }

  ngOnDestroy() {
    if (this.timer) {
      clearInterval(this.timer);
    }
  }

  startCountdown() {
    if (this.timer) {
      clearInterval(this.timer);
    }

    const startTime = this.remainingSeconds;
    
    this.timer = setInterval(() => {
      if (this.remainingSeconds > 0) {
        this.remainingSeconds--;
        this.progress = this.remainingSeconds / startTime;
        this.remainingTime = this.formatTime(this.remainingSeconds);
      } else {
        this.isRunning = false;
        clearInterval(this.timer);
        this.playAlertSound(); // 播放提示音
      }
    }, 1000);
  }

  formatTime(seconds: number): string {
    const hours = Math.floor(seconds / 3600);
    const minutes = Math.floor((seconds % 3600) / 60);
    const secs = seconds % 60;
    return `${this.padNumber(hours)}:${this.padNumber(minutes)}:${this.padNumber(secs)}`;
  }

  padNumber(num: number): string {
    return num.toString().padStart(2, '0');
  }

  togglePause() {
    console.log('Toggle Pause called');
    if (this.isRunning) {
      clearInterval(this.timer);
      console.log('Paused at:', this.remainingSeconds, 'seconds');
    } else {
      console.log('Resuming from:', this.remainingSeconds, 'seconds');
      this.startCountdown();
    }
    this.isRunning = !this.isRunning;
  }

  stop() {
    clearInterval(this.timer);
    this.isRunning = false;
    this.remainingSeconds = this.duration * 60;
    this.remainingTime = this.formatTime(this.remainingSeconds);
    this.progress = 1;
  }

  exit() {
    this.stop();
    this.navCtrl.back();
  }

  private playAlertSound() {
    this.alertAudio.play().catch(error => console.error('Error playing alert sound:', error));
  }
}