kurbezz/browser-wakatime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Force more line endings

Browse Source
This commit is contained in:
Nathaniel van Diepen
2017-04-18 12:16:12 -06:00
parent 84f30cc918
commit 6b1672d474
14 changed files with 841 additions and 834 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
.gitattributes vendored
View File

@@ -7,4 +7,11 @@ LICENSE text eol=lf
*.html text eol=lf *.html text eol=lf
*.js text eol=lf *.js text eol=lf
*.json text eol=lf *.json text eol=lf
*.css text eol=lf *.css text eol=lf
*.jsx text eol=lf
.gitignore text eol=lf
.gitattributes text eol=lf
.gitmodules text eol=lf
.jshintrc text eol=lf
*.md text eol=lf
*.rst text eol=lf

72
.gitignore vendored
View File

@@ -1,36 +1,36 @@
# Logs # Logs
logs logs
*.log *.log
# Runtime data # Runtime data
pids pids
*.pid *.pid
*.seed *.seed
# Directory for instrumented libs generated by jscoverage/JSCover # Directory for instrumented libs generated by jscoverage/JSCover
lib-cov lib-cov
# Coverage directory used by tools like istanbul # Coverage directory used by tools like istanbul
coverage coverage
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt .grunt
# Compiled binary addons (http://nodejs.org/api/addons.html) # Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release build/Release
# Dependency directory # Dependency directory
# Deployed apps should consider commenting this line out: # Deployed apps should consider commenting this line out:
# see https://npmjs.org/doc/faq.html#Should-I-check-my-node_modules-folder-into-git # see https://npmjs.org/doc/faq.html#Should-I-check-my-node_modules-folder-into-git
node_modules node_modules
.DS_Store .DS_Store
vendor/bower_components vendor/bower_components
.idea .idea
# Generated chrome extension # Generated chrome extension
public/ public/
web-ext-artifacts/ web-ext-artifacts/
.web-extension-id .web-extension-id

20
.jshintrc
View File

@@ -1,10 +1,10 @@
{ {
"node": true, "node": true,
"curly": true, "curly": true,
"latedef": true, "latedef": true,
"quotmark": true, "quotmark": true,
"undef": true, "undef": true,
"unused": true, "unused": true,
"trailing": true, "trailing": true,
"predef": [ "chrome" ] "predef": [ "chrome" ]
} }

48
HISTORY.rst
View File

@@ -1,24 +1,24 @@
History History
------- -------
1.0.2 (2016-06-30) 1.0.2 (2016-06-30)
++++++++++++++++++ ++++++++++++++++++
- Fix bug preventing options from saving. #42 - Fix bug preventing options from saving. #42
1.0.1 (2016-06-29) 1.0.1 (2016-06-29)
++++++++++++++++++ ++++++++++++++++++
- Fix blacklist setting. - Fix blacklist setting.
- Misc bug fixes related to icon popup. - Misc bug fixes related to icon popup.
- Send plugin name and version with heartbeat data. #41 - Send plugin name and version with heartbeat data. #41
1.0.0 (2016-06-29) 1.0.0 (2016-06-29)
++++++++++++++++++ ++++++++++++++++++
- Birth - Birth

154
README.md
View File

