diff --git a/.gitignore b/.gitignore
index d75774f37..e1d46dc1d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
+.DS_Store
MANIFEST
/build
/dist
@@ -23,4 +24,4 @@ libpathod
node_modules
bower_components
*.compiled.js
-*.map
\ No newline at end of file
+*.map
diff --git a/libmproxy/web/static/js/app.js b/libmproxy/web/static/js/app.js
index dbaa5cb4b..991f9af31 100644
--- a/libmproxy/web/static/js/app.js
+++ b/libmproxy/web/static/js/app.js
@@ -33,6 +33,7 @@ AppDispatcher.dispatchServerAction = function(action) {
action.actionSource = PayloadSources.SERVER_ACTION;
this.dispatch(action);
};
+
var ActionTypes = {
SETTINGS_UPDATE: "SETTINGS_UPDATE",
EVENTLOG_ADD: "EVENTLOG_ADD"
@@ -51,7 +52,7 @@ var SettingsActions = {
}
};
- function EventEmitter() {"use strict";
+function EventEmitter() {"use strict";
this.listeners = {};
}
EventEmitter.prototype.emit=function(event) {"use strict";
@@ -103,6 +104,7 @@ for(var EventEmitter____Key in EventEmitter){if(EventEmitter.hasOwnProperty(Even
var SettingsStore = new _SettingsStore();
AppDispatcher.register(SettingsStore.handle.bind(SettingsStore));
+
//
// We have an EventLogView and an EventLogStore:
// The basic architecture is that one can request views on the event log
@@ -188,7 +190,7 @@ for(EventEmitter____Key in EventEmitter){if(EventEmitter.hasOwnProperty(EventEmi
var EventLogStore = new _EventLogStore();
AppDispatcher.register(EventLogStore.handle.bind(EventLogStore));
- function _Connection(root) {"use strict";
+function _Connection(root) {"use strict";
if (!root) {
root = location.origin + "/api/v1";
}
@@ -221,15 +223,16 @@ AppDispatcher.register(EventLogStore.handle.bind(EventLogStore));
};
var Connection = new _Connection();
+
/** @jsx React.DOM */
var MainMenu = React.createClass({displayName: 'MainMenu',
- toggleEventLog:function() {
+ toggleEventLog: function() {
SettingsActions.update({
showEventLog: !this.props.settings.showEventLog
});
},
- render:function(){
+ render: function(){
return (
React.DOM.div(null,
React.DOM.button({className: "btn " + (this.props.settings.showEventLog ? "btn-primary" : "btn-default"), onClick: this.toggleEventLog},
@@ -240,12 +243,12 @@ var MainMenu = React.createClass({displayName: 'MainMenu',
}
});
var ToolsMenu = React.createClass({displayName: 'ToolsMenu',
- render:function(){
+ render: function(){
return React.DOM.div(null, "Tools Menu");
}
});
var ReportsMenu = React.createClass({displayName: 'ReportsMenu',
- render:function(){
+ render: function(){
return React.DOM.div(null, "Reports Menu");
}
});
@@ -270,20 +273,20 @@ var _Header_Entries = {
};
var Header = React.createClass({displayName: 'Header',
- getInitialState:function(){
+ getInitialState: function(){
return {
active: "main"
};
},
- handleClick:function(active){
+ handleClick: function(active){
this.setState({active: active});
ReactRouter.transitionTo(_Header_Entries[active].route);
return false;
},
- handleFileClick:function(){
+ handleFileClick: function(){
console.log("File click");
},
- render:function(){
+ render: function(){
var header = [];
for(var item in _Header_Entries){
var classes = this.state.active == item ? "active" : "";
@@ -310,28 +313,29 @@ var Header = React.createClass({displayName: 'Header',
);
}
});
+
/** @jsx React.DOM */
var TrafficTable = React.createClass({displayName: 'TrafficTable',
- getInitialState:function() {
+ getInitialState: function() {
return {
flows: []
};
},
- componentDidMount:function() {
+ componentDidMount: function() {
//this.flowStore = FlowStore.getView();
//this.flowStore.addListener("change",this.onFlowChange);
},
- componentWillUnmount:function() {
+ componentWillUnmount: function() {
//this.flowStore.removeListener("change",this.onFlowChange);
//this.flowStore.close();
},
- onFlowChange:function() {
+ onFlowChange: function() {
this.setState({
//flows: this.flowStore.getAll()
});
},
- render:function() {
+ render: function() {
/*var flows = this.state.flows.map(function(flow){
return
{flow.request.method} {flow.request.scheme}://{flow.request.host}{flow.request.path}
;
}); */
@@ -344,34 +348,36 @@ var TrafficTable = React.createClass({displayName: 'TrafficTable',
);
}
});
+
/** @jsx React.DOM */
var EventLog = React.createClass({displayName: 'EventLog',
- getInitialState:function() {
+ getInitialState: function() {
return {
log: []
};
},
- componentDidMount:function() {
+ componentDidMount: function() {
this.log = EventLogStore.getView();
this.log.addListener("change", this.onEventLogChange);
},
- componentWillUnmount:function() {
+ componentWillUnmount: function() {
this.log.removeListener("change", this.onEventLogChange);
this.log.close();
},
- onEventLogChange:function() {
+ onEventLogChange: function() {
this.setState({
log: this.log.getAll()
});
},
- close:function() {
+ close: function() {
SettingsActions.update({
showEventLog: false
});
},
- render:function() {
- var messages = this.state.log.map(function(row) {return React.DOM.div({key: row.id}, row.message);});
+ render: function() {
+ //var messages = this.state.log.map(row => ({row.message}
));
+ var messages = [];
return (
React.DOM.div({className: "eventlog"},
React.DOM.pre(null,
@@ -382,10 +388,11 @@ var EventLog = React.createClass({displayName: 'EventLog',
);
}
});
+
/** @jsx React.DOM */
var Footer = React.createClass({displayName: 'Footer',
- render:function(){
+ render: function(){
var mode = this.props.settings.mode;
return (
React.DOM.footer(null,
@@ -394,37 +401,38 @@ var Footer = React.createClass({displayName: 'Footer',
);
}
});
+
/** @jsx React.DOM */
//TODO: Move out of here, just a stub.
var Reports = React.createClass({displayName: 'Reports',
- render:function(){
+ render: function(){
return React.DOM.div(null, "Report Editor");
}
});
var ProxyAppMain = React.createClass({displayName: 'ProxyAppMain',
- getInitialState:function(){
+ getInitialState: function(){
return { settings: SettingsStore.getAll() };
},
- componentDidMount:function(){
+ componentDidMount: function(){
SettingsStore.addListener("change", this.onSettingsChange);
},
- componentWillUnmount:function(){
+ componentWillUnmount: function(){
SettingsStore.removeListener("change", this.onSettingsChange);
},
- onSettingsChange:function(){
+ onSettingsChange: function(){
console.log("onSettingsChange");
this.setState({settings: SettingsStore.getAll()});
},
- render:function() {
+ render: function() {
return (
React.DOM.div({id: "container"},
- Header({settings: this.state.settings}),
- React.DOM.div({id: "main"}, this.props.activeRouteHandler(null)),
- this.state.settings.showEventLog ? EventLog(null) : null,
- Footer({settings: this.state.settings})
+ Header({settings: this.state.settings}),
+ React.DOM.div({id: "main"}, this.props.activeRouteHandler(null)),
+ this.state.settings.showEventLog ? EventLog(null) : null,
+ Footer({settings: this.state.settings})
)
);
}
diff --git a/web/gulpfile.js b/web/gulpfile.js
index 6f72016bf..50c1a3faf 100644
--- a/web/gulpfile.js
+++ b/web/gulpfile.js
@@ -32,17 +32,17 @@ var path = {
'vendor/react-bootstrap/react-bootstrap.js'
],
app: [
- 'js/Dispatcher.es6.js',
- 'js/actions.es6.js',
- 'js/stores/base.es6.js',
- 'js/stores/SettingsStore.es6.js',
- 'js/stores/EventLogStore.es6.js',
- 'js/Connection.es6.js',
- 'js/components/Header.react.js',
- 'js/components/TrafficTable.react.js',
- 'js/components/EventLog.react.js',
- 'js/components/Footer.react.js',
- 'js/components/ProxyApp.react.js',
+ 'js/dispatcher.js',
+ 'js/actions.js',
+ 'js/stores/base.js',
+ 'js/stores/settingstore.js',
+ 'js/stores/eventlogstore.js',
+ 'js/connection.js',
+ 'js/components/header.jsx',
+ 'js/components/traffictable.jsx',
+ 'js/components/eventlog.jsx',
+ 'js/components/footer.jsx',
+ 'js/components/proxyapp.jsx',
'js/app.js',
],
},
@@ -81,7 +81,7 @@ function scripts(files, filename, dev) {
return gulp.src(files, {base: "src", cwd: "src"})
.pipe(dev ? dont_break_on_errors(): gutil.noop())
.pipe(dev ? sourcemaps.init() : gutil.noop())
- .pipe(react({harmony: true}))
+ .pipe(react({harmony: false}))
.pipe(concat(filename))
.pipe(!dev ? uglify() : gutil.noop())
.pipe(dev ? sourcemaps.write(".", {sourceRoot: "/static"}) : gutil.noop())
diff --git a/web/src/js/actions.es6.js b/web/src/js/actions.js
similarity index 92%
rename from web/src/js/actions.es6.js
rename to web/src/js/actions.js
index 55cb45524..6eecd78e6 100644
--- a/web/src/js/actions.es6.js
+++ b/web/src/js/actions.js
@@ -4,7 +4,7 @@ var ActionTypes = {
};
var SettingsActions = {
- update(settings) {
+ update:function(settings) {
settings = _.merge({}, SettingsStore.getAll(), settings);
//TODO: Update server.
@@ -14,4 +14,4 @@ var SettingsActions = {
settings: settings
});
}
-};
\ No newline at end of file
+};
diff --git a/web/src/js/components/EventLog.react.js b/web/src/js/components/eventlog.jsx
similarity index 70%
rename from web/src/js/components/EventLog.react.js
rename to web/src/js/components/eventlog.jsx
index 6c7a7c587..530e9f4f9 100644
--- a/web/src/js/components/EventLog.react.js
+++ b/web/src/js/components/eventlog.jsx
@@ -1,31 +1,32 @@
/** @jsx React.DOM */
var EventLog = React.createClass({
- getInitialState() {
+ getInitialState: function() {
return {
log: []
};
},
- componentDidMount() {
+ componentDidMount: function() {
this.log = EventLogStore.getView();
this.log.addListener("change", this.onEventLogChange);
},
- componentWillUnmount() {
+ componentWillUnmount: function() {
this.log.removeListener("change", this.onEventLogChange);
this.log.close();
},
- onEventLogChange() {
+ onEventLogChange: function() {
this.setState({
log: this.log.getAll()
});
},
- close() {
+ close: function() {
SettingsActions.update({
showEventLog: false
});
},
- render() {
- var messages = this.state.log.map(row => ({row.message}
));
+ render: function() {
+ //var messages = this.state.log.map(row => ({row.message}
));
+ var messages = [];
return (
@@ -35,4 +36,4 @@ var EventLog = React.createClass({
);
}
-});
\ No newline at end of file
+});
diff --git a/web/src/js/components/Footer.react.js b/web/src/js/components/footer.jsx
similarity index 90%
rename from web/src/js/components/Footer.react.js
rename to web/src/js/components/footer.jsx
index 20a4abfbf..6d5b75a18 100644
--- a/web/src/js/components/Footer.react.js
+++ b/web/src/js/components/footer.jsx
@@ -1,7 +1,7 @@
/** @jsx React.DOM */
var Footer = React.createClass({
- render(){
+ render: function(){
var mode = this.props.settings.mode;
return (
);
}
-});
\ No newline at end of file
+});
diff --git a/web/src/js/components/Header.react.js b/web/src/js/components/header.jsx
similarity index 90%
rename from web/src/js/components/Header.react.js
rename to web/src/js/components/header.jsx
index 0131d3509..e63501717 100644
--- a/web/src/js/components/Header.react.js
+++ b/web/src/js/components/header.jsx
@@ -1,12 +1,12 @@
/** @jsx React.DOM */
var MainMenu = React.createClass({
- toggleEventLog() {
+ toggleEventLog: function() {
SettingsActions.update({
showEventLog: !this.props.settings.showEventLog
});
},
- render(){
+ render: function(){
return (