diff options
Diffstat (limited to 'web/src/js')
-rw-r--r-- | web/src/js/app.jsx | 2 | ||||
-rw-r--r-- | web/src/js/components/ContentView.jsx | 6 | ||||
-rw-r--r-- | web/src/js/components/ContentView/ContentViews.jsx | 16 | ||||
-rw-r--r-- | web/src/js/components/FlowView/Messages.jsx | 4 | ||||
-rw-r--r-- | web/src/js/components/common/MonacoEditor.jsx | 34 |
5 files changed, 52 insertions, 10 deletions
diff --git a/web/src/js/app.jsx b/web/src/js/app.jsx index bd2d3d58..51b2b639 100644 --- a/web/src/js/app.jsx +++ b/web/src/js/app.jsx @@ -12,7 +12,7 @@ import { add as addLog } from './ducks/eventLog' const middlewares = [thunk]; -if (process.env.NODE_ENV === 'development') { +if (process.env.NODE_ENV === 'development' || true) { const createLogger = require('redux-logger'); middlewares.push(createLogger()); } diff --git a/web/src/js/components/ContentView.jsx b/web/src/js/components/ContentView.jsx index 1533684e..f6dbe90a 100644 --- a/web/src/js/components/ContentView.jsx +++ b/web/src/js/components/ContentView.jsx @@ -59,11 +59,11 @@ export default class ContentView extends Component { return ( <div> {View.textView ? ( - <ContentLoader flow={flow} message={message}> - <this.state.View content="" /> + <ContentLoader flow={flow} message={message}> + <this.state.View onChange={this.props.onChange} content="" /> </ContentLoader> ) : ( - <View flow={flow} message={message} /> + <View flow={flow} onChange={this.props.onChange} message={message} /> )} <div className="view-options text-center"> <ViewSelector onSelectView={this.selectView} active={View} message={message}/> diff --git a/web/src/js/components/ContentView/ContentViews.jsx b/web/src/js/components/ContentView/ContentViews.jsx index b0297dcc..e5a864bf 100644 --- a/web/src/js/components/ContentView/ContentViews.jsx +++ b/web/src/js/components/ContentView/ContentViews.jsx @@ -1,6 +1,8 @@ import React, { PropTypes } from 'react' import ContentLoader from './ContentLoader' import { MessageUtils } from '../../flow/utils.js' +import Button from '../common/Button' + const views = [ViewAuto, ViewImage, ViewJSON, ViewRaw] @@ -22,13 +24,19 @@ export function ViewImage({ flow, message }) { ViewRaw.textView = true ViewRaw.matches = () => true +ViewRaw.input = {} ViewRaw.propTypes = { content: React.PropTypes.string.isRequired, } -export function ViewRaw({ content }) { - return <pre>{content}</pre> +export function ViewRaw({ content, onChange }) { + return ( + <div> + <textarea onKeyDown={e => e.stopPropagation()} ref={ref => ViewRaw.input = ref}>{content}</textarea> + <Button onClick={(e) => onChange(ViewRaw.input.value)} text="Update"/> + </div> + ) } ViewJSON.textView = true @@ -58,10 +66,10 @@ ViewAuto.propTypes = { flow: React.PropTypes.object.isRequired, } -export function ViewAuto({ message, flow }) { +export function ViewAuto({ message, flow, onChange }) { const View = ViewAuto.findView(message) if (View.textView) { - return <ContentLoader message={message} flow={flow}><View content="" /></ContentLoader> + return <ContentLoader message={message} flow={flow}><View onChange={onChange} content="" /></ContentLoader> } else { return <View message={message} flow={flow} /> } diff --git a/web/src/js/components/FlowView/Messages.jsx b/web/src/js/components/FlowView/Messages.jsx index 9295f97c..d2c42a54 100644 --- a/web/src/js/components/FlowView/Messages.jsx +++ b/web/src/js/components/FlowView/Messages.jsx @@ -89,7 +89,7 @@ export class Request extends Component { onChange={headers => updateFlow({ request: { headers } })} /> <hr/> - <ContentView flow={flow} message={flow.request}/> + <ContentView flow={flow} message={flow.request} onChange={content => updateFlow({request: {content} })}/> </section> ) } @@ -128,7 +128,7 @@ export class Response extends Component { onChange={headers => updateFlow({ response: { headers } })} /> <hr/> - <ContentView flow={flow} message={flow.response}/> + <ContentView flow={flow} message={flow.response} onChange={content => updateFlow({response: {content} }) }/> </section> ) } diff --git a/web/src/js/components/common/MonacoEditor.jsx b/web/src/js/components/common/MonacoEditor.jsx new file mode 100644 index 00000000..a0e8d58c --- /dev/null +++ b/web/src/js/components/common/MonacoEditor.jsx @@ -0,0 +1,34 @@ +//not working +import React, { Component, PropTypes } from 'react' + +export default class MonacoEditor extends Component { + + constructor(props) { + super(props) + } + + onLoad(){ + window.MonacoEnvironment = { + getWorkerUrl: function(workerId, label) { + return 'worker-loader-proxy.js'; + } + }; + require.config({ + paths: { + vs: '../release/min/vs' + } + }); + + } + + + render() { + return ( + <div id="container" + ref={ref => this.editor = ref} + style="width:800px;height:600px;border:1px solid grey" + onLoad={this.onLoad()}> + </div> + ) + } +} |