checkin assets

1 files changed, 272 insertions, 0 deletions

diff --git a/libmproxy/web/static/js/app.js b/libmproxy/web/static/js/app.js
new file mode 100644
index 00000000..8dada810
--- /dev/null
+++ b/libmproxy/web/static/js/app.js
@@ -0,0 +1,272 @@
+
+    function EventEmitter(){"use strict";
+        this.listeners = {};
+    }
+    EventEmitter.prototype.emit=function(event){"use strict";
+        if(!(event in this.listeners)){
+            return;
+        }
+        this.listeners[event].forEach(function (listener) {
+            listener(event, this);
+        }.bind(this));
+    };
+    EventEmitter.prototype.addListener=function(event, f){"use strict";
+        this.listeners[event] = this.listeners[event] || [];
+        this.listeners[event].push(f);
+    };
+    EventEmitter.prototype.removeListener=function(event, f){"use strict";
+        if(!(event in this.listeners)){
+            return false;
+        }
+        var index = this.listeners.indexOf(f);
+        if (index >= 0) {
+            this.listeners.splice(this.listeners.indexOf(f), 1);
+        }
+    };
+
+
+var FLOW_CHANGED = "flow.changed";
+
+for(var EventEmitter____Key in EventEmitter){if(EventEmitter.hasOwnProperty(EventEmitter____Key)){FlowStore[EventEmitter____Key]=EventEmitter[EventEmitter____Key];}}var ____SuperProtoOfEventEmitter=EventEmitter===null?null:EventEmitter.prototype;FlowStore.prototype=Object.create(____SuperProtoOfEventEmitter);FlowStore.prototype.constructor=FlowStore;FlowStore.__superConstructor__=EventEmitter;
+    function FlowStore() {"use strict";
+        EventEmitter.call(this);
+        this.flows = [];
+    }
+
+    FlowStore.prototype.getAll=function() {"use strict";
+        return this.flows;
+    };
+
+    FlowStore.prototype.close=function(){"use strict";
+        console.log("FlowStore.close()");
+        this.listeners = [];
+    };
+
+    FlowStore.prototype.emitChange=function() {"use strict";
+        return this.emit(FLOW_CHANGED);
+    };
+
+    FlowStore.prototype.addChangeListener=function(f) {"use strict";
+        this.addListener(FLOW_CHANGED, f);
+    };
+
+    FlowStore.prototype.removeChangeListener=function(f) {"use strict";
+        this.removeListener(FLOW_CHANGED, f);
+    };
+
+
+for(var FlowStore____Key in FlowStore){if(FlowStore.hasOwnProperty(FlowStore____Key)){DummyFlowStore[FlowStore____Key]=FlowStore[FlowStore____Key];}}var ____SuperProtoOfFlowStore=FlowStore===null?null:FlowStore.prototype;DummyFlowStore.prototype=Object.create(____SuperProtoOfFlowStore);DummyFlowStore.prototype.constructor=DummyFlowStore;DummyFlowStore.__superConstructor__=FlowStore;
+    function DummyFlowStore(flows) {"use strict";
+        FlowStore.call(this);
+        this.flows = flows;
+    }
+
+    DummyFlowStore.prototype.addFlow=function(flow) {"use strict";
+        this.flows.push(flow);
+        this.emitChange();
+    };
+
+
+
+var SETTINGS_CHANGED = "settings.changed";
+
+for(EventEmitter____Key in EventEmitter){if(EventEmitter.hasOwnProperty(EventEmitter____Key)){Settings[EventEmitter____Key]=EventEmitter[EventEmitter____Key];}}Settings.prototype=Object.create(____SuperProtoOfEventEmitter);Settings.prototype.constructor=Settings;Settings.__superConstructor__=EventEmitter;
+    function Settings(){"use strict";
+        EventEmitter.call(this);
+        this.settings = false;
+    }
+
+    Settings.prototype.getAll=function(){"use strict";
+        return this.settings;
+    };
+
+    Settings.prototype.emitChange=function() {"use strict";
+        return this.emit(SETTINGS_CHANGED);
+    };
+
+    Settings.prototype.addChangeListener=function(f) {"use strict";
+        this.addListener(SETTINGS_CHANGED, f);
+    };
+
+    Settings.prototype.removeChangeListener=function(f) {"use strict";
+        this.removeListener(SETTINGS_CHANGED, f);
+    };
+
+
+for(var Settings____Key in Settings){if(Settings.hasOwnProperty(Settings____Key)){DummySettings[Settings____Key]=Settings[Settings____Key];}}var ____SuperProtoOfSettings=Settings===null?null:Settings.prototype;DummySettings.prototype=Object.create(____SuperProtoOfSettings);DummySettings.prototype.constructor=DummySettings;DummySettings.__superConstructor__=Settings;
+    function DummySettings(settings){"use strict";
+        Settings.call(this);
+        this.settings = settings;
+    }
+    DummySettings.prototype.update=function(obj){"use strict";
+        _.merge(this.settings, obj);
+        this.emitChange();
+    };
+
+/** @jsx React.DOM */
+
+var Footer = React.createClass({displayName: 'Footer',
+    render : function(){
+        return (React.DOM.footer(null, 
+            React.DOM.span({className: "label label-success"}, "transparent mode")
+            ));
+    }
+});
+/** @jsx React.DOM */
+
+var MainMenu = React.createClass({displayName: 'MainMenu',
+    render : function(){
+        return (React.DOM.div(null, "Main Menu"));
+    }
+});
+var ToolsMenu = React.createClass({displayName: 'ToolsMenu',
+    render : function(){
+        return (React.DOM.div(null, "Tools Menu"));
+    }
+});
+var ReportsMenu = React.createClass({displayName: 'ReportsMenu',
+    render : function(){
+        return (React.DOM.div(null, "Reports Menu"));
+    }
+});
+
+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({displayName: 'Header',
+    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(React.DOM.a({key: item, href: "#", className: classes, 
+            onClick: this.handleClick.bind(this, item)},  _Header_Entries[item].title));
+        }
+
+        var menu = _Header_Entries[this.state.active].menu();
+        return (
+        React.DOM.header(null, 
+          React.DOM.div({className: "title-bar"}, 
+              "mitmproxy ",  this.props.settings.version
+          ), 
+          React.DOM.nav(null, 
+              React.DOM.a({href: "#", className: "special", onClick: this.handleFileClick}, " File "), 
+            header
+          ), 
+          React.DOM.div({className: "menu"}, 
+              menu 
+          )
+        ));
+    }
+});
+/** @jsx React.DOM */
+
+var App = React.createClass({displayName: 'App',
+    getInitialState: function () {
+        return {
+            settings: {} //TODO: How explicit should we get here?
+                         //List all subattributes?
+        };
+    },
+    componentDidMount: function () {
+        //TODO: Replace DummyStore with real settings over WS (https://facebook.github.io/react/tips/initial-ajax.html)
+        var settingsStore = new DummySettings({
+            version: "0.12"
+        });
+        this.setState({settingsStore: settingsStore});
+        settingsStore.addChangeListener(this.onSettingsChange);
+    },
+    onSettingsChange: function(event, settings){
+        this.setState({settings: settings.getAll()});
+    },
+    render: function () {
+    return (
+      React.DOM.div({id: "container"}, 
+        Header({settings: this.state.settings}), 
+        React.DOM.div({id: "main"}, 
+            this.props.activeRouteHandler({settings: this.state.settings})
+        ), 
+        Footer(null)
+      )
+    );
+    }
+});
+
+var TrafficTable = React.createClass({displayName: 'TrafficTable',
+    getInitialState: function(){
+        return {
+            flows: []
+        };
+    },
+    componentDidMount: function () {
+        var flowStore = new DummyFlowStore([]);
+        this.setState({flowStore: flowStore});
+
+        flowStore.addChangeListener(this.onFlowsChange);
+
+        $.getJSON("/flows.json").success(function (flows) {
+
+            flows.forEach(function (flow, i) {
+                window.setTimeout(function () {
+                    flowStore.addFlow(flow);
+                }, _.random(i*400,i*400+1000));
+            });
+
+        }.bind(this));
+    },
+    componentWillUnmount: function(){
+        this.state.flowStore.close();
+    },
+    onFlowsChange: function(event, flows){
+       this.setState({flows: flows.getAll()});
+    },
+    render: function () {
+       var flows = this.state.flows.map(function(flow){
+           return React.DOM.div(null, flow.request.method, " ", flow.request.scheme, "://", flow.request.host, flow.request.path);
+       });
+       return React.DOM.pre(null, flows);
+   }
+});
+
+var Reports = React.createClass({displayName: 'Reports',
+   render: function(){
+       return (React.DOM.div(null, "Report Editor"));
+   }
+});
+
+var routes = (
+  ReactRouter.Routes({location: "hash"}, 
+    ReactRouter.Route({name: "app", path: "/", handler: App}, 
+        ReactRouter.Route({name: "main", handler: TrafficTable}), 
+        ReactRouter.Route({name: "reports", handler: Reports}), 
+        ReactRouter.Redirect({to: "main"})
+    )
+  )
+);
+//# sourceMappingURL=app.js.map
\ No newline at end of file