diff options
author | Maximilian Hils <git@maximilianhils.com> | 2014-12-10 17:44:45 +0100 |
---|---|---|
committer | Maximilian Hils <git@maximilianhils.com> | 2014-12-10 17:44:45 +0100 |
commit | 93e928dec4d1004d4f983ff343569f6966db9675 (patch) | |
tree | 05a894dc0d9df21620b6232331de66126eb9342b /web/src/js/components/header.jsx.js | |
parent | 7e40b8ab09d6d605307342fbfa21129ca15ff055 (diff) | |
download | mitmproxy-93e928dec4d1004d4f983ff343569f6966db9675.tar.gz mitmproxy-93e928dec4d1004d4f983ff343569f6966db9675.tar.bz2 mitmproxy-93e928dec4d1004d4f983ff343569f6966db9675.zip |
web: add file menu stub
Diffstat (limited to 'web/src/js/components/header.jsx.js')
-rw-r--r-- | web/src/js/components/header.jsx.js | 92 |
1 files changed, 83 insertions, 9 deletions
diff --git a/web/src/js/components/header.jsx.js b/web/src/js/components/header.jsx.js index a3fe4d51..a23afa9b 100644 --- a/web/src/js/components/header.jsx.js +++ b/web/src/js/components/header.jsx.js @@ -8,17 +8,20 @@ var MainMenu = React.createClass({ showEventLog: !this.props.settings.showEventLog }); }, - clearFlows: function(){ + clearFlows: function () { $.post("/flows/clear"); }, render: function () { return ( <div> <button className={"btn " + (this.props.settings.showEventLog ? "btn-primary" : "btn-default")} onClick={this.toggleEventLog}> - <i className="fa fa-database"></i> Display Event Log - </button> + <i className="fa fa-database"></i> + Display Event Log + </button> + <button className="btn btn-default" onClick={this.clearFlows}> - <i className="fa fa-eraser"></i> Clear Flows + <i className="fa fa-eraser"></i> + Clear Flows </button> </div> ); @@ -47,6 +50,80 @@ var ReportsMenu = React.createClass({ } }); +var FileMenu = React.createClass({ + getInitialState: function () { + return { + showFileMenu: false + }; + }, + handleFileClick: function (e) { + e.preventDefault(); + if (!this.state.showFileMenu) { + var close = function () { + this.setState({showFileMenu: false}); + document.removeEventListener("click", close); + }.bind(this); + document.addEventListener("click", close); + + this.setState({ + showFileMenu: true + }); + } + }, + handleNewClick: function(e){ + e.preventDefault(); + console.error("unimplemented: handleNewClick"); + }, + handleOpenClick: function(e){ + e.preventDefault(); + console.error("unimplemented: handleOpenClick"); + }, + handleSaveClick: function(e){ + e.preventDefault(); + console.error("unimplemented: handleSaveClick"); + }, + handleShutdownClick: function(e){ + e.preventDefault(); + console.error("unimplemented: handleShutdownClick"); + }, + render: function () { + var fileMenuClass = "dropdown pull-left" + (this.state.showFileMenu ? " open" : ""); + + return ( + <div className={fileMenuClass}> + <a href="#" className="special" onClick={this.handleFileClick}> File </a> + <ul className="dropdown-menu" role="menu"> + <li> + <a href="#" onClick={this.handleNewClick}> + <i className="fa fa-fw fa-file"></i> + New + </a> + </li> + <li> + <a href="#" onClick={this.handleOpenClick}> + <i className="fa fa-fw fa-folder-open"></i> + Open + </a> + </li> + <li> + <a href="#" onClick={this.handleSaveClick}> + <i className="fa fa-fw fa-save"></i> + Save + </a> + </li> + <li role="presentation" className="divider"></li> + <li> + <a href="#" onClick={this.handleShutdownClick}> + <i className="fa fa-fw fa-plug"></i> + Shutdown + </a> + </li> + </ul> + </div> + ); + } +}); + var header_entries = [MainMenu, ToolsMenu, ReportsMenu]; @@ -63,9 +140,6 @@ var Header = React.createClass({ this.transitionTo(active.route); this.setState({active: active}); }, - handleFileClick: function () { - console.log("File click"); - }, render: function () { var header = header_entries.map(function (entry, i) { var classes = React.addons.classSet({ @@ -85,10 +159,10 @@ var Header = React.createClass({ return ( <header> <div className="title-bar"> - mitmproxy { this.props.settings.version } + mitmproxy { this.props.settings.version } </div> <nav className="nav-tabs nav-tabs-lg"> - <a href="#" className="special" onClick={this.handleFileClick}> File </a> + <FileMenu/> {header} </nav> <div className="menu"> |