Grasscutters/mitmproxy
3
0
Fork 0
mirror of https://github.com/Grasscutters/mitmproxy.git synced 2024-11-22 07:08:10 +00:00
Code Issues Projects Releases Wiki Activity

We're not ready for ES6

Browse Source 
Lets re-evaluate in June next year when it's actually released
This commit is contained in:
Aldo Cortesi 2014-09-16 16:26:16 +12:00
parent 6bac1540bd
commit 6efe1aa6a9
15 changed files with 176 additions and 169 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.gitignore vendored
View File

@ -1,3 +1,4 @@
.DS_Store
MANIFEST
/build
/dist
@ -23,4 +24,4 @@ libpathod
node_modules
bower_components
*.compiled.js
*.map
*.map

74
libmproxy/web/static/js/app.js
View File

@ -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 <div>{flow.request.method} {flow.request.scheme}://{flow.request.host}{flow.request.path}</div>;
}); */
@ -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 => (<div key={row.id}>{row.message}</div>));
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})
)
);
}

24
web/gulpfile.js
View File

@ -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())

4
web/src/js/actions.es6.js → web/src/js/actions.js
View File

@ -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
});
}
};
};

17
web/src/js/components/EventLog.react.js → web/src/js/components/eventlog.jsx
View File

@ -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 => (<div key={row.id}>{row.message}</div>));
render: function() {
//var messages = this.state.log.map(row => (<div key={row.id}>{row.message}</div>));
var messages = [];
return (
<div className="eventlog">
<pre>
@ -35,4 +36,4 @@ var EventLog = React.createClass({
</div>
);
}
});
});

4
web/src/js/components/Footer.react.js → web/src/js/components/footer.jsx
View File

