Passable weight chart.

This commit is contained in:
Ian Gulliver
2016-01-05 23:52:32 -08:00
parent d26cc3c4ab
commit 2d319431f3
3 changed files with 68 additions and 4 deletions

View File

@@ -311,6 +311,13 @@ babyStatsDisplayEventCountValue {
white-space: pre-line; white-space: pre-line;
} }
babyStatsDisplayWeight {
display: block;
width: 90%;
height: 50vw;
flex-shrink: 0;
}
babyStatsDisplayTimelines { babyStatsDisplayTimelines {
display: block; display: block;
width: 100%; width: 100%;

View File

@@ -2,11 +2,12 @@
<html> <html>
<head> <head>
<title>BabyStats</title> <title>BabyStats</title>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script src="https://use.typekit.net/ifo2asf.js"></script>
<script>try{Typekit.load();}catch(e){}</script>
<script src="/cosmopolite/static/cosmopolite.js" charset="UTF-8"></script> <script src="/cosmopolite/static/cosmopolite.js" charset="UTF-8"></script>
<script src="/cosmopolite/static/hogfather.js" charset="UTF-8"></script> <script src="/cosmopolite/static/hogfather.js" charset="UTF-8"></script>
<script src="/static/babystats.js" charset="UTF-8"></script> <script src="/static/babystats.js" charset="UTF-8"></script>
<script src="https://use.typekit.net/ifo2asf.js"></script>
<script>try{Typekit.load();}catch(e){}</script>
<link rel="stylesheet" href="/static/babystats.css"> <link rel="stylesheet" href="/static/babystats.css">
</head> </head>
<body> <body>

View File

@@ -87,6 +87,9 @@ var BabyStats = function(container) {
this.intervals_ = {}; this.intervals_ = {};
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(this.onChartsReady_.bind(this));
this.buildStylesheet_(); this.buildStylesheet_();
this.cosmo_ = new Cosmopolite(); this.cosmo_ = new Cosmopolite();
@@ -98,12 +101,35 @@ var BabyStats = function(container) {
}; };
/**
* @private
*/
BabyStats.prototype.onChartsReady_ = function() {
this.weightTable_ = new google.visualization.DataTable();
this.weightTable_.addColumn('datetime', 'Sample Date');
this.weightTable_.addColumn('number', 'Weight');
this.checkInit_();
};
/** /**
* @param {hogfather.PublicChat} chat * @param {hogfather.PublicChat} chat
* @private * @private
*/ */
BabyStats.prototype.onChatReady_ = function(chat) { BabyStats.prototype.onChatReady_ = function(chat) {
this.chat_ = chat; this.chat_ = chat;
this.checkInit_();
};
/**
* @private
*/
BabyStats.prototype.checkInit_ = function() {
if (!this.chat_ || !this.weightTable_) {
return;
}
this.buildCells_(); this.buildCells_();
this.buildLayout_(); this.buildLayout_();
@@ -224,11 +250,12 @@ BabyStats.prototype.handleMessage_ = function(isEvent, message) {
tile2 = this.tilesByType_[type]; tile2 = this.tilesByType_[type];
tile2.active = false; tile2.active = false;
}.bind(this)); }.bind(this));
this.updateDisplayIncremental_(message);
if (isEvent) { if (isEvent) {
this.updateTileStatus_(); this.updateTileStatus_();
this.updateDisplayPage_(); this.updateDisplayPage_();
} }
this.updateDisplayIncremental_(message);
} }
} else { } else {
console.log('Unknown message type:', message); console.log('Unknown message type:', message);
@@ -670,6 +697,10 @@ BabyStats.prototype.buildLayout_ = function() {
}.bind(this)); }.bind(this));
}.bind(this)); }.bind(this));
this.displayWeight_ = document.createElement('babyStatsDisplayWeight');
back.appendChild(this.displayWeight_);
this.weightChart_ = new google.visualization.LineChart(this.displayWeight_);
this.displayTimelines_ = document.createElement('babyStatsDisplayTimelines'); this.displayTimelines_ = document.createElement('babyStatsDisplayTimelines');
back.appendChild(this.displayTimelines_); back.appendChild(this.displayTimelines_);
@@ -847,6 +878,10 @@ BabyStats.prototype.updateTileStatus_ = function() {
* @private * @private
*/ */
BabyStats.prototype.updateDisplayPage_ = function() { BabyStats.prototype.updateDisplayPage_ = function() {
if (!this.chat_) {
return;
}
var now = Date.now() / 1000; var now = Date.now() / 1000;
var asleep = this.tilesByType_['asleep']; var asleep = this.tilesByType_['asleep'];
@@ -911,6 +946,16 @@ BabyStats.prototype.updateDisplayPage_ = function() {
this.displayEventCountCells_[tile.type][cutoff[0]].textContent = text; this.displayEventCountCells_[tile.type][cutoff[0]].textContent = text;
}.bind(this)); }.bind(this));
}.bind(this)); }.bind(this));
this.weightChart_.draw(this.weightTable_, {
title: 'Weight',
legend: {
position: 'none',
},
vAxis: {
title: 'kg',
},
});
}; };
@@ -920,6 +965,16 @@ BabyStats.prototype.updateDisplayPage_ = function() {
*/ */
BabyStats.prototype.updateDisplayIncremental_ = function(message) { BabyStats.prototype.updateDisplayIncremental_ = function(message) {
var date = new Date(message.created * 1000); var date = new Date(message.created * 1000);
switch (message.message.type) {
case 'measurements':
if (message.message.weight_kg) {
this.weightTable_.addRow([date, message.message.weight_kg]);
}
break;
}
/*
var dateStr = var dateStr =
date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate(); date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
var days = [ var days = [
@@ -932,7 +987,8 @@ BabyStats.prototype.updateDisplayIncremental_ = function(message) {
'Saturday', 'Saturday',
]; ];
// date.toLocaleDateString() + ' (' + days[date.getDay()] + ')'; date.toLocaleDateString() + ' (' + days[date.getDay()] + ')';
*/
}; };