reorganized layout with navbar and two cols

This commit is contained in:
Giulio De Pasquale 2020-12-14 13:55:33 +00:00
parent 119d80a936
commit 3e45135809
5 changed files with 40 additions and 28 deletions

View File

@ -108,15 +108,10 @@ class SymbolStatus:
return self.positions[self.current_tick]
def all_ticks(self) -> List[int]:
return [x for x in range(self.current_tick)]
return [x for x in range(1, self.current_tick + 1)]
def all_prices(self) -> List[float]:
res = []
for x in range(1, self.current_tick):
res.append(self.prices[x])
return res
return list(map(lambda x: self.prices[x], range(1, self.current_tick + 1)))
# Applies strategy and adds position to list
async def add_position(self, position: Position):
@ -247,4 +242,4 @@ class EventHandler:
def registerhandle(handler):
self.any_state.append(handler)
return handler
return registerhandle
return registerhandle

View File

@ -10,9 +10,7 @@
<title>Hello world!</title>
<body class="h-100 d-flex flex-column">
<div id="root" class="my-2 flex-fill d-flex">
</div>
<div id="root" class="d-flex flex-fill"></div>
<!-- <main class="container my-2 border h-100">
<div class="row row-cols-auto justify-content-center my-2" id="statistics">
@ -129,11 +127,6 @@
</footer> -->
<script src="{{ url_for('static', filename='index.js') }}"></script>
<footer class="footer py-3 bg-light border-top">
<div class="container text-center">
<span class="text-muted">Made with ❤️ by the Pepe</span>
</div>
</footer>
</body>
</html>

View File

@ -1,5 +1,5 @@
import React, { Component } from "react";
import { Col, Container, Navbar, Row } from "react-bootstrap";
import { Col, Container, Nav, Navbar, Row } from "react-bootstrap";
import Plot from "react-plotly.js";
import HCard from "./HCard";
import RPlot from "./RPlot";
@ -31,16 +31,40 @@ class App extends Component {
render() {
return (
<Container className="flex-fill border d-flex flex-column">
<Row className="justify-content-center my-2">
<HCard title="Current tick:" content={String(this.state.current_tick)} update={this.state.last_update}></HCard>
<HCard title="Current price:" content={String(this.state.current_price)} update={this.state.last_update}></HCard>
</Row>
<div className="d-flex flex-fill flex-column">
<Navbar bg="light" expand="lg" className="border-bottom">
<Navbar.Brand href="#home">Rustico - BfxBot</Navbar.Brand>
</Navbar>
<Row className="flex-grow-1 border-top border-bottom">
<RPlot />
</Row>
</Container >
<Container fluid className="mt-2 border flex-fill d-flex">
<Row className="flex-fill">
{/* Toolbar column */}
<Col md={4} lg={4} className="border-right">
<Row className="justify-content-center border-bottom py-2">
<HCard title="Current tick:" content={String(this.state.current_tick)} update={this.state.last_update}></HCard>
<HCard title="Current price:" content={String(this.state.current_price)} update={this.state.last_update}></HCard>
</Row>
</Col>
{/* Graph column */}
<Col md={8} lg={8} className="flex-fill">
<div className="border-bottom mt-2">
<h2>Price graph:</h2>
</div>
<RPlot />
</Col>
</Row>
{/* <Row className="flex-grow-1 border-top border-bottom">
<RPlot />
</Row> */}
</Container >
<footer className="footer fixed-bottom py-3 bg-light border-top">
<Container className="text-center">
<span className="text-muted">Made with by the Pepe</span>
</Container>
</footer>
</div>
)
}
}

View File

@ -16,7 +16,7 @@ class HCard extends Component<CardProps> {
render() {
return (
<Card bg="light" style={{ minWidth: "15rem" }}>
<Card bg="light" style={{ minWidth: "15rem" }} className="mx-auto">
<Row className="no-gutters">
<Col md={7} className="border-right my-auto">
<h3 className="text-center">{this.props.title}</h3>

View File

@ -66,7 +66,7 @@ class RPlot extends Component<{}, PlotState> {
displayModeBar: false,
responsive: true,
}}
style={{ width: '90%', height: '90%' }}
style={{ width: '100%', height: '90%' }}
/>
)
}