Skip to content

GitLab

Commit d9370da2 authored by M2947's avatar M2947 😎
Browse files

update

parent 2ed8cfac
Pipeline #243043 canceled with stages
Expand all Show whitespace changes
Inline Side-by-side
.DS_Store
View file @ d9370da2
No preview for this file type
Tavara- raskaan liikenne/frontend/traffic/package-lock.json
View file @ d9370da2
......@@ -1117,6 +1117,11 @@
"resolved": "https://registry.npmjs.org/@csstools/normalize.css/-/normalize.css-10.1.0.tgz",
"integrity": "sha512-ij4wRiunFfaJxjB0BdrYHIH8FxBJpOwNPhhAcunlmPdXudL1WQV1qoP9un6JsEBAgQH+7UXyyjh0g7jTxXK6tg=="
},
"@emotion/hash": {
"version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
"integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow=="
},
"@hapi/address": {
"version": "2.1.4",
"resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.1.4.tgz",
......@@ -1342,6 +1347,82 @@
"@types/yargs": "^13.0.0"
}
},
"@material-ui/core": {
"version": "4.11.0",
"resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.11.0.tgz",
"integrity": "sha512-bYo9uIub8wGhZySHqLQ833zi4ZML+XCBE1XwJ8EuUVSpTWWG57Pm+YugQToJNFsEyiKFhPh8DPD0bgupz8n01g==",
"requires": {
"@babel/runtime": "^7.4.4",
"@material-ui/styles": "^4.10.0",
"@material-ui/system": "^4.9.14",
"@material-ui/types": "^5.1.0",
"@material-ui/utils": "^4.10.2",
"@types/react-transition-group": "^4.2.0",
"clsx": "^1.0.4",
"hoist-non-react-statics": "^3.3.2",
"popper.js": "1.16.1-lts",
"prop-types": "^15.7.2",
"react-is": "^16.8.0",
"react-transition-group": "^4.4.0"
}
},
"@material-ui/icons": {
"version": "4.9.1",
"resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.9.1.tgz",
"integrity": "sha512-GBitL3oBWO0hzBhvA9KxqcowRUsA0qzwKkURyC8nppnC3fw54KPKZ+d4V1Eeg/UnDRSzDaI9nGCdel/eh9AQMg==",
"requires": {
"@babel/runtime": "^7.4.4"
}
},
"@material-ui/styles": {
"version": "4.10.0",
"resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.10.0.tgz",
"integrity": "sha512-XPwiVTpd3rlnbfrgtEJ1eJJdFCXZkHxy8TrdieaTvwxNYj42VnnCyFzxYeNW9Lhj4V1oD8YtQ6S5Gie7bZDf7Q==",
"requires": {
"@babel/runtime": "^7.4.4",
"@emotion/hash": "^0.8.0",
"@material-ui/types": "^5.1.0",
"@material-ui/utils": "^4.9.6",
"clsx": "^1.0.4",
"csstype": "^2.5.2",
"hoist-non-react-statics": "^3.3.2",
"jss": "^10.0.3",
"jss-plugin-camel-case": "^10.0.3",
"jss-plugin-default-unit": "^10.0.3",
"jss-plugin-global": "^10.0.3",
"jss-plugin-nested": "^10.0.3",
"jss-plugin-props-sort": "^10.0.3",
"jss-plugin-rule-value-function": "^10.0.3",
"jss-plugin-vendor-prefixer": "^10.0.3",
"prop-types": "^15.7.2"
}
},
"@material-ui/system": {
"version": "4.9.14",
"resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.9.14.tgz",
"integrity": "sha512-oQbaqfSnNlEkXEziDcJDDIy8pbvwUmZXWNqlmIwDqr/ZdCK8FuV3f4nxikUh7hvClKV2gnQ9djh5CZFTHkZj3w==",
"requires": {
"@babel/runtime": "^7.4.4",
"@material-ui/utils": "^4.9.6",
"csstype": "^2.5.2",
"prop-types": "^15.7.2"
}
},
"@material-ui/types": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz",
"integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A=="
},
"@material-ui/utils": {
"version": "4.10.2",
"resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.10.2.tgz",
"integrity": "sha512-eg29v74P7W5r6a4tWWDAAfZldXIzfyO1am2fIsC39hdUUHm/33k6pGOKPbgDjg/U/4ifmgAePy/1OjkKN6rFRw==",
"requires": {
"@babel/runtime": "^7.4.4",
"prop-types": "^15.7.2",
"react-is": "^16.8.0"
}
},
"@mrmlnc/readdir-enhanced": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz",
......@@ -1750,6 +1831,14 @@
"@types/react": "*"
}
},
"@types/react-transition-group": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.0.tgz",
"integrity": "sha512-/QfLHGpu+2fQOqQaXh8MG9q03bFENooTb/it4jr5kKaZlDQfWvjqWZg48AwzPVMBHlRuTRAY7hRHCEOXz5kV6w==",
"requires": {
"@types/react": "*"
}
},
"@types/stack-utils": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-1.0.1.tgz",
......@@ -3687,6 +3776,11 @@
"shallow-clone": "^0.1.2"
}
},
"clsx": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/clsx/-/clsx-1.1.1.tgz",
"integrity": "sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA=="
},
"co": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
......@@ -4186,6 +4280,15 @@
}
}
},
"css-vendor": {
"version": "2.0.8",
"resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.8.tgz",
"integrity": "sha512-x9Aq0XTInxrkuFeHKbYC7zWY8ai7qJ04Kxd9MnvbC1uO5DagxoHQjm4JvG+vCdXOoFtCjbL2XSZfxmoYa9uQVQ==",
"requires": {
"@babel/runtime": "^7.8.3",
"is-in-browser": "^1.0.2"
}
},
"css-what": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/css-what/-/css-what-3.3.0.tgz",
......@@ -6594,6 +6697,11 @@
"resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
"integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM="
},
"hyphenate-style-name": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz",
"integrity": "sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ=="
},
"iconv-lite": {
"version": "0.4.24",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
......@@ -6962,6 +7070,11 @@
"is-extglob": "^2.1.1"
}
},
"is-in-browser": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/is-in-browser/-/is-in-browser-1.1.3.tgz",
"integrity": "sha1-Vv9NtoOgeMYILrldrX3GLh0E+DU="
},
"is-number": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
......@@ -7819,6 +7932,84 @@
"verror": "1.10.0"
}
},
"jss": {
"version": "10.3.0",
"resolved": "https://registry.npmjs.org/jss/-/jss-10.3.0.tgz",
"integrity": "sha512-B5sTRW9B6uHaUVzSo9YiMEOEp3UX8lWevU0Fsv+xtRnsShmgCfIYX44bTH8bPJe6LQKqEXku3ulKuHLbxBS97Q==",
"requires": {
"@babel/runtime": "^7.3.1",
"csstype": "^2.6.5",
"is-in-browser": "^1.1.3",
"tiny-warning": "^1.0.2"
}
},
"jss-plugin-camel-case": {
"version": "10.3.0",
"resolved": "https://registry.npmjs.org/jss-plugin-camel-case/-/jss-plugin-camel-case-10.3.0.tgz",
"integrity": "sha512-tadWRi/SLWqLK3EUZEdDNJL71F3ST93Zrl9JYMjV0QDqKPAl0Liue81q7m/nFUpnSTXczbKDy4wq8rI8o7WFqA==",
"requires": {
"@babel/runtime": "^7.3.1",
"hyphenate-style-name": "^1.0.3",
"jss": "^10.3.0"
}
},
"jss-plugin-default-unit": {
"version": "10.3.0",
"resolved": "https://registry.npmjs.org/jss-plugin-default-unit/-/jss-plugin-default-unit-10.3.0.tgz",
"integrity": "sha512-tT5KkIXAsZOSS9WDSe8m8lEHIjoEOj4Pr0WrG0WZZsMXZ1mVLFCSsD2jdWarQWDaRNyMj/I4d7czRRObhOxSuw==",
"requires": {
"@babel/runtime": "^7.3.1",
"jss": "^10.3.0"
}
},
"jss-plugin-global": {
"version": "10.3.0",
"resolved": "https://registry.npmjs.org/jss-plugin-global/-/jss-plugin-global-10.3.0.tgz",
"integrity": "sha512-etYTG/y3qIR/vxZnKY+J3wXwObyBDNhBiB3l/EW9/pE3WHE//BZdK8LFvQcrCO48sZW1Z6paHo6klxUPP7WbzA==",
"requires": {
"@babel/runtime": "^7.3.1",
"jss": "^10.3.0"
}
},
"jss-plugin-nested": {
"version": "10.3.0",
"resolved": "https://registry.npmjs.org/jss-plugin-nested/-/jss-plugin-nested-10.3.0.tgz",
"integrity": "sha512-qWiEkoXNEkkZ+FZrWmUGpf+zBsnEOmKXhkjNX85/ZfWhH9dfGxUCKuJFuOWFM+rjQfxV4csfesq4hY0jk8Qt0w==",
"requires": {
"@babel/runtime": "^7.3.1",
"jss": "^10.3.0",
"tiny-warning": "^1.0.2"
}
},
"jss-plugin-props-sort": {
"version": "10.3.0",
"resolved": "https://registry.npmjs.org/jss-plugin-props-sort/-/jss-plugin-props-sort-10.3.0.tgz",
"integrity": "sha512-boetORqL/lfd7BWeFD3K+IyPqyIC+l3CRrdZr+NPq7Noqp+xyg/0MR7QisgzpxCEulk+j2CRcEUoZsvgPC4nTg==",
"requires": {
"@babel/runtime": "^7.3.1",
"jss": "^10.3.0"
}
},
"jss-plugin-rule-value-function": {
"version": "10.3.0",
"resolved": "https://registry.npmjs.org/jss-plugin-rule-value-function/-/jss-plugin-rule-value-function-10.3.0.tgz",
"integrity": "sha512-7WiMrKIHH3rwxTuJki9+7nY11r1UXqaUZRhHvqTD4/ZE+SVhvtD5Tx21ivNxotwUSleucA/8boX+NF21oXzr5Q==",
"requires": {
"@babel/runtime": "^7.3.1",
"jss": "^10.3.0",
"tiny-warning": "^1.0.2"
}
},
"jss-plugin-vendor-prefixer": {
"version": "10.3.0",
"resolved": "https://registry.npmjs.org/jss-plugin-vendor-prefixer/-/jss-plugin-vendor-prefixer-10.3.0.tgz",
"integrity": "sha512-sZQbrcZyP5V0ADjCLwUA1spVWoaZvM7XZ+2fSeieZFBj31cRsnV7X70FFDerMHeiHAXKWzYek+67nMDjhrZAVQ==",
"requires": {
"@babel/runtime": "^7.3.1",
"css-vendor": "^2.0.8",
"jss": "^10.3.0"
}
},
"jsx-ast-utils": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-2.3.0.tgz",
......@@ -9317,6 +9508,11 @@
"ts-pnp": "^1.1.6"
}
},
"popper.js": {
"version": "1.16.1-lts",
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz",
"integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA=="
},
"portfinder": {
"version": "1.0.26",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.26.tgz",
......
Tavara- raskaan liikenne/frontend/traffic/package.json
View file @ d9370da2
......@@ -3,6 +3,8 @@
"version": "0.1.0",
"private": true,
"dependencies": {
"@material-ui/core": "^4.11.0",
"@material-ui/icons": "^4.9.1",
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
......
Tavara- raskaan liikenne/frontend/traffic/src/App.css
View file @ d9370da2
.oneDayGraphComponent{
display: flex;
.App {
text-align: center;
background-color: rgba(243, 243, 243, 0.904);
}
.grid-container {
display: grid;
grid-template-columns: 30% 600px ;
grid-auto-rows: 100px;
column-gap: 4px;
row-gap: 4px;
padding: 50px;
justify-content: center;
margin: auto;
.navbarmenu{
background-color: #0051adde;
padding: 1em 2.5em;
}
.grid-item-heading {
grid-column-start: 1;
grid-column-end: 3;
padding: 0.7em;
background-color: rgb(255, 255, 255);
border-radius: 6px;
text-align: left;
font-size: 2em;
.nav-brand{
font-weight: bold;
color: #cc3b31 ;
box-shadow: 5px 5px 10px #c4c4c4c0;
}
.grid-item-form {
grid-column-start: 1;
grid-row-start: 2;
grid-row-end: 12;
padding: 1.5em;
background-color: rgb(255, 255, 255);
border-radius: 6px;
text-align: left;
font-size: 18px;
color: rgba(15, 48, 75, 0.685) ;
box-shadow: 5px 5px 10px #c4c4c4c0;
}
.grid-item-info {
margin-top: 2.5em;
font-size: 1.5em;
margin-right: 2em;
}
.link{
.grid-item-filter {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 2;
grid-row-end: 4;
padding: 1em 2em;
display: flex;
background-color: rgb(255, 255, 255);
border-radius: 6px;
text-align: left;
align-content: center;
font-weight: bold;
font-size: 1em;
color: rgba(15, 48, 75, 0.685) ;
box-shadow: 5px 5px 10px #c4c4c4c0;
}
.grid-item-graph1 {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 4;
grid-row-end: 8;
display: flex;
background-color: rgb(255, 255, 255);
border-radius: 6px;
text-align: center;
align-content: center;
font-size: 1em;
color: rgba(15, 48, 75, 0.685) ;
box-shadow: 5px 5px 10px #c4c4c4c0;
}
.grid-item-graph2 {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 8;
grid-row-end: 12;
display: flex;
background-color: rgb(255, 255, 255);
border-radius: 6px;
text-align: left;
font-size: 1em;
color: rgba(15, 48, 75, 0.685) ;
box-shadow: 5px 5px 10px #c4c4c4c0;
}
.grid-item-graph-child{
margin: auto;
.navbar-dark .navbar-nav .nav-link{
color: rgb(250, 250, 250);
}
.navIcons{
.App {
text-align: center;
background-color: rgb(236, 236, 236);
margin-top:7px ;
margin-right: 3px;
color: aliceblue;
float: left;
}
.navbarmenu{
background-color: #b3403a;
padding: 1em 2.5em;
@media only screen and (max-width: 975px) {
.App {
text-align: left;
}
}
\ No newline at end of file
.nav-brand{
font-weight: bolder;
font-size: 2em;
margin-right: 2em;
}
.link{
font-weight: bold;
font-size: 1.2em;
}
.nav-link {
color: wheat;
}
Tavara- raskaan liikenne/frontend/traffic/src/App.js
View file @ d9370da2
import React from "react";
import Navbar from "react-bootstrap/Navbar"
import Nav from "react-bootstrap/Nav"
import Navbar from "react-bootstrap/Navbar";
import Nav from "react-bootstrap/Nav";
import NavDropdown from "react-bootstrap/NavDropdown"
import Home from "@material-ui/icons/HomeRounded";
import Car from '@material-ui/icons/DirectionsCarRounded';
import Boat from '@material-ui/icons/DirectionsBoatRounded';
import Train from '@material-ui/icons/TrainRounded';
import Compare from '@material-ui/icons/CompareArrowsSharp';
import Graph from '@material-ui/icons/TimelineRounded';
//import NavDropdown from "react-bootstrap/NavDropdown"
import { Route, BrowserRouter as Router } from "react-router-dom";
import OneDayGraph from './components/OneDayGraph_v2';
import OneDayGraph from "./components/OneDayGraph_v2";
import MultipleDayGraph from "./components/MultipleDayGraph";
import Compare2Days from "./components/Compare2Days";
import CompareMultipleDays from "./components/CompareMultipleDays";
import "bootstrap/dist/css/bootstrap.min.css";
import "./App.css";
......@@ -20,25 +29,115 @@ function App() {
<div className="App">
<Router>
<Navbar expand="lg" className="navbarmenu" variant="dark">
<Navbar.Brand className="nav-brand" href="/">Traffic Analysis</Navbar.Brand>
<Navbar.Brand className="nav-brand" href="/">
Traffic Analysis
</Navbar.Brand>
<Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="mr-auto" style={{color : '#ffe6e3'}} >
<Nav.Link className="link" href="/">Home</Nav.Link>
<Nav.Link className="link" href="/onedaygraph">One Day Analysis</Nav.Link>
<Nav.Link className="link" href="/multipledaygraph">Multiple Day Analysis</Nav.Link>
</Nav>
</Navbar.Collapse>
</Navbar>
<Nav className="mr-auto" style={{ color: "red" }}>
<div style={{padding:5, marginRight:20}}>
<Nav.Link className="link" href="/">
<Home className="navIcons" style={{marginTop:0}}/>
Home
</Nav.Link>
</div>
<div style={{padding:5, marginRight:30}}>
<Car className="navIcons" />
<NavDropdown title="Vehicles" id="basic-nav-dropdown">
<Route exact path="/" component={OneDayGraph} />
<Route path="/onedaygraph" component={OneDayGraph} />
<Route path="/multipledaygraph" component={MultipleDayGraph} />
</Router>
<NavDropdown.Item href="/vehicles/onedaygraph">
<Graph style={{paddingRight:7, color:"#b3403a"}} />
One day analysis
</NavDropdown.Item>
<NavDropdown.Item href="/vehicles/multipledaygraph">
<Graph style={{paddingRight:7, color:"#b3403a"}} />
Multiple days analysis
</NavDropdown.Item>
<NavDropdown.Divider />
<NavDropdown.Item href="/vehicles/compare2days">
<Compare style={{paddingRight:7, color:"#b3403a"}} />
Compare 2 days
</NavDropdown.Item>
<NavDropdown.Item href="/vehicles/comparemultipledays">
<Compare style={{paddingRight:7, color:"#b3403a"}} />
Compare multiple days
</NavDropdown.Item>
</NavDropdown>
</div>
<div style={{padding:5, marginRight:30}}>
<Train className="navIcons" />
<NavDropdown title="Trains" id="basic-nav-dropdown">
<NavDropdown.Item href="">
<Graph style={{paddingRight:7, color:"#b3403a"}} />
comming soon
</NavDropdown.Item>
<NavDropdown.Item href="">
<Graph style={{paddingRight:7, color:"#b3403a"}} />
comming soon
</NavDropdown.Item>
<NavDropdown.Divider />
<NavDropdown.Item href="">
<Compare style={{paddingRight:7, color:"#b3403a"}} />
comming soon
</NavDropdown.Item>
<NavDropdown.Item href="">
<Compare style={{paddingRight:7, color:"#b3403a"}} />
comming soon
</NavDropdown.Item>
</NavDropdown>
</div>
<div style={{padding:5, marginRight:30}}>
<Boat className="navIcons" />
<NavDropdown title="Ships" id="basic-nav-dropdown">
<NavDropdown.Item href="">
<Graph style={{paddingRight:7, color:"#b3403a"}} />
comming soon
</NavDropdown.Item>
<NavDropdown.Item href="">
<Graph style={{paddingRight:7, color:"#b3403a"}} />
comming soon
</NavDropdown.Item>
<NavDropdown.Divider />
<NavDropdown.Item href="">
<Compare style={{paddingRight:7, color:"#b3403a"}} />
comming soon
</NavDropdown.Item>
<NavDropdown.Item href="">
<Compare style={{paddingRight:7, color:"#b3403a"}} />
comming soon
</NavDropdown.Item>
</NavDropdown>
</div>
</Nav>
</Navbar.Collapse>
</Navbar>
<div className="container-liquid">
<Route exact path="/" component={CompareMultipleDays} />
<Route path="/vehicles/onedaygraph" component={OneDayGraph} />
<Route path="/vehicles/multipledaygraph" component={MultipleDayGraph} />
<Route path="/vehicles/compare2days" component={Compare2Days} />
<Route path="/vehicles/comparemultipledays" component={CompareMultipleDays} />
</div>
</Router>
</div>
);