websocket atleast connects!

This commit is contained in:
Luke Berndt
2023-01-12 22:16:18 -05:00
parent dad7dc1bd2
commit 844e8e7fdd
6 changed files with 355 additions and 282 deletions

View File

@@ -25,7 +25,8 @@
"react-scripts": "5.0.1",
"redux-thunk": "2.4.2",
"semantic-ui-css": "2.5.0",
"semantic-ui-react": "2.1.4"
"semantic-ui-react": "2.1.4",
"socket.io-client": "^4.5.4"
},
"scripts": {
"start": "react-scripts start",

View File

@@ -26,10 +26,11 @@ import {
import "./CallPlayer.css";
//import setupSocket from '../socket/SetupSocket.js'
import queryString from '../query-string';
import io from 'socket.io-client';
import { setDateFilter } from "./call-actions";
const socket = io(process.env.REACT_APP_BACKEND_SERVER );
// ----------------------------------------------------
@@ -63,7 +64,10 @@ function CallPlayer (props) {
const [filterVisible, setFilterVisible] = useState(false);
const [groupVisible, setGroupVisible] = useState(false);
const [calendarVisible, setCalendarVisible] = useState(false);
const [isConnected, setIsConnected] = useState(socket.connected);
const dispatch = useDispatch();
@@ -86,10 +90,7 @@ function CallPlayer (props) {
const handleSidebarToggle = () => setSidebarOpened(!sidebarOpened);
const handleFilterToggle = () => setFilterVisible(!filterVisible);
const handleCalendarToggle = () => setCalendarVisible(!calendarVisible);
const handleLiveToggle = () => {
dispatch(setLive(!live));
}
const audioRef = false;
const loadNewerCalls = () => {
@@ -121,7 +122,7 @@ function CallPlayer (props) {
}
const getFilter = () => {
const getFilterDescription = () => {
var filter = { type: 'all', code: "", filterStarred: false };
@@ -141,45 +142,86 @@ const getFilter = () => {
}
filter.filterStarred = filterStarred
return filter;
}
const addCall = (data) =>{
const message = JSON.parse(data)
switch (message.type) {
case 'calls':
/*const refs = this.refs.current;
callActions.addCall(message);
const newCall = callsById[callsAllIds[0]];
if (!isPlaying && autoPlay) {
this.playCall({ call: newCall });
if (this.currentCallRef.current) {
this.currentCallRef.current.scrollIntoView({
behavior: "smooth",
block: "center",
});
}
}*/
console.log("Got: " + message);
break
default:
break
}
}
/*
const endSocket = () => {
this.socket.removeAllListeners("new message");
this.socket.removeAllListeners("reconnect");
}
setupSocket() {
this.socket.on('new message', this.addCall);
this.socket.on('reconnect', (attempts) => {
useEffect(() => {
socket.on('connect', () => {
setIsConnected(true);
});
socket.on('disconnect', () => {
setIsConnected(false);
});
socket.on('reconnect', (attempts) => {
console.log("Socket Reconnected after attempts: " + attempts); // true
if (live) {
var filter = this.getFilter();
this.startSocket(shortName, filter.type, filter.code, filter.filterStarred);
this.startSocket();
}
})
}
startSocket(shortName, filterType = "", filterCode = "", filterStarred = false) {
this.socket.emit("start", {
filterCode: filterCode,
filterType: filterType,
socket.on("new message", addCall);
return () => {
socket.off('connect');
socket.off('disconnect');
socket.off('pong');
};
}, []);
const startSocket = () => {
const filter = getFilterDescription();
socket.emit("start", {
filterCode: filter.Code,
filterType: filter.Type,
filterName: "OpenMHz",
filterStarred: filterStarred,
filterStarred: filter.Starred,
shortName: shortName
});
}
stopSocket() {
this.socket.emit("stop");
const stopSocket = () => {
socket.emit("stop");
}
handleLiveToggle() {
const handleLiveToggle = () => {
if (!live) {
callActions.setDateFilter(false);
callActions.setLive(false);
this.setState({ callUrl: "", callId: false });
callActions.fetchCalls();
var filter = this.getFilter();
this.startSocket(shortName, filter.type, filter.code, filter.filterStarred);
dispatch(setDateFilter(false));
dispatch(setLive(true));
setCallUrl("");
setCallId(false);
dispatch(getCalls({}));
this.startSocket();
}
}
*/
/*
updateUri(props, state) {
var search = "?"
@@ -396,11 +438,9 @@ const getFilter = () => {
//talkgroupActions.fetchTalkgroups(shortName);
//groupActions.fetchGroups(shortName);
//systemActions.fetchSystems();
/*this.setupSocket();
if (filter.live) {
this.startSocket(shortName, filterType, filterCode, filter.filterStarred);
}*/
setStateFromUri();
//console.log("Setting short name to: " + shortName)
//dispatch(setShortName(shortName));
@@ -411,9 +451,14 @@ const getFilter = () => {
}, []);
useEffect(() => {
/*
this.updateUri(nextProps, nextState);*/
dispatch(getCalls({}));
if (live) {
startSocket();
}
//dispatch(getOlderCalls());
}, [shortName,filterGroupId,filterTalkgroups,filterType,filterStarred])
}, [shortName,filterGroupId,filterTalkgroups,filterType,filterDate,filterStarred])
@@ -432,33 +477,6 @@ const getFilter = () => {
}
},[groupsData] )
useEffect( () => {
/*var typeString = 'all';
var filterCode = '';
switch (nextProps.filterType) {
case 1:
typeString = 'group';
filterCode = nextProps.filterGroupId;
break;
case 2:
typeString = 'talkgroup';
filterCode = nextProps.filterTalkgroups;
break;
default:
case 0:
typeString = "all";
filterCode = '';
break;
}
this.updateUri(nextProps, nextState);
if (live) {
this.startSocket(shortName, typeString, filterCode, nextProps.filterStarred);
}*/
}, [filterType,filterTalkgroups,filterGroupId,filterStarred,filterDate])
/*
componentWillUpdate(nextProps, nextState) {

View File

@@ -2430,6 +2430,11 @@
dependencies:
"@sinonjs/commons" "^1.7.0"
"@socket.io/component-emitter@~3.1.0":
version "3.1.0"
resolved "https://registry.yarnpkg.com/@socket.io/component-emitter/-/component-emitter-3.1.0.tgz#96116f2a912e0c02817345b3c10751069920d553"
integrity sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg==
"@surma/rollup-plugin-off-main-thread@^2.2.3":
version "2.2.3"
resolved "https://registry.yarnpkg.com/@surma/rollup-plugin-off-main-thread/-/rollup-plugin-off-main-thread-2.2.3.tgz#ee34985952ca21558ab0d952f00298ad2190c053"
@@ -4371,7 +4376,7 @@ debug@2.6.9, debug@^2.6.0, debug@^2.6.9:
dependencies:
ms "2.0.0"
debug@4, debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4:
debug@4, debug@^4.1.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4, debug@~4.3.1, debug@~4.3.2:
version "4.3.4"
resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
@@ -4691,6 +4696,22 @@ encodeurl@~1.0.2:
resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
integrity sha512-TPJXq8JqFaVYm2CWmPvnP2Iyo4ZSM7/QKcSmuMLDObfpH5fi7RUGmd/rTDf+rut/saiDiQEeVTNgAmJEdAOx0w==
engine.io-client@~6.2.3:
version "6.2.3"
resolved "https://registry.yarnpkg.com/engine.io-client/-/engine.io-client-6.2.3.tgz#a8cbdab003162529db85e9de31575097f6d29458"
integrity sha512-aXPtgF1JS3RuuKcpSrBtimSjYvrbhKW9froICH4s0F3XQWLxsKNxqzG39nnvQZQnva4CMvUK63T7shevxRyYHw==
dependencies:
"@socket.io/component-emitter" "~3.1.0"
debug "~4.3.1"
engine.io-parser "~5.0.3"
ws "~8.2.3"
xmlhttprequest-ssl "~2.0.0"
engine.io-parser@~5.0.3:
version "5.0.5"
resolved "https://registry.yarnpkg.com/engine.io-parser/-/engine.io-parser-5.0.5.tgz#c6fa52e57d8d2dc68b24754348f779aa6e44f886"
integrity sha512-mjEyaa4zhuuRhaSLOdjEb57X0XPP9JEsnXI4E+ivhwT0GgzUogARx4MqoY1jQyB+4Bkz3BUOmzL7t9RMKmlG3g==
enhanced-resolve@^5.10.0:
version "5.12.0"
resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.12.0.tgz#300e1c90228f5b570c4d35babf263f6da7155634"
@@ -9093,6 +9114,24 @@ smart-buffer@^4.2.0:
resolved "https://registry.yarnpkg.com/smart-buffer/-/smart-buffer-4.2.0.tgz#6e1d71fa4f18c05f7d0ff216dd16a481d0e8d9ae"
integrity sha512-94hK0Hh8rPqQl2xXc3HsaBoOXKV20MToPkcXvwbISWLEs+64sBq5kFgn2kJDHb1Pry9yrP0dxrCI9RRci7RXKg==
socket.io-client@^4.5.4:
version "4.5.4"
resolved "https://registry.yarnpkg.com/socket.io-client/-/socket.io-client-4.5.4.tgz#d3cde8a06a6250041ba7390f08d2468ccebc5ac9"
integrity sha512-ZpKteoA06RzkD32IbqILZ+Cnst4xewU7ZYK12aS1mzHftFFjpoMz69IuhP/nL25pJfao/amoPI527KnuhFm01g==
dependencies:
"@socket.io/component-emitter" "~3.1.0"
debug "~4.3.2"
engine.io-client "~6.2.3"
socket.io-parser "~4.2.1"
socket.io-parser@~4.2.1:
version "4.2.1"
resolved "https://registry.yarnpkg.com/socket.io-parser/-/socket.io-parser-4.2.1.tgz#01c96efa11ded938dcb21cbe590c26af5eff65e5"
integrity sha512-V4GrkLy+HeF1F/en3SpUaM+7XxYXpuMUWLGde1kSSh5nQMN4hLrbPIkD+otwh6q9R6NOQBN4AMaOZ2zVjui82g==
dependencies:
"@socket.io/component-emitter" "~3.1.0"
debug "~4.3.1"
sockjs@^0.3.24:
version "0.3.24"
resolved "https://registry.yarnpkg.com/sockjs/-/sockjs-0.3.24.tgz#c9bc8995f33a111bea0395ec30aa3206bdb5ccce"
@@ -10304,6 +10343,11 @@ ws@^8.4.2:
resolved "https://registry.yarnpkg.com/ws/-/ws-8.11.0.tgz#6a0d36b8edfd9f96d8b25683db2f8d7de6e8e143"
integrity sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==
ws@~8.2.3:
version "8.2.3"
resolved "https://registry.yarnpkg.com/ws/-/ws-8.2.3.tgz#63a56456db1b04367d0b721a0b80cae6d8becbba"
integrity sha512-wBuoj1BDpC6ZQ1B7DWQBYVLphPWkm8i9Y0/3YdHjHKHiohOJ1ws+3OccDWtH+PoC9DZD5WOTrJvNbWvjS6JWaA==
xml-name-validator@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/xml-name-validator/-/xml-name-validator-3.0.0.tgz#6ae73e06de4d8c6e47f9fb181f78d648ad457c6a"
@@ -10314,6 +10358,11 @@ xmlchars@^2.2.0:
resolved "https://registry.yarnpkg.com/xmlchars/-/xmlchars-2.2.0.tgz#060fe1bcb7f9c76fe2a17db86a9bc3ab894210cb"
integrity sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==
xmlhttprequest-ssl@~2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/xmlhttprequest-ssl/-/xmlhttprequest-ssl-2.0.0.tgz#91360c86b914e67f44dce769180027c0da618c67"
integrity sha512-QKxVRxiRACQcVuQEYFsI1hhkrMlrXHPegbbd1yn9UHOmRxY+si12nQYzri3vbzt8VdTTRviqcKxcyllFas5z2A==
xtend@^4.0.2:
version "4.0.2"
resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"