From 30ed29a39aa4c64c866ce66ee235be0b24a3ba32 Mon Sep 17 00:00:00 2001 From: Ben Wheeler Date: Sat, 17 Nov 2018 15:13:58 -0500 Subject: [PATCH 1/4] enable remix button; format remix, see inside button css --- src/views/preview/presentation.jsx | 61 ++++++++++++++++++------------ src/views/preview/preview.jsx | 18 +++++++-- src/views/preview/preview.scss | 15 ++++++-- src/views/preview/subactions.scss | 2 +- 4 files changed, 62 insertions(+), 34 deletions(-) diff --git a/src/views/preview/presentation.jsx b/src/views/preview/presentation.jsx index 74416cd6a..807e74197 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 : ''; @@ -155,8 +158,11 @@ const PreviewPresentation = ({
{/* TODO: Hide Remix button for now until implemented */} - {(!userOwnsProject && false) && - } @@ -177,12 +183,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 +457,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 +482,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 +493,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..bb45d6fac 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; } @@ -205,18 +206,24 @@ $stage-width: 480px; .remix-button, .see-inside-button { + height: 2.5rem; margin-top: 0; font-size: .875rem; - font-weight: normal; + border-radius: .375rem; + padding-left: .875rem; + padding-right: .9375rem; + padding-top: .6875rem; + padding-bottom: .6875rem; &: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; + height: 1.125rem; + width: 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, From cd030e0895d31ce9c1f7dbda1c9b034927de73c9 Mon Sep 17 00:00:00 2001 From: Ben Wheeler Date: Sun, 18 Nov 2018 11:19:21 -0500 Subject: [PATCH 2/4] rearranged css to get tests working --- src/views/preview/preview.scss | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/views/preview/preview.scss b/src/views/preview/preview.scss index bb45d6fac..bab3d35d0 100644 --- a/src/views/preview/preview.scss +++ b/src/views/preview/preview.scss @@ -206,14 +206,14 @@ $stage-width: 480px; .remix-button, .see-inside-button { - height: 2.5rem; margin-top: 0; - font-size: .875rem; border-radius: .375rem; - padding-left: .875rem; - padding-right: .9375rem; padding-top: .6875rem; + padding-right: .9375rem; padding-bottom: .6875rem; + padding-left: .875rem; + height: 2.5rem; + font-size: .875rem; &:before { display: inline-block; @@ -222,8 +222,8 @@ $stage-width: 480px; background-repeat: no-repeat; background-position: center center; background-size: contain; - height: 1.125rem; width: 1.125rem; + height: 1.125rem; vertical-align: middle; content: ""; } From 1c8a124f44a1abcc1610275e4066149a30ca2c50 Mon Sep 17 00:00:00 2001 From: Ben Wheeler Date: Mon, 19 Nov 2018 13:22:27 -0500 Subject: [PATCH 3/4] switched button border radius back to 4px --- src/views/preview/preview.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/views/preview/preview.scss b/src/views/preview/preview.scss index bab3d35d0..c950314cd 100644 --- a/src/views/preview/preview.scss +++ b/src/views/preview/preview.scss @@ -207,7 +207,7 @@ $stage-width: 480px; .remix-button, .see-inside-button { margin-top: 0; - border-radius: .375rem; + border-radius: .25rem; padding-top: .6875rem; padding-right: .9375rem; padding-bottom: .6875rem; From 50a2072794437dfb92527f7edf9e8a30552a61e7 Mon Sep 17 00:00:00 2001 From: Ben Wheeler Date: Mon, 19 Nov 2018 13:58:02 -0500 Subject: [PATCH 4/4] removed stale comment --- src/views/preview/presentation.jsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/views/preview/presentation.jsx b/src/views/preview/presentation.jsx index 807e74197..31954480f 100644 --- a/src/views/preview/presentation.jsx +++ b/src/views/preview/presentation.jsx @@ -157,7 +157,6 @@ const PreviewPresentation = ({
- {/* TODO: Hide Remix button for now until implemented */} {canRemix &&