client/src/components/Navbar.js
changeset 167 1f340f3597a8
parent 163 78c54cb473cd
child 170 7da1d5137b0b
equal deleted inserted replaced
166:950a2350930f 167:1f340f3597a8
   146   }
   146   }
   147 
   147 
   148   render() {
   148   render() {
   149     return (
   149     return (
   150       <div>
   150       <div>
   151         <nav className="navbar navbar-expand-lg navbar-light bg-primary sticky-top">
   151       <nav className="navbar navbar-expand-lg navbar-light bg-primary sticky-top">
   152           <div className="container-fluid">
   152         <div className="container-fluid">
   153           <div className="navbar-header">
   153         <div className="navbar-header">
   154           <a className="navbar-brand" onClick={this.onClickHome} href="/">IRI Notes</a>
   154         <a className="navbar-brand" /*onClick={this.onClickHome}*/ href="/">IRI Notes</a>
   155           <button className="navbar-toggler mr-auto" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
   155         <button className="navbar-toggler mr-auto" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
   156                 <span className="navbar-toggler-icon"></span>
   156               <span className="navbar-toggler-icon"></span>
   157                 <span className="icon-bar"></span>
   157               <span className="icon-bar"></span>
   158                 <span className="icon-bar"></span>
   158               <span className="icon-bar"></span>
   159                 <span className="icon-bar"></span>
   159               <span className="icon-bar"></span>
   160               </button>
   160             </button>
       
   161           </div>
       
   162           <div className="collapse navbar-collapse text-center" id="navbarSupportedContent">
       
   163             <ul className="navbar-nav mr-auto">
       
   164               <li className="nav-item text-secondary">
       
   165                 <a className="nav-link " onClick={this.onClickSessions} href="/sessions">Sessions</a>
       
   166                 {/* <CreateSession
       
   167                     history={this.props.history}
       
   168                     group={this.props.currentGroup}
       
   169                     createSession={this.props.sessionsActions.createSession}
       
   170                   /> */}
       
   171               </li>
       
   172             </ul>
       
   173             <ul className="navbar-nav navbar-center">
       
   174                 <li className="nav-item text-secondary">
       
   175                 {/* <a className="nav-link " onClick={this.onClickSessions} href="/sessions">Sessions</a> */}
       
   176                   <CreateSession
       
   177                     history={this.props.history}
       
   178                     group={this.props.currentGroup}
       
   179                     createSession={this.props.sessionsActions.createSession}
       
   180                   />
       
   181                 </li>
       
   182             </ul>
       
   183             <ul className="nav navbar-nav ml-auto">
       
   184               <NavbarGroup currentGroup={this.props.currentGroup} groups={this.props.groups} onSelect={this.onGroupSelect}/>
       
   185               <SyncButton id='sync-button' isAuthenticated={this.props.isAuthenticated} onSyncClick={this.onSyncClick} isSynchronizing={this.props.isSynchronizing} isSynchronized={this.props.isSynchronized} />
       
   186               <Online {...this.props} />
       
   187               <NavbarLogin {...this.props} onLogout={this.onClickLogout} />
       
   188             </ul>
       
   189           </div>
       
   190           <Modal
       
   191           className="Modal__Bootstrap modal-dialog modal-dialog-centered"
       
   192           // closeTimeoutMS={150}
       
   193           isOpen={this.state.modalIsOpen}
       
   194           onRequestClose={this.handleModalCloseRequest}
       
   195           >
       
   196             <div id="logout-modal" className="modal-content">
       
   197               <span id="logout-close-modal-button" className="material-icons p-0 text-right" onClick={ this.handleModalCloseRequest }>close</span>
       
   198               <div className="modal-body text-center">
       
   199               <span className="material-icons modal-warning text-info pb-5">warning</span>
       
   200                 <p className="modal-text">
       
   201                   Certaines sessions n'ont pas encore été sauvegardées.
       
   202                   <br />
       
   203                   Si vous continuez, elles seront perdues.
       
   204                 </p>
       
   205               <button type="button" className="btn btn-info text-secondary font-weight-bold py-1 px-2 mb-3" id="logout-modal-button" onClick={ this.confirmLogout }>Confirmer</button>
       
   206               </div>
   161             </div>
   207             </div>
   162             <div className="collapse navbar-collapse text-center" id="navbarSupportedContent">
   208           </Modal>
   163               <ul className="navbar-nav mr-auto">
   209         </div>
   164                 <li className="nav-item">
   210       </nav>
   165                   <a className="nav-link " onClick={this.onClickSessions} href="/sessions">Sessions</a>
   211       <OffLineMessage isAuthenticated={this.props.isAuthenticated} />
   166                 </li>
       
   167               </ul>
       
   168               <ul className="navbar-nav navbar-center">
       
   169                   <li className="nav-item text-secondary">
       
   170                     <CreateSession
       
   171                       history={this.props.history}
       
   172                       group={this.props.currentGroup}
       
   173                       createSession={this.props.sessionsActions.createSession}
       
   174                     />
       
   175                   </li>
       
   176               </ul>
       
   177               <ul className="nav navbar-nav ml-auto">
       
   178                 <NavbarGroup currentGroup={this.props.currentGroup} groups={this.props.groups} onSelect={this.onGroupSelect}/>
       
   179                 <SyncButton id='sync-button' isAuthenticated={this.props.isAuthenticated} onSyncClick={this.onSyncClick} isSynchronizing={this.props.isSynchronizing} isSynchronized={this.props.isSynchronized} />
       
   180                 <Online {...this.props} />
       
   181                 <NavbarLogin {...this.props} onLogout={this.onClickLogout} />
       
   182               </ul>
       
   183             </div>
       
   184             <Modal
       
   185             className="Modal__Bootstrap modal-dialog modal-dialog-centered"
       
   186             // closeTimeoutMS={150}
       
   187             isOpen={this.state.modalIsOpen}
       
   188             onRequestClose={this.handleModalCloseRequest}
       
   189             >
       
   190               <div id="logout-modal" className="modal-content">
       
   191                 <span id="logout-close-modal-button" className="material-icons p-0 text-right" onClick={ this.handleModalCloseRequest }>close</span>
       
   192                 <div className="modal-body text-center">
       
   193                 <span className="material-icons modal-warning text-info pb-5">warning</span>
       
   194                   <p className="modal-text">
       
   195                     Certaines sessions n'ont pas encore été sauvegardées.
       
   196                     <br />
       
   197                     Si vous continuez, elles seront perdues.
       
   198                   </p>
       
   199                 <button type="button" className="btn btn-info text-secondary font-weight-bold py-1 px-2 mb-3" id="logout-modal-button" onClick={ this.confirmLogout }>Confirmer</button>
       
   200                 </div>
       
   201               </div>
       
   202             </Modal>
       
   203           </div>
       
   204         </nav>
       
   205         <OffLineMessage isAuthenticated={this.props.isAuthenticated} />
       
   206       </div>
   212       </div>
   207     );
   213     );
   208   }
   214   }
   209 }
   215 }
   210 
   216