var React = require( 'react'), SetupProgressStore = require( 'stores/setup-progress-store'), SetupProgressActions = require( 'actions/setup-progress-actions'), SpinnerStore = require( 'stores/spinner-store' ), SpinnerActions = require( 'actions/spinner-actions'), DataStore = require( 'stores/data-store' ), Flash = require( '../flash' ), GetStarted = require( '../steps/get-started' ); function getSetupProgress() { return { newUser: SetupProgressStore.isNewUser(), showSpinner: SpinnerStore.showing(), spinnerMessage: SpinnerStore.getMessage(), currentStep: SetupProgressStore.getCurrentStep(), allSteps: SetupProgressStore.getAllSteps(), progressPercent: SetupProgressStore.getProgressPercent() }; } // TODO: visual "saving" for this.state.saving module.exports = React.createClass( { displayName: 'WelcomeWidget', componentDidMount: function() { SetupProgressStore.addChangeListener( this._onChange ); SpinnerStore.addChangeListener( this._onSpinnerChange ); DataStore.addChangeListener( this._onDataChange ); }, componentWillUnmount: function() { SetupProgressStore.removeChangeListener( this._onChange ); SpinnerStore.removeChangeListener( this._onSpinnerChange ); DataStore.removeChangeListener( this._onDataChange ); }, _onChange: function() { this.setState( getSetupProgress() ); }, _onSpinnerChange: function() { this.setState( { showSpinner: SpinnerStore.showing(), spinnerMessage: SpinnerStore.getMessage() } ); }, _onDataChange: function() { this.setState( { saving: DataStore.isSaving() } ); }, getInitialState: function() { return getSetupProgress(); }, handleReset: function( e ) { e.preventDefault(); SetupProgressActions.resetData(); }, handleShowSpinner: function ( e ) { e.preventDefault(); SpinnerActions.show( "Testing spinner" ); }, handleHideSpinner: function ( e ) { e.preventDefault(); SpinnerActions.hide(); }, render: function() { return (