<template>
    <div style="width: 1280px; height: 720px">

            <RemoteFeedOnly @kick="kick" @rtp="rtp" v-if="rid" :creator="creator" :user="$route.params.user" :room="rid" server="ws://localhost:8188/ws" :username="name"></RemoteFeedOnly>
<!--        <ObsVue server="ws://localhost:4444/"></ObsVue>-->
    </div>
</template>

<script>
    // import VueJanus from "@/lib/VueJanus";
    import RemoteFeedOnly from "@/lib/RemoteFeedOnly";
    export default {
        name: "RoomView",
        // components: {VueJanus},
        components: {RemoteFeedOnly},
        data: () => ({
            rid:'',
            name:'',
            dialog:false,
            creator:false
        }),
        mounted () {
            // if (!name) this.dialog = true
            this.getRoom()
        },
        methods: {
            kick (user) {
                this.$axios.get(`kick/${this.$route.params.id}/${user}`).then(response => {
                    console.log(response)
                })
            },
            rtp (user) {
                this.$axios.get(`rtp/${this.$route.params.id}/${user}`).then(response => {
                    console.log(response)
                })
            },
            getRoom () {
                this.dialog = false
                this.$axios.get(`room/${this.$route.params.id}`).then(response => {
                    this.rid = response.data.rid
                    this.creator = response.data.can_modify
                })
            }
        }
    }
</script>

<style scoped>
    body , html, div {
        overflow: hidden;
    }
</style>
