Changeset View
Changeset View
Standalone View
Standalone View
src/resources/vue/Meet/Room.vue
| Show First 20 Lines • Show All 168 Lines • ▼ Show 20 Lines | <script> | ||||
| // Register additional icons | // Register additional icons | ||||
| import { library } from '@fortawesome/fontawesome-svg-core' | import { library } from '@fortawesome/fontawesome-svg-core' | ||||
| import { | import { | ||||
| faAlignLeft, | faAlignLeft, | ||||
| faCog, | faCog, | ||||
| faCompress, | faCompress, | ||||
| faCrown, | |||||
| faDesktop, | faDesktop, | ||||
| faExpand, | faExpand, | ||||
| faMicrophone, | faMicrophone, | ||||
| faPowerOff, | faPowerOff, | ||||
| faUser, | faUser, | ||||
| faShieldAlt, | faShieldAlt, | ||||
| faVideo, | faVideo, | ||||
| faVolumeMute | faVolumeMute | ||||
| } from '@fortawesome/free-solid-svg-icons' | } from '@fortawesome/free-solid-svg-icons' | ||||
| // Register only these icons we need | // Register only these icons we need | ||||
| library.add( | library.add( | ||||
| faAlignLeft, | faAlignLeft, | ||||
| faCog, | faCog, | ||||
| faCompress, | faCompress, | ||||
| faCrown, | |||||
| faDesktop, | faDesktop, | ||||
| faExpand, | faExpand, | ||||
| faMicrophone, | faMicrophone, | ||||
| faPowerOff, | faPowerOff, | ||||
| faUser, | faUser, | ||||
| faShieldAlt, | faShieldAlt, | ||||
| faVideo, | faVideo, | ||||
| faVolumeMute | faVolumeMute | ||||
| ) | ) | ||||
| let roomRequest | let roomRequest | ||||
| const authHeader = 'X-Meet-Auth-Token' | |||||
| export default { | export default { | ||||
| components: { | components: { | ||||
| LogonForm, | LogonForm, | ||||
| SessionSecurityOptions, | SessionSecurityOptions, | ||||
| StatusMessage | StatusMessage | ||||
| }, | }, | ||||
| data() { | data() { | ||||
| Show All 37 Lines | export default { | ||||
| this.setupSession() | this.setupSession() | ||||
| }, | }, | ||||
| beforeDestroy() { | beforeDestroy() { | ||||
| clearTimeout(roomRequest) | clearTimeout(roomRequest) | ||||
| if (this.meet) { | if (this.meet) { | ||||
| this.meet.leaveRoom() | this.meet.leaveRoom() | ||||
| } | } | ||||
| delete axios.defaults.headers.common[authHeader] | |||||
| }, | }, | ||||
| methods: { | methods: { | ||||
| authSuccess() { | authSuccess() { | ||||
| // The user authentication succeeded, we still don't know it's really the room owner | // The user authentication succeeded, we still don't know it's really the room owner | ||||
| this.initSession() | this.initSession() | ||||
| $('#meet-setup').removeClass('hidden') | $('#meet-setup').removeClass('hidden') | ||||
| $('#meet-auth').addClass('hidden') | $('#meet-auth').addClass('hidden') | ||||
| Show All 29 Lines | export default { | ||||
| } | } | ||||
| this.roomState = 'ready' | this.roomState = 'ready' | ||||
| this.session = response.data | this.session = response.data | ||||
| if (init) { | if (init) { | ||||
| this.joinSession() | this.joinSession() | ||||
| } | } | ||||
| if (this.session.authToken) { | |||||
| axios.defaults.headers.common[authHeader] = this.session.authToken | |||||
| } | |||||
| }) | }) | ||||
| .catch(error => { | .catch(error => { | ||||
| if (!error.response) { | if (!error.response) { | ||||
| console.error(error) | console.error(error) | ||||
| return | return | ||||
| } | } | ||||
| const data = error.response.data || {} | const data = error.response.data || {} | ||||
| ▲ Show 20 Lines • Show All 302 Lines • ▼ Show 20 Lines | export default { | ||||
| const enabled = this.meet.switchAudio() | const enabled = this.meet.switchAudio() | ||||
| this.setMenuItem('audio', enabled) | this.setMenuItem('audio', enabled) | ||||
| }, | }, | ||||
| switchVideo() { | switchVideo() { | ||||
| const enabled = this.meet.switchVideo() | const enabled = this.meet.switchVideo() | ||||
| this.setMenuItem('video', enabled) | this.setMenuItem('video', enabled) | ||||
| }, | }, | ||||
| switchScreen() { | switchScreen() { | ||||
| this.meet.switchScreen(enabled => { | const switchScreenAction = () => { | ||||
| this.meet.switchScreen((enabled, error) => { | |||||
| this.setMenuItem('screen', enabled) | this.setMenuItem('screen', enabled) | ||||
| if (!enabled && !error) { | |||||
| // Closing a screen sharing connection invalidates the token | |||||
| delete this.session.shareToken | |||||
| } | |||||
| }) | |||||
| } | |||||
| // After one screen sharing session ended request a new token | if (this.session.shareToken || !$('#meet-session-menu').find('.link-screen').is('.text-danger')) { | ||||
| // for the next screen sharing session | switchScreenAction() | ||||
| if (!enabled) { | } else { | ||||
| // TODO: This might need to be a different route. E.g. the room password might have | axios.post('/api/v4/openvidu/rooms/' + this.room + '/connections') | ||||
| // changed since user joined the session | |||||
| // Also because it creates a redundant connection (token) | |||||
| axios.post('/api/v4/openvidu/rooms/' + this.room, this.post, { ignoreErrors: true }) | |||||
| .then(response => { | .then(response => { | ||||
| // Response data contains: session, token and shareToken | this.session.shareToken = response.data.token | ||||
| this.session.shareToken = response.data.shareToken | |||||
| this.meet.updateSession(this.session) | this.meet.updateSession(this.session) | ||||
| switchScreenAction() | |||||
| }) | }) | ||||
| } | } | ||||
| }) | |||||
| }, | }, | ||||
| updateParticipant(connId, params) { | updateParticipant(connId, params) { | ||||
| if (this.isModerator()) { | if (this.isModerator()) { | ||||
| axios.put('/api/v4/openvidu/rooms/' + this.room + '/connections/' + connId, params) | axios.put('/api/v4/openvidu/rooms/' + this.room + '/connections/' + connId, params) | ||||
| } | } | ||||
| }, | }, | ||||
| updateSession(data) { | updateSession(data) { | ||||
| let params = {} | let params = {} | ||||
| Show All 24 Lines | |||||