auto scrolling working!

This commit is contained in:
Luke Berndt
2021-02-11 21:54:38 -05:00
parent 6f7b86f0cb
commit 25b953d58d
18 changed files with 86 additions and 193 deletions

3
.gitignore vendored
View File

@@ -3,3 +3,6 @@ prod.env
test.env
account/.eslintcache
account/.eslintcache
admin/.eslintcache
frontend/.eslintcache
admin/.eslintcache

File diff suppressed because one or more lines are too long

View File

@@ -22,22 +22,5 @@ RUN mkdir -p /home/app/upload && cp -a /tmp/node_modules /home/app
WORKDIR $HOME/
COPY . $HOME/
#ADD sweep.sh $HOME/sweep.sh
#RUN chmod +x $HOME/sweep.sh
#ADD mycrontab $HOME/mycrontab
#RUN crontab $HOME/mycrontab
#RUN update-rc.d cron defaults
# Add crontab file in the cron directory
#ADD mycrontab /etc/cron.d/sweep-cron
#RUN touch /var/log/cron.log
# Give execution rights on the cron job
#RUN chmod 0644 /etc/cron.d/sweep-cron
# Run the command on container startup
#CMD env > $HOME/env.txt && cron
#CMD cron && node index.js
CMD node index.js

View File

@@ -90,14 +90,6 @@ function isUser(req, res, next) {
}
}
function isLoggedIn(req, res, next) {
if (req.isAuthenticated()) return next();
res.status(401).send({
success: false,
message: "Not Authenticated."
});
};
// -------------------------------------------
@@ -121,27 +113,11 @@ connect()
mongoose.connection.on("error", console.error)
mongoose.connection.on("disconnected", connect)
/*
const WebSocket = require('ws');
const wss = new WebSocket.Server({
server
});*/
var upload = multer({
dest: config.uploadDirectory
});
function isLoggedIn(req, res, next) {
if (req.isAuthenticated()) return next();
res.status(401).send({
success: false,
message: "Not Authenticated."
});
};
var clients = [];
function addSystemClients(req, res, next) {

View File

@@ -1,3 +0,0 @@
# Jobs:
# m h dom mon dow command
0 4 * * * root env - `cat /home/app/env.txt` /home/app/sweep.sh >> /var/log/cron.log 2>&1

View File

@@ -1,81 +0,0 @@
var fs = require('fs');
var path = require('path');
var config = require('./config/config.json');
var mongo = require('mongodb');
var ObjectID = require('mongodb').ObjectID;
mongo.BSONPure = require('bson').BSONPure;
var BSON = mongo.BSONPure;
var MongoClient = require('mongodb').MongoClient,
assert = require('assert');
var db = require('./db');
var findRemoveSync = require('./find-remove');
var util = require('util');
function sweep(){
var base_path = config.mediaDirectory;
var total = 0;
var sysCount = 0;
db.get().collection('systems', function(err, sysCollection) {
var cursor = sysCollection.find();
cursor.each(function(err, item) {
if (item) {
var date = new Date();
var old;
if (item.shortName == "dcfd"){
old = 60*60*24*30;
date.setMonth(date.getMonth() - 1);
} else {
old = 60*60*24*5;
date.setDate(date.getDate() - 5);
}
var local_path = config.mediaDirectory + "/" + item.shortName + "/";
console.log("Sytems: " + local_path + " Date: " + date + " Seconds: " + old);
try {
var result = findRemoveSync(local_path, { age: {seconds: old}, removeEmpty:true, files: "*.*"});
if (result && result.totals) {
result.totals.date = date;
} else {
result = {totals:{fileSize: 0, deletedSize:0, files: 0, deleted:0, date: date}};
}
db.get().collection('system_stats', function(err, statsCollection) {
statsCollection.update({
shortName: item.shortName
}, {
$set: {
"sweep": result.totals
}
}, {
upsert: true
}, function(err, objects) {
if (err) console.warn("Problem adding system stats: " + err.message);
});
});
} catch (e) {
console.log("Error trying to remove: ");
console.log(e);
}
console.log("Deleted: \n");
console.log(util.inspect(result));
sysCount++;
} else {
console.log("Clean Sweep - Systems Processed: " + sysCount);
db.get().close();
}
});
});
}
// Connect to Mongo on start
db.connect(function(err) {
if (err) {
console.log('Unable to connect to Mongo.')
process.exit(1)
} else {
sweep();
}
})

View File

@@ -1,2 +0,0 @@
node /home/app/sweep.js > /home/app/sweep.log

File diff suppressed because one or more lines are too long

View File

@@ -26,7 +26,7 @@
-->
<script src="%REACT_APP_BACKEND_SERVER%/socket.io/socket.io.js"></script>
<script>
const socket = io('%REACT_APP_BACKEND_SERVER%');
window.socket = io('%REACT_APP_BACKEND_SERVER%');
</script>
<title>React Redux App</title>
</head>

View File

@@ -49,6 +49,11 @@ sourceString(call) {
return srcString;
}
componentDidUpdate(){
if (this.props.activeCall) {
console.log("Active call mounted")
}
}
addStar(e) {
e.preventDefault();
e.stopPropagation();
@@ -103,7 +108,7 @@ render() {
talkgroup = this.props.talkgroups[call.talkgroupNum].description;
}
return (
<Table.Row onClick={(e) => this.props.onClick({call: call}, e)} {...rowSelected}>
<Table.Row onClick={(e) => this.props.onClick({call: call}, e)} {...rowSelected}>
<Table.Cell> {call.len} </Table.Cell>
<Table.Cell> {talkgroup} </Table.Cell>
<Table.Cell> {time.toLocaleTimeString()} </Table.Cell>

View File

@@ -48,12 +48,10 @@ class CallPlayer extends React.Component {
this.handleCalendarClose = this.handleCalendarClose.bind(this);
this.handleLiveToggle = this.handleLiveToggle.bind(this);
this.getFilter = this.getFilter.bind(this);
this.callList = React.createRef();
this.socket = window.socket;
this.setupSocket = this.setupSocket.bind(this);
this.endSocket = this.endSocket.bind(this);
this.changeUrl = this.changeUrl.bind(this);
this.currentCallRef = React.createRef();
this.audioRef = React.createRef();
this.state = {
requestMessage: "",
@@ -69,7 +67,6 @@ class CallPlayer extends React.Component {
groupVisible: false,
calendarVisible: false,
supportVisible: false
}
}
@@ -124,11 +121,14 @@ class CallPlayer extends React.Component {
filter.type = "group";
filter.code = this.props.filterGroupId;
break;
default:
case 2:
filter.type = "talkgroup";
filter.code = this.props.filterTalkgroups;
break;
default:
case 0:
filter.type = "all";
filter.code = ""
}
filter.filterStarred = this.props.filterStarred;
return filter;
@@ -167,8 +167,6 @@ class CallPlayer extends React.Component {
this.props.callActions.fetchCalls();
var filter = this.getFilter();
this.startSocket(this.props.shortName, filter.type, filter.code, filter.filterStarred);
//this.socket = setupSocket(this.addCall, this.props.shortName);
}
}
@@ -179,10 +177,13 @@ class CallPlayer extends React.Component {
case 1:
search = search + `filter-type=group&filter-code=${props.filterGroupId}`;
break;
default:
case 2:
search = search + `filter-type=talkgroup&filter-code=${props.filterTalkgroups}`;
break;
default:
case 0:
break;
}
if (props.filterDate) {
if (search.length!==1) {
@@ -250,7 +251,6 @@ class CallPlayer extends React.Component {
const nextCall = this.props.callsById[nextCallId];
var callUrl = nextCall.url;
this.setState({callUrl: callUrl, callId: nextCallId, sourceIndex: 0, isPlaying: true}, () => { audio.playSource(callUrl)}); //scrollToComponent(this.currentCallRef.current);
this.props.callActions.fetchCallInfo( nextCallId);
} else {
@@ -294,7 +294,7 @@ class CallPlayer extends React.Component {
this.props.callActions.setShortName(this.props.shortName);
var filter = {
filterDate: false,
filterType: "all",
filterType: 0, // this is "all"
filterTalkgroups: [],
filterGroupId: false,
filterStarred: false,
@@ -375,6 +375,7 @@ class CallPlayer extends React.Component {
}
return true
}
componentWillUpdate(nextProps) {
if (!this.props.groups && nextProps.groups) {
if (!this.state.urlOptions && (nextProps.groups.length > 0 )) {
@@ -384,8 +385,6 @@ class CallPlayer extends React.Component {
}
}
const filterChanged = (nextProps.filterType !== this.props.filterType) || !this.compareArray(nextProps.filterTalkgroups, this.props.filterTalkgroups) || (nextProps.filterGroupId !== this.props.filterGroupId) || (nextProps.filterDate !== this.props.filterDate) || (nextProps.filterStarred !== this.props.filterStarred);
if (filterChanged) {
var typeString = 'all';
@@ -396,11 +395,15 @@ class CallPlayer extends React.Component {
typeString = 'group';
filterCode = nextProps.filterGroupId;
break;
default:
case 2:
typeString = 'talkgroup';
filterCode = nextProps.filterTalkgroups;
break;
default:
case 0:
typeString = "all";
filterCode = '';
break;
}
this.updateUri(nextProps);
@@ -423,17 +426,22 @@ class CallPlayer extends React.Component {
this.setState({callUrl: call.url });
}
}
}
componentDidUpdate() {
componentDidUpdate(prevProps, prevState) {
const {contextRef} = this.state
//console.log( contextRef.clientHeight - this.prevHeight );
if (this.autoScroll) {
this.autoScroll = false;
window.scrollBy(0, contextRef.clientHeight - this.prevHeight);
}
}
if (this.state.callId != prevState.callId) {
/*this.currentCallRef.current.scrollIntoView({
behavior: "smooth",
block: "start",
});*/
}
}
//https://stackoverflow.com/questions/36559661/how-can-i-dispatch-from-child-components-in-react-redux
//https://stackoverflow.com/questions/42597602/react-onclick-pass-event-with-parameter
@@ -467,10 +475,13 @@ class CallPlayer extends React.Component {
case 1:
filterLabel = "Group"
break;
default:
case 2:
filterLabel = "Talkgroups"
break;
default:
case 0:
filterLabel = "All"
}
/* if (this.props.calls) {
var callRows = calls.map((call) =>
@@ -484,10 +495,10 @@ class CallPlayer extends React.Component {
<GroupModal shortName={this.props.shortName} open={this.state.groupVisible} onClose={this.handleGroupClose}/>
<SupportModal open={this.state.supportVisible} onClose={this.handleSupportClose}/>
<Sidebar as={Menu} animation='overlay' inverted vertical visible={sidebarOpened}
onClick={this.handlePusherClick} duration={250}>
<Menu.Item>
<span> </span><Icon name="close" onClick={this.handlePusherClick} inverted={true} link={true} size="large"/></Menu.Item>
<Link to="/"><Menu.Item>Home</Menu.Item></Link>
onClick={this.handlePusherClick} duration={50} width='thin'>
<Menu.Item onClick={this.handlePusherClick} >
<span> </span><Icon name="close" inverted={true} link={true} size='small'/></Menu.Item>
<Link to="/"><Menu.Item link>Home</Menu.Item></Link>
<Link to="/systems"><Menu.Item link>Systems</Menu.Item></Link>
<Link to="/about"><Menu.Item link>About</Menu.Item></Link>
</Sidebar>
@@ -535,7 +546,7 @@ class CallPlayer extends React.Component {
</Sidebar.Pusher>
</Sidebar.Pushable>
<Waypoint onEnter={this.loadOlderCalls}/>
<Rail position='right' className="desktop-only" dimmed={sidebarOpened}>
<Rail position='right' className="desktop-only" dimmed={sidebarOpened ? "true" : "false"} >
<Sticky context={contextRef} offset={60}>
<CallInfo call={currentCall} header={callInfoHeader} />
</Sticky>

View File

@@ -66,11 +66,11 @@ handleDone(event) {
}
}
componentWillUpdate(nextProps) {
componentDidUpdate(prevProps) {
const filterChanged = ((nextProps.selectedTalkgroups !== this.props.selectedTalkgroups) || (nextProps.selectedGroup !== this.props.selectedGroup));
const filterChanged = ((prevProps.selectedTalkgroups !== this.props.selectedTalkgroups) || (prevProps.selectedGroup !== this.props.selectedGroup));
if (filterChanged) {
this.setState({selectedTalkgroup: nextProps.selectedTalkgroups, selectedGroup: nextProps.selectedGroup, activeTab: nextProps.activeTab});
this.setState({selectedTalkgroup: prevProps.selectedTalkgroups, selectedGroup: prevProps.selectedGroup, activeTab: prevProps.activeTab});
}
}

View File

@@ -35,11 +35,11 @@ handleDone(event) {
}
}
componentWillUpdate(nextProps) {
componentDidUpdate(prevProps) {
const filterChanged = (nextProps.selectedGroup !== this.props.selectedGroup);
const filterChanged = (prevProps.selectedGroup !== this.props.selectedGroup);
if (filterChanged) {
this.setState({ selectedGroup: nextProps.selectedGroup});
this.setState({ selectedGroup: this.props.selectedGroup});
}
}

View File

@@ -3,19 +3,38 @@ import CallItem from "./CallItem";
import {
Icon,
Table,
Ref
} from "semantic-ui-react";
import "./CallPlayer.css";
// ----------------------------------------------------
class ListCalls extends React.Component {
constructor(props) {
super(props);
this.handleCurrentCallRef = this.handleCurrentCallRef.bind(this);
//this.currentCallRef = React.createRef();
}
handleCurrentCallRef(ref) {
this.currentCallRef = ref
console.log("Setting it")
}
componentDidUpdate(prevProps, prevState) {
if (this.currentCallRef && this.props.activeCallId && (this.props.activeCallId != prevProps.activeCallId)) {
this.currentCallRef.scrollIntoView({
behavior: "smooth",
block: "center",
});
}
}
//https://stackoverflow.com/questions/36559661/how-can-i-dispatch-from-child-components-in-react-redux
//https://stackoverflow.com/questions/42597602/react-onclick-pass-event-with-parameter
render() {
return (
<Table id="calls" unstackable>
<Table id="calls" unstackable >
<Table.Header >
<Table.Row>
<Table.HeaderCell>Len</Table.HeaderCell>
@@ -24,9 +43,16 @@ class ListCalls extends React.Component {
<Table.HeaderCell><Icon name='star' /></Table.HeaderCell>
</Table.Row>
</Table.Header>
<Table.Body>
{this.props.callsAllIds.map((callId, index) => <CallItem activeCall={callId === this.props.activeCallId ? true : false} call={this.props.callsById[callId]} talkgroups={this.props.talkgroups} key={index} onClick={this.props.playCall}/>)}
<Table.Body >
{this.props.callsAllIds.map((callId, index) => {
if (callId === this.props.activeCallId) {
return (<Ref innerRef={this.handleCurrentCallRef}><CallItem activeCall={true} call={this.props.callsById[callId]} talkgroups={this.props.talkgroups} key={index} onClick={this.props.playCall}/></Ref>)
} else {
return <CallItem activeCall={false} call={this.props.callsById[callId]} talkgroups={this.props.talkgroups} key={index} onClick={this.props.playCall}/>
}
})
}
</Table.Body>
</Table>

View File

@@ -65,8 +65,8 @@ class MediaPlayer extends React.Component {
});
}
componentWillUpdate(nextProps) {
if (nextProps.call && (nextProps.call !== this.props.call)) {
componentDidUpdate(prevProps) {
if (this.props.call && (prevProps.call !== this.props.call)) {
this.setState({
sourceIndex: 0
});

View File

@@ -10,10 +10,11 @@ import thunk from 'redux-thunk';
export const history = createBrowserHistory()
export default function configureStore(preloadedState) {
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(
createRootReducer(history), // root reducer with router state
preloadedState,
compose(
preloadedState,
composeEnhancers(
applyMiddleware(
routerMiddleware(history), // for dispatching history actions
thunk,

View File

@@ -17,7 +17,6 @@ MAINTAINER Luke Berndt <lukekb@gmail.com>
# Add main NGINX config
RUN mkdir -p /app
ADD trim.js /app
ADD totals.js /app
ADD init_test_db.js /app
ADD upgrade_db_admin.js /app

View File

@@ -1,25 +0,0 @@
db = db.getMongo().getDB( "scanner" );
var bulkRemove = db.calls.initializeUnorderedBulkOp()
var short_date = new Date();
db.systems.find().forEach(
function(system){
var date = new Date();
var total =0;
if (system.planType == 10){
date.setMonth(date.getDate() - 30);
} else {
date.setDate(date.getDate() - 7);
}
print(system.shortName);
bulkRemove.find({"time":{$lt: date}, "shortName": system.shortName}).remove();
});
//bulkInsert.execute()
var results = bulkRemove.execute();
print("Removed: " + results.nRemoved);