browser-wakatime/assets/js/components/WakaTime.jsx

/* global browser */

var React = require("react");
var reactCreateClass = require('create-react-class');
var $ = require('jquery');

var config = require('../config');

// React components
var NavBar = require('./NavBar.jsx');
var MainList = require('./MainList.jsx');

// Core
var WakaTimeCore = require('../core/WakaTimeCore').default;

// Helpers
var changeExtensionState = require('../helpers/changeExtensionState');

var Wakatime = reactCreateClass({

    getInitialState: function() {
        return {
            user: {
                full_name: null,
                email: null,
                photo: null
            },
            loggedIn: false,
            loggingEnabled: config.loggingEnabled,
            totalTimeLoggedToday: '0 minutes'
        };
    },

    componentDidMount: function() {

        var wakatime = new WakaTimeCore();

        var that = this;

        wakatime.checkAuth().done(function(data) {

            if (data !== false) {

                browser.storage.sync.get({
                    loggingEnabled: config.loggingEnabled
                }).then(function(items) {
                    that.setState({loggingEnabled: items.loggingEnabled});

                    if (items.loggingEnabled === true) {
                        changeExtensionState('allGood');
                    }
                    else {
                        changeExtensionState('notLogging');
                    }
                });

                that.setState({
                    user: {
                        full_name: data.full_name,
                        email: data.email,
                        photo: data.photo
                    },
                    loggedIn: true
                });

                wakatime.getTotalTimeLoggedToday().done(function(grand_total) {
                    that.setState({
                        totalTimeLoggedToday: grand_total.text
                    });
                });

                wakatime.recordHeartbeat();
            }
            else {
                changeExtensionState('notSignedIn');
            }
        });

    },

    logoutUser: function() {
        var deferredObject = $.Deferred();

        var that = this;

        $.ajax({
            url: config.logoutUserUrl,
            method: 'GET',
            success: function() {

                deferredObject.resolve(that);

            },
            error: function(xhr, status, err) {

                console.error(config.logoutUserUrl, status, err.toString());

                deferredObject.resolve(that);
            }
        });

        return deferredObject.promise();
    },

    _logoutUser: function() {

        var that = this;

        this.logoutUser().done(function(){

            that.setState({
                user: {
                    full_name: null,
                    email: null,
                    photo: null
                },
                loggedIn: false,
                loggingEnabled: false
            });

            changeExtensionState('notSignedIn');

        });
    },

    _disableLogging: function() {
        this.setState({
            loggingEnabled: false
        });

        changeExtensionState('notLogging');

        browser.storage.sync.set({
            loggingEnabled: false
        });
    },

    _enableLogging: function() {
        this.setState({
            loggingEnabled: true
        });

        changeExtensionState('allGood');

        browser.storage.sync.set({
            loggingEnabled: true
        });
    },

    render: function() {
        return (
            <div>
                <NavBar
                    user={this.state.user}
                    loggedIn={this.state.loggedIn} />
                <div className="container">
                    <div className="row">
                        <div className="col-md-12">
                            <MainList
                                disableLogging={this._disableLogging}
                                enableLogging={this._enableLogging}
                                loggingEnabled={this.state.loggingEnabled}
                                user={this.state.user}
                                totalTimeLoggedToday={this.state.totalTimeLoggedToday}
                                logoutUser={this._logoutUser}
                                loggedIn={this.state.loggedIn} />
                        </div>
                    </div>
                </div>
            </div>
        );
    }

});

module.exports = Wakatime;