import { rejects } from "assert";
import { Howl, HowlCallback } from "howler";

import { resolve } from "path";
import { ref, watch, ComputedRef } from "vue";
import { useStore } from "vuex";
export function useAudio() {
    const store = useStore()
    const token = "Bearer " + store.getters.getToken;
    let sound: Howl = store.state.lightAudio
    let pauseAudio = () => {
        sound && sound.pause();
    }
    let stopAudio = () => {
        sound && sound.stop()

    }
    let playAudio = (url: string) => {
        stopAudio()
        sound = new Howl({
            src: url,
            html5: true,
            xhr: {
                method: 'GET',
                headers: {
                    Authorization: 'Bearer:' + token,
                },
                withCredentials: true,
            }
        });
        return new Promise((resolve, reject) => {
            sound.once("load", function () {
                let id = sound.play();
                if (id) {

                    resolve(id)
                }
                else {
                    reject("id错误")
                }

            });

        })
    }
    let audioOnce = (event: string, callback: HowlCallback) => {
        sound.once(event, callback)

    }
    let audioOn = (event: string, callback: HowlCallback) => {
        sound.on(event, callback)

    }
    let playMulAudio = (urls: string[]) => {
        pauseAudio()
        sound = new Howl({
            src: urls
        });

    }
    let durationAudio = (id?: number) => {
        return sound && sound.duration(id)

    }





    return {
        playAudio,
        audioOnce,
        audioOn,
        playMulAudio,
        pauseAudio,
        stopAudio,
        durationAudio

    }


}