Added total time logged today. Changed UI.

This commit is contained in:
Mario Basic
2015-06-14 12:33:21 +02:00
parent fda748019c
commit 350110742e
13 changed files with 6626 additions and 283 deletions

View File

@@ -22,14 +22,6 @@ class MainList extends React.Component {
if (this.props.loggedIn === true) {
return (
<div>
<a target="_blank" href="https://wakatime.com/settings/rules" className="list-group-item">
<i className="fa fa-fw fa-filter"></i>
Custom Rules
</a>
<a target="_blank" href="https://wakatime.com/dashboard" className="list-group-item">
<i className="fa fa-fw fa-tachometer"></i>
Dashboard
</a>
<a href="#" className="list-group-item" onClick={this.props.logoutUser}>
<i className="fa fa-fw fa-sign-out"></i>
Logout
@@ -51,13 +43,11 @@ class MainList extends React.Component {
if(this.props.loggingEnabled === true && this.props.loggedIn === true)
{
return (
<div className="panel panel-default">
<div className="panel-body">
<div className="row">
<div className="col-xs-12">
<a href="#" onClick={this.props.disableLogging} className="btn btn-danger btn-lg btn-block">Disable logging</a>
</div>
</div>
<div className="row">
<div className="col-xs-12">
<p>
<a href="#" onClick={this.props.disableLogging} className="btn btn-danger btn-block">Disable logging</a>
</p>
</div>
</div>
);
@@ -65,36 +55,26 @@ class MainList extends React.Component {
else if(this.props.loggingEnabled === false && this.props.loggedIn === true)
{
return (
<div className="panel panel-default">
<div className="panel-body">
<div className="row">
<div className="col-xs-12">
<a href="#" onClick={this.props.enableLogging} className="btn btn-success btn-lg btn-block">Enable logging</a>
</div>
</div>
<div className="row">
<div className="col-xs-12">
<p>
<a href="#" onClick={this.props.enableLogging} className="btn btn-success btn-block">Enable logging</a>
</p>
</div>
</div>
);
}
};
var signedInAs = () => {
var totalTimeLoggedToday = () => {
if (this.props.loggedIn === true) {
return (
<div className="panel panel-default">
<div className="panel-body">
<div className="row">
<div className="col-xs-2">
<img className="img-circle" width="48" height="48" src={this.props.user.photo} />
</div>
<div className="col-xs-10">
Signed in as&nbsp;
<b>{this.props.user.full_name}</b>
<br />
{this.props.user.email}
</div>
</div>
<div className="row">
<div className="col-xs-12">
<blockquote>
<p>{this.props.totalTimeLoggedToday}</p>
<small><cite>TOTAL TIME LOGGED TODAY</cite></small>
</blockquote>
</div>
</div>
);
@@ -104,7 +84,7 @@ class MainList extends React.Component {
return (
<div>
{signedInAs()}
{totalTimeLoggedToday()}
{loggingStatus()}

View File

@@ -5,6 +5,41 @@ var React = require('react');
class Navbar extends React.Component {
render() {
var signedInAs = () => {
if (this.props.loggedIn === true) {
return (
<p class="navbar-text">Signed in as <b>{this.props.user.full_name}</b></p>
);
}
};
var dashboard = () => {
if (this.props.loggedIn === true) {
return (
<li>
<a target="_blank" href="https://wakatime.com/dashboard">
<i className="fa fa-fw fa-tachometer"></i>
Dashboard
</a>
</li>
);
}
};
var customRules = () => {
if (this.props.loggedIn === true) {
return (
<li>
<a target="_blank" href="https://wakatime.com/settings/rules">
<i className="fa fa-fw fa-filter"></i>
Custom Rules
</a>
</li>
);
}
};
return (
<nav className="navbar navbar-default" role="navigation">
<div className="container-fluid">
@@ -19,7 +54,10 @@ class Navbar extends React.Component {
</a>
</div>
<div className="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
{signedInAs()}
<ul className="nav navbar-nav">
{customRules()}
{dashboard()}
<li className="dropdown">
<a href="#" className="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
<i className="fa fa-fw fa-info"></i>

View File

@@ -28,7 +28,8 @@ class WakaTime extends React.Component {
photo: null
},
loggedIn: false,
loggingEnabled: config.loggingEnabled
loggingEnabled: config.loggingEnabled,
totalTimeLoggedToday: 0
};
}
@@ -61,6 +62,13 @@ class WakaTime extends React.Component {
},
loggedIn: true
});
wakatime.getTotalTimeLoggedToday().done((grand_total) => {
console.log(grand_total['text']);
this.setState({
totalTimeLoggedToday: grand_total['text']
})
});
}
else {
changeExtensionState('notSignedIn');
@@ -133,10 +141,13 @@ class WakaTime extends React.Component {
});
}
render() {
return (
<div>
<NavBar />
<NavBar
user={this.state.user}
loggedIn={this.state.loggedIn} />
<div className="container">
<div className="row">
<div className="col-md-12">
@@ -145,6 +156,7 @@ class WakaTime extends React.Component {
enableLogging={this._enableLogging.bind(this)}
loggingEnabled={this.state.loggingEnabled}
user={this.state.user}
totalTimeLoggedToday={this.state.totalTimeLoggedToday}
logoutUser={this._logoutUser.bind(this)}
loggedIn={this.state.loggedIn} />
</div>

View File

@@ -1,4 +1,5 @@
var $ = require('jquery');
var moment = require('moment');
var config = require('./../config');
@@ -23,6 +24,30 @@ class WakaTime {
this.tabsWithDevtoolsOpen = tabs;
}
getTotalTimeLoggedToday() {
var deferredObject = $.Deferred();
var today = moment().format('YYYY-MM-DD');
$.ajax({
url: config.summariesApiUrl + '?start=' + today + '&end=' + today,
dataType: 'json',
success: (data) => {
deferredObject.resolve(data.data[0]['grand_total']);
},
error: (xhr, status, err) => {
console.error(config.summariesApiUrl, status, err.toString());
deferredObject.resolve(false);
}
});
return deferredObject.promise();
}
/**
* Checks if the user is logged in.
*

View File

@@ -1,13 +0,0 @@
function getTodaysDateInFormat()
{
var today = new Date();
var month = today.getMonth() + 1;
var date = today.getDate();
if(month < 10) month = '0' + month;
if(date < 10) date = '0' + date;
return today.getFullYear() + '-' + month + '-' + date;
}
export default getTodaysDateInFormat;