mirror of
https://github.com/Grasscutters/mitmproxy.git
synced 2024-11-22 07:08:10 +00:00
formatting
This commit is contained in:
parent
d998790c2f
commit
51db9a5612
@ -4,32 +4,32 @@ const PayloadSources = {
|
||||
};
|
||||
|
||||
|
||||
function Dispatcher() {"use strict";
|
||||
function Dispatcher() {
|
||||
this.callbacks = [];
|
||||
}
|
||||
Dispatcher.prototype.register=function(callback) {"use strict";
|
||||
Dispatcher.prototype.register = function (callback) {
|
||||
this.callbacks.push(callback);
|
||||
};
|
||||
Dispatcher.prototype.unregister=function(callback) {"use strict";
|
||||
Dispatcher.prototype.unregister = function (callback) {
|
||||
var index = this.callbacks.indexOf(f);
|
||||
if (index >= 0) {
|
||||
this.callbacks.splice(this.callbacks.indexOf(f), 1);
|
||||
}
|
||||
};
|
||||
Dispatcher.prototype.dispatch=function(payload) {"use strict";
|
||||
Dispatcher.prototype.dispatch = function (payload) {
|
||||
console.debug("dispatch", payload);
|
||||
this.callbacks.forEach(function(callback) {
|
||||
this.callbacks.forEach(function (callback) {
|
||||
callback(payload);
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
AppDispatcher = new Dispatcher();
|
||||
AppDispatcher.dispatchViewAction = function(action) {
|
||||
AppDispatcher.dispatchViewAction = function (action) {
|
||||
action.actionSource = PayloadSources.VIEW_ACTION;
|
||||
this.dispatch(action);
|
||||
};
|
||||
AppDispatcher.dispatchServerAction = function(action) {
|
||||
AppDispatcher.dispatchServerAction = function (action) {
|
||||
action.actionSource = PayloadSources.SERVER_ACTION;
|
||||
this.dispatch(action);
|
||||
};
|
||||
@ -40,7 +40,7 @@ var ActionTypes = {
|
||||
};
|
||||
|
||||
var SettingsActions = {
|
||||
update:function(settings) {
|
||||
update: function (settings) {
|
||||
settings = _.merge({}, SettingsStore.getAll(), settings);
|
||||
//TODO: Update server.
|
||||
|
||||
@ -52,23 +52,22 @@ var SettingsActions = {
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
function EventEmitter() {
|
||||
this.listeners = {};
|
||||
}
|
||||
EventEmitter.prototype.emit=function(event) {
|
||||
EventEmitter.prototype.emit = function (event) {
|
||||
if (!(event in this.listeners)) {
|
||||
return;
|
||||
}
|
||||
this.listeners[event].forEach(function(listener) {
|
||||
this.listeners[event].forEach(function (listener) {
|
||||
listener.apply(this, arguments);
|
||||
}.bind(this));
|
||||
};
|
||||
EventEmitter.prototype.addListener=function(event, f) {
|
||||
EventEmitter.prototype.addListener = function (event, f) {
|
||||
this.listeners[event] = this.listeners[event] || [];
|
||||
this.listeners[event].push(f);
|
||||
};
|
||||
EventEmitter.prototype.removeListener=function(event, f) {
|
||||
EventEmitter.prototype.removeListener = function (event, f) {
|
||||
if (!(event in this.listeners)) {
|
||||
return false;
|
||||
}
|
||||
@ -78,7 +77,6 @@ EventEmitter.prototype.removeListener=function(event, f) {
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
function _SettingsStore() {
|
||||
EventEmitter.call(this);
|
||||
|
||||
@ -87,13 +85,13 @@ function _SettingsStore() {
|
||||
version: "0.12",
|
||||
showEventLog: true,
|
||||
mode: "transparent",
|
||||
};
|
||||
};
|
||||
}
|
||||
_.extend(_SettingsStore.prototype, EventEmitter.prototype, {
|
||||
getAll: function() {
|
||||
getAll: function () {
|
||||
return this.settings;
|
||||
},
|
||||
handle: function(action) {
|
||||
handle: function (action) {
|
||||
switch (action.actionType) {
|
||||
case ActionTypes.SETTINGS_UPDATE:
|
||||
this.settings = action.settings;
|
||||
@ -128,42 +126,47 @@ function EventLogView(store, live) {
|
||||
}
|
||||
}
|
||||
_.extend(EventLogView.prototype, EventEmitter.prototype, {
|
||||
close: function() {
|
||||
close: function () {
|
||||
this.$EventLogView_store.removeListener("new_entry", this.add);
|
||||
},
|
||||
getAll: function() {
|
||||
getAll: function () {
|
||||
return this.log;
|
||||
},
|
||||
add: function(entry) {
|
||||
add: function (entry) {
|
||||
this.log.push(entry);
|
||||
this.emit("change");
|
||||
},
|
||||
add_bulk: function(messages) {
|
||||
add_bulk: function (messages) {
|
||||
var log = messages;
|
||||
var last_id = log[log.length - 1].id;
|
||||
var to_add = _.filter(this.log, function(entry) {return 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");
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
function _EventLogStore(){
|
||||
function _EventLogStore() {
|
||||
EventEmitter.call(this);
|
||||
}
|
||||
_.extend(_EventLogStore.prototype, EventEmitter.prototype, {
|
||||
getView: function(since) {
|
||||
getView: function (since) {
|
||||
var view = new EventLogView(this, !since);
|
||||
|
||||
//TODO: Really do bulk retrieval of last messages.
|
||||
window.setTimeout(function() {
|
||||
view.add_bulk([{
|
||||
id: 1,
|
||||
message: "Hello World"
|
||||
}, {
|
||||
id: 2,
|
||||
message: "I was already transmitted as an event."
|
||||
}]);
|
||||
window.setTimeout(function () {
|
||||
view.add_bulk([
|
||||
{
|
||||
id: 1,
|
||||
message: "Hello World"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
message: "I was already transmitted as an event."
|
||||
}
|
||||
]);
|
||||
}, 100);
|
||||
|
||||
var id = 2;
|
||||
@ -175,7 +178,7 @@ _.extend(_EventLogStore.prototype, EventEmitter.prototype, {
|
||||
id: id++,
|
||||
message: "I was only transmitted as an event before the bulk was added.."
|
||||
});
|
||||
window.setInterval(function() {
|
||||
window.setInterval(function () {
|
||||
view.add({
|
||||
id: id++,
|
||||
message: "."
|
||||
@ -183,7 +186,7 @@ _.extend(_EventLogStore.prototype, EventEmitter.prototype, {
|
||||
}, 1000);
|
||||
return view;
|
||||
},
|
||||
handle: function(action) {
|
||||
handle: function (action) {
|
||||
switch (action.actionType) {
|
||||
case ActionTypes.EVENTLOG_ADD:
|
||||
this.emit("new_message", action.message);
|
||||
@ -201,10 +204,10 @@ AppDispatcher.register(EventLogStore.handle.bind(EventLogStore));
|
||||
function _Connection(url) {
|
||||
this.url = url;
|
||||
}
|
||||
_Connection.prototype.init=function() {
|
||||
_Connection.prototype.init = function () {
|
||||
this.openWebSocketConnection();
|
||||
};
|
||||
_Connection.prototype.openWebSocketConnection=function() {
|
||||
_Connection.prototype.openWebSocketConnection = function () {
|
||||
this.ws = new WebSocket(this.url.replace("http", "ws"));
|
||||
var ws = this.ws;
|
||||
|
||||
@ -213,17 +216,17 @@ _Connection.prototype.openWebSocketConnection=function() {
|
||||
ws.onerror = this.onerror.bind(this);
|
||||
ws.onclose = this.onclose.bind(this);
|
||||
};
|
||||
_Connection.prototype.onopen=function(open) {
|
||||
_Connection.prototype.onopen = function (open) {
|
||||
console.log("onopen", this, arguments);
|
||||
};
|
||||
_Connection.prototype.onmessage=function(message) {
|
||||
_Connection.prototype.onmessage = function (message) {
|
||||
//AppDispatcher.dispatchServerAction(...);
|
||||
console.log("onmessage", this, arguments);
|
||||
};
|
||||
_Connection.prototype.onerror=function(error) {
|
||||
_Connection.prototype.onerror = function (error) {
|
||||
console.log("onerror", this, arguments);
|
||||
};
|
||||
_Connection.prototype.onclose=function(close) {
|
||||
_Connection.prototype.onclose = function (close) {
|
||||
console.log("onclose", this, arguments);
|
||||
};
|
||||
|
||||
@ -232,28 +235,28 @@ var Connection = new _Connection(location.origin + "/updates");
|
||||
/** @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},
|
||||
React.DOM.i({className: "fa fa-database"}), " Display Event Log"
|
||||
)
|
||||
)
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
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");
|
||||
}
|
||||
});
|
||||
@ -278,22 +281,22 @@ 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){
|
||||
for (var item in _Header_Entries) {
|
||||
var classes = this.state.active == item ? "active" : "";
|
||||
header.push(React.DOM.a({key: item, href: "#", className: classes,
|
||||
onClick: this.handleClick.bind(this, item)}, _Header_Entries[item].title));
|
||||
@ -315,72 +318,72 @@ var Header = React.createClass({displayName: 'Header',
|
||||
menu
|
||||
)
|
||||
)
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
/** @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>;
|
||||
}); */
|
||||
return <div>{flow.request.method} {flow.request.scheme}://{flow.request.host}{flow.request.path}</div>;
|
||||
}); */
|
||||
//Dummy Text for layout testing
|
||||
x = "Flow";
|
||||
i = 12;
|
||||
while (i--) x += x;
|
||||
return (
|
||||
return (
|
||||
React.DOM.div(null, "Flow")
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
/** @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() {
|
||||
render: function () {
|
||||
//var messages = this.state.log.map(row => (<div key={row.id}>{row.message}</div>));
|
||||
var messages = [];
|
||||
return (
|
||||
@ -390,20 +393,20 @@ var EventLog = React.createClass({displayName: 'EventLog',
|
||||
messages
|
||||
)
|
||||
)
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
/** @jsx React.DOM */
|
||||
|
||||
var Footer = React.createClass({displayName: 'Footer',
|
||||
render: function(){
|
||||
render: function () {
|
||||
var mode = this.props.settings.mode;
|
||||
return (
|
||||
React.DOM.footer(null,
|
||||
mode != "regular" ? React.DOM.span({className: "label label-success"}, mode, " mode") : null
|
||||
)
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@ -411,27 +414,27 @@ var Footer = React.createClass({displayName: 'Footer',
|
||||
|
||||
//TODO: Move out of here, just a stub.
|
||||
var Reports = React.createClass({displayName: 'Reports',
|
||||
render: function(){
|
||||
return React.DOM.div(null, "Report Editor");
|
||||
render: function () {
|
||||
return React.DOM.div(null, "ReportEditor");
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
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}),
|
||||
@ -439,7 +442,7 @@ var ProxyAppMain = React.createClass({displayName: 'ProxyAppMain',
|
||||
this.state.settings.showEventLog ? EventLog(null) : null,
|
||||
Footer({settings: this.state.settings})
|
||||
)
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@ -452,9 +455,9 @@ var ProxyApp = (
|
||||
ReactRouter.Redirect({to: "main"})
|
||||
)
|
||||
)
|
||||
);
|
||||
);
|
||||
|
||||
$(function() {
|
||||
$(function () {
|
||||
Connection.init();
|
||||
app = React.renderComponent(ProxyApp, document.body);
|
||||
});
|
||||
|
@ -4,7 +4,7 @@ var ActionTypes = {
|
||||
};
|
||||
|
||||
var SettingsActions = {
|
||||
update:function(settings) {
|
||||
update: function (settings) {
|
||||
settings = _.merge({}, SettingsStore.getAll(), settings);
|
||||
//TODO: Update server.
|
||||
|
||||
|
@ -1,4 +1,4 @@
|
||||
$(function() {
|
||||
$(function () {
|
||||
Connection.init();
|
||||
app = React.renderComponent(ProxyApp, document.body);
|
||||
});
|
@ -1,30 +1,30 @@
|
||||
/** @jsx React.DOM */
|
||||
|
||||
var EventLog = React.createClass({
|
||||
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() {
|
||||
render: function () {
|
||||
//var messages = this.state.log.map(row => (<div key={row.id}>{row.message}</div>));
|
||||
var messages = [];
|
||||
return (
|
||||
@ -34,6 +34,6 @@ var EventLog = React.createClass({
|
||||
{messages}
|
||||
</pre>
|
||||
</div>
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
|
@ -1,12 +1,12 @@
|
||||
/** @jsx React.DOM */
|
||||
|
||||
var Footer = React.createClass({
|
||||
render: function(){
|
||||
render: function () {
|
||||
var mode = this.props.settings.mode;
|
||||
return (
|
||||
<footer>
|
||||
{mode != "regular" ? <span className="label label-success">{mode} mode</span> : null}
|
||||
</footer>
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
|
@ -1,28 +1,28 @@
|
||||
/** @jsx React.DOM */
|
||||
|
||||
var MainMenu = React.createClass({
|
||||
toggleEventLog: function() {
|
||||
toggleEventLog: function () {
|
||||
SettingsActions.update({
|
||||
showEventLog: !this.props.settings.showEventLog
|
||||
});
|
||||
},
|
||||
render: function(){
|
||||
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>
|
||||
</div>
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
var ToolsMenu = React.createClass({
|
||||
render: function(){
|
||||
render: function () {
|
||||
return <div>Tools Menu</div>;
|
||||
}
|
||||
});
|
||||
var ReportsMenu = React.createClass({
|
||||
render: function(){
|
||||
render: function () {
|
||||
return <div>Reports Menu</div>;
|
||||
}
|
||||
});
|
||||
@ -47,22 +47,22 @@ var _Header_Entries = {
|
||||
};
|
||||
|
||||
var Header = React.createClass({
|
||||
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){
|
||||
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>);
|
||||
@ -84,6 +84,6 @@ var Header = React.createClass({
|
||||
{ menu }
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
|
@ -2,27 +2,27 @@
|
||||
|
||||
//TODO: Move out of here, just a stub.
|
||||
var Reports = React.createClass({
|
||||
render: function(){
|
||||
return <div>Report Editor</div>;
|
||||
render: function () {
|
||||
return <div>ReportEditor</div>;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var ProxyAppMain = React.createClass({
|
||||
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 (
|
||||
<div id="container">
|
||||
<Header settings={this.state.settings}/>
|
||||
@ -30,7 +30,7 @@ var ProxyAppMain = React.createClass({
|
||||
{this.state.settings.showEventLog ? <EventLog/> : null}
|
||||
<Footer settings={this.state.settings}/>
|
||||
</div>
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
@ -43,4 +43,4 @@ var ProxyApp = (
|
||||
<ReactRouter.Redirect to="main"/>
|
||||
</ReactRouter.Route>
|
||||
</ReactRouter.Routes>
|
||||
);
|
||||
);
|
||||
|
@ -1,34 +1,34 @@
|
||||
/** @jsx React.DOM */
|
||||
|
||||
var TrafficTable = React.createClass({
|
||||
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>;
|
||||
}); */
|
||||
return <div>{flow.request.method} {flow.request.scheme}://{flow.request.host}{flow.request.path}</div>;
|
||||
}); */
|
||||
//Dummy Text for layout testing
|
||||
x = "Flow";
|
||||
i = 12;
|
||||
while (i--) x += x;
|
||||
return (
|
||||
return (
|
||||
<div>Flow</div>
|
||||
);
|
||||
);
|
||||
}
|
||||
});
|
||||
|
@ -1,10 +1,10 @@
|
||||
function _Connection(url) {
|
||||
this.url = url;
|
||||
}
|
||||
_Connection.prototype.init=function() {
|
||||
_Connection.prototype.init = function () {
|
||||
this.openWebSocketConnection();
|
||||
};
|
||||
_Connection.prototype.openWebSocketConnection=function() {
|
||||
_Connection.prototype.openWebSocketConnection = function () {
|
||||
this.ws = new WebSocket(this.url.replace("http", "ws"));
|
||||
var ws = this.ws;
|
||||
|
||||
@ -13,17 +13,17 @@ _Connection.prototype.openWebSocketConnection=function() {
|
||||
ws.onerror = this.onerror.bind(this);
|
||||
ws.onclose = this.onclose.bind(this);
|
||||
};
|
||||
_Connection.prototype.onopen=function(open) {
|
||||
_Connection.prototype.onopen = function (open) {
|
||||
console.log("onopen", this, arguments);
|
||||
};
|
||||
_Connection.prototype.onmessage=function(message) {
|
||||
_Connection.prototype.onmessage = function (message) {
|
||||
//AppDispatcher.dispatchServerAction(...);
|
||||
console.log("onmessage", this, arguments);
|
||||
};
|
||||
_Connection.prototype.onerror=function(error) {
|
||||
_Connection.prototype.onerror = function (error) {
|
||||
console.log("onerror", this, arguments);
|
||||
};
|
||||
_Connection.prototype.onclose=function(close) {
|
||||
_Connection.prototype.onclose = function (close) {
|
||||
console.log("onclose", this, arguments);
|
||||
};
|
||||
|
||||
|
@ -4,32 +4,32 @@ const PayloadSources = {
|
||||
};
|
||||
|
||||
|
||||
function Dispatcher() {"use strict";
|
||||
function Dispatcher() {
|
||||
this.callbacks = [];
|
||||
}
|
||||
Dispatcher.prototype.register=function(callback) {"use strict";
|
||||
Dispatcher.prototype.register = function (callback) {
|
||||
this.callbacks.push(callback);
|
||||
};
|
||||
Dispatcher.prototype.unregister=function(callback) {"use strict";
|
||||
Dispatcher.prototype.unregister = function (callback) {
|
||||
var index = this.callbacks.indexOf(f);
|
||||
if (index >= 0) {
|
||||
this.callbacks.splice(this.callbacks.indexOf(f), 1);
|
||||
}
|
||||
};
|
||||
Dispatcher.prototype.dispatch=function(payload) {"use strict";
|
||||
Dispatcher.prototype.dispatch = function (payload) {
|
||||
console.debug("dispatch", payload);
|
||||
this.callbacks.forEach(function(callback) {
|
||||
this.callbacks.forEach(function (callback) {
|
||||
callback(payload);
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
AppDispatcher = new Dispatcher();
|
||||
AppDispatcher.dispatchViewAction = function(action) {
|
||||
AppDispatcher.dispatchViewAction = function (action) {
|
||||
action.actionSource = PayloadSources.VIEW_ACTION;
|
||||
this.dispatch(action);
|
||||
};
|
||||
AppDispatcher.dispatchServerAction = function(action) {
|
||||
AppDispatcher.dispatchServerAction = function (action) {
|
||||
action.actionSource = PayloadSources.SERVER_ACTION;
|
||||
this.dispatch(action);
|
||||
};
|
||||
|
@ -1,20 +1,19 @@
|
||||
|
||||
function EventEmitter() {
|
||||
this.listeners = {};
|
||||
}
|
||||
EventEmitter.prototype.emit=function(event) {
|
||||
EventEmitter.prototype.emit = function (event) {
|
||||
if (!(event in this.listeners)) {
|
||||
return;
|
||||
}
|
||||
this.listeners[event].forEach(function(listener) {
|
||||
this.listeners[event].forEach(function (listener) {
|
||||
listener.apply(this, arguments);
|
||||
}.bind(this));
|
||||
};
|
||||
EventEmitter.prototype.addListener=function(event, f) {
|
||||
EventEmitter.prototype.addListener = function (event, f) {
|
||||
this.listeners[event] = this.listeners[event] || [];
|
||||
this.listeners[event].push(f);
|
||||
};
|
||||
EventEmitter.prototype.removeListener=function(event, f) {
|
||||
EventEmitter.prototype.removeListener = function (event, f) {
|
||||
if (!(event in this.listeners)) {
|
||||
return false;
|
||||
}
|
||||
|
@ -18,42 +18,47 @@ function EventLogView(store, live) {
|
||||
}
|
||||
}
|
||||
_.extend(EventLogView.prototype, EventEmitter.prototype, {
|
||||
close: function() {
|
||||
close: function () {
|
||||
this.$EventLogView_store.removeListener("new_entry", this.add);
|
||||
},
|
||||
getAll: function() {
|
||||
getAll: function () {
|
||||
return this.log;
|
||||
},
|
||||
add: function(entry) {
|
||||
add: function (entry) {
|
||||
this.log.push(entry);
|
||||
this.emit("change");
|
||||
},
|
||||
add_bulk: function(messages) {
|
||||
add_bulk: function (messages) {
|
||||
var log = messages;
|
||||
var last_id = log[log.length - 1].id;
|
||||
var to_add = _.filter(this.log, function(entry) {return 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");
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
function _EventLogStore(){
|
||||
function _EventLogStore() {
|
||||
EventEmitter.call(this);
|
||||
}
|
||||
_.extend(_EventLogStore.prototype, EventEmitter.prototype, {
|
||||
getView: function(since) {
|
||||
getView: function (since) {
|
||||
var view = new EventLogView(this, !since);
|
||||
|
||||
//TODO: Really do bulk retrieval of last messages.
|
||||
window.setTimeout(function() {
|
||||
view.add_bulk([{
|
||||
id: 1,
|
||||
message: "Hello World"
|
||||
}, {
|
||||
id: 2,
|
||||
message: "I was already transmitted as an event."
|
||||
}]);
|
||||
window.setTimeout(function () {
|
||||
view.add_bulk([
|
||||
{
|
||||
id: 1,
|
||||
message: "Hello World"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
message: "I was already transmitted as an event."
|
||||
}
|
||||
]);
|
||||
}, 100);
|
||||
|
||||
var id = 2;
|
||||
@ -65,7 +70,7 @@ _.extend(_EventLogStore.prototype, EventEmitter.prototype, {
|
||||
id: id++,
|
||||
message: "I was only transmitted as an event before the bulk was added.."
|
||||
});
|
||||
window.setInterval(function() {
|
||||
window.setInterval(function () {
|
||||
view.add({
|
||||
id: id++,
|
||||
message: "."
|
||||
@ -73,7 +78,7 @@ _.extend(_EventLogStore.prototype, EventEmitter.prototype, {
|
||||
}, 1000);
|
||||
return view;
|
||||
},
|
||||
handle: function(action) {
|
||||
handle: function (action) {
|
||||
switch (action.actionType) {
|
||||
case ActionTypes.EVENTLOG_ADD:
|
||||
this.emit("new_message", action.message);
|
||||
|
@ -1,4 +1,3 @@
|
||||
|
||||
function _SettingsStore() {
|
||||
EventEmitter.call(this);
|
||||
|
||||
@ -7,13 +6,13 @@ function _SettingsStore() {
|
||||
version: "0.12",
|
||||
showEventLog: true,
|
||||
mode: "transparent",
|
||||
};
|
||||
};
|
||||
}
|
||||
_.extend(_SettingsStore.prototype, EventEmitter.prototype, {
|
||||
getAll: function() {
|
||||
getAll: function () {
|
||||
return this.settings;
|
||||
},
|
||||
handle: function(action) {
|
||||
handle: function (action) {
|
||||
switch (action.actionType) {
|
||||
case ActionTypes.SETTINGS_UPDATE:
|
||||
this.settings = action.settings;
|
||||
|
Loading…
Reference in New Issue
Block a user