@@ -1,77 +1,77 @@
chrome-wakatime chrome-wakatime
=============== ===============
Automatic time tracking for stats about your website debugging, research, documentation, etc. Automatic time tracking for stats about your website debugging, research, documentation, etc.
Note: Activity from this Chrome extension will not display on leaderboards, so installing this extension may lower your rank. Note: Activity from this Chrome extension will not display on leaderboards, so installing this extension may lower your rank.
## Installation ## Installation
1. Install the extension: 1. Install the extension:
[![Chrome Web Store](https://wakatime.com/static/img/chrome-web-store.png)](https://chrome.google.com/webstore/detail/wakatime/jnbbnacmeggbgdjgaoojpmhdlkkpblgi) [![Chrome Web Store](https://wakatime.com/static/img/chrome-web-store.png)](https://chrome.google.com/webstore/detail/wakatime/jnbbnacmeggbgdjgaoojpmhdlkkpblgi)
2. Login to [WakaTime](https://wakatime.com/). 2. Login to [WakaTime](https://wakatime.com/).
3. Use Chrome like you normally do and your time will be tracked for you automatically. 3. Use Chrome like you normally do and your time will be tracked for you automatically.
4. Visit https://wakatime.com to see your logged time. 4. Visit https://wakatime.com to see your logged time.
5. Use in conjunction with [other WakaTime plugins](https://wakatime.com/plugins). 5. Use in conjunction with [other WakaTime plugins](https://wakatime.com/plugins).
## Screenshots ## Screenshots
![SC open](./screenshots/sc_6-green.png) ![SC open](./screenshots/sc_6-green.png)
![SC open](./screenshots/sc_6-open.png) ![SC open](./screenshots/sc_6-open.png)
![Options SC](./screenshots/sc_8-options.png) ![Options SC](./screenshots/sc_8-options.png)
## Development instructions ## Development instructions
> For development purposes only. > For development purposes only.
To get started, install NPM and Bower dependencies, and do an initial build with Gulp: To get started, install NPM and Bower dependencies, and do an initial build with Gulp:
``` ```
npm start npm start
``` ```
To build the extension once: To build the extension once:
``` ```
npm run gulp npm run gulp
``` ```
To monitor changes: To monitor changes:
``` ```
npm run watch npm run watch
``` ```
Run tests: Run tests:
``` ```
npm test npm test
``` ```
Lint code *(Both JS and JSX)*: Lint code *(Both JS and JSX)*:
``` ```
jsxhint --jsx-only . jsxhint --jsx-only .
``` ```
### Automatic code linting ### Automatic code linting
There is a precommit hook that lints the code before commiting the changes. There is a precommit hook that lints the code before commiting the changes.
### Load unpacked in Chrome ### Load unpacked in Chrome
1. Clone repository to disk 1. Clone repository to disk
2. Go to `Settings` → `Extensions` 2. Go to `Settings` → `Extensions`
3. Enable `Developer mode` 3. Enable `Developer mode`
4. Click `Load unpacked extension...` 4. Click `Load unpacked extension...`
5. Select repository directory 5. Select repository directory

30
assets/js/app.jsx
View File

@@ -1,15 +1,15 @@
/* This is a fix for Bootstrap requiring jQuery */ /* This is a fix for Bootstrap requiring jQuery */
global.jQuery = require('jquery'); global.jQuery = require('jquery');
require('bootstrap'); require('bootstrap');
var React = require('react'); var React = require('react');
var ReactDOM = require('react-dom'); var ReactDOM = require('react-dom');
// React components // React components
var WakaTime = require('./components/WakaTime.jsx'); var WakaTime = require('./components/WakaTime.jsx');
ReactDOM.render( ReactDOM.render(
<WakaTime />, <WakaTime />,
document.getElementById('wakatime') document.getElementById('wakatime')
); );

38
assets/js/components/Alert.jsx
View File

@@ -1,19 +1,19 @@
var React = require('react'); var React = require('react');
var classNames = require('classnames'); var classNames = require('classnames');
var Alert = React.createClass({ var Alert = React.createClass({
propTypes: { propTypes: {
type: React.PropTypes.string.isRequired, type: React.PropTypes.string.isRequired,
text: React.PropTypes.string.isRequired text: React.PropTypes.string.isRequired
}, },
render: function() { render: function() {
return( return(
<div className={classNames('alert', 'alert-' + this.props.type)}>{this.props.text}</div> <div className={classNames('alert', 'alert-' + this.props.type)}>{this.props.text}</div>
); );
} }
}); });
module.exports = Alert; module.exports = Alert;

212
assets/js/components/MainList.jsx
View File

@@ -1,106 +1,106 @@
/* global browser */ /* global browser */
var React = require('react'); var React = require('react');
var MainList = React.createClass({ var MainList = React.createClass({
_openOptionsPage: function() { _openOptionsPage: function() {
if (browser.runtime.openOptionsPage) { if (browser.runtime.openOptionsPage) {
// New way to open options pages, if supported (Chrome 42+). // New way to open options pages, if supported (Chrome 42+).
browser.runtime.openOptionsPage(); browser.runtime.openOptionsPage();
} else { } else {
// Reasonable fallback. // Reasonable fallback.
window.open(browser.runtime.getURL('options.html')); window.open(browser.runtime.getURL('options.html'));
} }
}, },
render: function() { render: function() {
var that = this; var that = this;
var loginLogoutButton = function() { var loginLogoutButton = function() {
if (that.props.loggedIn === true) { if (that.props.loggedIn === true) {
return ( return (
<div> <div>
<a href="#" className="list-group-item" onClick={that.props.logoutUser}> <a href="#" className="list-group-item" onClick={that.props.logoutUser}>
<i className="fa fa-fw fa-sign-out"></i> <i className="fa fa-fw fa-sign-out"></i>
Logout Logout
</a> </a>
</div> </div>
); );
} }
return ( return (
<a target="_blank" href="https://wakatime.com/login" className="list-group-item"> <a target="_blank" href="https://wakatime.com/login" className="list-group-item">
<i className="fa fa-fw fa-sign-in"></i> <i className="fa fa-fw fa-sign-in"></i>
Login Login
</a> </a>
); );
}; };
// If logging is enabled, display that info to user // If logging is enabled, display that info to user
var loggingStatus = function() { var loggingStatus = function() {
if(that.props.loggingEnabled === true && that.props.loggedIn === true) if(that.props.loggingEnabled === true && that.props.loggedIn === true)
{ {
return ( return (
<div className="row"> <div className="row">
<div className="col-xs-12"> <div className="col-xs-12">
<p> <p>
<a href="#" onClick={that.props.disableLogging} className="btn btn-danger btn-block">Disable logging</a> <a href="#" onClick={that.props.disableLogging} className="btn btn-danger btn-block">Disable logging</a>
</p> </p>
</div> </div>
</div> </div>
); );
} }
else if(that.props.loggingEnabled === false && that.props.loggedIn === true) else if(that.props.loggingEnabled === false && that.props.loggedIn === true)
{ {
return ( return (
<div className="row"> <div className="row">
<div className="col-xs-12"> <div className="col-xs-12">
<p> <p>
<a href="#" onClick={that.props.enableLogging} className="btn btn-success btn-block">Enable logging</a> <a href="#" onClick={that.props.enableLogging} className="btn btn-success btn-block">Enable logging</a>
</p> </p>
</div> </div>
</div> </div>
); );
} }
}; };
var totalTimeLoggedToday = function() { var totalTimeLoggedToday = function() {
if (that.props.loggedIn === true) { if (that.props.loggedIn === true) {
return ( return (
<div className="row"> <div className="row">
<div className="col-xs-12"> <div className="col-xs-12">
<blockquote> <blockquote>
<p>{that.props.totalTimeLoggedToday}</p> <p>{that.props.totalTimeLoggedToday}</p>
<small><cite>TOTAL TIME LOGGED TODAY</cite></small> <small><cite>TOTAL TIME LOGGED TODAY</cite></small>
</blockquote> </blockquote>
</div> </div>
</div> </div>
); );
} }
}; };
return ( return (
<div> <div>
{totalTimeLoggedToday()} {totalTimeLoggedToday()}
{loggingStatus()} {loggingStatus()}
<div className="list-group"> <div className="list-group">
<a href="#" className="list-group-item" onClick={this._openOptionsPage}> <a href="#" className="list-group-item" onClick={this._openOptionsPage}>
<i className="fa fa-fw fa-cogs"></i> <i className="fa fa-fw fa-cogs"></i>
Options Options
</a> </a>
{loginLogoutButton()} {loginLogoutButton()}
</div> </div>
</div> </div>
); );
} }
}); });
module.exports = MainList; module.exports = MainList;

178
assets/js/components/NavBar.jsx
View File

@@ -1,89 +1,89 @@
var React = require('react'); var React = require('react');
var NavBar = React.createClass({ var NavBar = React.createClass({
render: function() { render: function() {
var that = this; var that = this;
var signedInAs = function() { var signedInAs = function() {
if (that.props.loggedIn === true) { if (that.props.loggedIn === true) {
return ( return (
<p className="navbar-text">Signed in as <b>{that.props.user.full_name}</b></p> <p className="navbar-text">Signed in as <b>{that.props.user.full_name}</b></p>
); );
} }
}; };
var dashboard = function() { var dashboard = function() {
if (that.props.loggedIn === true) { if (that.props.loggedIn === true) {
return ( return (
<li> <li>
<a target="_blank" href="https://wakatime.com/dashboard"> <a target="_blank" href="https://wakatime.com/dashboard">
<i className="fa fa-fw fa-tachometer"></i> <i className="fa fa-fw fa-tachometer"></i>
Dashboard Dashboard
</a> </a>
</li> </li>
); );
} }
}; };
var customRules = function() { var customRules = function() {
if (that.props.loggedIn === true) { if (that.props.loggedIn === true) {
return ( return (
<li> <li>
<a target="_blank" href="https://wakatime.com/settings/rules"> <a target="_blank" href="https://wakatime.com/settings/rules">
<i className="fa fa-fw fa-filter"></i> <i className="fa fa-fw fa-filter"></i>
Custom Rules Custom Rules
</a> </a>
</li> </li>
); );
} }
}; };
return ( return (
<nav className="navbar navbar-default" role="navigation"> <nav className="navbar navbar-default" role="navigation">
<div className="container-fluid"> <div className="container-fluid">
<div className="navbar-header"> <div className="navbar-header">
<button type="button" className="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <button type="button" className="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span className="sr-only">Toggle navigation</span> <span className="sr-only">Toggle navigation</span>
<i className="fa fa-fw fa-cogs"></i> <i className="fa fa-fw fa-cogs"></i>
</button> </button>
<a target="_blank" className="navbar-brand" href="https://wakatime.com"> <a target="_blank" className="navbar-brand" href="https://wakatime.com">
WakaTime WakaTime
<img src="graphics/wakatime-logo-48.png" /> <img src="graphics/wakatime-logo-48.png" />
</a> </a>
</div> </div>
<div className="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <div className="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
{signedInAs()} {signedInAs()}
<ul className="nav navbar-nav"> <ul className="nav navbar-nav">
{customRules()} {customRules()}
{dashboard()} {dashboard()}
<li className="dropdown"> <li className="dropdown">
<a href="#" className="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"> <a href="#" className="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
<i className="fa fa-fw fa-info"></i> <i className="fa fa-fw fa-info"></i>
About About
<span className="caret"></span> <span className="caret"></span>
</a> </a>
<ul className="dropdown-menu" role="menu"> <ul className="dropdown-menu" role="menu">
<li> <li>
<a target="_blank" href="https://github.com/wakatime/chrome-wakatime/issues"> <a target="_blank" href="https://github.com/wakatime/chrome-wakatime/issues">
<i className="fa fa-fw fa-bug"></i> <i className="fa fa-fw fa-bug"></i>
Report an Issue</a> Report an Issue</a>
</li> </li>
<li> <li>
<a target="_blank" href="https://github.com/wakatime/chrome-wakatime"> <a target="_blank" href="https://github.com/wakatime/chrome-wakatime">
<i className="fa fa-fw fa-github"></i> <i className="fa fa-fw fa-github"></i>
View on GitHub</a> View on GitHub</a>
</li> </li>
</ul> </ul>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
</nav> </nav>
); );
} }
}); });
module.exports = NavBar; module.exports = NavBar;

428
assets/js/components/Options.jsx
View File

@@ -1,214 +1,214 @@
/* global browser */ /* global browser */
var React = require('react'); var React = require('react');
var ReactCSSTransitionGroup = require('react-addons-css-transition-group'); var ReactCSSTransitionGroup = require('react-addons-css-transition-group');
var config = require('../config'); var config = require('../config');
// React components // React components
var Alert = require('./Alert.jsx'); var Alert = require('./Alert.jsx');
var SitesList = require('./SitesList.jsx'); var SitesList = require('./SitesList.jsx');
/** /**
* One thing to keep in mind is that you cannot use this.refs.blacklist if * One thing to keep in mind is that you cannot use this.refs.blacklist if
* the blacklist select box is not being rendered on the form. * the blacklist select box is not being rendered on the form.
* *
* @type {*|Function} * @type {*|Function}
*/ */
var Options = React.createClass({ var Options = React.createClass({
getInitialState: function () { getInitialState: function () {
return { return {
theme: config.theme, theme: config.theme,
blacklist: '', blacklist: '',
whitelist: '', whitelist: '',
loggingType: config.loggingType, loggingType: config.loggingType,
loggingStyle: config.loggingStyle, loggingStyle: config.loggingStyle,
displayAlert: false, displayAlert: false,
alertType: config.alert.success.type, alertType: config.alert.success.type,
alertText: config.alert.success.text alertText: config.alert.success.text
}; };
}, },
componentDidMount: function () { componentDidMount: function () {
this.restoreSettings(); this.restoreSettings();
}, },
restoreSettings: function () { restoreSettings: function () {
var that = this; var that = this;
browser.storage.sync.get({ browser.storage.sync.get({
theme: config.theme, theme: config.theme,
blacklist: '', blacklist: '',
whitelist: '', whitelist: '',
loggingType: config.loggingType, loggingType: config.loggingType,
loggingStyle: config.loggingStyle loggingStyle: config.loggingStyle
}).then(function (items) { }).then(function (items) {
that.setState({ that.setState({
theme: items.theme, theme: items.theme,
blacklist: items.blacklist, blacklist: items.blacklist,
whitelist: items.whitelist, whitelist: items.whitelist,
loggingType: items.loggingType, loggingType: items.loggingType,
loggingStyle: items.loggingStyle loggingStyle: items.loggingStyle
}); });
that.refs.theme.value = items.theme; that.refs.theme.value = items.theme;
that.refs.loggingType.value = items.loggingType; that.refs.loggingType.value = items.loggingType;
that.refs.loggingStyle.value = items.loggingStyle; that.refs.loggingStyle.value = items.loggingStyle;
}); });
}, },
_handleSubmit: function (e) { _handleSubmit: function (e) {
e.preventDefault(); e.preventDefault();
this.saveSettings(); this.saveSettings();
}, },
saveSettings: function () { saveSettings: function () {
var that = this; var that = this;
var theme = this.refs.theme.value.trim(); var theme = this.refs.theme.value.trim();
var loggingType = this.refs.loggingType.value.trim(); var loggingType = this.refs.loggingType.value.trim();
var loggingStyle = this.refs.loggingStyle.value.trim(); var loggingStyle = this.refs.loggingStyle.value.trim();
// Trimming blacklist and whitelist removes blank lines and spaces. // Trimming blacklist and whitelist removes blank lines and spaces.
var blacklist = that.state.blacklist.trim(); var blacklist = that.state.blacklist.trim();
var whitelist = that.state.whitelist.trim(); var whitelist = that.state.whitelist.trim();
// Sync options with google storage. // Sync options with google storage.
browser.storage.sync.set({ browser.storage.sync.set({
theme: theme, theme: theme,
blacklist: blacklist, blacklist: blacklist,
whitelist: whitelist, whitelist: whitelist,
loggingType: loggingType, loggingType: loggingType,
loggingStyle: loggingStyle loggingStyle: loggingStyle
}).then(function () { }).then(function () {
// Set state to be newly entered values. // Set state to be newly entered values.
that.setState({ that.setState({
theme: theme, theme: theme,
blacklist: blacklist, blacklist: blacklist,
whitelist: whitelist, whitelist: whitelist,
loggingType: loggingType, loggingType: loggingType,
loggingStyle: loggingStyle, loggingStyle: loggingStyle,
displayAlert: true displayAlert: true
}); });
}); });
}, },
_displayBlackOrWhiteList: function () { _displayBlackOrWhiteList: function () {
var loggingStyle = this.refs.loggingStyle.value.trim(); var loggingStyle = this.refs.loggingStyle.value.trim();
this.setState({loggingStyle: loggingStyle}); this.setState({loggingStyle: loggingStyle});
}, },
_updateBlacklistState: function(sites){ _updateBlacklistState: function(sites){
this.setState({ this.setState({
blacklist: sites blacklist: sites
}); });
}, },
_updateWhitelistState: function(sites){ _updateWhitelistState: function(sites){
this.setState({ this.setState({
whitelist: sites whitelist: sites
}); });
}, },
render: function () { render: function () {
var that = this; var that = this;
var alert = function() { var alert = function() {
if(that.state.displayAlert === true){ if(that.state.displayAlert === true){
setTimeout(function () { setTimeout(function () {
that.setState({displayAlert:false}); that.setState({displayAlert:false});
}, 2000); }, 2000);
return( return(
<Alert key={that.state.alertText} type={that.state.alertType} text={that.state.alertText} /> <Alert key={that.state.alertText} type={that.state.alertType} text={that.state.alertText} />
); );
} }
}; };
var loggingStyle = function () { var loggingStyle = function () {
if (that.state.loggingStyle == 'blacklist') { if (that.state.loggingStyle == 'blacklist') {
return ( return (
<SitesList <SitesList
handleChange={that._updateBlacklistState} handleChange={that._updateBlacklistState}
label="Blacklist" label="Blacklist"
sites={that.state.blacklist} sites={that.state.blacklist}
helpText="Sites that you don't want to show in your reports." /> helpText="Sites that you don't want to show in your reports." />
); );
} }
return ( return (
<SitesList <SitesList
handleChange={that._updateWhitelistState} handleChange={that._updateWhitelistState}
label="Whitelist" label="Whitelist"
sites={that.state.whitelist} sites={that.state.whitelist}
helpText="Sites that you want to show in your reports." /> helpText="Sites that you want to show in your reports." />
); );
}; };
return ( return (
<div className="container"> <div className="container">
<div className="row"> <div className="row">
<div className="col-md-12"> <div className="col-md-12">
<ReactCSSTransitionGroup transitionName="alert" transitionEnterTimeout={500} transitionLeaveTimeout={300}> <ReactCSSTransitionGroup transitionName="alert" transitionEnterTimeout={500} transitionLeaveTimeout={300}>
{alert()} {alert()}
</ReactCSSTransitionGroup> </ReactCSSTransitionGroup>
<form className="form-horizontal" onSubmit={this._handleSubmit}> <form className="form-horizontal" onSubmit={this._handleSubmit}>
<div className="form-group"> <div className="form-group">
<label className="col-lg-2 control-label">Logging style</label> <label className="col-lg-2 control-label">Logging style</label>
<div className="col-lg-10"> <div className="col-lg-10">
<select className="form-control" ref="loggingStyle" defaultValue="blacklist" onChange={this._displayBlackOrWhiteList}> <select className="form-control" ref="loggingStyle" defaultValue="blacklist" onChange={this._displayBlackOrWhiteList}>
<option value="blacklist">All except blacklisted sites</option> <option value="blacklist">All except blacklisted sites</option>
<option value="whitelist">Only whitelisted sites</option> <option value="whitelist">Only whitelisted sites</option>
</select> </select>
</div> </div>
</div> </div>
{loggingStyle()} {loggingStyle()}
<div className="form-group"> <div className="form-group">
<label className="col-lg-2 control-label">Logging type</label> <label className="col-lg-2 control-label">Logging type</label>
<div className="col-lg-10"> <div className="col-lg-10">
<select className="form-control" ref="loggingType" defaultValue="domain"> <select className="form-control" ref="loggingType" defaultValue="domain">
<option value="domain">Only the domain</option> <option value="domain">Only the domain</option>
<option value="url">Entire URL</option> <option value="url">Entire URL</option>
</select> </select>
</div> </div>
</div> </div>
<div className="form-group"> <div className="form-group">
<label htmlFor="theme" className="col-lg-2 control-label">Theme</label> <label htmlFor="theme" className="col-lg-2 control-label">Theme</label>
<div className="col-lg-10"> <div className="col-lg-10">
<select className="form-control" ref="theme" defaultValue="light"> <select className="form-control" ref="theme" defaultValue="light">
<option value="light">Light</option> <option value="light">Light</option>
<option value="dark">Dark</option> <option value="dark">Dark</option>
</select> </select>
</div> </div>
</div> </div>
<div className="form-group"> <div className="form-group">
<div className="col-lg-10 col-lg-offset-2"> <div className="col-lg-10 col-lg-offset-2">
<button type="submit" className="btn btn-primary">Save</button> <button type="submit" className="btn btn-primary">Save</button>
</div> </div>
</div> </div>
</form> </form>
</div> </div>
</div> </div>
</div> </div>
); );
} }
}); });
module.exports = Options; module.exports = Options;

70
assets/js/components/SitesList.jsx
View File

@@ -1,35 +1,35 @@
var React = require('react'); var React = require('react');
var SitesList = React.createClass({ var SitesList = React.createClass({
getDefaultProps: function () { getDefaultProps: function () {
return { return {
placeholder: 'http://google.com' placeholder: 'http://google.com'
}; };
}, },
_handleChange: function (event) { _handleChange: function (event) {
var sites = event.target.value; var sites = event.target.value;
this.props.handleChange(sites); this.props.handleChange(sites);
}, },
render: function () { render: function () {
return ( return (
<div className="form-group"> <div className="form-group">
<label htmlFor="sites" className="col-lg-2 control-label">{this.props.label}</label> <label htmlFor="sites" className="col-lg-2 control-label">{this.props.label}</label>
<div className="col-lg-10"> <div className="col-lg-10">
<textarea className="form-control" rows="3" ref="sites" onChange={this._handleChange} <textarea className="form-control" rows="3" ref="sites" onChange={this._handleChange}
placeholder={this.props.placeholder} value={this.props.sites}></textarea> placeholder={this.props.placeholder} value={this.props.sites}></textarea>
<span className="help-block">{this.props.helpText} <span className="help-block">{this.props.helpText}
<br/> <br/>
One line per site.</span> One line per site.</span>
</div> </div>
</div> </div>
); );
} }
}); });
module.exports = SitesList; module.exports = SitesList;

346
assets/js/components/WakaTime.jsx
View File

@@ -1,173 +1,173 @@
/* global browser */ /* global browser */
var React = require("react"); var React = require("react");
var $ = require('jquery'); var $ = require('jquery');
var config = require('../config'); var config = require('../config');
// React components // React components
var NavBar = require('./NavBar.jsx'); var NavBar = require('./NavBar.jsx');
var MainList = require('./MainList.jsx'); var MainList = require('./MainList.jsx');
// Core // Core
var WakaTimeCore = require('../core/WakaTimeCore').default; var WakaTimeCore = require('../core/WakaTimeCore').default;
// Helpers // Helpers
var changeExtensionState = require('../helpers/changeExtensionState'); var changeExtensionState = require('../helpers/changeExtensionState');
var Wakatime = React.createClass({ var Wakatime = React.createClass({
getInitialState: function() { getInitialState: function() {
return { return {
user: { user: {
full_name: null, full_name: null,
email: null, email: null,
photo: null photo: null
}, },
loggedIn: false, loggedIn: false,
loggingEnabled: config.loggingEnabled, loggingEnabled: config.loggingEnabled,
totalTimeLoggedToday: '0 minutes' totalTimeLoggedToday: '0 minutes'
}; };
}, },
componentDidMount: function() { componentDidMount: function() {
var wakatime = new WakaTimeCore(); var wakatime = new WakaTimeCore();
var that = this; var that = this;
wakatime.checkAuth().done(function(data) { wakatime.checkAuth().done(function(data) {
if (data !== false) { if (data !== false) {
browser.storage.sync.get({ browser.storage.sync.get({
loggingEnabled: config.loggingEnabled loggingEnabled: config.loggingEnabled
}).then(function(items) { }).then(function(items) {
that.setState({loggingEnabled: items.loggingEnabled}); that.setState({loggingEnabled: items.loggingEnabled});
if (items.loggingEnabled === true) { if (items.loggingEnabled === true) {
changeExtensionState('allGood'); changeExtensionState('allGood');
} }
else { else {
changeExtensionState('notLogging'); changeExtensionState('notLogging');
} }
}); });
that.setState({ that.setState({
user: { user: {
full_name: data.full_name, full_name: data.full_name,
email: data.email, email: data.email,
photo: data.photo photo: data.photo
}, },
loggedIn: true loggedIn: true
}); });
wakatime.getTotalTimeLoggedToday().done(function(grand_total) { wakatime.getTotalTimeLoggedToday().done(function(grand_total) {
that.setState({ that.setState({
totalTimeLoggedToday: grand_total.text totalTimeLoggedToday: grand_total.text
}); });
}); });
} }
else { else {
changeExtensionState('notSignedIn'); changeExtensionState('notSignedIn');
} }
}); });
}, },
logoutUser: function() { logoutUser: function() {
var deferredObject = $.Deferred(); var deferredObject = $.Deferred();
var that = this; var that = this;
$.ajax({ $.ajax({
url: config.logoutUserUrl, url: config.logoutUserUrl,
method: 'GET', method: 'GET',
success: function() { success: function() {
deferredObject.resolve(that); deferredObject.resolve(that);
}, },
error: function(xhr, status, err) { error: function(xhr, status, err) {
console.error(config.logoutUserUrl, status, err.toString()); console.error(config.logoutUserUrl, status, err.toString());
deferredObject.resolve(that); deferredObject.resolve(that);
} }
}); });
return deferredObject.promise(); return deferredObject.promise();
}, },
_logoutUser: function() { _logoutUser: function() {
var that = this; var that = this;
this.logoutUser().done(function(){ this.logoutUser().done(function(){
that.setState({ that.setState({
user: { user: {
full_name: null, full_name: null,
email: null, email: null,
photo: null photo: null
}, },
loggedIn: false, loggedIn: false,
loggingEnabled: false loggingEnabled: false
}); });
changeExtensionState('notSignedIn'); changeExtensionState('notSignedIn');
}); });
}, },
_disableLogging: function() { _disableLogging: function() {
this.setState({ this.setState({
loggingEnabled: false loggingEnabled: false
}); });
changeExtensionState('notLogging'); changeExtensionState('notLogging');
browser.storage.sync.set({ browser.storage.sync.set({
loggingEnabled: false loggingEnabled: false
}); });
}, },
_enableLogging: function() { _enableLogging: function() {
this.setState({ this.setState({
loggingEnabled: true loggingEnabled: true
}); });
changeExtensionState('allGood'); changeExtensionState('allGood');
browser.storage.sync.set({ browser.storage.sync.set({
loggingEnabled: true loggingEnabled: true
}); });
}, },
render: function() { render: function() {
return ( return (
<div> <div>
<NavBar <NavBar
user={this.state.user} user={this.state.user}
loggedIn={this.state.loggedIn} /> loggedIn={this.state.loggedIn} />
<div className="container"> <div className="container">
<div className="row"> <div className="row">
<div className="col-md-12"> <div className="col-md-12">
<MainList <MainList
disableLogging={this._disableLogging} disableLogging={this._disableLogging}
enableLogging={this._enableLogging} enableLogging={this._enableLogging}
loggingEnabled={this.state.loggingEnabled} loggingEnabled={this.state.loggingEnabled}
user={this.state.user} user={this.state.user}
totalTimeLoggedToday={this.state.totalTimeLoggedToday} totalTimeLoggedToday={this.state.totalTimeLoggedToday}
logoutUser={this._logoutUser} logoutUser={this._logoutUser}
loggedIn={this.state.loggedIn} /> loggedIn={this.state.loggedIn} />
</div> </div>
</div> </div>
</div> </div>
</div> </div>
); );
} }
}); });
module.exports = Wakatime; module.exports = Wakatime;

32
assets/js/options.jsx
View File

@@ -1,16 +1,16 @@
/* global browser */ /* global browser */
/* This is a fix for Bootstrap requiring jQuery */ /* This is a fix for Bootstrap requiring jQuery */
global.jQuery = require('jquery'); global.jQuery = require('jquery');
require('bootstrap'); require('bootstrap');
var React = require('react'); var React = require('react');
var ReactDOM = require('react-dom'); var ReactDOM = require('react-dom');
// React components // React components
var Options = require('./components/Options.jsx'); var Options = require('./components/Options.jsx');
ReactDOM.render( ReactDOM.render(
<Options />, <Options />,
document.getElementById('wakatime-options') document.getElementById('wakatime-options')
); );

38
assets/less/bootstrap/.csslintrc
View File

@@ -1,19 +1,19 @@
{ {
"adjoining-classes": false, "adjoining-classes": false,
"box-sizing": false, "box-sizing": false,
"box-model": false, "box-model": false,
"compatible-vendor-prefixes": false, "compatible-vendor-prefixes": false,
"floats": false, "floats": false,
"font-sizes": false, "font-sizes": false,
"gradients": false, "gradients": false,
"important": false, "important": false,
"known-properties": false, "known-properties": false,
"outline-none": false, "outline-none": false,
"qualified-headings": false, "qualified-headings": false,
"regex-selectors": false, "regex-selectors": false,
"shorthand": false, "shorthand": false,
"text-indent": false, "text-indent": false,
"unique-headings": false, "unique-headings": false,
"universal-selector": false, "universal-selector": false,
"unqualified-attributes": false "unqualified-attributes": false
} }