Skip to content

Commit

Permalink
Performance improvements + added spinner
Browse files Browse the repository at this point in the history
  • Loading branch information
peniqliotuv committed Feb 11, 2018
1 parent 768ab29 commit e9410fa
Show file tree
Hide file tree
Showing 6 changed files with 262 additions and 20 deletions.
3 changes: 1 addition & 2 deletions StockAPI.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,12 +26,11 @@ class StockAPI {
time_period: 10,
};
const qs = queryString.stringify(query);
console.log(qs)
try {
const res = await fetch(`${this.HOST}/query?${qs}`);
const json = await res.json();
const data = json['Technical Analysis: SMA'];
console.log(data)
console.log(`Data for ${symbol} received.`);
/* Transform into [{x: ... y: ...}, {}]*/
return data;
} catch (e) {
Expand Down
6 changes: 3 additions & 3 deletions main.js
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,6 @@ const changeRefreshRate = (rate) => {

const fetchWithAuth = (url, opts) => {
const options = Object.assign({}, opts, { headers: { Authorization: `Token ${RobinHoodAPI._token}` } });
console.log(options)
return fetch(url, options);
};

Expand Down Expand Up @@ -319,9 +318,10 @@ const createPreferencesWindow = () => {

const createStockInfoWindow = async (symbol) => {
if (stockInfoWindow !== null) {
stockInfoWindow.show();
return;
// Don't allow multiple stock info windows
stockInfoWindow.close();
}

stockInfoWindow = new BrowserWindow({
height: 750,
width: 1100,
Expand Down
29 changes: 29 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@
}
},
"devDependencies": {
"devtron": "^1.4.0",
"electron": "~1.7.8",
"electron-builder": "^19.55.2",
"electron-debug": "^1.5.0",
Expand Down
181 changes: 175 additions & 6 deletions styles/chart.css
Original file line number Diff line number Diff line change
@@ -1,10 +1,179 @@
@font-face {
font-family: 'Alte Din';
src: url('../assets/din1451alt.ttf');
}

body {
margin: 20px;
font-family: 'Alte Din', sans-serif!important;
}

.container {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
font-family: 'Alte Din', sans-serif;
letter-spacing: 0.1em;
font-weight: 100;
user-select: none;
}

canvas {
visibility: hidden;
}

/*!
* Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)
* Copyright 2015 Daniel Cardoso <@DanielCardoso>
* Licensed under MIT
*/
.la-line-scale-pulse-out,
.la-line-scale-pulse-out > div {
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.la-line-scale-pulse-out {
display: block;
font-size: 0;
color: #fff;
}
.la-line-scale-pulse-out.la-dark {
color: #333;
}
.la-line-scale-pulse-out > div {
display: inline-block;
float: none;
background-color: currentColor;
border: 0 solid currentColor;
}
.la-line-scale-pulse-out {
width: 40px;
height: 32px;
}
.la-line-scale-pulse-out > div {
width: 4px;
height: 32px;
margin: 2px;
margin-top: 0;
margin-bottom: 0;
border-radius: 0;
-webkit-animation: line-scale-pulse-out .9s infinite cubic-bezier(.85, .25, .37, .85);
-moz-animation: line-scale-pulse-out .9s infinite cubic-bezier(.85, .25, .37, .85);
-o-animation: line-scale-pulse-out .9s infinite cubic-bezier(.85, .25, .37, .85);
animation: line-scale-pulse-out .9s infinite cubic-bezier(.85, .25, .37, .85);
}
.la-line-scale-pulse-out > div:nth-child(3) {
-webkit-animation-delay: -.9s;
-moz-animation-delay: -.9s;
-o-animation-delay: -.9s;
animation-delay: -.9s;
}
.la-line-scale-pulse-out > div:nth-child(2),
.la-line-scale-pulse-out > div:nth-child(4) {
-webkit-animation-delay: -.7s;
-moz-animation-delay: -.7s;
-o-animation-delay: -.7s;
animation-delay: -.7s;
}
.la-line-scale-pulse-out > div:nth-child(1),
.la-line-scale-pulse-out > div:nth-child(5) {
-webkit-animation-delay: -.5s;
-moz-animation-delay: -.5s;
-o-animation-delay: -.5s;
animation-delay: -.5s;
}
.la-line-scale-pulse-out.la-sm {
width: 20px;
height: 16px;
}
.la-line-scale-pulse-out.la-sm > div {
width: 2px;
height: 16px;
margin: 1px;
margin-top: 0;
margin-bottom: 0;
}
.la-line-scale-pulse-out.la-2x {
width: 80px;
height: 64px;
}
.la-line-scale-pulse-out.la-2x > div {
width: 8px;
height: 64px;
margin: 4px;
margin-top: 0;
margin-bottom: 0;
}
.la-line-scale-pulse-out.la-3x {
width: 120px;
height: 96px;
}
.la-line-scale-pulse-out.la-3x > div {
width: 12px;
height: 96px;
margin: 6px;
margin-top: 0;
margin-bottom: 0;
}
/*
* Animation
*/
@-webkit-keyframes line-scale-pulse-out {
0% {
-webkit-transform: scaley(1);
transform: scaley(1);
}
50% {
-webkit-transform: scaley(.3);
transform: scaley(.3);
}
100% {
-webkit-transform: scaley(1);
transform: scaley(1);
}
}
@-moz-keyframes line-scale-pulse-out {
0% {
-moz-transform: scaley(1);
transform: scaley(1);
}
50% {
-moz-transform: scaley(.3);
transform: scaley(.3);
}
100% {
-moz-transform: scaley(1);
transform: scaley(1);
}
}
@-o-keyframes line-scale-pulse-out {
0% {
-o-transform: scaley(1);
transform: scaley(1);
}
50% {
-o-transform: scaley(.3);
transform: scaley(.3);
}
100% {
-o-transform: scaley(1);
transform: scaley(1);
}
}
@keyframes line-scale-pulse-out {
0% {
-webkit-transform: scaley(1);
-moz-transform: scaley(1);
-o-transform: scaley(1);
transform: scaley(1);
}
50% {
-webkit-transform: scaley(.3);
-moz-transform: scaley(.3);
-o-transform: scaley(.3);
transform: scaley(.3);
}
100% {
-webkit-transform: scaley(1);
-moz-transform: scaley(1);
-o-transform: scaley(1);
transform: scaley(1);
}
}
62 changes: 53 additions & 9 deletions views/chart.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,21 +8,31 @@
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.min.js" /> -->
</head>
<body>
<div>
<div class="container">
<div id="loader" style="color: #529B80; position: absolute;" class="la-line-scale-pulse-out la-3x">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<canvas id="stock-chart" width="1025" height="650"></canvas>
</div>
<script>
const { remote, ipcRenderer } = require('electron');
const Chart = require('chart.js');

const Hammer = require('hammerjs');
// const Hammer = require('hammerjs');
const zoom = require('chartjs-plugin-zoom');
console.log(Hammer)
console.log(zoom)

const ctx = document.getElementById('stock-chart');

ipcRenderer.on('data', (event, message) => {
/* Removing the loader */
const loader = document.getElementById('loader');
loader.parentNode.removeChild(loader);
ctx.style.visibility = 'visible';

const { data, symbol } = message;
const stockChart = new Chart(ctx, {
type: 'line',
Expand All @@ -38,32 +48,66 @@
options: {
title: {
display: true,
fontFamily: 'Alte Din',
text: `Simple Moving Average for ${symbol}`,
fontSize: 24,
fontStyle: 'normal',
fontColor: '#50A885',
},
responsive: true,
tooltips: {
titleFontFamily: 'Alte Din',
titleFontSize: 18,
titleMarginBottom: 10,
bodyFontSize: 14,
bodyFontFamily: 'Alte Din',
yPadding: 10,
xPadding: 8,
},
scales: {
yAxes: [{
ticks: {
fontSize: 14,
}
}],
xAxes: [{
type: 'time',
ticks: {
fontSize: 14,
},
time: {
unit: 'day',
// displayFormats: {
// minute: 'h:mm a'
// },
displayFormats: {
day: 'MM/DD'
},
}
}]
},
legend: {
display: false,

},
pan: {
// Boolean to enable panning
enabled: true,

// Panning directions. Remove the appropriate direction to disable
// Eg. 'y' would only allow panning in the y direction
mode: 'x',
},

},

// Container for zoom options
zoom: {
// Boolean to enable zooming
enabled: true,

// Enable drag-to-zoom behavior
drag: true,

// Zooming directions. Remove the appropriate direction to disable
// Eg. 'y' would only allow zooming in the y direction
mode: 'x',

}
}
});
Expand Down

0 comments on commit e9410fa

Please sign in to comment.