You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This repo is archived. You can view files and clone it, but cannot push or open issues/pull-requests.

137 lines
5.3 KiB

<html>
<head>
<link rel="stylesheet" src="/static/css/noty.css" />
<link rel="stylesheet" src="/static/css/noty-relax.css" />
</head>
<body>
<div id="container"></div>
</body>
</html>
<script src="/static/js/react.min.js"></script>
<script src="/static/js/react-dom.min.js"></script>
<script src="/static/js/babel.min.js"></script>
<script src="/static/js/noty.js"></script>
<script type="text/babel">
'use strict';
const e = React.createElement;
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
looping: false
}
}
// new Noty({
// theme: 'relax',
// layout: 'topCenter',
// text: 'yo doggy',
// timeout: 4500
// }).show();
render() {
let updateAllData;
let storeMarketData;
let storeBalances;
let storeBitcoinPrice;
let storeOrderStatuses;
let storeTradeHistory;
function getAllData() {
console.log('updating data');
fetch('{{ url_for("api.get_ticker_data") }}')
.then((response) => response.json())
.then((res) => {
document.getElementById('get_ticker_data').innerHTML = JSON.stringify(res);
});
fetch('{{ url_for("api.get_balances") }}')
.then((response) => response.json())
.then((res) => {
document.getElementById('get_balances').innerHTML = JSON.stringify(res)
});
fetch('{{ url_for("api.get_bitcoin_price") }}')
.then((response) => response.json())
.then((res) => {
document.getElementById('get_bitcoin_price').innerHTML = JSON.stringify(res)
});
fetch('{{ url_for("api.get_orders") }}')
.then((response) => response.json())
.then((res) => {
document.getElementById('get_orders').innerHTML = JSON.stringify(res)
});
fetch('{{ url_for("api.get_trade_history") }}')
.then((response) => response.json())
.then((res) => {
document.getElementById('get_trade_history').innerHTML = JSON.stringify(res)
});
}
if (this.state.looping) {
storeMarketData = setInterval(function() {
console.log('updating ticker data');
fetch('{{ url_for("tasks.store_ticker_data") }}');
}, 30000);
storeBalances = setInterval(function() {
console.log('storing balances');
fetch('{{ url_for("tasks.store_balances") }}');
}, 50000);
storeBitcoinPrice = setInterval(function() {
console.log('storing bitcoin price');
fetch('{{ url_for("tasks.store_bitcoin_price") }}');
}, 300000);
storeOrderStatuses = setInterval(function() {
console.log('storing order statuses');
fetch('{{ url_for("tasks.store_orders") }}');
}, 30000);
storeTradeHistory = setInterval(function() {
console.log('storing trade history');
fetch('{{ url_for("tasks.store_trade_history") }}');
}, 60000);
updateAllData = setInterval(getAllData, 10000);
}
return(
<div>
<h1>we trade a lil {{ trade_currency | lower }}</h1>
{this.state.looping && (
<div>
<p>market making is started</p>
<button onClick={() => {
this.setState({...this.state, looping: false});
clearInterval(storeMarketData);
clearInterval(storeBalances);
clearInterval(storeBitcoinPrice);
clearInterval(storeOrderStatuses);
clearInterval(storeTradeHistory);
clearInterval(updateAllData);
}}>Stop</button>
</div>
) || (
<div>
<p>market making is stopped</p>
<button onClick={() => {
this.setState({...this.state, looping: true});
getAllData();
}}>Start</button>
</div>
)}
<p id="get_ticker_data"></p>
<p id="get_balances"></p>
<p id="get_bitcoin_price"></p>
<p id="get_orders"></p>
<p id="get_trade_history"></p>
</div>
)
}
}
const domContainer = document.querySelector('#container');
const root = ReactDOM.createRoot(domContainer);
root.render(e(App));
</script>