From 51db9a5612f0899ed61751dbee3f4e4b19a74ea4 Mon Sep 17 00:00:00 2001 From: Maximilian Hils Date: Wed, 17 Sep 2014 02:13:37 +0200 Subject: formatting --- libmproxy/web/static/js/app.js | 161 +++++++++++++++++++++-------------------- 1 file changed, 82 insertions(+), 79 deletions(-) (limited to 'libmproxy/web/static') diff --git a/libmproxy/web/static/js/app.js b/libmproxy/web/static/js/app.js index 6a157b24..90a004ef 100644 --- a/libmproxy/web/static/js/app.js +++ b/libmproxy/web/static/js/app.js @@ -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
{flow.request.method} {flow.request.scheme}://{flow.request.host}{flow.request.path}
; - }); */ + return
{flow.request.method} {flow.request.scheme}://{flow.request.host}{flow.request.path}
; + }); */ //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 => (
{row.message}
)); 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); }); -- cgit v1.2.3