From 93b9260426454c4301b8e0519042cc445929eb4d Mon Sep 17 00:00:00 2001 From: snow Date: Mon, 10 May 2021 15:38:59 +0800 Subject: [PATCH] switch editor --- .../elements/PostCategoryBanner.jsx | 1 + .../elements/PostCategoryBanner.scss | 2 + src/app/components/elements/ReplyEditor.jsx | 16 ++++-- src/app/components/elements/ReplyEditor.scss | 5 ++ .../components/elements/ReplyEditorNew.jsx | 17 +++++-- src/app/components/pages/SubmitPost.jsx | 49 +++++++++++++++++-- src/app/locales/en.json | 6 ++- src/app/locales/zh.json | 6 ++- 8 files changed, 87 insertions(+), 15 deletions(-) diff --git a/src/app/components/elements/PostCategoryBanner.jsx b/src/app/components/elements/PostCategoryBanner.jsx index 05f08382e7..3510c8a0d7 100644 --- a/src/app/components/elements/PostCategoryBanner.jsx +++ b/src/app/components/elements/PostCategoryBanner.jsx @@ -54,6 +54,7 @@ class PostCategoryBanner extends React.Component { Posting to {community ? 'Community: ' : ''} {label} + {this.props.editorButton} {/*
diff --git a/src/app/components/elements/PostCategoryBanner.scss b/src/app/components/elements/PostCategoryBanner.scss index 774bd0210e..9bc7212ce7 100644 --- a/src/app/components/elements/PostCategoryBanner.scss +++ b/src/app/components/elements/PostCategoryBanner.scss @@ -2,6 +2,8 @@ margin: .5em 0 1em; .postTo { + display: flex; + justify-content: space-between; small { font-size: 100%; color: #666; diff --git a/src/app/components/elements/ReplyEditor.jsx b/src/app/components/elements/ReplyEditor.jsx index e1783ea9e0..6cac0c7187 100644 --- a/src/app/components/elements/ReplyEditor.jsx +++ b/src/app/components/elements/ReplyEditor.jsx @@ -578,6 +578,7 @@ class ReplyEditor extends React.Component { username={username} onCancel={this.shiftTagInput.bind(this)} onUndo={this.unshiftTagInput.bind(this)} + editorButton={this.props.editorButton} /> )}
@@ -753,10 +754,17 @@ class ReplyEditor extends React.Component { isEdit={isEdit} tabIndex={3} /> -
- {(tags.touched || tags.value) && - tags.error}  -
+ {(tags.touched || tags.value) && + tags.error ? ( +
+ {(tags.touched || tags.value) && + tags.error}  +
+ ) : ( +
+ {tt('g.tag_tips')} +
+ )} )}
diff --git a/src/app/components/elements/ReplyEditor.scss b/src/app/components/elements/ReplyEditor.scss index d378db562b..6f23601643 100644 --- a/src/app/components/elements/ReplyEditor.scss +++ b/src/app/components/elements/ReplyEditor.scss @@ -119,3 +119,8 @@ .Dropdown__root___1B9ta { color: black!important; } + +.tap_input_tips { + color: #06D6A9; + margin-bottom: 10px; +} diff --git a/src/app/components/elements/ReplyEditorNew.jsx b/src/app/components/elements/ReplyEditorNew.jsx index 727093fc49..cd504a292f 100644 --- a/src/app/components/elements/ReplyEditorNew.jsx +++ b/src/app/components/elements/ReplyEditorNew.jsx @@ -564,6 +564,7 @@ class ReplyEditorNew extends React.Component { username={username} onCancel={this.shiftTagInput.bind(this)} onUndo={this.unshiftTagInput.bind(this)} + editorButton={this.props.editorButton} /> )}
@@ -677,10 +678,17 @@ class ReplyEditorNew extends React.Component { isEdit={isEdit} tabIndex={3} /> -
- {(tags.touched || tags.value) && - tags.error}  -
+ {(tags.touched || tags.value) && + tags.error ? ( +
+ {(tags.touched || tags.value) && + tags.error}  +
+ ) : ( +
+ {tt('g.tag_tips')} +
+ )} )}
@@ -863,6 +871,7 @@ export default formId => if (isStory && jsonMetadata && jsonMetadata.tags) { tags = OrderedSet([category, ...jsonMetadata.tags]).join(' '); } + console.log(tags); let isNSFWCommunity = false; isNSFWCommunity = state.global.getIn([ 'community', diff --git a/src/app/components/pages/SubmitPost.jsx b/src/app/components/pages/SubmitPost.jsx index 8d6e6f3e35..c320e2758f 100644 --- a/src/app/components/pages/SubmitPost.jsx +++ b/src/app/components/pages/SubmitPost.jsx @@ -7,9 +7,11 @@ import ReplyEditor from 'app/components/elements/ReplyEditor'; import { SUBMIT_FORM_ID } from 'shared/constants'; import Callout from 'app/components/elements/Callout'; import * as appActions from 'app/redux/AppReducer'; +import tt from 'counterpart'; const formId = SUBMIT_FORM_ID; const SubmitReplyEditor = ReplyEditor(formId); +const SubmitReplyEditorNew = ReplyEditorNew(formId); function _redirect_url(operations) { try { @@ -24,11 +26,21 @@ function _redirect_url(operations) { class SubmitPost extends React.Component { constructor() { super(); + this.state = { + editorNew: false, + }; this.success = operations => { localStorage.removeItem('replyEditorData-' + formId); browserHistory.push(_redirect_url(operations)); }; } + + switchEditor() { + this.setState({ + editorNew: !this.state.editorNew, + }); + } + componentWillMount() { this.props.setRouteTag(); } @@ -36,12 +48,39 @@ class SubmitPost extends React.Component { if (!this.props.username) { return Log in to make a post.; } - + const SwitchButton = ( + {`${ + this.state.editorNew + ? tt('g.switch_old_editor') + : tt('g.switch_new_editor') + }`} + ); return ( - +
+ {this.state.editorNew ? ( + + ) : ( + + )} +
); } } diff --git a/src/app/locales/en.json b/src/app/locales/en.json index ac98bca684..3b8e09a9c5 100644 --- a/src/app/locales/en.json +++ b/src/app/locales/en.json @@ -291,7 +291,11 @@ "many_followers": "%(count)s Followers", "many_posts": "%(count)s Posts", "search_history": "History", - "announcement": "Announcement" + "announcement": "Announcement", + "switch_new_editor": "Switch to new editor", + "switch_old_editor": "Switch to old editor", + "tag_tips": + "Tags must only contain lower case letters, numbers, and hyphens. They must be no more than 24 characters which start with a letter and end with a letter or a number." }, "navigation": { "about": "About Steemit, Inc.", diff --git a/src/app/locales/zh.json b/src/app/locales/zh.json index 3aeed9eb71..794a1285c6 100644 --- a/src/app/locales/zh.json +++ b/src/app/locales/zh.json @@ -229,7 +229,11 @@ "many_followers": "%(count)s个关注者", "many_posts": "%(count)s个帖子", "search_history": "搜索历史", - "announcement": "公告" + "announcement": "公告", + "switch_new_editor": "切换新版编辑器", + "switch_old_editor": "切换旧版编辑器", + "tag_tips": + "标签只能包含小写字母，数字和破折号。长度不能超过24个字符，请以字母开头，以字母或数字结尾。" }, "navigation": { "about": "关于",