blob: 85dc31067a4416946b79edf92b26c36684e0b4ae (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
|
/** @jsx React.DOM */
var MainMenu = React.createClass({
render: function(){
return (<div>Main Menu</div>);
}
});
var ToolsMenu = React.createClass({
render: function(){
return (<div>Tools Menu</div>);
}
});
var ReportsMenu = React.createClass({
render: function(){
return (<div>Reports Menu</div>);
}
});
var _Header_Entries = {
main: {
title: "Traffic",
route: "main",
menu: MainMenu
},
tools: {
title: "Tools",
route: "main",
menu: ToolsMenu
},
reports: {
title: "Visualization",
route: "reports",
menu: ReportsMenu
}
};
var Header = React.createClass({
getInitialState: function(){
return {active: "main"};
},
handleClick: function(active){
this.setState({active: active});
ReactRouter.transitionTo(_Header_Entries[active].route);
return false;
},
handleFileClick: function(){
console.log("File click");
},
render: function(){
var header = [];
for(var item in _Header_Entries){
var classes = this.state.active == item ? "active" : "";
header.push(<a key={item} href="#" className={classes}
onClick={this.handleClick.bind(this, item)}>{ _Header_Entries[item].title }</a>);
}
var menu = _Header_Entries[this.state.active].menu();
return (
<header>
<div className="title-bar">
mitmproxy { this.props.settings.version }
</div>
<nav>
<a href="#" className="special" onClick={this.handleFileClick}> File </a>
{header}
</nav>
<div className="menu">
{ menu }
</div>
</header>);
}
});
|
