/* V14 Timeline Module - Keyframe Animation System */
import { state } from './state.js';

class Timeline {
    constructor() {
        this.keyframes = [];
        this.currentTime = 0;
        this.duration = 10000; // 10 seconds
        this.playing = false;
        this.loop = true;
    }

    addKeyframe(time, property, value, easing = 'linear') {
        this.keyframes.push({ time, property, value, easing });
        this.keyframes.sort((a, b) => a.time - b.time);
    }

    play() {
        this.playing = true;
        this.currentTime = 0;
    }

    pause() {
        this.playing = false;
    }

    update(deltaTime) {
        if (!this.playing) return;

        this.currentTime += deltaTime;

        if (this.currentTime >= this.duration) {
            if (this.loop) {
                this.currentTime = 0;
            } else {
                this.pause();
                return;
            }
        }

        // Apply keyframes
        const activeKeyframes = this.keyframes.filter(kf => kf.time <= this.currentTime);

        activeKeyframes.forEach(kf => {
            // Find next keyframe for interpolation
            const nextKf = this.keyframes.find(k =>
                k.property === kf.property && k.time > this.currentTime
            );

            if (nextKf) {
                const progress = (this.currentTime - kf.time) / (nextKf.time - kf.time);
                const easedProgress = this.ease(progress, kf.easing);
                const value = this.interpolate(kf.value, nextKf.value, easedProgress);

                if (state.hasOwnProperty(kf.property)) {
                    state[kf.property] = value;
                }
            } else {
                // No next keyframe, use current value
                if (state.hasOwnProperty(kf.property)) {
                    state[kf.property] = kf.value;
                }
            }
        });
    }

    interpolate(start, end, progress) {
        if (typeof start === 'number' && typeof end === 'number') {
            return start + (end - start) * progress;
        }
        return progress < 0.5 ? start : end;
    }

    ease(t, type) {
        switch (type) {
            case 'easeIn':
                return t * t;
            case 'easeOut':
                return t * (2 - t);
            case 'easeInOut':
                return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;
            case 'bounce':
                if (t < 1 / 2.75) {
                    return 7.5625 * t * t;
                } else if (t < 2 / 2.75) {
                    return 7.5625 * (t -= 1.5 / 2.75) * t + 0.75;
                } else if (t < 2.5 / 2.75) {
                    return 7.5625 * (t -= 2.25 / 2.75) * t + 0.9375;
                } else {
                    return 7.5625 * (t -= 2.625 / 2.75) * t + 0.984375;
                }
            case 'elastic':
                return Math.sin(-13 * (Math.PI / 2) * (t + 1)) * Math.pow(2, -10 * t) + 1;
            default:
                return t; // linear
        }
    }

    clear() {
        this.keyframes = [];
        this.currentTime = 0;
    }
}

// Global timeline instance
export const globalTimeline = new Timeline();

/**
 * Update timeline (called from main loop)
 */
export function updateTimeline(deltaTime = 16) {
    if (state.timelineEnabled) {
        globalTimeline.update(deltaTime);
    }
}

/**
 * Create demo timeline
 */
export function createDemoTimeline() {
    globalTimeline.clear();

    // Animate spikes
    globalTimeline.addKeyframe(0, 'spikes', 5, 'linear');
    globalTimeline.addKeyframe(2000, 'spikes', 12, 'easeInOut');
    globalTimeline.addKeyframe(4000, 'spikes', 5, 'easeInOut');

    // Animate radius
    globalTimeline.addKeyframe(0, 'outerRadius', 100, 'linear');
    globalTimeline.addKeyframe(3000, 'outerRadius', 200, 'bounce');
    globalTimeline.addKeyframe(6000, 'outerRadius', 100, 'bounce');

    // Animate glow
    globalTimeline.addKeyframe(0, 'glow', 0, 'linear');
    globalTimeline.addKeyframe(2500, 'glow', 40, 'easeIn');
    globalTimeline.addKeyframe(5000, 'glow', 0, 'easeOut');

    globalTimeline.play();
}