Rooba
/
mitmproxy
mirror of https://github.com/mitmproxy/mitmproxy.git
1
1
Fork 0
Code Issues Packages Projects Releases Wiki Activity

added flow_content update

This commit is contained in:
Clemens 2016-07-19 16:13:26 +02:00
parent 698fb11132
commit 281f20ef1e
4 changed files with 98 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
web/src/js/components/ContentView.jsx
View File

@ -5,9 +5,8 @@ import * as ContentViews from './ContentView/ContentViews'
import * as MetaViews from './ContentView/MetaViews'
import ContentLoader from './ContentView/ContentLoader'
import ViewSelector from './ContentView/ViewSelector'
import { setContentView, setDisplayLarge } from '../ducks/ui'
import { setContentView, setDisplayLarge, setModifiedFlowContent } from '../ducks/ui'
import CodeEditor from './common/CodeEditor'
import {setModifiedFlowContent} from '../ducks/flows'
ContentView.propTypes = {
// It may seem a bit weird at the first glance:
@ -20,7 +19,7 @@ ContentView.propTypes = {
ContentView.isContentTooLarge = msg => msg.contentLength > 1024 * 1024 * (ContentViews.ViewImage.matches(msg) ? 10 : 0.2)
function ContentView(props) {
const { flow, message, contentView, selectView, displayLarge, setDisplayLarge } = props
const { flow, message, contentView, selectView, displayLarge, setDisplayLarge, onContentChange, isFlowEditorOpen, setModifiedFlowContent } = props
if (message.contentLength === 0) {
return <MetaViews.ContentEmpty {...props}/>
@ -37,6 +36,12 @@ function ContentView(props) {
const View = ContentViews[contentView]
return (
<div>
{isFlowEditorOpen ? (
<ContentLoader flow={flow} message={message}>
<CodeEditor content="" onChange={content =>{setModifiedFlowContent(content)}}/>
</ContentLoader>
): (
<div>
{View.textView ? (
<ContentLoader flow={flow} message={message}>
@ -48,11 +53,28 @@ function ContentView(props) {
<div className="view-options text-center">
<ViewSelector onSelectView={selectView} active={View} message={message}/>
&nbsp;
<a className="btn btn-default btn-xs" href={MessageUtils.getContentURL(flow, message)}>
<a className="btn btn-default btn-xs"
href={MessageUtils.getContentURL(flow, message)}
title="Download the content of the flow.">
<i className="fa fa-download"/>
</a>
&nbsp;
<a className="btn btn-default btn-xs"
onClick={() => ContentView.fileInput.click()}
title="Upload a file to replace the content."
>
<i className="fa fa-upload"/>
</a>
<input
ref={ref => ContentView.fileInput = ref}
className="hidden"
type="file"
onChange={e => {if(e.target.files.length > 0) onContentChange(e.target.files[0])}}
/>
</div>
</div>
)}
</div>
)
}
@ -60,9 +82,11 @@ export default connect(
state => ({
contentView: state.ui.contentView,
displayLarge: state.ui.displayLarge,
isFlowEditorOpen : state.ui.isFlowEditorOpen
}),
{
selectView: setContentView,
setDisplayLarge,
setModifiedFlowContent
}
)(ContentView)

15
web/src/js/components/FlowView/FlowEditorButton.jsx
View File

@ -4,21 +4,13 @@ import { connect } from 'react-redux'
import {closeFlowEditor} from '../../ducks/ui.js'
import {openFlowEditor} from '../../ducks/ui.js'
// FlowEditorButton.propTypes = {
// isFlowEditorOpen: PropTypes.bool.isRequired,
// content: PropTypes.string.isRequired,
// onContentChange: PropTypes.func.isRequired
// }
class FlowEditorButton extends Component{
static propTypes = {
FlowEditorButton.propTypes = {
isFlowEditorOpen: PropTypes.bool.isRequired,
content: PropTypes.string.isRequired,
onContentChange: PropTypes.func.isRequired
}
render(){
let { isFlowEditorOpen, closeFlowEditor, openFlowEditor, onContentChange, content } = this.props
function FlowEditorButton ({ isFlowEditorOpen, closeFlowEditor, openFlowEditor, onContentChange, content }) {
return (
<div className="edit-flow-container">
{isFlowEditorOpen ?
@ -33,12 +25,11 @@ class FlowEditorButton extends Component{
</div>
)
}
}
export default connect(
state => ({
isFlowEditorOpen: state.ui.isFlowEditorOpen,
content: state.flows.modifiedFlow.content
content: state.ui.modifiedFlow.content
}),
{
closeFlowEditor,

2
web/src/js/components/FlowView/Messages.jsx
View File

@ -7,7 +7,7 @@ import ContentView from '../ContentView'
import ValueEditor from '../ValueEditor'
import Headers from './Headers'
import * as flowActions from '../../ducks/flows'
import FlowEditorButton from './FlowEditorButton.jsx'
import FlowEditorButton from './FlowEditorButton'
class RequestLine extends Component {

43
web/src/js/ducks/ui.js
View File

@ -9,6 +9,9 @@ export const UPDATE_QUERY = 'UI_UPDATE_QUERY'
export const SELECT_TAB = 'UI_SELECT_TAB'
export const SET_PROMPT = 'UI_SET_PROMPT'
export const SET_DISPLAY_LARGE = 'UI_SET_DISPLAY_LARGE'
export const OPEN_FLOW_EDITOR= 'UI_OPEN_FLOW_EDITOR'
export const CLOSE_FLOW_EDITOR = 'UI_CLOSE_FLOW_EDITOR'
export const SET_MODIFIED_FLOW_CONTENT = 'UI_SET_MODIFIED_FLOW'
const defaultState = {
activeMenu: 'Start',
@ -18,7 +21,9 @@ const defaultState = {
promptOpen: false,
contentView: 'ViewAuto',
query: {},
panel: 'request'
panel: 'request',
modifiedFlow: {headers: "", content: ""},
isFlowEditorOpen: false
}
export default function reducer(state = defaultState, action) {
@ -31,9 +36,10 @@ export default function reducer(state = defaultState, action) {
}
case flowsActions.SELECT:
let s = {...state, isFlowEditorOpen: false}
if (action.flowIds.length && !state.isFlowSelected) {
return {
...state,
...s,
displayLarge: false,
activeMenu: 'Flow',
isFlowSelected: true,
@ -46,14 +52,14 @@ export default function reducer(state = defaultState, action) {
activeMenu = 'Start'
}
return {
...state,
...s,
activeMenu,
isFlowSelected: false,
}
}
return {
...state,
...s,
displayLarge: false,
}
@ -78,6 +84,7 @@ export default function reducer(state = defaultState, action) {
case SELECT_TAB:
return {
...state,
isFlowEditorOpen: false,
panel: action.panel
}
@ -92,7 +99,21 @@ export default function reducer(state = defaultState, action) {
...state,
displayLarge: action.displayLarge,
}
case OPEN_FLOW_EDITOR:
return {
...state,
isFlowEditorOpen: true
}
case CLOSE_FLOW_EDITOR:
return {
...state,
isFlowEditorOpen: false
}
case SET_MODIFIED_FLOW_CONTENT:
return{
...state,
modifiedFlow: {...state.modifiedFlow, content: action.content}
}
default:
return state
}
@ -126,6 +147,18 @@ export function setDisplayLarge(displayLarge) {
return { type: SET_DISPLAY_LARGE, displayLarge }
}
export function openFlowEditor(){
return { type: OPEN_FLOW_EDITOR }
}
export function closeFlowEditor(){
return { type: CLOSE_FLOW_EDITOR }
}
export function setModifiedFlowContent(content) {
return { type: SET_MODIFIED_FLOW_CONTENT, content }
}
export function onKeyDown(e) {
if (e.ctrlKey) {
return () => {