mirror of
https://github.com/openmhz/trunk-server.git
synced 2026-11-14 17:58:02 -05:00
fixed some live stuff
This commit is contained in:
@@ -1,11 +1,11 @@
|
|||||||
import React, { useEffect, useLayoutEffect, useState, useRef } from "react";
|
import React, { useEffect, useLayoutEffect, useState, useRef, useCallback } from "react";
|
||||||
import { Link, useLocation, useParams, useNavigate } from 'react-router-dom';
|
import { Link, useLocation, useParams, useNavigate } from 'react-router-dom';
|
||||||
import FilterModal from "./components/FilterModal";
|
import FilterModal from "./components/FilterModal";
|
||||||
import GroupModal from "./components/GroupModal";
|
import GroupModal from "./components/GroupModal";
|
||||||
import CalendarModal from "./components/CalendarModal";
|
import CalendarModal from "./components/CalendarModal";
|
||||||
import CallPlayer from "./CallPlayer";
|
import CallPlayer from "./CallPlayer";
|
||||||
import { useSelector, useDispatch } from 'react-redux'
|
import { useSelector, useDispatch } from 'react-redux'
|
||||||
import { setLive, setFilter, setDateFilter } from "../features/callPlayer/callPlayerSlice";
|
import { setFilter, setDateFilter } from "../features/callPlayer/callPlayerSlice";
|
||||||
import { getCalls, addCall, getOlderCalls, getNewerCalls } from "../features/calls/callsSlice";
|
import { getCalls, addCall, getOlderCalls, getNewerCalls } from "../features/calls/callsSlice";
|
||||||
import { useGetGroupsQuery, useGetSystemsQuery, } from '../features/api/apiSlice'
|
import { useGetGroupsQuery, useGetSystemsQuery, } from '../features/api/apiSlice'
|
||||||
import { selectSystem } from "../features/systems/systemsSlice";
|
import { selectSystem } from "../features/systems/systemsSlice";
|
||||||
@@ -21,6 +21,7 @@ import {
|
|||||||
import "./CallPlayer.css";
|
import "./CallPlayer.css";
|
||||||
import queryString from '../query-string';
|
import queryString from '../query-string';
|
||||||
import io from 'socket.io-client';
|
import io from 'socket.io-client';
|
||||||
|
import { useCallLink } from "./components/CallLinks";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -44,6 +45,7 @@ function Calls(props) {
|
|||||||
const [calendarVisible, setCalendarVisible] = useState(false);
|
const [calendarVisible, setCalendarVisible] = useState(false);
|
||||||
const [isConnected, setIsConnected] = useState(socket.connected);
|
const [isConnected, setIsConnected] = useState(socket.connected);
|
||||||
const [selectCallId, setSelectCallId] = useState(false);
|
const [selectCallId, setSelectCallId] = useState(false);
|
||||||
|
const [live, setLive] = useState(true);
|
||||||
|
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
@@ -57,7 +59,7 @@ function Calls(props) {
|
|||||||
const filterTalkgroups = useSelector((state) => state.callPlayer.filterTalkgroups);
|
const filterTalkgroups = useSelector((state) => state.callPlayer.filterTalkgroups);
|
||||||
const filterStarred = useSelector((state) => state.callPlayer.filterStarred);
|
const filterStarred = useSelector((state) => state.callPlayer.filterStarred);
|
||||||
const filterDate = useSelector((state) => state.callPlayer.filterDate);
|
const filterDate = useSelector((state) => state.callPlayer.filterDate);
|
||||||
const live = useSelector((state) => state.callPlayer.live);
|
//const live = useSelector((state) => state.callPlayer.live);
|
||||||
const uri = queryString.parse(useLocation().search);
|
const uri = queryString.parse(useLocation().search);
|
||||||
const pathname = useLocation().pathname;
|
const pathname = useLocation().pathname;
|
||||||
|
|
||||||
@@ -131,6 +133,7 @@ function Calls(props) {
|
|||||||
shortName: shortName
|
shortName: shortName
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
const stopSocket = () => {
|
const stopSocket = () => {
|
||||||
console.log("Stopping Socket")
|
console.log("Stopping Socket")
|
||||||
socket.emit("stop");
|
socket.emit("stop");
|
||||||
@@ -172,8 +175,8 @@ function Calls(props) {
|
|||||||
const handleLiveToggle = (currentlyLive) => {
|
const handleLiveToggle = (currentlyLive) => {
|
||||||
if (!live) {
|
if (!live) {
|
||||||
dispatch(setDateFilter(false));
|
dispatch(setDateFilter(false));
|
||||||
dispatch(setLive(true));
|
|
||||||
dispatch(getCalls({}));
|
dispatch(getCalls({}));
|
||||||
|
setLive(true);
|
||||||
startSocket();
|
startSocket();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -182,7 +185,7 @@ function Calls(props) {
|
|||||||
setCalendarVisible(!calendarVisible);
|
setCalendarVisible(!calendarVisible);
|
||||||
|
|
||||||
if (didUpdate) {
|
if (didUpdate) {
|
||||||
dispatch(setLive(false));
|
setLive(false);
|
||||||
stopSocket();
|
stopSocket();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -233,7 +236,6 @@ useLayoutEffect(() => {
|
|||||||
filterTalkgroups: [],
|
filterTalkgroups: [],
|
||||||
filterGroupId: false,
|
filterGroupId: false,
|
||||||
filterStarred: false,
|
filterStarred: false,
|
||||||
live: true,
|
|
||||||
shortName: shortName
|
shortName: shortName
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -248,7 +250,8 @@ useLayoutEffect(() => {
|
|||||||
if (uri.hasOwnProperty('time')) {
|
if (uri.hasOwnProperty('time')) {
|
||||||
const date = new Date(parseInt(uri['time']));
|
const date = new Date(parseInt(uri['time']));
|
||||||
filter.filterDate = date.getTime();
|
filter.filterDate = date.getTime();
|
||||||
filter.live = false;
|
setLive(false);
|
||||||
|
//filter.live = false;
|
||||||
if (!urlOptions) setUrlOptions(true);
|
if (!urlOptions) setUrlOptions(true);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -257,6 +260,7 @@ useLayoutEffect(() => {
|
|||||||
const _id = uri['call-id'];
|
const _id = uri['call-id'];
|
||||||
setSelectCallId(_id);
|
setSelectCallId(_id);
|
||||||
setAutoPlay(false);
|
setAutoPlay(false);
|
||||||
|
setLive(false);
|
||||||
if (!urlOptions) setUrlOptions(true);
|
if (!urlOptions) setUrlOptions(true);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -289,9 +293,17 @@ useLayoutEffect(() => {
|
|||||||
};
|
};
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
socket.on('connect', () => {
|
socket.on('connect', () => {
|
||||||
console.log("Socket Connect");
|
console.log("Socket Connect");
|
||||||
|
setLive( (live) => {
|
||||||
|
if (live) {
|
||||||
|
startSocket();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
setIsConnected(true);
|
setIsConnected(true);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -302,10 +314,11 @@ useLayoutEffect(() => {
|
|||||||
|
|
||||||
socket.on('reconnect', (attempts) => {
|
socket.on('reconnect', (attempts) => {
|
||||||
console.log("Socket Reconnected after attempts: " + attempts); // true
|
console.log("Socket Reconnected after attempts: " + attempts); // true
|
||||||
|
setLive( (live) => {
|
||||||
if (live) {
|
if (live) {
|
||||||
this.startSocket();
|
startSocket();
|
||||||
}
|
}
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
socket.on("new message", handleSocketMessage);
|
socket.on("new message", handleSocketMessage);
|
||||||
|
|||||||
@@ -15,17 +15,6 @@ server {
|
|||||||
|
|
||||||
server_name ${DOMAIN_NAME} www.${DOMAIN_NAME};
|
server_name ${DOMAIN_NAME} www.${DOMAIN_NAME};
|
||||||
|
|
||||||
location /apple-touch-*.png {
|
|
||||||
return 444;
|
|
||||||
}
|
|
||||||
|
|
||||||
location /favicon.ico {
|
|
||||||
return 444;
|
|
||||||
}
|
|
||||||
|
|
||||||
location /apple-touch-icon-precomposed.png {
|
|
||||||
return 444;
|
|
||||||
}
|
|
||||||
|
|
||||||
location / {
|
location / {
|
||||||
proxy_pass http://frontend:3000;
|
proxy_pass http://frontend:3000;
|
||||||
|
|||||||
Reference in New Issue
Block a user