From 1f454b577f7db434d79388eb101006b065f62a2b Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Thu, 25 Dec 2014 16:10:47 +0100
Subject: web: CSP, revert functionality, serve content

---
 web/src/js/actions.js                   |  3 ++
 web/src/js/components/flowdetail.jsx.js | 75 +++++++++------------------------
 web/src/js/components/header.jsx.js     |  2 +-
 web/src/js/components/mainview.jsx.js   |  7 ++-
 4 files changed, 29 insertions(+), 58 deletions(-)

(limited to 'web/src')

diff --git a/web/src/js/actions.js b/web/src/js/actions.js
index 83dcb801..7f4fd0b0 100644
--- a/web/src/js/actions.js
+++ b/web/src/js/actions.js
@@ -89,6 +89,9 @@ var FlowActions = {
     replay: function(flow){
         jQuery.post("/flows/" + flow.id + "/replay");
     },
+    revert: function(flow){
+        jQuery.post("/flows/" + flow.id + "/revert");
+    },
     update: function (flow) {
         AppDispatcher.dispatchViewAction({
             type: ActionTypes.FLOW_STORE,
diff --git a/web/src/js/components/flowdetail.jsx.js b/web/src/js/components/flowdetail.jsx.js
index dfc0099e..594d1a0e 100644
--- a/web/src/js/components/flowdetail.jsx.js
+++ b/web/src/js/components/flowdetail.jsx.js
@@ -1,67 +1,20 @@
-var DeleteButton = React.createClass({
+var NavAction = React.createClass({
     onClick: function (e) {
         e.preventDefault();
-        FlowActions.delete(this.props.flow);
+        this.props.onClick();
     },
     render: function () {
         return (
-            <a title="[d]elete Flow"
+            <a title={this.props.title}
                 href="#"
                 className="nav-action"
                 onClick={this.onClick}>
-                <i className="fa fa-fw fa-trash"></i>
-            </a>
-        );
-    }
-});
-var DuplicateButton = React.createClass({
-    onClick: function (e) {
-        e.preventDefault();
-        FlowActions.duplicate(this.props.flow);
-    },
-    render: function () {
-        return (
-            <a title="[D]uplicate Flow"
-                href="#"
-                className="nav-action"
-                onClick={this.onClick}>
-                <i className="fa fa-fw fa-edit"></i>
-            </a>
-        );
-    }
-});
-var ReplayButton = React.createClass({
-    onClick: function (e) {
-        e.preventDefault();
-        FlowActions.replay(this.props.flow);
-    },
-    render: function () {
-        return (
-            <a title="[r]eplay Flow"
-                href="#"
-                className="nav-action"
-                onClick={this.onClick}>
-                <i className="fa fa-fw fa-close"></i>
-            </a>
-        );
-    }
-});
-var AcceptButton = React.createClass({
-    onClick: function (e) {
-        e.preventDefault();
-        FlowActions.accept(this.props.flow);
-    },
-    render: function () {
-        return (
-            <a title="[a]ccept (resume) Flow"
-                href="#"
-                className="nav-action"
-                onClick={this.onClick}>
-                <i className="fa fa-fw fa-play"></i>
+                <i className={"fa fa-fw " + this.props.icon}></i>
             </a>
         );
     }
 });
+
 var FlowDetailNav = React.createClass({
     render: function () {
         var flow = this.props.flow;
@@ -79,13 +32,23 @@ var FlowDetailNav = React.createClass({
                 onClick={onClick}>{str}</a>;
         }.bind(this));
 
+        var acceptButton = null;
+        if(flow.intercepted){
+            acceptButton = <NavAction title="[a]ccept intercepted flow" icon="fa-play" onClick={FlowActions.accept.bind(null, flow)} />
+        }
+        var revertButton = null;
+        if(flow.modified){
+            revertButton = <NavAction title="revert changes to flow [V]" icon="fa-history" onClick={FlowActions.revert.bind(null, flow)} />
+        }
+
         return (
             <nav ref="head" className="nav-tabs nav-tabs-sm">
                 {tabs}
-                <DeleteButton flow={flow}/>
-                <DuplicateButton flow={flow}/>
-                <ReplayButton flow={flow}/>
-                { flow.intercepted ? <AcceptButton flow={this.props.flow}/> : null }
+                <NavAction title="[d]elete flow" icon="fa-trash" onClick={FlowActions.delete.bind(null, flow)} />
+                <NavAction title="[D]uplicate flow" icon="fa-copy" onClick={FlowActions.duplicate.bind(null, flow)} />
+                <NavAction disabled title="[r]eplay flow" icon="fa-repeat" onClick={FlowActions.replay.bind(null, flow)} />
+                {acceptButton}
+                {revertButton}
             </nav>
         );
     }
diff --git a/web/src/js/components/header.jsx.js b/web/src/js/components/header.jsx.js
index e1016950..ba63f12e 100644
--- a/web/src/js/components/header.jsx.js
+++ b/web/src/js/components/header.jsx.js
@@ -260,7 +260,7 @@ var FileMenu = React.createClass({
                     <li role="presentation" className="divider"></li>
                     <li>
                         <a href="http://mitm.it/" target="_blank">
-                            <i className="fa fa-fw fa-lock"></i>
+                            <i className="fa fa-fw fa-external-link"></i>
                             Install Certificates...
                         </a>
                     </li>
diff --git a/web/src/js/components/mainview.jsx.js b/web/src/js/components/mainview.jsx.js
index 41f22a95..af65ca1e 100644
--- a/web/src/js/components/mainview.jsx.js
+++ b/web/src/js/components/mainview.jsx.js
@@ -171,7 +171,7 @@ var MainView = React.createClass({
             case Key.A:
                 if (e.shiftKey) {
                     FlowActions.accept_all();
-                } else if (flow) {
+                } else if (flow && flow.intercepted) {
                     FlowActions.accept(flow);
                 }
                 break;
@@ -180,6 +180,11 @@ var MainView = React.createClass({
                     FlowActions.replay(flow);
                 }
                 break;
+            case Key.V:
+                if(e.shiftKey && flow && flow.modified) {
+                    FlowActions.revert(flow);
+                }
+                break;
             default:
                 console.debug("keydown", e.keyCode);
                 return;
-- 
cgit v1.2.3