old-ribica/front-ui/app/components/rootApp.js

var React = require('react'),
    SectionsListComponent = require('./shared/sectionsListComponent'),
    Router = require('react-router'),
    Link = Router.Link,
    RouteHandler = Router.RouteHandler,
    LoginStatus = require('./shared/loginStatus'),
    InitializationStore = require('../stores/initializationStore'),
    InitializationActions = require('../actions/initializationActions');

var CartIcon = require('./cart/cartIcon');
var SearchBox = require('./shared/searchBox');

var RootApp = React.createClass({

     // Add change listeners to stores
    componentDidMount: function() {
      InitializationStore.addChangeListener(this._onChange); 
      InitializationActions.initialize();
    },


    getInitialState: function() {
      return InitializationStore.getState();
    },


    _onChange: function () {
      if (this.isMounted()) {
        this.setState(InitializationStore.getState());         
      }
    },

    componentWillUnmount: function () {
      InitializationStore.removeChangeListener(this._onChange);
    },

    render: function() {

        if (!this.state.isEverythingReadyToStartTheShow) {
            return (<div>loading...</div>);
        }

        return (
<div className="container">
    <div className='page-header'>
        <h1 className="main-heading">
        
        <Link to="app"><img src="https://res.cloudinary.com/lfvt7ps2n/image/upload/c_scale,w_132/v1426226452/ribica-ispunjava-zelje_nng0gn.png" /></Link>

        </h1>
        <div style={{float:'right'}}>
            <div style={{display: 'inline-block'}}>
                <Link to="korpa">Završi narudžbu</Link><CartIcon /> | &nbsp;
            </div>
            <LoginStatus />
        </div>
    </div>
    <div className='row'>
        <div className='col-md-8' id='header'>
            <SectionsListComponent />
            </div>

        <div className="col-md-4">
            <SearchBox />
        </div>
        </div>

        <div className='row'>
            <RouteHandler />
        </div>
        
    </div>
            
            );
    }
});

module.exports = RootApp;