Merge branch 'master' into feature/Contexts
This commit is contained in:
		@@ -1,8 +1,6 @@
 | 
			
		||||
import { Box, Container, IconButton, Menu, MenuItem, MenuList, Paper, Grow, Popper } from '@material-ui/core';
 | 
			
		||||
import AccountCircle from '@material-ui/icons/AccountCircle';
 | 
			
		||||
import AppBar from '@material-ui/core/AppBar';
 | 
			
		||||
import blue from '@material-ui/core/colors/blue';
 | 
			
		||||
import orange from '@material-ui/core/colors/orange';
 | 
			
		||||
import { positions } from '@material-ui/system';
 | 
			
		||||
import { createMuiTheme, createStyles, makeStyles, Theme } from '@material-ui/core/styles';
 | 
			
		||||
import Toolbar from '@material-ui/core/Toolbar';
 | 
			
		||||
@@ -15,15 +13,19 @@ import Auth from './components/auth/Auth';
 | 
			
		||||
import AuthService from './components/auth/AuthService';
 | 
			
		||||
import { ClickAwayListener } from '@material-ui/core';
 | 
			
		||||
import MapContainer from './components/heatmap/Heatmap';
 | 
			
		||||
import Devices from './components/devices/Devices';
 | 
			
		||||
import { blueGrey, blue, orange, grey } from '@material-ui/core/colors';
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
const theme = createMuiTheme({
 | 
			
		||||
    palette: {
 | 
			
		||||
        primary: {
 | 
			
		||||
            main: blue[900],
 | 
			
		||||
            dark: blueGrey[50],
 | 
			
		||||
        },
 | 
			
		||||
        secondary: {
 | 
			
		||||
            main: orange[200],
 | 
			
		||||
            dark: blueGrey[50],
 | 
			
		||||
        }
 | 
			
		||||
    },
 | 
			
		||||
});
 | 
			
		||||
