From 0510c9b111aed03d0d3680db63614d50f231745c Mon Sep 17 00:00:00 2001
From: Aldo Cortesi <aldo@nullcube.com>
Date: Wed, 10 Sep 2014 14:22:26 +1200
Subject: Client-side framework for web application

---
 web/src/js/certinstall.jsx    | 27 +++++++++++++++++++++++++++
 web/src/js/certinstall_jsx.js | 27 +++++++++++++++++++++++++++
 web/src/js/mitmproxy.js       | 10 ++++++++++
 web/src/js/router.jsx         | 10 ++++++++++
 web/src/js/router_jsx.js      | 10 ++++++++++
 web/src/js/tests.js           |  5 +++++
 6 files changed, 89 insertions(+)
 create mode 100644 web/src/js/certinstall.jsx
 create mode 100644 web/src/js/certinstall_jsx.js
 create mode 100644 web/src/js/mitmproxy.js
 create mode 100644 web/src/js/router.jsx
 create mode 100644 web/src/js/router_jsx.js
 create mode 100644 web/src/js/tests.js

(limited to 'web/src/js')

diff --git a/web/src/js/certinstall.jsx b/web/src/js/certinstall.jsx
new file mode 100644
index 00000000..2e681ac2
--- /dev/null
+++ b/web/src/js/certinstall.jsx
@@ -0,0 +1,27 @@
+/** @jsx React.DOM */
+
+var CertInstallView = React.createClass({
+    render: function () {
+        return <div className="certinstall">
+            <h2> Click to install the mitmproxy certificate: </h2>
+            <div id="certbank" className="row">
+                <div className="col-md-3">
+                    <a href="/cert/pem"><i className="fa fa-apple fa-5x"></i></a>
+                    <p>Apple</p>
+                </div>
+                <div className="col-md-3">
+                    <a href="/cert/p12"><i className="fa fa-windows fa-5x"></i></a>
+                    <p>Windows</p>
+                </div>
+                <div className="col-md-3">
+                    <a href="/cert/pem"><i className="fa fa-android fa-5x"></i></a>
+                    <p>Android</p>
+                </div>
+                <div className="col-md-3">
+                    <a href="/cert/pem"><i className="fa fa-asterisk fa-5x"></i></a>
+                    <p>Other</p>
+                </div>
+            </div>
+        </div>;
+    }
+});
diff --git a/web/src/js/certinstall_jsx.js b/web/src/js/certinstall_jsx.js
new file mode 100644
index 00000000..17f9f807
--- /dev/null
+++ b/web/src/js/certinstall_jsx.js
@@ -0,0 +1,27 @@
+/** @jsx React.DOM */
+
+var CertInstallView = React.createClass({displayName: 'CertInstallView',
+    render: function () {
+        return React.DOM.div({className: "certinstall"}, 
+            React.DOM.h2(null, " Click to install the mitmproxy certificate: "), 
+            React.DOM.div({id: "certbank", className: "row"}, 
+                React.DOM.div({className: "col-md-3"}, 
+                    React.DOM.a({href: "/cert/pem"}, React.DOM.i({className: "fa fa-apple fa-5x"})), 
+                    React.DOM.p(null, "Apple")
+                ), 
+                React.DOM.div({className: "col-md-3"}, 
+                    React.DOM.a({href: "/cert/p12"}, React.DOM.i({className: "fa fa-windows fa-5x"})), 
+                    React.DOM.p(null, "Windows")
+                ), 
+                React.DOM.div({className: "col-md-3"}, 
+                    React.DOM.a({href: "/cert/pem"}, React.DOM.i({className: "fa fa-android fa-5x"})), 
+                    React.DOM.p(null, "Android")
+                ), 
+                React.DOM.div({className: "col-md-3"}, 
+                    React.DOM.a({href: "/cert/pem"}, React.DOM.i({className: "fa fa-asterisk fa-5x"})), 
+                    React.DOM.p(null, "Other")
+                )
+            )
+        );
+    }
+});
diff --git a/web/src/js/mitmproxy.js b/web/src/js/mitmproxy.js
new file mode 100644
index 00000000..87c45b34
--- /dev/null
+++ b/web/src/js/mitmproxy.js
@@ -0,0 +1,10 @@
+
+mitmproxy = function () {
+	function init() {
+		React.renderComponent(Router(), $("#mitmproxy")[0]);
+	}
+	var exports = {
+		init: init,
+	};
+	return exports;
+}();
\ No newline at end of file
diff --git a/web/src/js/router.jsx b/web/src/js/router.jsx
new file mode 100644
index 00000000..dc3e729b
--- /dev/null
+++ b/web/src/js/router.jsx
@@ -0,0 +1,10 @@
+/** @jsx React.DOM */
+
+var Router = React.createClass({
+    render: function(){
+        return <ReactRouter.Routes location="hash">
+            <ReactRouter.Route name="certs" path="/" handler={CertInstallView}/>
+            <ReactRouter.Route name="other" path="/other" handler={CertInstallView}/>
+        </ReactRouter.Routes>;
+    }
+});
diff --git a/web/src/js/router_jsx.js b/web/src/js/router_jsx.js
new file mode 100644
index 00000000..707715de
--- /dev/null
+++ b/web/src/js/router_jsx.js
@@ -0,0 +1,10 @@
+/** @jsx React.DOM */
+
+var Router = React.createClass({displayName: 'Router',
+    render: function(){
+        return ReactRouter.Routes({location: "hash"}, 
+            ReactRouter.Route({name: "certs", path: "/", handler: CertInstallView}), 
+            ReactRouter.Route({name: "other", path: "/other", handler: CertInstallView})
+        );
+    }
+});
diff --git a/web/src/js/tests.js b/web/src/js/tests.js
new file mode 100644
index 00000000..254bad72
--- /dev/null
+++ b/web/src/js/tests.js
@@ -0,0 +1,5 @@
+
+
+QUnit.test("example test", function (assert) {
+    assert.ok(true);
+});
\ No newline at end of file
-- 
cgit v1.2.3