Archived
2
0

hide buttons in cast mode

This commit is contained in:
Pawel Urbanek 2023-03-24 15:24:20 +01:00
parent 50e5483661
commit 1f81bd3efc
3 changed files with 23 additions and 16 deletions

View File

@ -1,17 +1,17 @@
<template>
<div id="neko" :class="[!hideControls && side ? 'expanded' : '']">
<div id="neko" :class="[!videoOnly && side ? 'expanded' : '']">
<template v-if="!$client.supported">
<neko-unsupported />
</template>
<template v-else>
<main class="neko-main">
<div v-if="!hideControls" class="header-container">
<div v-if="!videoOnly" class="header-container">
<neko-header />
</div>
<div class="video-container">
<neko-video ref="video" :hideControls="hideControls" @control-attempt="controlAttempt" />
</div>
<div v-if="!hideControls" class="room-container">
<div v-if="!videoOnly" class="room-container">
<neko-members />
<div class="room-menu">
<div class="settings">
@ -26,11 +26,11 @@
</div>
</div>
</main>
<neko-side v-if="!hideControls && side" />
<neko-side v-if="!videoOnly && side" />
<neko-connect v-if="!connected" />
<neko-about v-if="about" />
<notifications
v-if="!hideControls"
v-if="!videoOnly"
group="neko"
position="top left"
style="top: 50px; pointer-events: none"
@ -176,10 +176,22 @@
shakeKbd = false
get hideControls() {
get isCastMode() {
return !!new URL(location.href).searchParams.get('cast')
}
get isEmbedMode() {
return !!new URL(location.href).searchParams.get('embed')
}
get hideControls() {
return this.isCastMode
}
get videoOnly() {
return this.isCastMode || this.isEmbedMode
}
@Watch('hideControls', { immediate: true })
onHideControls(enabled: boolean) {
if (enabled) {

View File

@ -30,17 +30,17 @@
</div>
<div ref="aspect" class="player-aspect" />
</div>
<ul v-if="!fullscreen" class="video-menu top">
<ul v-if="!fullscreen && !hideControls" class="video-menu top">
<li><i @click.stop.prevent="requestFullscreen" class="fas fa-expand"></i></li>
<li v-if="admin"><i @click.stop.prevent="openResolution" class="fas fa-desktop"></i></li>
<li :class="hideControls || 'request-control'">
<li v-if="!this.implicitHosting" class="request-control">
<i
:class="[hosted && !hosting ? 'disabled' : '', !hosted && !hosting ? 'faded' : '', 'fas', 'fa-keyboard']"
@click.stop.prevent="toggleControl"
/>
</li>
</ul>
<ul v-if="!fullscreen" class="video-menu bottom">
<ul v-if="!fullscreen && !hideControls" class="video-menu bottom">
<li v-if="hosting && (!clipboard_read_available || !clipboard_write_available)">
<i @click.stop.prevent="openClipboard" class="fas fa-clipboard"></i>
</li>
@ -106,15 +106,9 @@
}
}
&.request-control {
display: none;
}
@media (max-width: 768px) {
&.request-control {
display: inline-block;
}
}
&:last-child {
margin: 0;

View File

@ -230,6 +230,7 @@ Note, currently only browser GPU acceleration is supported, not encoding.
- Adding `?pwd=<password>` will prefill password.
- Adding `?usr=<display-name>` will prefill username.
- Adding `?cast=1` will hide all control and show only video.
- Adding `?embed=1` will hide most additional components and show only video.
- e.g. `http(s)://<URL:Port>/?pwd=neko&usr=guest&cast=1`
### Screen size