GitHub/trunk-server
1
0
Fork 0
mirror of https://github.com/openmhz/trunk-server.git synced 2026-11-13 09:17:30 -05:00
Code Issues Packages Projects Releases Wiki Activity

background autoplaying

Browse Source
This commit is contained in:
Luke Berndt
2023-02-15 21:28:30 -05:00
parent b5a610eb4d
commit b8ba705aee
5 changed files with 69 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/src/Call/components/GroupModal.js
View File

@@ -1,6 +1,6 @@
import React, { Component, useState, useEffect } from "react";
import { useGetGroupsQuery, useGetSystemsQuery, } from '../../features/api/apiSlice'
import { setGroupFilter, setCenterCall } from "../../features/callPlayer/callPlayerSlice";
import { setGroupFilter, setCenterCall, setBackgroundAutoplay } from "../../features/callPlayer/callPlayerSlice";
import { useSelector, useDispatch } from 'react-redux'
import {
@@ -15,11 +15,14 @@ import "./FilterModal.css";
function GroupModal(props) {
const shortName = useSelector((state) => state.callPlayer.shortName);
const backgroundAutoplay = useSelector((state) => state.callPlayer.backgroundAutoplay);
const centerCall = useSelector((state) => state.callPlayer.centerCall);
const { data: groupData, isSuccess } = useGetGroupsQuery(props.shortName);
const { data: allSystems } = useGetSystemsQuery();
const [selectedGroup, setSelectedGroup] = useState(false);
const [groupOptions, setGroupOptions] = useState([]);
const [centerCall, setLocalCenterCall] = useState(true);
const [localCenterCall, setLocalCenterCall] = useState(centerCall);
const [localBackgroundAutoplay, setLocalBackgroundAutoplay] = useState(backgroundAutoplay);
const dispatch = useDispatch()
const onClose = props.onClose;
let system = false;
@@ -30,7 +33,8 @@ function GroupModal(props) {
}
function handleDone(onClose) {
dispatch(setCenterCall(centerCall));
dispatch(setCenterCall(localCenterCall));
dispatch(setBackgroundAutoplay(localBackgroundAutoplay));
if (selectedGroup && (selectedGroup!="all")) {
dispatch(setGroupFilter(selectedGroup))
@@ -83,7 +87,8 @@ function GroupModal(props) {
<p>Choose the type of calls you want to listen to</p>
<Form>
<Form.Select placeholder='All Calls' fluid selection options={groupOptions} name='selectedGroup' onChange={(e, data) => setSelectedGroup(data.value)} />
<Form.Checkbox label='Center playing call ' checked={centerCall} onChange={(e, data) => setLocalCenterCall(data.value)} />
<Form.Checkbox label='Focus on call playing' checked={localCenterCall} onChange={(e, data) => setLocalCenterCall(data.checked)} />
<Form.Checkbox label='Background autoplay' checked={localBackgroundAutoplay} onChange={(e, data) => setLocalBackgroundAutoplay(data.checked)} />
</Form>
</Grid.Column>
</Grid.Row>

33
frontend/src/Call/components/MediaPlayer.js
View File

@@ -17,6 +17,7 @@ const MediaPlayer = (props) => {
const [playTime, setPlayTime] = useState(0);
const [isPlaying, setIsPlaying] = useState(false);
const parentHandlePlayPause = props.onPlayPause
const playSilence = props.playSilence;
const handlePause = () => { setIsPlaying(false); }
const handlePlay = () => { setIsPlaying(true); }
@@ -61,6 +62,38 @@ const MediaPlayer = (props) => {
}
}, [call]);
useEffect(() => {
const audio = audioRef.current.audioEl.current;
setSourceIndex(0);
navigator.mediaSession.metadata = new MediaMetadata({
title: "Waiting for Call...",
album: 'OpenMHz',
artwork: [
{ src: '/favicon-32x32.png', sizes: '32x32', type: 'image/png' },
{ src: '/android-chrome-192x192.png', sizes: '192x192', type: 'image/png' },
{ src: '/android-chrome-192x192.png', sizes: '512x512', type: 'image/png' },
]
});
audio.src = "data:audio/mpeg;base64,SUQzBAAAAAAAI1RTU0UAAAAPAAADTGF2ZjU4Ljc2LjEwMAAAAAAAAAAAAAAA/+M4wAAAAAAAAAAAAEluZm8AAAAPAAAAAwAAAbAAqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV1dXV////////////////////////////////////////////AAAAAExhdmM1OC4xMwAAAAAAAAAAAAAAACQDkAAAAAAAAAGw9wrNaQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA/+MYxAAAAANIAAAAAExBTUUzLjEwMFVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV/+MYxDsAAANIAAAAAFVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV/+MYxHYAAANIAAAAAFVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV";
const playPromise = audio.play();
// In browsers that don’t yet support this functionality,
// playPromise won’t be defined.
if (playPromise !== undefined) {
playPromise.then(function () {
}).catch(function (error) {
console.log("Automatic playback failed: " + error);
// Show a UI element to let the user manually start playback.
});
} else {
audio.src = false;
}
}, [playSilence]);
const updatePlayProgress = () => {
const audio = audioRef.current.audioEl.current;
const { currentTime, duration } = audio;