fullscreen.

This commit is contained in:
Miroslav Šedivý 2020-11-08 22:16:47 +01:00
parent fc928f4ed2
commit 869b27161b
3 changed files with 19 additions and 5 deletions

View File

@ -83,9 +83,9 @@
</select> </select>
</td> </td>
</tr> </tr>
<tr> <tr class="ok">
<th>screen.is_fullscreen</th> <th>screen.fullscreen</th>
<td>{{ neko.state.screen.is_fullscreen }}</td> <td><input type="checkbox" v-model="neko.state.screen.fullscreen" /></td>
</tr> </tr>
<tr class="ok"> <tr class="ok">
<th>member.id</th> <th>member.id</th>

View File

@ -105,7 +105,7 @@
rate: 30, rate: 30,
}, },
configurations: [], configurations: [],
is_fullscreen: false, fullscreen: false,
}, },
member: { member: {
id: null, id: null,
@ -151,6 +151,15 @@
this.onResize() this.onResize()
} }
@Watch('state.screen.fullscreen')
onScreenFullscreenChanged() {
if (document.fullscreenElement !== null) {
document.exitFullscreen()
} else {
this._component.requestFullscreen()
}
}
public control = { public control = {
request: () => { request: () => {
this.websocket.send('control/request') this.websocket.send('control/request')
@ -200,6 +209,11 @@
Vue.set(this.state.member, 'is_controlling', id != null && id === this.state.member.id) Vue.set(this.state.member, 'is_controlling', id != null && id === this.state.member.id)
}) })
this._component.addEventListener('fullscreenchange', () => {
Vue.set(this.state.screen, 'fullscreen', document.fullscreenElement !== null)
this.onResize()
})
// Video // Video
VideoRegister(this.video, this.state.video) VideoRegister(this.video, this.state.video)

View File

@ -47,7 +47,7 @@ export interface Scroll {
export interface Screen { export interface Screen {
size: ScreenSize size: ScreenSize
configurations: ScreenSize[] configurations: ScreenSize[]
is_fullscreen: boolean fullscreen: boolean
} }
export interface ScreenSize { export interface ScreenSize {