Added total time logged today. Changed UI.
This commit is contained in:
@@ -19,9 +19,11 @@ Installation
|
||||
|
||||
## Screenshots
|
||||
|
||||

|
||||

|
||||
|
||||

|
||||

|
||||
|
||||

|
||||
|
||||

|
||||
|
||||
|
||||
@@ -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>
|
||||
<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>
|
||||
<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
|
||||
<b>{this.props.user.full_name}</b>
|
||||
<br />
|
||||
{this.props.user.email}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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()}
|
||||
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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.
|
||||
*
|
||||
|
||||
@@ -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;
|
||||
@@ -30,6 +30,7 @@
|
||||
"dependencies": {
|
||||
"bootstrap": "^3.3.4",
|
||||
"jquery": "^2.1.3",
|
||||
"moment": "^2.10.3",
|
||||
"react": "^0.13.3"
|
||||
}
|
||||
}
|
||||
|
||||
3617
public/js/bundle.js
3617
public/js/bundle.js
File diff suppressed because it is too large
Load Diff
3139
public/js/events.js
3139
public/js/events.js
File diff suppressed because it is too large
Load Diff
BIN
screenshots/sc_6-green.png
Normal file
BIN
screenshots/sc_6-green.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
BIN
screenshots/sc_6-open.png
Normal file
BIN
screenshots/sc_6-open.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
BIN
screenshots/sc_6-red.png
Normal file
BIN
screenshots/sc_6-red.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
@@ -1,14 +0,0 @@
|
||||
var chai = require('chai');
|
||||
var expect = chai.expect;
|
||||
|
||||
import getTodaysDateInFormat from '../../assets/js/helpers/getTodaysDateInFormat';
|
||||
|
||||
describe('getTodaysDateInFormat', function() {
|
||||
it('should be a function', function() {
|
||||
expect(getTodaysDateInFormat).to.be.a('function');
|
||||
});
|
||||
|
||||
it('should return todays date in format YYYY-MM-DD', function() {
|
||||
expect(getTodaysDateInFormat()).to.equal('2015-06-14');
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user