diff --git a/src/components/PreviewPane.js b/src/components/PreviewPane.js index 2964ae93..731f9c90 100644 --- a/src/components/PreviewPane.js +++ b/src/components/PreviewPane.js @@ -1,8 +1,9 @@ import React, { PropTypes } from 'react'; +import { render } from 'react-dom'; import ImmutablePropTypes from 'react-immutable-proptypes'; import Widgets from './Widgets'; -export default class PreviewPane extends React.Component { +class Preview extends React.Component { previewFor(field) { const { entry, getMedia } = this.props; const widget = Widgets[field.get('widget')] || Widgets._unknown; @@ -17,13 +18,43 @@ export default class PreviewPane extends React.Component { const { collection } = this.props; if (!collection) { return null; } - return
{collection.get('fields').map((field) =>
{this.previewFor(field)}
)}
; } } +export default class PreviewPane extends React.Component { + constructor(props) { + super(props); + this.handleIframeRef = this.handleIframeRef.bind(this); + } + + componentDidUpdate() { + this.renderPreview(); + } + + renderPreview() { + const props = this.props; + render(, this.previewEl); + } + + handleIframeRef(ref) { + if (ref) { + this.previewEl = document.createElement('div'); + ref.contentDocument.body.appendChild(this.previewEl); + this.renderPreview(); + } + } + + render() { + const { collection } = this.props; + if (!collection) { return null; } + + return + } +} + PreviewPane.propTypes = { collection: ImmutablePropTypes.map.isRequired, entry: ImmutablePropTypes.map.isRequired,