github.com/aitjcize/Overlord@v0.0.0-20240314041920-104a804cf5e8/overlord/app/common/js/NavBar.jsx (about)

     1  // Copyright 2015 The Chromium OS Authors. All rights reserved.
     2  // Use of this source code is governed by a BSD-style license that can be
     3  // found in the LICENSE file.
     4  //
     5  // Navigation bar for overlord apps.
     6  
     7  var NavBar = React.createClass({
     8    loadAppsFromServer: function () {
     9      $.ajax({
    10        url: this.props.url,
    11        dataType: "json",
    12        success: function (data) {
    13          this.setState(data);
    14        }.bind(this),
    15        error: function (xhr, status, err) {
    16          console.error(this.props.url, status, err.toString());
    17        }.bind(this)
    18      });
    19    },
    20    getInitialState: function () {
    21      return {apps: []};
    22    },
    23    componentDidMount: function () {
    24      this.loadAppsFromServer();
    25    },
    26    render: function () {
    27      return (
    28        <nav className="navbar navbar-default navbar-static-top">
    29          <div className="container-fluid">
    30            <div className="navbar-header">
    31              <a className="navbar-brand" href="">Overlord::{this.props.name}</a>
    32            </div>
    33            <div className="collapse navbar-collapse navbar-right" id="bs-example-navbar-collapse-1">
    34              <ul className="nav navbar-nav">
    35                <li className="dropdown">
    36                  <a href="#" className="dropdown-toggle" data-toggle="dropdown" role="button"
    37                    aria-expanded="false">Switch Apps <span className="caret"></span></a>
    38                  <ul className="dropdown-menu" role="menu">
    39                  {
    40                    this.state.apps.map(function (app) {
    41                      return (
    42                        <li key={app}><a href={"/" + app}>{app}</a></li>
    43                      );
    44                    })
    45                  }
    46                  </ul>
    47                </li>
    48              </ul>
    49            </div>
    50          </div>
    51        </nav>
    52      );
    53    }
    54  });