import _                                  from 'lodash';
  import { Meteor }                         from 'meteor/meteor';
  import React, { Component }               from 'react';
  import { Link }                           from 'react-router';
  import { Avatar }                         from '/imports/client/components/Avatar';
  import { Icon }                           from '/imports/client/components/Icon';
  import classNames                         from 'classnames';

  import { EnterModule }                    from '/imports/client/views/org/enter/module/index';
  // import { VerifyModule }                   from '/imports/client/views/verify/module/index';

  import { Navbar,Modal, Nav, NavItem,

    Glyphicon, Collapse,

    NavbarToggler, NavbarBrand,
    NavLink, DropdownItem, DropdownToggle, DropdownMenu,

    NavDropdown, MenuItem, Breadcrumb }                 from 'react-bootstrap';

    import { VerifyModule }                   from '/imports/client/views/verify/module/index'

  var Accordion = require('react-bootstrap').Accordion;
  var Panel = require('react-bootstrap').Panel;

  export class AppLayout extends Component {

    render() {

      console.log(this.props);

      const {user} = this.props.data;
  
      if(!user) {
        return (

          <EnterModule
            pane      = {this.props.location.query.enter}
            location  = {this.props.location}
          />

        );
      }

      if(!user.isEmailVerified()) {
        return (
          <VerifyModule
            pane      = {this.props.location.query.verify}
            location  = {this.props.location}
          />
        );
      }

      return (

        <div className = "appLayout-box">

          <div className="page-container">
              <div className="page-content">
                  <div className="sidebar sidebar-main sidebar-default">
                      <div className="sidebar-content">

                          <div className="sidebar-category sidebar-category-visible">
                              <div className="category-content no-padding">
                                  <Nav className="navigation navigation-main navigation-accordion">
                                      <NavItem className="navigation-header"><span>#schoolname</span> <i className="icon-menu" title="Main pages"></i></NavItem>
                                      <NavItem className="active" eventKey={1} href="#"><i className="icon-home4"></i> <span>Dashboard</span></NavItem>

                                      <NavDropdown eventKey={2} title="Settings" name="Settings" id="setting">

                                          <MenuItem eventKey={2.1}>Information</MenuItem>
                                          <MenuItem eventKey={2.2}>Infrastructure</MenuItem>
                                          <MenuItem eventKey={2.3}>Users</MenuItem>
                                          <MenuItem eventKey={2.4}>Academic Settings</MenuItem>
                                          <MenuItem eventKey={2.5}>Account Configuration</MenuItem>

                                      </NavDropdown>

                                      <NavDropdown eventKey={3} title="Academic" name="Academic" id="academic">
                                          <MenuItem eventKey={3.1}>Layout 1</MenuItem>
                                          <MenuItem eventKey={3.2}>Layout 2</MenuItem>
                                          <MenuItem eventKey={3.3}>Layout 3</MenuItem>
                                          <MenuItem eventKey={3.4}>Layout 4</MenuItem>
                                          <MenuItem eventKey={3.5}>Layout 5</MenuItem>
                                      </NavDropdown>
                                      <NavDropdown eventKey={4} title="Communication" name="Communication" id="communication">
                                          <MenuItem eventKey={4.1}>Primary palett</MenuItem>
                                          <MenuItem eventKey={4.2}>Danger palett</MenuItem>
                                          <MenuItem eventKey={4.3}>Success palett</MenuItem>
                                          <MenuItem eventKey={4.4}>Warning palett</MenuItem>
                                          <MenuItem divider />
                                          <MenuItem eventKey={4.5}>Info palett</MenuItem>
                                          <MenuItem eventKey={4.6}>Info palett</MenuItem>
                                          <MenuItem eventKey={4.7}>Info palett</MenuItem>
                                          <MenuItem eventKey={4.8}>Info palett</MenuItem>
                                      </NavDropdown>
                                      <NavDropdown eventKey={5} title="Finance" name="Finance" id="finance">
                                          <MenuItem eventKey={5.1}>Primary palett</MenuItem>
                                          <MenuItem eventKey={5.2}>Danger palett</MenuItem>
                                          <MenuItem eventKey={5.3}>Success palett</MenuItem>
                                          <MenuItem eventKey={5.4}>Warning palett</MenuItem>
                                          <NavDropdown eventKey={5.5} title="Calumns" id="calumns">
                                              <MenuItem>Success palett</MenuItem>
                                              <MenuItem>Warning palett</MenuItem>
                                          </NavDropdown>
                                      </NavDropdown>

                                      <NavItem eventKey={6} href="#"><i className="icon-file-stats"></i><span> Reports </span></NavItem>
                                      <NavItem eventKey={7} href="#"><i className="icon-design"></i> <span>Examinations</span></NavItem>

  
                                  </Nav>
                              </div>
                          </div>
                      </div>
                  </div>
          {/*end sidebar*/}
          	<div className="content-wrapper">

                  <div className="page-header page-header-default">
                      <div className="breadcrumb-line">

                          <Breadcrumb>
                              <Breadcrumb.Item href="#">
                                <i className="icon-home2 position-left"></i> Users
                              </Breadcrumb.Item>
                              <Breadcrumb.Item active href="#">
                               Setup
                              </Breadcrumb.Item>
                          </Breadcrumb>

                          <ul className="breadcrumb-elements">

                              <NavItem href="#"><i className="icon-comment-discussion position-left"></i> Support</NavItem>
                              <NavDropdown title="Settings" id="setting">
                                  <MenuItem><i className="icon-user-lock"></i> Account security</MenuItem>
                                  <MenuItem><i className="icon-statistics"></i> Analytics</MenuItem>
                                  <MenuItem><i className="icon-accessibility"></i> Accessibility</MenuItem>
                                  <MenuItem divider/>
                                  <MenuItem><i className="icon-gear"></i> All settings</MenuItem>
                              </NavDropdown>

                          </ul>

                      </div>
                  </div>

                  <div className="content">

          					<div className="row">
          						<div className="col-lg-3 col-md-6">
          							<div className="thumbnail">
          								<Link to="/students" >
            								<div className="thumb thumb-rounded">
            									<img src="assets/images/download2.png" alt="" />
            								</div>
          						    	<div className="caption text-center">
          						    		<h6 className="text-semibold no-margin">Students <small className="display-block">Click to view</small></h6>
          						    	</div>
          								</Link>
          					    	</div>
          						</div>
          						<div className="col-lg-3 col-md-6">
          							<div className="thumbnail">
          								<Link to="/teachers" >
            								<div className="thumb thumb-rounded">
            									<img src="assets/images/download3.png" alt=""/>
            								</div>
          						    	<div className="caption text-center">
          						    		<h6 className="text-semibold no-margin">Teachers <small className="display-block">Click to view</small></h6>
          						    	</div>
          								</Link>
          					    </div>
          						</div>
  
          					</div>
  				        </div>

              </div>

            </div>

          </div>

  
          <div className = "appLayout-wrapOuter">
            <div className = "appLayout-wrapInner">
              <div className = "appLayout-menuWrap">
  
              </div>
              <div className = "appLayout-contentWrap">
                <div className = "appLayout-content">

                </div>
              </div>
            </div>
          </div>
        </div>
      );
    };
  
  };