gearheads
/
mastodon
Archived
2
0
Fork 0
Code Releases 4 Activity

Add form element on focal point modal (#19834) 

* Add form element on focal point modal

* Add type="button" for detection button
gh/stable
Sunny Ripert 2022-11-07 15:41:42 +01:00 committed by GitHub
parent 5925a31b78
commit 8515bc7962
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
app/javascript/mastodon/features/ui/components/focal_point_modal.js
View File

@ -176,14 +176,14 @@ class FocalPointModal extends ImmutablePureComponent {
handleKeyDown = (e) => { handleKeyDown = (e) => {
if (e.keyCode === 13 && (e.ctrlKey || e.metaKey)) { if (e.keyCode === 13 && (e.ctrlKey || e.metaKey)) {
e.preventDefault();
e.stopPropagation();
this.props.onChangeDescription(e.target.value); this.props.onChangeDescription(e.target.value);
this.handleSubmit(); this.handleSubmit(e);
} }
} }
handleSubmit = () => { handleSubmit = (e) => {
e.preventDefault();
e.stopPropagation();
this.props.onSave(this.props.description, this.props.focusX, this.props.focusY); this.props.onSave(this.props.description, this.props.focusX, this.props.focusY);
} }
@ -313,7 +313,7 @@ class FocalPointModal extends ImmutablePureComponent {
</div> </div>
<div className='report-modal__container'> <div className='report-modal__container'>
<div className='report-modal__comment'> <form className='report-modal__comment' onSubmit={this.handleSubmit} >
{focals && <p><FormattedMessage id='upload_modal.hint' defaultMessage='Click or drag the circle on the preview to choose the focal point which will always be in view on all thumbnails.' /></p>} {focals && <p><FormattedMessage id='upload_modal.hint' defaultMessage='Click or drag the circle on the preview to choose the focal point which will always be in view on all thumbnails.' /></p>}
{thumbnailable && ( {thumbnailable && (
@ -361,12 +361,23 @@ class FocalPointModal extends ImmutablePureComponent {
</div> </div>
<div className='setting-text__toolbar'> <div className='setting-text__toolbar'>
<button disabled={detecting || media.get('type') !== 'image' || is_changing_upload} className='link-button' onClick={this.handleTextDetection}><FormattedMessage id='upload_modal.detect_text' defaultMessage='Detect text from picture' /></button> <button
type='button'
disabled={detecting || media.get('type') !== 'image' || is_changing_upload}
className='link-button'
onClick={this.handleTextDetection}
>
<FormattedMessage id='upload_modal.detect_text' defaultMessage='Detect text from picture' />
</button>
<CharacterCounter max={1500} text={detecting ? '' : description} /> <CharacterCounter max={1500} text={detecting ? '' : description} />
</div> </div>
<Button disabled={!dirty || detecting || isUploadingThumbnail || length(description) > 1500 || is_changing_upload} text={intl.formatMessage(is_changing_upload ? messages.applying : messages.apply)} onClick={this.handleSubmit} /> <Button
</div> type='submit'
disabled={!dirty || detecting || isUploadingThumbnail || length(description) > 1500 || is_changing_upload}
text={intl.formatMessage(is_changing_upload ? messages.applying : messages.apply)}
/>
</form>
<div className='focal-point-modal__content'> <div className='focal-point-modal__content'>
{focals && ( {focals && (