[web] FlowView and ContentView

1 files changed, 0 insertions, 320 deletions

diff --git a/web/src/js/components/flowview/messages.js b/web/src/js/components/flowview/messages.js
deleted file mode 100644
index 2885b3b1..00000000
--- a/web/src/js/components/flowview/messages.js
+++ /dev/null
@@ -1,320 +0,0 @@
-import React from "react";
-import ReactDOM from 'react-dom';
-import _ from "lodash";
-
-import {FlowActions} from "../../actions.js";
-import {RequestUtils, isValidHttpVersion, parseUrl, parseHttpVersion} from "../../flow/utils.js";
-import {Key, formatTimeStamp} from "../../utils.js";
-import ContentView from "./contentview.js";
-import {ValueEditor} from "../editor.js";
-
-var Headers = React.createClass({
-    propTypes: {
-        onChange: React.PropTypes.func.isRequired,
-        message: React.PropTypes.object.isRequired
-    },
-    onChange: function (row, col, val) {
-        var nextHeaders = _.cloneDeep(this.props.message.headers);
-        nextHeaders[row][col] = val;
-        if (!nextHeaders[row][0] && !nextHeaders[row][1]) {
-            // do not delete last row
-            if (nextHeaders.length === 1) {
-                nextHeaders[0][0] = "Name";
-                nextHeaders[0][1] = "Value";
-            } else {
-                nextHeaders.splice(row, 1);
-                // manually move selection target if this has been the last row.
-                if (row === nextHeaders.length) {
-                    this._nextSel = (row - 1) + "-value";
-                }
-            }
-        }
-        this.props.onChange(nextHeaders);
-    },
-    edit: function () {
-        this.refs["0-key"].focus();
-    },
-    onTab: function (row, col, e) {
-        var headers = this.props.message.headers;
-        if (row === headers.length - 1 && col === 1) {
-            e.preventDefault();
-
-            var nextHeaders = _.cloneDeep(this.props.message.headers);
-            nextHeaders.push(["Name", "Value"]);
-            this.props.onChange(nextHeaders);
-            this._nextSel = (row + 1) + "-key";
-        }
-    },
-    componentDidUpdate: function () {
-        if (this._nextSel && this.refs[this._nextSel]) {
-            this.refs[this._nextSel].focus();
-            this._nextSel = undefined;
-        }
-    },
-    onRemove: function (row, col, e) {
-        if (col === 1) {
-            e.preventDefault();
-            this.refs[row + "-key"].focus();
-        } else if (row > 0) {
-            e.preventDefault();
-            this.refs[(row - 1) + "-value"].focus();
-        }
-    },
-    render: function () {
-
-        var rows = this.props.message.headers.map(function (header, i) {
-
-            var kEdit = <HeaderEditor
-                ref={i + "-key"}
-                content={header[0]}
-                onDone={this.onChange.bind(null, i, 0)}
-                onRemove={this.onRemove.bind(null, i, 0)}
-                onTab={this.onTab.bind(null, i, 0)}/>;
-            var vEdit = <HeaderEditor
-                ref={i + "-value"}
-                content={header[1]}
-                onDone={this.onChange.bind(null, i, 1)}
-                onRemove={this.onRemove.bind(null, i, 1)}
-                onTab={this.onTab.bind(null, i, 1)}/>;
-            return (
-                <tr key={i}>
-                    <td className="header-name">{kEdit}:</td>
-                    <td className="header-value">{vEdit}</td>
-                </tr>
-            );
-        }.bind(this));
-        return (
-            <table className="header-table">
-                <tbody>
-                    {rows}
-                </tbody>
-            </table>
-        );
-    }
-});
-
-var HeaderEditor = React.createClass({
-    render: function () {
-        return <ValueEditor ref="input" {...this.props} onKeyDown={this.onKeyDown} inline/>;
-    },
-    focus: function () {
-        ReactDOM.findDOMNode(this).focus();
-    },
-    onKeyDown: function (e) {
-        switch (e.keyCode) {
-            case Key.BACKSPACE:
-                var s = window.getSelection().getRangeAt(0);
-                if (s.startOffset === 0 && s.endOffset === 0) {
-                    this.props.onRemove(e);
-                }
-                break;
-            case Key.TAB:
-                if (!e.shiftKey) {
-                    this.props.onTab(e);
-                }
-                break;
-        }
-    }
-});
-
-var RequestLine = React.createClass({
-    render: function () {
-        var flow = this.props.flow;
-        var url = RequestUtils.pretty_url(flow.request);
-        var httpver = flow.request.http_version;
-
-        return <div className="first-line request-line">
-            <ValueEditor
-                ref="method"
-                content={flow.request.method}
-                onDone={this.onMethodChange}
-                inline/>
-        &nbsp;
-            <ValueEditor
-                ref="url"
-                content={url}
-                onDone={this.onUrlChange}
-                isValid={this.isValidUrl}
-                inline/>
-        &nbsp;
-            <ValueEditor
-                ref="httpVersion"
-                content={httpver}
-                onDone={this.onHttpVersionChange}
-                isValid={isValidHttpVersion}
-                inline/>
-        </div>
-    },
-    isValidUrl: function (url) {
-        var u = parseUrl(url);
-        return !!u.host;
-    },
-    onMethodChange: function (nextMethod) {
-        FlowActions.update(
-            this.props.flow,
-            {request: {method: nextMethod}}
-        );
-    },
-    onUrlChange: function (nextUrl) {
-        var props = parseUrl(nextUrl);
-        props.path = props.path || "";
-        FlowActions.update(
-            this.props.flow,
-            {request: props}
-        );
-    },
-    onHttpVersionChange: function (nextVer) {
-        var ver = parseHttpVersion(nextVer);
-        FlowActions.update(
-            this.props.flow,
-            {request: {http_version: ver}}
-        );
-    }
-});
-
-var ResponseLine = React.createClass({
-    render: function () {
-        var flow = this.props.flow;
-        var httpver = flow.response.http_version;
-        return <div className="first-line response-line">
-            <ValueEditor
-                ref="httpVersion"
-                content={httpver}
-                onDone={this.onHttpVersionChange}
-                isValid={isValidHttpVersion}
-                inline/>
-        &nbsp;
-            <ValueEditor
-                ref="code"
-                content={flow.response.status_code + ""}
-                onDone={this.onCodeChange}
-                isValid={this.isValidCode}
-                inline/>
-        &nbsp;
-            <ValueEditor
-                ref="msg"
-                content={flow.response.reason}
-                onDone={this.onMsgChange}
-                inline/>
-        </div>;
-    },
-    isValidCode: function (code) {
-        return /^\d+$/.test(code);
-    },
-    onHttpVersionChange: function (nextVer) {
-        var ver = parseHttpVersion(nextVer);
-        FlowActions.update(
-            this.props.flow,
-            {response: {http_version: ver}}
-        );
-    },
-    onMsgChange: function (nextMsg) {
-        FlowActions.update(
-            this.props.flow,
-            {response: {msg: nextMsg}}
-        );
-    },
-    onCodeChange: function (nextCode) {
-        nextCode = parseInt(nextCode);
-        FlowActions.update(
-            this.props.flow,
-            {response: {code: nextCode}}
-        );
-    }
-});
-
-export var Request = React.createClass({
-    render: function () {
-        var flow = this.props.flow;
-        return (
-            <section className="request">
-                <RequestLine ref="requestLine" flow={flow}/>
-                {/*<ResponseLine flow={flow}/>*/}
-                <Headers ref="headers" message={flow.request} onChange={this.onHeaderChange}/>
-                <hr/>
-                <ContentView flow={flow} message={flow.request}/>
-            </section>
-        );
-    },
-    edit: function (k) {
-        switch (k) {
-            case "m":
-                this.refs.requestLine.refs.method.focus();
-                break;
-            case "u":
-                this.refs.requestLine.refs.url.focus();
-                break;
-            case "v":
-                this.refs.requestLine.refs.httpVersion.focus();
-                break;
-            case "h":
-                this.refs.headers.edit();
-                break;
-            default:
-                throw "Unimplemented: " + k;
-        }
-    },
-    onHeaderChange: function (nextHeaders) {
-        FlowActions.update(this.props.flow, {
-            request: {
-                headers: nextHeaders
-            }
-        });
-    }
-});
-
-export var Response = React.createClass({
-    render: function () {
-        var flow = this.props.flow;
-        return (
-            <section className="response">
-                {/*<RequestLine flow={flow}/>*/}
-                <ResponseLine ref="responseLine" flow={flow}/>
-                <Headers ref="headers" message={flow.response} onChange={this.onHeaderChange}/>
-                <hr/>
-                <ContentView flow={flow} message={flow.response}/>
-            </section>
-        );
-    },
-    edit: function (k) {
-        switch (k) {
-            case "c":
-                this.refs.responseLine.refs.status_code.focus();
-                break;
-            case "m":
-                this.refs.responseLine.refs.msg.focus();
-                break;
-            case "v":
-                this.refs.responseLine.refs.httpVersion.focus();
-                break;
-            case "h":
-                this.refs.headers.edit();
-                break;
-            default:
-                throw "Unimplemented: " + k;
-        }
-    },
-    onHeaderChange: function (nextHeaders) {
-        FlowActions.update(this.props.flow, {
-            response: {
-                headers: nextHeaders
-            }
-        });
-    }
-});
-
-export var Error = React.createClass({
-    render: function () {
-        var flow = this.props.flow;
-        return (
-            <section>
-                <div className="alert alert-warning">
-                {flow.error.msg}
-                    <div>
-                        <small>{ formatTimeStamp(flow.error.timestamp) }</small>
-                    </div>
-                </div>
-            </section>
-        );
-    }
-});