@ -1,7 +1,7 @@
/** @jsx React.DOM */
var Footer = React.createClass({
render(){
render: function(){
var mode = this.props.settings.mode;
return (
<footer>
@ -9,4 +9,4 @@ var Footer = React.createClass({
</footer>
);
}
});
});

18
web/src/js/components/Header.react.js → web/src/js/components/header.jsx
View File

@ -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 (
<div>
<button className={"btn " + (this.props.settings.showEventLog ? "btn-primary" : "btn-default")} onClick={this.toggleEventLog}>
@ -17,12 +17,12 @@ var MainMenu = React.createClass({
}
});
var ToolsMenu = React.createClass({
render(){
render: function(){
return <div>Tools Menu</div>;
}
});
var ReportsMenu = React.createClass({
render(){
render: function(){
return <div>Reports Menu</div>;
}
});
@ -47,20 +47,20 @@ var _Header_Entries = {
};
var Header = React.createClass({
getInitialState(){
getInitialState: function(){
return {
active: "main"
};
},
handleClick(active){
handleClick: function(active){
this.setState({active: active});
ReactRouter.transitionTo(_Header_Entries[active].route);
return false;
},
handleFileClick(){
handleFileClick: function(){
console.log("File click");
},
render(){
render: function(){
var header = [];
for(var item in _Header_Entries){
var classes = this.state.active == item ? "active" : "";
@ -86,4 +86,4 @@ var Header = React.createClass({
</header>
);
}
});
});

20
web/src/js/components/ProxyApp.react.js → web/src/js/components/proxyapp.jsx
View File

@ -2,33 +2,33 @@
//TODO: Move out of here, just a stub.
var Reports = React.createClass({
render(){
render: function(){
return <div>Report Editor</div>;
}
});
var ProxyAppMain = React.createClass({
getInitialState(){
getInitialState: function(){
return { settings: SettingsStore.getAll() };
},
componentDidMount(){
componentDidMount: function(){
SettingsStore.addListener("change", this.onSettingsChange);
},
componentWillUnmount(){
componentWillUnmount: function(){
SettingsStore.removeListener("change", this.onSettingsChange);
},
onSettingsChange(){
onSettingsChange: function(){
console.log("onSettingsChange");
this.setState({settings: SettingsStore.getAll()});
},
render() {
render: function() {
return (
<div id="container">
<Header settings={this.state.settings}/>
<div id="main"><this.props.activeRouteHandler/></div>
{this.state.settings.showEventLog ? <EventLog/> : null}
<Footer settings={this.state.settings}/>
<Header settings={this.state.settings}/>
<div id="main"><this.props.activeRouteHandler/></div>
{this.state.settings.showEventLog ? <EventLog/> : null}
<Footer settings={this.state.settings}/>
</div>
);
}

12
web/src/js/components/TrafficTable.react.js → web/src/js/components/traffictable.jsx
View File

@ -1,25 +1,25 @@
/** @jsx React.DOM */
var TrafficTable = React.createClass({
getInitialState() {
getInitialState: function() {
return {
flows: []
};
},
componentDidMount() {
componentDidMount: function() {
//this.flowStore = FlowStore.getView();
//this.flowStore.addListener("change",this.onFlowChange);
},
componentWillUnmount() {
componentWillUnmount: function() {
//this.flowStore.removeListener("change",this.onFlowChange);
//this.flowStore.close();
},
onFlowChange() {
onFlowChange: function() {
this.setState({
//flows: this.flowStore.getAll()
});
},
render() {
render: function() {
/*var flows = this.state.flows.map(function(flow){
return <div>{flow.request.method} {flow.request.scheme}://{flow.request.host}{flow.request.path}</div>;
}); */
@ -31,4 +31,4 @@ var TrafficTable = React.createClass({
<div><pre> { x } </pre></div>
);
}
});
});

31
web/src/js/Connection.es6.js → web/src/js/connection.js
View File

@ -1,14 +1,13 @@
class _Connection {
constructor(root) {
function _Connection(root) {"use strict";
if (!root) {
root = location.origin + "/api/v1";
}
this.root = root;
}
init() {
_Connection.prototype.init=function() {"use strict";
this.openWebSocketConnection();
}
openWebSocketConnection() {
};
_Connection.prototype.openWebSocketConnection=function() {"use strict";
this.ws = new WebSocket(this.root.replace("http", "ws") + "/ws");
var ws = this.ws;
@ -16,19 +15,19 @@ class _Connection {
ws.onmessage = this.onmessage.bind(this);
ws.onerror = this.onerror.bind(this);
ws.onclose = this.onclose.bind(this);
}
onopen(open) {
};
_Connection.prototype.onopen=function(open) {"use strict";
console.log("onopen", this, arguments);
}
onmessage(message) {
};
_Connection.prototype.onmessage=function(message) {"use strict";
//AppDispatcher.dispatchServerAction(...);
console.log("onmessage", this, arguments);
}
onerror(error) {
};
_Connection.prototype.onerror=function(error) {"use strict";
console.log("onerror", this, arguments);
}
onclose(close) {
};
_Connection.prototype.onclose=function(close) {"use strict";
console.log("onclose", this, arguments);
}
}
var Connection = new _Connection();
};
var Connection = new _Connection();

22
web/src/js/Dispatcher.es6.js → web/src/js/dispatcher.js
View File

@ -3,26 +3,26 @@ const PayloadSources = {
SERVER_ACTION: "SERVER_ACTION"
};
class Dispatcher {
constructor() {
function Dispatcher() {"use strict";
this.callbacks = [];
}
register(callback) {
Dispatcher.prototype.register=function(callback) {"use strict";
this.callbacks.push(callback);
}
unregister(callback) {
};
Dispatcher.prototype.unregister=function(callback) {"use strict";
var index = this.callbacks.indexOf(f);
if (index >= 0) {
this.callbacks.splice(this.callbacks.indexOf(f), 1);
}
}
dispatch(payload) {
};
Dispatcher.prototype.dispatch=function(payload) {"use strict";
console.debug("dispatch", payload);
this.callbacks.forEach((callback) => {
this.callbacks.forEach(function(callback) {
callback(payload);
});
}
}
};
AppDispatcher = new Dispatcher();
AppDispatcher.dispatchViewAction = function(action) {
@ -32,4 +32,4 @@ AppDispatcher.dispatchViewAction = function(action) {
AppDispatcher.dispatchServerAction = function(action) {
action.actionSource = PayloadSources.SERVER_ACTION;
this.dispatch(action);
};
};

27
web/src/js/stores/SettingsStore.es6.js
View File

@ -1,27 +0,0 @@
class _SettingsStore extends EventEmitter {
constructor() {
super();
//FIXME: What do we do if we haven't requested anything from the server yet?
this.settings = {
version: "0.12",
showEventLog: true,
mode: "transparent",
};
}
getAll() {
return this.settings;
}
handle(action) {
switch (action.actionType) {
case ActionTypes.SETTINGS_UPDATE:
this.settings = action.settings;
this.emit("change");
break;
default:
return;
}
}
}
var SettingsStore = new _SettingsStore();
AppDispatcher.register(SettingsStore.handle.bind(SettingsStore));

16
web/src/js/stores/base.es6.js → web/src/js/stores/base.js
View File

@ -1,20 +1,19 @@
class EventEmitter {
constructor() {
function EventEmitter() {"use strict";
this.listeners = {};
}
emit(event) {
EventEmitter.prototype.emit=function(event) {"use strict";
if (!(event in this.listeners)) {
return;
}
this.listeners[event].forEach(function(listener) {
listener.apply(this, arguments);
}.bind(this));
}
addListener(event, f) {
};
EventEmitter.prototype.addListener=function(event, f) {"use strict";
this.listeners[event] = this.listeners[event] || [];
this.listeners[event].push(f);
}
removeListener(event, f) {
};
EventEmitter.prototype.removeListener=function(event, f) {"use strict";
if (!(event in this.listeners)) {
return false;
}
@ -22,5 +21,4 @@ class EventEmitter {
if (index >= 0) {
this.listeners[event].splice(index, 1);
}
}
}
};

46
web/src/js/stores/EventLogStore.es6.js → web/src/js/stores/eventlogstore.js
View File

@ -6,40 +6,40 @@
//
// See also: components/EventLog.react.js
class EventLogView extends EventEmitter {
constructor(store, live) {
super();
this._store = store;
for(var EventEmitter____Key in EventEmitter){if(EventEmitter.hasOwnProperty(EventEmitter____Key)){EventLogView[EventEmitter____Key]=EventEmitter[EventEmitter____Key];}}var ____SuperProtoOfEventEmitter=EventEmitter===null?null:EventEmitter.prototype;EventLogView.prototype=Object.create(____SuperProtoOfEventEmitter);EventLogView.prototype.constructor=EventLogView;EventLogView.__superConstructor__=EventEmitter;
function EventLogView(store, live) {"use strict";
EventEmitter.call(this);
this.$EventLogView_store = store;
this.live = live;
this.log = [];
this.add = this.add.bind(this);
if (live) {
this._store.addListener("new_entry", this.add);
this.$EventLogView_store.addListener("new_entry", this.add);
}
}
close() {
this._store.removeListener("new_entry", this.add);
}
getAll() {
EventLogView.prototype.close=function() {"use strict";
this.$EventLogView_store.removeListener("new_entry", this.add);
};
EventLogView.prototype.getAll=function() {"use strict";
return this.log;
}
add(entry) {
};
EventLogView.prototype.add=function(entry) {"use strict";
this.log.push(entry);
this.emit("change");
}
add_bulk(messages) {
};
EventLogView.prototype.add_bulk=function(messages) {"use strict";
var log = messages;
var last_id = log[log.length - 1].id;
var to_add = _.filter(this.log, entry => entry.id > last_id);
var to_add = _.filter(this.log, function(entry) {return entry.id > last_id;});
this.log = log.concat(to_add);
this.emit("change");
}
}
};
class _EventLogStore extends EventEmitter {
getView(since) {
for(EventEmitter____Key in EventEmitter){if(EventEmitter.hasOwnProperty(EventEmitter____Key)){_EventLogStore[EventEmitter____Key]=EventEmitter[EventEmitter____Key];}}_EventLogStore.prototype=Object.create(____SuperProtoOfEventEmitter);_EventLogStore.prototype.constructor=_EventLogStore;_EventLogStore.__superConstructor__=EventEmitter;function _EventLogStore(){"use strict";if(EventEmitter!==null){EventEmitter.apply(this,arguments);}}
_EventLogStore.prototype.getView=function(since) {"use strict";
var view = new EventLogView(this, !since);
//TODO: Really do bulk retrieval of last messages.
@ -69,8 +69,8 @@ class _EventLogStore extends EventEmitter {
});
}, 1000);
return view;
}
handle(action) {
};
_EventLogStore.prototype.handle=function(action) {"use strict";
switch (action.actionType) {
case ActionTypes.EVENTLOG_ADD:
this.emit("new_message", action.message);
@ -78,7 +78,7 @@ class _EventLogStore extends EventEmitter {
default:
return;
}
}
}
};
var EventLogStore = new _EventLogStore();
AppDispatcher.register(EventLogStore.handle.bind(EventLogStore));
AppDispatcher.register(EventLogStore.handle.bind(EventLogStore));

27
web/src/js/stores/settingstore.js Normal file
View File

@ -0,0 +1,27 @@
for(var EventEmitter____Key in EventEmitter){if(EventEmitter.hasOwnProperty(EventEmitter____Key)){_SettingsStore[EventEmitter____Key]=EventEmitter[EventEmitter____Key];}}var ____SuperProtoOfEventEmitter=EventEmitter===null?null:EventEmitter.prototype;_SettingsStore.prototype=Object.create(____SuperProtoOfEventEmitter);_SettingsStore.prototype.constructor=_SettingsStore;_SettingsStore.__superConstructor__=EventEmitter;
function _SettingsStore() {"use strict";
EventEmitter.call(this);
//FIXME: What do we do if we haven't requested anything from the server yet?
this.settings = {
version: "0.12",
showEventLog: true,
mode: "transparent",
};
}
_SettingsStore.prototype.getAll=function() {"use strict";
return this.settings;
};
_SettingsStore.prototype.handle=function(action) {"use strict";
switch (action.actionType) {
case ActionTypes.SETTINGS_UPDATE:
this.settings = action.settings;
this.emit("change");
break;
default:
return;
}
};
var SettingsStore = new _SettingsStore();
AppDispatcher.register(SettingsStore.handle.bind(SettingsStore));