From 3dba731dd7ea22a3d00c15a7e8862da38e5041f2 Mon Sep 17 00:00:00 2001 From: Trevor Buckner Date: Fri, 18 Dec 2020 23:51:08 -0500 Subject: [PATCH] Popup confirmation when switching between google and hb (#1155) * Popup confirmation when switching between google and hb * Allow closing error popup. * Up version. --- changelog.md | 13 +++- client/homebrew/pages/editPage/editPage.jsx | 79 +++++++++++++++---- client/homebrew/pages/editPage/editPage.less | 81 ++++++++++++++++---- package-lock.json | 2 +- package.json | 2 +- 5 files changed, 141 insertions(+), 36 deletions(-) diff --git a/changelog.md b/changelog.md index d42f0d7a0..beba63d7a 100644 --- a/changelog.md +++ b/changelog.md @@ -1,8 +1,13 @@ # changelog +### Friday, 18/12/2020 - v2.10.5 +- Brews now immediately save when transferring between Google Drive and Homebrewery storage. +- Added confirmation popup to clarify the transfer process. +- Brews transferred or deleted from Google will be found in your Google Drive trash. +- Dependency updates. + ### Wednesday, 25/11/2020 - v2.10.4 - Fixed Google Drive brews not saving metadata (view count, description, etc.) Note that we are still working on making published Google brews visible to the public when viewing your profile page. -- Fixed inconsistent font size for bullet lists inside notes (thanks /u/garumoo! re:1085) ### Thursday, 22/10/2020 - v2.10.3 - Fixed brews with broken code crashing the edit page when loaded (the "blue screen of death" bug). @@ -27,6 +32,9 @@ ### Wednesday, 20/05/2020 - v2.9.0 - Major refactoring of site backend to work with updated dependencies for security (should be invisible to users) +``` +``` + ### Wednesday, 11/03/2020 - v2.8.2 - Fixed delete button removing everyone's copy for brews with multiple authors - Compressed homebrew text in database @@ -37,9 +45,6 @@ - Fixed issue of being unable to change brew metadata - Sanitized script tags-javascript typed into the editor was crashing brews -``` -``` - ### Sunday, 08/04/2018 - v2.8.0 - Re-enabled box shadows for PDF output - Added a "contributing guide" for the GitHub diff --git a/client/homebrew/pages/editPage/editPage.jsx b/client/homebrew/pages/editPage/editPage.jsx index 530987ad5..5430070cd 100644 --- a/client/homebrew/pages/editPage/editPage.jsx +++ b/client/homebrew/pages/editPage/editPage.jsx @@ -51,12 +51,13 @@ const EditPage = createClass({ return { brew : this.props.brew, - isSaving : false, - isPending : false, - saveGoogle : this.props.brew.googleId ? true : false, - errors : null, - htmlErrors : Markdown.validate(this.props.brew.text), - url : '' + isSaving : false, + isPending : false, + saveGoogle : this.props.brew.googleId ? true : false, + confirmGoogleTransfer : false, + errors : null, + htmlErrors : Markdown.validate(this.props.brew.text), + url : '' }; }, savedBrew : null, @@ -135,12 +136,27 @@ const EditPage = createClass({ } }, + handleGoogleClick : function(){ + this.setState((prevState)=>({ + confirmGoogleTransfer : !prevState.confirmGoogleTransfer + })); + this.clearErrors(); + }, + toggleGoogleStorage : function(){ this.setState((prevState)=>({ saveGoogle : !prevState.saveGoogle, isSaving : false, errors : null - }), ()=>this.trySave()); + }), ()=>this.save()); + }, + + clearErrors : function(){ + this.setState({ + errors : null, + isSaving : false + + }); }, save : async function(){ @@ -163,7 +179,7 @@ const EditPage = createClass({ console.log(err.status === 401 ? 'Not signed in!' : 'Error Saving to Google!'); - this.setState({ errors: err }); + this.setState({ errors: err, saveGoogle: false }); }); if(!res) { return; } @@ -185,7 +201,7 @@ const EditPage = createClass({ console.log(err.status === 401 ? 'Not signed in!' : 'Error Saving to Google!'); - this.setState({ errors: err }); + this.setState({ errors: err, saveGoogle: false }); return; }); @@ -236,15 +252,38 @@ const EditPage = createClass({ renderGoogleDriveIcon : function(){ if(this.state.saveGoogle) { - return + return googleDriveActive + + {this.state.confirmGoogleTransfer && +
+ Would you like to transfer this brew from your Google Drive storage back to the Homebrewery?
+
+ Yes +
+
+ No +
+
+ } ; } else { - return + return googleDriveInactive + + {this.state.confirmGoogleTransfer && +
+ Would you like to transfer this brew from the Homebrewery to your personal Google Drive storage?
+
+ Yes +
+
+ No +
+
+ } ; } - }, renderSaveButton : function(){ @@ -258,12 +297,18 @@ const EditPage = createClass({ if(this.state.errors.status == '401'){ return Oops! -
+
You must be signed in to a Google account - to save this to Google Drive!
- Sign in Google Drive!
+ - here. +
+ Sign In +
+ +
+ Not Now +
; } @@ -273,7 +318,7 @@ const EditPage = createClass({ diff --git a/client/homebrew/pages/editPage/editPage.less b/client/homebrew/pages/editPage/editPage.less index 8e48c7dc5..381b29fca 100644 --- a/client/homebrew/pages/editPage/editPage.less +++ b/client/homebrew/pages/editPage/editPage.less @@ -1,7 +1,7 @@ .editPage{ .navItem.save{ - width : 105px; + width : 106px; text-align : center; &.saved{ cursor : initial; @@ -10,23 +10,78 @@ &.error{ position : relative; background-color : @red; - .errorContainer{ - position : absolute; - top : 29px; - left : -20px; - z-index : 1000; - width : 135px; - padding : 6px; - background-color : #333; - a{ - color : @teal; - } - } } } + .googleDriveStorage { + position : relative; + } .googleDriveStorage img{ height : 20px; padding : 0px; margin : -5px; } + .errorContainer{ + position : absolute; + top : 100%; + left : 50%; + z-index : 1000; + width : 140px; + padding : 3px; + background-color : #333; + border : 3px solid #444; + border-radius : 5px; + transform : translate(-50% + 3px, 10px); + text-align : center; + a{ + color : @teal; + } + &:before { + content: ""; + width: 0px; + height: 0px; + position: absolute; + border-left: 10px solid transparent; + border-right: 10px solid transparent; + border-top: 10px solid transparent; + border-bottom: 10px solid #444; + left: 53px; + top: -23px; + } + &:after { + content: ""; + width: 0px; + height: 0px; + position: absolute; + border-left: 10px solid transparent; + border-right: 10px solid transparent; + border-top: 10px solid transparent; + border-bottom: 10px solid #333; + left: 53px; + top: -19px; + } + .deny { + width : 48%; + margin : 1px; + padding : 5px; + background-color : #333; + display : inline-block; + border-left : 1px solid #666; + .animate(background-color); + &:hover{ + background-color : red; + } + } + .confirm { + width : 48%; + margin : 1px; + padding : 5px; + background-color : #333; + display : inline-block; + color : white; + .animate(background-color); + &:hover{ + background-color : teal; + } + } + } } diff --git a/package-lock.json b/package-lock.json index 80f9a959a..5abb1e878 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "homebrewery", - "version": "2.10.4", + "version": "2.10.5", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index bc8ae2c2e..e1b5bef51 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "homebrewery", "description": "Create authentic looking D&D homebrews using only markdown", - "version": "2.10.4", + "version": "2.10.5", "engines": { "node": "12.16.x" },