Updating video player when switching scene page.

This commit is contained in:
DebaucheryLibrarian 2021-04-25 04:20:38 +02:00
parent fc1c2fc2f3
commit eed563e06f
4 changed files with 29 additions and 17 deletions

View File

@ -213,21 +213,19 @@ export default {
.notification-body { .notification-body {
flex-grow: 1; flex-grow: 1;
padding: .4rem 1rem .25rem .5rem; padding: .4rem 1rem .25rem .5rem;
overflow: hidden;
} }
.notification-row { .notification-row {
display: flex; display: flex;
align-items: center; align-items: center;
overflow: hidden;
&:not(:last-child) { &:not(:last-child) {
margin: 0 0 .1rem 0; margin: 0 0 .1rem 0;
} }
} }
.notification-tidbit {
font-weight: bold;
}
.notification-favicon { .notification-favicon {
width: 1rem; width: 1rem;
height: 1rem; height: 1rem;
@ -240,8 +238,14 @@ export default {
overflow: hidden; overflow: hidden;
} }
.notification-tags {
white-space: nowrap;
}
.notification-actor, .notification-actor,
.notification-tag { .notification-tag {
white-space: nowrap;
&:not(:last-child)::after { &:not(:last-child)::after {
content: ','; content: ',';
padding: 0 .1rem 0 0; padding: 0 .1rem 0 0;

View File

@ -17,7 +17,6 @@
@pause="playing = false; paused = true;" @pause="playing = false; paused = true;"
/> />
<Player <Player
v-else-if="release.teaser && /^video\//.test(release.teaser.mime)" v-else-if="release.teaser && /^video\//.test(release.teaser.mime)"
:video="release.teaser" :video="release.teaser"

View File

@ -6,19 +6,19 @@
class="player video-js vjs-big-play-centered" class="player video-js vjs-big-play-centered"
@playing="$emit('play')" @playing="$emit('play')"
@pause="$emit('pause')" @pause="$emit('pause')"
> />
<source
:src="getPath(video)"
type="video/mp4"
>
</video>
</template> </template>
<script> <script>
import videoJs from 'video.js'; import videoJs from 'video.js';
import 'videojs-vr/dist/videojs-vr.min'; import 'videojs-vr/dist/videojs-vr.min';
function mounted() { function updatePlayer() {
this.player.src(this.getPath(this.video));
this.player.poster(this.poster);
}
function initPlayer() {
this.player = videoJs(this.$refs.player, { this.player = videoJs(this.$refs.player, {
controls: true, controls: true,
inactivityTimeout: 1000, inactivityTimeout: 1000,
@ -29,6 +29,8 @@ function mounted() {
}, },
}, },
}, () => { }, () => {
this.player.src(this.getPath(this.video));
if (this.video.isVr) { if (this.video.isVr) {
this.player.vr({ projection: '180' }); this.player.vr({ projection: '180' });
} }
@ -46,7 +48,17 @@ export default {
default: null, default: null,
}, },
}, },
mounted, data() {
return {
player: null,
};
},
emits: ['play', 'pause'],
watch: {
video: updatePlayer,
poster: updatePlayer,
},
mounted: initPlayer,
}; };
</script> </script>

View File

@ -49,7 +49,7 @@ async function removeAlert(alertId) {
await knex('alerts').where('id', alertId).delete(); await knex('alerts').where('id', alertId).delete();
} }
async function notify(scenes, sessionUser) { async function notify(scenes) {
const releases = await knex.raw(` const releases = await knex.raw(`
SELECT alerts.id as alert_id, alerts.notify, alerts.email, releases.id as scene_id, users.id as user_id SELECT alerts.id as alert_id, alerts.notify, alerts.email, releases.id as scene_id, users.id as user_id
FROM releases FROM releases
@ -94,7 +94,6 @@ async function notify(scenes, sessionUser) {
GROUP BY releases.id, users.id, alerts.id; GROUP BY releases.id, users.id, alerts.id;
`, { `, {
sceneIds: scenes.map(scene => scene.id), sceneIds: scenes.map(scene => scene.id),
userId: sessionUser.id,
}); });
const notifications = releases.rows.filter(alert => alert.notify); const notifications = releases.rows.filter(alert => alert.notify);
@ -110,8 +109,6 @@ async function notify(scenes, sessionUser) {
} }
async function updateNotification(notificationId, notification, sessionUser) { async function updateNotification(notificationId, notification, sessionUser) {
console.log(notification, sessionUser.id);
await knex('notifications') await knex('notifications')
.where('user_id', sessionUser.id) .where('user_id', sessionUser.id)
.where('id', notificationId) .where('id', notificationId)