diff --git a/src/views/preview/presentation.jsx b/src/views/preview/presentation.jsx index 74416cd6a..31954480f 100644 --- a/src/views/preview/presentation.jsx +++ b/src/views/preview/presentation.jsx @@ -43,10 +43,12 @@ const onKeyPress = e => { }; const PreviewPresentation = ({ + addToStudioOpen, assetHost, backpackHost, canAddToStudio, canDeleteComments, + canRemix, canReport, canRestoreComments, canShare, @@ -61,39 +63,40 @@ const PreviewPresentation = ({ isFullScreen, isLoggedIn, isShared, - loved, loveCount, + loved, moreCommentsToLoad, + onAddComment, + onAddToStudioClicked, + onAddToStudioClosed, + onDeleteComment, + onFavoriteClicked, + onLoadMore, + onLoveClicked, + onRemix, + onReportClicked, + onReportClose, + onReportComment, + onReportSubmit, + onRestoreComment, + onSeeInside, + onShare, + onToggleComments, + onToggleStudio, + onUpdate, + onUpdateProjectId, originalInfo, parentInfo, projectHost, projectId, projectInfo, projectNotAvailable, - remixes, - reportOpen, - replies, - addToStudioOpen, projectStudios, + remixes, + replies, + reportOpen, singleCommentId, - userOwnsProject, - onAddComment, - onDeleteComment, - onFavoriteClicked, - onLoadMore, - onLoveClicked, - onReportClicked, - onReportClose, - onReportComment, - onReportSubmit, - onRestoreComment, - onAddToStudioClicked, - onAddToStudioClosed, - onToggleStudio, - onToggleComments, - onSeeInside, - onShare, - onUpdate + userOwnsProject }) => { const shareDate = ((projectInfo.history && projectInfo.history.shared)) ? projectInfo.history.shared : ''; @@ -154,9 +157,11 @@ const PreviewPresentation = ({
- {/* TODO: Hide Remix button for now until implemented */} - {(!userOwnsProject && false) && - } @@ -177,12 +182,14 @@ const PreviewPresentation = ({ backpackHost={backpackHost} backpackVisible={canUseBackpack} basePath="/" + canRemix={canRemix} className="guiPlayer" cloudHost={cloudHost} isFullScreen={isFullScreen} previewInfoVisible="false" projectHost={projectHost} projectId={projectId} + onUpdateProjectId={onUpdateProjectId} />
@@ -449,6 +456,7 @@ PreviewPresentation.propTypes = { backpackHost: PropTypes.string, canAddToStudio: PropTypes.bool, canDeleteComments: PropTypes.bool, + canRemix: PropTypes.bool, canReport: PropTypes.bool, canRestoreComments: PropTypes.bool, canShare: PropTypes.bool, @@ -473,6 +481,7 @@ PreviewPresentation.propTypes = { onFavoriteClicked: PropTypes.func, onLoadMore: PropTypes.func, onLoveClicked: PropTypes.func, + onRemix: PropTypes.func, onReportClicked: PropTypes.func.isRequired, onReportClose: PropTypes.func.isRequired, onReportComment: PropTypes.func.isRequired, @@ -483,6 +492,7 @@ PreviewPresentation.propTypes = { onToggleComments: PropTypes.func, onToggleStudio: PropTypes.func, onUpdate: PropTypes.func, + onUpdateProjectId: PropTypes.func, originalInfo: projectShape, parentInfo: projectShape, projectHost: PropTypes.string, diff --git a/src/views/preview/preview.jsx b/src/views/preview/preview.jsx index 483bfe1c1..19b380f88 100644 --- a/src/views/preview/preview.jsx +++ b/src/views/preview/preview.jsx @@ -50,6 +50,7 @@ class Preview extends React.Component { 'handleRestoreComment', 'handleAddToStudioClick', 'handleAddToStudioClose', + 'handleRemix', 'handleSeeInside', 'handleShare', 'handleUpdateProjectId', @@ -73,13 +74,13 @@ class Preview extends React.Component { parseInt(window.location.hash.replace(commentHashPrefix, ''), 10); this.state = { + addToStudioOpen: false, extensions: [], favoriteCount: 0, loveCount: 0, projectId: parts[1] === 'editor' ? '0' : parts[1], - singleCommentId: singleCommentId, - addToStudioOpen: false, - reportOpen: false + reportOpen: false, + singleCommentId: singleCommentId }; this.addEventListeners(); /* In the beginning, if user is on mobile and landscape, go to fullscreen */ @@ -328,6 +329,9 @@ class Preview extends React.Component { })); } } + handleRemix () { + this.props.remixProject(); + } handleSeeInside () { this.props.setPlayer(false); } @@ -405,6 +409,7 @@ class Preview extends React.Component { backpackHost={this.props.backpackHost} canAddToStudio={this.props.canAddToStudio} canDeleteComments={this.props.isAdmin || this.props.userOwnsProject} + canRemix={this.props.canRemix} canReport={this.props.canReport} canRestoreComments={this.props.isAdmin} canShare={this.props.canShare} @@ -440,6 +445,7 @@ class Preview extends React.Component { onFavoriteClicked={this.handleFavoriteToggle} onLoadMore={this.handleLoadMore} onLoveClicked={this.handleLoveToggle} + onRemix={this.handleRemix} onReportClicked={this.handleReportClick} onReportClose={this.handleReportClose} onReportComment={this.handleReportComment} @@ -450,11 +456,11 @@ class Preview extends React.Component { onToggleComments={this.handleToggleComments} onToggleStudio={this.handleToggleStudio} onUpdate={this.handleUpdate} + onUpdateProjectId={this.handleUpdateProjectId} /> : ({ updateProject: (id, formData, username, token) => { dispatch(previewActions.updateProject(id, formData, username, token)); }, + remixProject: () => { + dispatch(GUI.remixProject()); + }, setPlayer: player => { dispatch(GUI.setPlayer(player)); }, diff --git a/src/views/preview/preview.scss b/src/views/preview/preview.scss index e81b4c122..c950314cd 100644 --- a/src/views/preview/preview.scss +++ b/src/views/preview/preview.scss @@ -163,6 +163,7 @@ $stage-width: 480px; } .project-buttons { + font-weight: bold; flex-shrink: 0; } @@ -206,17 +207,23 @@ $stage-width: 480px; .remix-button, .see-inside-button { margin-top: 0; + border-radius: .25rem; + padding-top: .6875rem; + padding-right: .9375rem; + padding-bottom: .6875rem; + padding-left: .875rem; + height: 2.5rem; font-size: .875rem; - font-weight: normal; &:before { display: inline-block; - margin-right: .5rem; + margin-top: -2px; + margin-right: .4375rem; background-repeat: no-repeat; background-position: center center; background-size: contain; - width: 1.25rem; - height: 1.25rem; + width: 1.125rem; + height: 1.125rem; vertical-align: middle; content: ""; } diff --git a/src/views/preview/subactions.scss b/src/views/preview/subactions.scss index b778b6bb5..2c3b8c014 100644 --- a/src/views/preview/subactions.scss +++ b/src/views/preview/subactions.scss @@ -54,7 +54,7 @@ text-decoration: none; line-height: .875rem; font-size: .75rem; - font-weight: normal; + font-weight: bold; &.studio-button, &.copy-link-button,