import PropTypes from 'prop-types'; import React from 'react'; import Helmet from 'react-helmet'; import { bindActionCreators } from 'redux'; import { connect } from 'react-redux'; import PreviewFrame from '../components/PreviewFrame'; import PreviewNav from '../../../components/PreviewNav'; import { getHTMLFile, getJSFiles, getCSSFiles } from '../reducers/files'; import * as ProjectActions from '../actions/project'; class FullView extends React.Component { componentDidMount() { this.props.getProject(this.props.params.project_id); document.body.className = this.props.theme; } componentWillUpdate(nextProps) { if (nextProps.theme !== this.props.theme) { document.body.className = nextProps.theme; } } ident = () => {} render() { return (
{this.props.project.name}
} fullView isPlaying isAccessibleOutputPlaying={false} textOutput={false} gridOutput={false} soundOutput={false} dispatchConsoleEvent={this.ident} endSketchRefresh={this.ident} previewIsRefreshing={false} setBlobUrl={this.ident} stopSketch={this.ident} expandConsole={this.ident} />
); } } FullView.propTypes = { theme: PropTypes.string.isRequired, params: PropTypes.shape({ project_id: PropTypes.string }).isRequired, project: PropTypes.shape({ name: PropTypes.string, owner: PropTypes.shape({ username: PropTypes.string }) }).isRequired, htmlFile: PropTypes.shape({ id: PropTypes.string.isRequired, content: PropTypes.string.isRequired, name: PropTypes.string.isRequired }).isRequired, jsFiles: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired, content: PropTypes.string.isRequired, name: PropTypes.string.isRequired })).isRequired, cssFiles: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired, content: PropTypes.string.isRequired, name: PropTypes.string.isRequired })).isRequired, getProject: PropTypes.func.isRequired, files: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired, content: PropTypes.string.isRequired, name: PropTypes.string.isRequired })).isRequired, }; function mapStateToProps(state) { return { user: state.user, theme: state.preferences.theme, htmlFile: getHTMLFile(state.files), jsFiles: getJSFiles(state.files), cssFiles: getCSSFiles(state.files), project: state.project, files: state.files }; } function mapDispatchToProps(dispatch) { return bindActionCreators(ProjectActions, dispatch); } export default connect(mapStateToProps, mapDispatchToProps)(FullView);