import AdminApp from 'admin/app';
import Model, {Set} from 'public/model';
import Sound from 'public/sound';
import {setEcoInterval} from 'public/utils';

import {Streamer, Queue} from './controllers';


export const StreamerApp = {
    ...AdminApp,

    props: {
        ...(AdminApp.props || {}),
        apiUrl: String,
    },
    
    data() {
        return {
            // current streamer
            streamer: null,
            // all streamers
            streamers: [],
            // fetch interval id
            fetchInterval: null,
            Sound: Sound,
        }
    },

    computed: {
        ...(AdminApp.computed || {}),
        
        sources() {
            var sources = this.streamer ? this.streamer.sources : [];
            return sources.filter(s => s.data)
        },
    },

    methods: {
        ...(AdminApp.methods || {}),

        fetchStreamers() {
            Streamer.fetch(this.apiUrl, {many:true}).then(streamers => {
                this.streamers = streamers
                this.streamer = streamers ? streamers[0] : null
            })
        },
    },

    mounted() {
        this.fetchStreamers();
        this.fetchInterval = setEcoInterval(() => this.streamer && this.streamer.fetch(), 5000)
    },

    destroyed() {
        if(this.fetchInterval !== null)
            clearInterval(this.fetchInterval)
    }
}

window.StreamerApp = StreamerApp