diff options
author | Clemens <cle1000.cb@gmail.com> | 2016-07-15 14:41:30 +0200 |
---|---|---|
committer | Clemens <cle1000.cb@gmail.com> | 2016-07-15 14:41:30 +0200 |
commit | 87797d7ac07108ce5fd00902918e4900907b94b6 (patch) | |
tree | da021755cc692b33ccf33eb3ebd8cd8ba89a8868 /web/src/js/components | |
parent | 5f3782dd5fb8be4c196f57cb07fd1cc2fd6b2f56 (diff) | |
download | mitmproxy-87797d7ac07108ce5fd00902918e4900907b94b6.tar.gz mitmproxy-87797d7ac07108ce5fd00902918e4900907b94b6.tar.bz2 mitmproxy-87797d7ac07108ce5fd00902918e4900907b94b6.zip |
added new btn, changed to codemirror
Diffstat (limited to 'web/src/js/components')
-rw-r--r-- | web/src/js/components/ContentView.jsx | 22 | ||||
-rw-r--r-- | web/src/js/components/ContentView/ContentEditor.jsx | 16 | ||||
-rw-r--r-- | web/src/js/components/common/CodeEditor.jsx | 17 |
3 files changed, 18 insertions, 37 deletions
diff --git a/web/src/js/components/ContentView.jsx b/web/src/js/components/ContentView.jsx index fa26a057..70bca249 100644 --- a/web/src/js/components/ContentView.jsx +++ b/web/src/js/components/ContentView.jsx @@ -67,20 +67,14 @@ export default class ContentView extends Component { return ( <div> - <div className="row"> - <div className="col-sm-12"> - <ContentLoader flow={flow} message={message}> - <ContentEditor - onSave={this.props.onContentChange} - onClose={() => this.setState({contentEditorClosed : true})} - onOpen={() => this.setState({contentEditorClosed : false})} - isClosed={this.state.contentEditorClosed} - content="" - /> - </ContentLoader> - </div> - </div> - + <ContentLoader flow={flow} message={message}> + <ContentEditor + onSave={content => {this.props.onContentChange(content);this.setState({contentEditorClosed : true});}} + onOpen={() => this.setState({contentEditorClosed : false})} + isClosed={this.state.contentEditorClosed} + content="" + /> + </ContentLoader> {this.state.contentEditorClosed && (<div> {View.textView ? ( <ContentLoader flow={flow} message={message}> diff --git a/web/src/js/components/ContentView/ContentEditor.jsx b/web/src/js/components/ContentView/ContentEditor.jsx index a38e4d6f..ca2f3370 100644 --- a/web/src/js/components/ContentView/ContentEditor.jsx +++ b/web/src/js/components/ContentView/ContentEditor.jsx @@ -6,7 +6,6 @@ export default class ContentEditor extends Component { static propTypes = { content: PropTypes.string.isRequired, onSave: PropTypes.func.isRequired, - onClose: PropTypes.func.isRequired, onOpen: PropTypes.func.isRequired, isClosed: PropTypes.bool.isRequired } @@ -20,17 +19,12 @@ export default class ContentEditor extends Component { return ( <div> {this.props.isClosed ? - <a className="btn btn-default btn-xs pull-right" onClick={this.props.onOpen}> - <i className="fa fa-pencil-square-o"/> + <a className="edit-flow" onClick={this.props.onOpen}> + <i className="fa fa-pencil"/> </a> : - <span> - <a className="btn btn-default btn-xs pull-right" onClick={this.props.onClose}> - <i className="fa fa-times"/> - </a> - <a className="btn btn-default btn-xs pull-right" onClick={() => this.props.onSave(this.state.content)}> - <i className="fa fa-floppy-o"/> - </a> - </span> + <a className="edit-flow" onClick={() => this.props.onSave(this.state.content)}> + <i className="fa fa-check"/> + </a> } {!this.props.isClosed && <CodeEditor value={this.state.content} onChange={content => this.setState({content: content})}/> diff --git a/web/src/js/components/common/CodeEditor.jsx b/web/src/js/components/common/CodeEditor.jsx index b10b13ed..c122cf94 100644 --- a/web/src/js/components/common/CodeEditor.jsx +++ b/web/src/js/components/common/CodeEditor.jsx @@ -1,9 +1,7 @@ import React, { Component, PropTypes } from 'react' import { render } from 'react-dom'; -import AceEditor from 'react-ace'; +import Codemirror from 'react-codemirror'; -import 'brace/mode/javascript'; -import 'brace/theme/kuroir'; export default class CodeEditor extends Component{ static propTypes = { @@ -12,17 +10,12 @@ export default class CodeEditor extends Component{ } render() { + let options = { + lineNumbers: true + }; return ( <div onKeyDown={e => e.stopPropagation()}> - <AceEditor - mode="javascript" - theme="kuroir" - onChange={this.props.onChange} - name="rea" - value={this.props.value} - width="100%" - editorProps={{$blockScrolling: Infinity}} - /> + <Codemirror value={this.props.value} onChange={this.props.onChange} options={options}/> </div> ) } |