@@ -49,7 +51,7 @@ function App() {
 | 
			
		||||
    };
 | 
			
		||||
 | 
			
		||||
    const DevicesComponent = () => {
 | 
			
		||||
        return <Typography>Devices</Typography>;
 | 
			
		||||
        return <Devices/>;
 | 
			
		||||
 | 
			
		||||
    };
 | 
			
		||||
    const HeatmapComponent = () => {
 | 
			
		||||
@@ -180,7 +182,7 @@ const DefaultLayout = ({ component: Component, authenticated: Authenticated, isA
 | 
			
		||||
                    </Typography>
 | 
			
		||||
                </Toolbar>
 | 
			
		||||
            </AppBar>
 | 
			
		||||
            <Box zIndex="modal">
 | 
			
		||||
            <Box zIndex="modal" className={classes.box_root}>
 | 
			
		||||
                <Component isAdmin={IsAdmin} {...rest} />
 | 
			
		||||
            </Box>
 | 
			
		||||
        </React.Fragment>
 | 
			
		||||
@@ -189,6 +191,9 @@ const DefaultLayout = ({ component: Component, authenticated: Authenticated, isA
 | 
			
		||||
 | 
			
		||||
const useDefaultLayoutStyles = makeStyles((theme: Theme) =>
 | 
			
		||||
    createStyles({
 | 
			
		||||
        box_root: {
 | 
			
		||||
            color: theme.palette.secondary.dark,
 | 
			
		||||
        },
 | 
			
		||||
        typo: {
 | 
			
		||||
            marginLeft: 'auto',
 | 
			
		||||
            color: 'white',
 | 
			
		||||
 
 | 
			
		||||
@@ -20,7 +20,7 @@ exports.default = {
 | 
			
		||||
        });
 | 
			
		||||
        return service.authenticate(request)
 | 
			
		||||
            .then(function (response) {
 | 
			
		||||
            console.log(response);
 | 
			
		||||
            //console.log(response);
 | 
			
		||||
            sessionStorage.setItem('user', response.tokenType + " " + response.accessToken);
 | 
			
		||||
            sessionStorage.setItem('role', response.userRole);
 | 
			
		||||
            return Promise.resolve();
 | 
			
		||||
 
 | 
			
		||||
@@ -1 +1 @@
 | 
			
		||||
{"version":3,"file":"AuthService.js","sourceRoot":"","sources":["AuthService.ts"],"names":[],"mappings":";;AAAA,2CAA+D;AAE/D,kBAAe;IACX,eAAe;QACX,OAAO,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,IAAI,IAAI,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,SAAS,CAAC;IACnG,CAAC;IAED,OAAO;QACH,OAAO,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,OAAO,CAAC;IACtD,CAAC;IAED,MAAM;QACF,cAAc,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;QAClC,cAAc,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;IACtC,CAAC;IAED,KAAK,EAAL,UAAM,QAAgB,EAAE,QAAgB;QACpC,IAAM,OAAO,GAAG,IAAI,oBAAU,EAAE,CAAC;QAEjC,IAAI,OAAO,GAAG,IAAI,gCAAmB,CAAC;YAClC,QAAQ,EAAE,QAAQ;YAClB,QAAQ,EAAE,QAAQ;SACrB,CAAC,CAAC;QAEH,OAAO,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC;aAC/B,IAAI,CAAC,UAAA,QAAQ;YACV,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;YACtB,cAAc,CAAC,OAAO,CAAC,MAAM,EAAK,QAAQ,CAAC,SAAS,SAAI,QAAQ,CAAC,WAAa,CAAC,CAAC;YAChF,cAAc,CAAC,OAAO,CAAC,MAAM,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC;YAClD,OAAO,OAAO,CAAC,OAAO,EAAE,CAAC;QAC7B,CAAC,CAAC,CAAC;IACX,CAAC;CACJ,CAAA"}
 | 
			
		||||
{"version":3,"file":"AuthService.js","sourceRoot":"","sources":["AuthService.ts"],"names":[],"mappings":";;AAAA,2CAA+D;AAE/D,kBAAe;IACX,eAAe;QACX,OAAO,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,IAAI,IAAI,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,SAAS,CAAC;IACnG,CAAC;IAED,OAAO;QACH,OAAO,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,OAAO,CAAC;IACtD,CAAC;IAED,MAAM;QACF,cAAc,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;QAClC,cAAc,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;IACtC,CAAC;IAED,KAAK,EAAL,UAAM,QAAgB,EAAE,QAAgB;QACpC,IAAM,OAAO,GAAG,IAAI,oBAAU,EAAE,CAAC;QAEjC,IAAI,OAAO,GAAG,IAAI,gCAAmB,CAAC;YAClC,QAAQ,EAAE,QAAQ;YAClB,QAAQ,EAAE,QAAQ;SACrB,CAAC,CAAC;QAEH,OAAO,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC;aAC/B,IAAI,CAAC,UAAA,QAAQ;YACV,wBAAwB;YACxB,cAAc,CAAC,OAAO,CAAC,MAAM,EAAK,QAAQ,CAAC,SAAS,SAAI,QAAQ,CAAC,WAAa,CAAC,CAAC;YAChF,cAAc,CAAC,OAAO,CAAC,MAAM,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC;YAClD,OAAO,OAAO,CAAC,OAAO,EAAE,CAAC;QAC7B,CAAC,CAAC,CAAC;IACX,CAAC;CACJ,CAAA"}
 | 
			
		||||
@@ -24,7 +24,7 @@ export default {
 | 
			
		||||
 | 
			
		||||
        return service.authenticate(request)
 | 
			
		||||
            .then(response => {
 | 
			
		||||
                console.log(response);
 | 
			
		||||
                //console.log(response);
 | 
			
		||||
                sessionStorage.setItem('user', `${response.tokenType} ${response.accessToken}`);
 | 
			
		||||
                sessionStorage.setItem('role', response.userRole);
 | 
			
		||||
                return Promise.resolve();
 | 
			
		||||
 
 | 
			
		||||
@@ -0,0 +1,99 @@
 | 
			
		||||
import React, { Component } from 'react';
 | 
			
		||||
import Accordion from '@material-ui/core/Accordion';
 | 
			
		||||
import { blue, red, yellow } from '@material-ui/core/colors';
 | 
			
		||||
import AccordionSummary from '@material-ui/core/AccordionSummary';
 | 
			
		||||
import AccordionDetails from '@material-ui/core/AccordionDetails';
 | 
			
		||||
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 | 
			
		||||
import { Grid, Typography, Paper } from '@material-ui/core';
 | 
			
		||||
import { withStyles } from '@material-ui/styles';
 | 
			
		||||
import { withRouter } from "react-router";
 | 
			
		||||
 | 
			
		||||
const styles = theme => ({
 | 
			
		||||
    grid_typo: {
 | 
			
		||||
        fontSize: theme.typography.pxToRem(20),
 | 
			
		||||
        fontWeight: theme.typography.fontWeightRegular,
 | 
			
		||||
    },
 | 
			
		||||
    grid_typo_2: {
 | 
			
		||||
        marginLeft: '5px',
 | 
			
		||||
        fontSize: theme.typography.pxToRem(15),
 | 
			
		||||
        fontWeight: theme.typography.fontWeightRegular,
 | 
			
		||||
        color: theme.palette.text.secondary,
 | 
			
		||||
    },
 | 
			
		||||
    grid_item: {
 | 
			
		||||
        width: '100%',
 | 
			
		||||
        marginLeft: '5px',
 | 
			
		||||
    },
 | 
			
		||||
    grid_item_typo: {
 | 
			
		||||
        fontSize: theme.typography.pxToRem(15),
 | 
			
		||||
        fontWeight: theme.typography.fontWeightRegular,
 | 
			
		||||
    },
 | 
			
		||||
    grid_item_typo_2: {
 | 
			
		||||
        marginLeft: '5px',
 | 
			
		||||
        fontSize: theme.typography.pxToRem(15),
 | 
			
		||||
        fontWeight: theme.typography.fontWeightRegular,
 | 
			
		||||
        color: theme.palette.text.secondary,
 | 
			
		||||
    }
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
class DeviceComponent extends Component {
 | 
			
		||||
    constructor(props) {
 | 
			
		||||
        super(props);
 | 
			
		||||
 | 
			
		||||
        this.state = {
 | 
			
		||||
            expanded: "",
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    getColor(status) {
 | 
			
		||||
        if (status == "Online") {
 | 
			
		||||
            return { color: blue[800] };
 | 
			
		||||
        } else if (status == "Offline") {
 | 
			
		||||
            return { color: yellow[800] };
 | 
			
		||||
        } else /* if (device.status == "unknown") */ {
 | 
			
		||||
            return { color: red[800] };
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    componentDidMount() {
 | 
			
		||||
        const id = this.props.match.params.id;
 | 
			
		||||
        this.setState({ expanded: id });
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    render() {
 | 
			
		||||
        const { classes } = this.props;
 | 
			
		||||
        const Sensors = this.props.device.sensors.map((sensor, index) => (
 | 
			
		||||
            <Grid item className={classes.grid_item} key={sensor.id}>
 | 
			
		||||
                <Typography className={classes.grid_item_typo}>Sensor {index}</Typography>
 | 
			
		||||
                <Typography className={classes.grid_item_typo_2}>{sensor.id}</Typography>
 | 
			
		||||
            </Grid>
 | 
			
		||||
        ));
 | 
			
		||||
 | 
			
		||||
        const handleChange = (panel) => (event, isExpanded) => {
 | 
			
		||||
            this.setState({ expanded: isExpanded ? panel : "" });
 | 
			
		||||
        };
 | 
			
		||||
 | 
			
		||||
        return (
 | 
			
		||||
            <Accordion expanded={this.state.expanded === this.props.device.id} onChange={handleChange(this.props.device.id)}>
 | 
			
		||||
                <AccordionSummary
 | 
			
		||||
                    expandIcon={<ExpandMoreIcon />}
 | 
			
		||||
                    aria-controls={"device-panel-/" + this.props.device.id}
 | 
			
		||||
                    id={"device-panel-/" + this.props.device.id}>
 | 
			
		||||
                    <Typography className={classes.grid_typo}>Device {this.props.index}</Typography>
 | 
			
		||||
                    <Typography className={classes.grid_typo_2}>{this.props.device.id}</Typography>
 | 
			
		||||
                </AccordionSummary>
 | 
			
		||||
                    <AccordionDetails>
 | 
			
		||||
                    <Grid className={classes.grid_item}
 | 
			
		||||
                        container
 | 
			
		||||
                        spacing={3}
 | 
			
		||||
                        direction="column"
 | 
			
		||||
                        justify="center"
 | 
			
		||||
                        alignItems="flex-start">
 | 
			
		||||
                            {Sensors}
 | 
			
		||||
                        </Grid>
 | 
			
		||||
                </AccordionDetails>
 | 
			
		||||
            </Accordion>
 | 
			
		||||
        );
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export default withRouter(withStyles(styles)(DeviceComponent));
 | 
			
		||||
@@ -21,7 +21,7 @@ var __extends = (this && this.__extends) || (function () {
 | 
			
		||||
    };
 | 
			
		||||
})();
 | 
			
		||||
Object.defineProperty(exports, "__esModule", { value: true });
 | 
			
		||||
exports.ApiException = exports.SensorStatus = exports.Coordinates = exports.DeviceStatus = exports.Sensor = exports.Device = exports.DeviceService = void 0;
 | 
			
		||||
exports.ApiException = exports.SensorStatus = exports.Coordinates = exports.DeviceStatus = exports.Sensor = exports.Device = void 0;
 | 
			
		||||
var DeviceService = /** @class */ (function () {
 | 
			
		||||
    function DeviceService(baseUrl, http) {
 | 
			
		||||
        this.jsonParseReviver = undefined;
 | 
			
		||||
@@ -462,7 +462,7 @@ var DeviceService = /** @class */ (function () {
 | 
			
		||||
    };
 | 
			
		||||
    return DeviceService;
 | 
			
		||||
}());
 | 
			
		||||
exports.DeviceService = DeviceService;
 | 
			
		||||
exports.default = DeviceService;
 | 
			
		||||
var Device = /** @class */ (function () {
 | 
			
		||||
    function Device(data) {
 | 
			
		||||
        if (data) {
 | 
			
		||||
 
 | 
			
		||||
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							@@ -7,7 +7,7 @@
 | 
			
		||||
//----------------------
 | 
			
		||||
// ReSharper disable InconsistentNaming
 | 
			
		||||
 | 
			
		||||
export class DeviceService {
 | 
			
		||||
export default class DeviceService {
 | 
			
		||||
    private http: { fetch(url: RequestInfo, init?: RequestInit): Promise<Response> };
 | 
			
		||||
    private baseUrl: string;
 | 
			
		||||
    protected jsonParseReviver: ((key: string, value: any) => any) | undefined = undefined;
 | 
			
		||||
 
 | 
			
		||||
@@ -1,5 +1,48 @@
 | 
			
		||||
import React, { Component } from 'react'
 | 
			
		||||
import DeviceService from './DeviceService'
 | 
			
		||||
import Accordion from '@material-ui/core/Accordion';
 | 
			
		||||
import DeviceComponent from './DeviceComponent'
 | 
			
		||||
import SensorComponent from './DeviceComponent'
 | 
			
		||||
import { withStyles } from '@material-ui/styles';
 | 
			
		||||
import { Box } from '@material-ui/core';
 | 
			
		||||
import { grey } from '@material-ui/core/colors';
 | 
			
		||||
 | 
			
		||||
export default class Devices extends React.Component {
 | 
			
		||||
const styles = theme => ({
 | 
			
		||||
    root: {
 | 
			
		||||
        padding: '64px',
 | 
			
		||||
        backgroundColor: theme.palette.primary.dark,
 | 
			
		||||
    }
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
class Devices extends React.Component {
 | 
			
		||||
    constructor(props) {
 | 
			
		||||
        super(props);
 | 
			
		||||
 | 
			
		||||
        this.state = {
 | 
			
		||||
            devices: [],
 | 
			
		||||
        };
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    componentDidMount() {
 | 
			
		||||
        new DeviceService().getall().then(result => {
 | 
			
		||||
            this.setState({ devices: result });
 | 
			
		||||
        }).catch(ex => {
 | 
			
		||||
            console.log(ex);
 | 
			
		||||
        });
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    render() {
 | 
			
		||||
        const { classes } = this.props;
 | 
			
		||||
        const Devices = this.state.devices.map((device, index) => (
 | 
			
		||||
            <DeviceComponent device={device} index={index} key={device.id}/>
 | 
			
		||||
        ));
 | 
			
		||||
 | 
			
		||||
        return (
 | 
			
		||||
            <Box className={classes.root}>
 | 
			
		||||
                {Devices}
 | 
			
		||||
            </Box>
 | 
			
		||||
        );
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export default withStyles(styles)(Devices);
 | 
			
		||||
@@ -0,0 +1,15 @@
 | 
			
		||||
import React, { Component } from 'react';
 | 
			
		||||
import AccordionDetails from '@material-ui/core/AccordionDetails';
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
export default class SensorComponent extends Component {
 | 
			
		||||
    constructor(props) {
 | 
			
		||||
        super(props);
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    render() {
 | 
			
		||||
 | 
			
		||||
        return (
 | 
			
		||||
        );
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
@@ -1,7 +1,7 @@
 | 
			
		||||
/*global google*/
 | 
			
		||||
import GoogleMapReact from 'google-map-react';
 | 
			
		||||
import React, { Component } from 'react';
 | 
			
		||||
import DevicesService, { DeviceService } from '../devices/DeviceService'
 | 
			
		||||
import DeviceService from '../devices/DeviceService'
 | 
			
		||||
import DeviceMarker from './DeviceMarker'
 | 
			
		||||
import { HubConnectionBuilder } from '@microsoft/signalr';
 | 
			
		||||
 | 
			
		||||
@@ -22,7 +22,6 @@ export default class MapContainer extends Component {
 | 
			
		||||
            center: {
 | 
			
		||||
                lat: 48.275939, lng: 21.469640
 | 
			
		||||
            },
 | 
			
		||||
            points: [],
 | 
			
		||||
            heatmapPoints: [],
 | 
			
		||||
            connection: null,
 | 
			
		||||
        }
 | 
			
		||||
@@ -30,7 +29,7 @@ export default class MapContainer extends Component {
 | 
			
		||||
 | 
			
		||||
    handleAllDevicesUpdated(service = null) {
 | 
			
		||||
        if (service === null) {
 | 
			
		||||
            service = new DevicesService();
 | 
			
		||||
            service = new DeviceService();
 | 
			
		||||
        }
 | 
			
		||||
        service.getall().then(result => {
 | 
			
		||||
            this.setState({ devices: result });
 | 
			
		||||
@@ -55,8 +54,7 @@ export default class MapContainer extends Component {
 | 
			
		||||
                console.log('Hub Connected!');
 | 
			
		||||
 | 
			
		||||
                newConnection.on(probability_method_name, (id, date, prob) => {
 | 
			
		||||
                    this.state.points.push({ id, date, prob });
 | 
			
		||||
                    //console.log(method_name + " recieved: [id: " + id + ", date: " + date + ", prob: " + prob + "]");
 | 
			
		||||
                    //console.log(probability_method_name + " recieved: [id: " + id + ", date: " + date + ", prob: " + prob + "]");
 | 
			
		||||
                    if (prob > 0.5) {
 | 
			
		||||
                        var device = this.state.devices.filter(function (x) { return x.id === id })[0]
 | 
			
		||||
                        var newPoint = { lat: device.coordinates.latitude, lng: device.coordinates.longitude };
 | 
			
		||||
 
 | 
			
		||||
@@ -10,7 +10,7 @@ namespace Birdmap.BLL.Services
 | 
			
		||||
{
 | 
			
		||||
    public class DummyDeviceAndInputService : DeviceAndInputServiceBase
 | 
			
		||||
    {
 | 
			
		||||
        private const int numberOfDevices = 10;
 | 
			
		||||
        private const int numberOfDevices = 15;
 | 
			
		||||
 | 
			
		||||
        private const double centerLong = 21.469640;
 | 
			
		||||
        private const double centerLat = 48.275939;
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user