diff options
author | Maximilian Hils <git@maximilianhils.com> | 2016-06-17 01:53:02 -0700 |
---|---|---|
committer | GitHub <noreply@github.com> | 2016-06-17 01:53:02 -0700 |
commit | fcf5dc8728816bae73a175ee021f8a11a1591567 (patch) | |
tree | 56ff25784a659f0e54894ca616e198cfe1a13ea0 /web/src/js/components/ContentView/ContentViews.jsx | |
parent | 78785df16be237bfdbf4ee485639b61f06b4a47e (diff) | |
parent | 034287edcf00eb734cb67e62de58c3bfebf6bb44 (diff) | |
download | mitmproxy-fcf5dc8728816bae73a175ee021f8a11a1591567.tar.gz mitmproxy-fcf5dc8728816bae73a175ee021f8a11a1591567.tar.bz2 mitmproxy-fcf5dc8728816bae73a175ee021f8a11a1591567.zip |
Merge pull request #1267 from gzzhanghao/components
[web] Working on components
Diffstat (limited to 'web/src/js/components/ContentView/ContentViews.jsx')
-rw-r--r-- | web/src/js/components/ContentView/ContentViews.jsx | 70 |
1 files changed, 70 insertions, 0 deletions
diff --git a/web/src/js/components/ContentView/ContentViews.jsx b/web/src/js/components/ContentView/ContentViews.jsx new file mode 100644 index 00000000..b0297dcc --- /dev/null +++ b/web/src/js/components/ContentView/ContentViews.jsx @@ -0,0 +1,70 @@ +import React, { PropTypes } from 'react' +import ContentLoader from './ContentLoader' +import { MessageUtils } from '../../flow/utils.js' + +const views = [ViewAuto, ViewImage, ViewJSON, ViewRaw] + +ViewImage.regex = /^image\/(png|jpe?g|gif|vnc.microsoft.icon|x-icon)$/i +ViewImage.matches = msg => ViewImage.regex.test(MessageUtils.getContentType(msg)) + +ViewImage.propTypes = { + flow: PropTypes.object.isRequired, + message: PropTypes.object.isRequired, +} + +export function ViewImage({ flow, message }) { + return ( + <div className="flowview-image"> + <img src={MessageUtils.getContentURL(flow, message)} alt="preview" className="img-thumbnail"/> + </div> + ) +} + +ViewRaw.textView = true +ViewRaw.matches = () => true + +ViewRaw.propTypes = { + content: React.PropTypes.string.isRequired, +} + +export function ViewRaw({ content }) { + return <pre>{content}</pre> +} + +ViewJSON.textView = true +ViewJSON.regex = /^application\/json$/i +ViewJSON.matches = msg => ViewJSON.regex.test(MessageUtils.getContentType(msg)) + +ViewJSON.propTypes = { + content: React.PropTypes.string.isRequired, +} + +export function ViewJSON({ content }) { + let json = content + try { + json = JSON.stringify(JSON.parse(content), null, 2); + } catch (e) { + // @noop + } + return <pre>{json}</pre> +} + + +ViewAuto.matches = () => false +ViewAuto.findView = msg => views.find(v => v.matches(msg)) || views[views.length - 1] + +ViewAuto.propTypes = { + message: React.PropTypes.object.isRequired, + flow: React.PropTypes.object.isRequired, +} + +export function ViewAuto({ message, flow }) { + const View = ViewAuto.findView(message) + if (View.textView) { + return <ContentLoader message={message} flow={flow}><View content="" /></ContentLoader> + } else { + return <View message={message} flow={flow} /> + } +} + +export default views |