Add form element on focal point modal (#19834)
* Add form element on focal point modal * Add type="button" for detection button
This commit is contained in:
		
							parent
							
								
									5925a31b78
								
							
						
					
					
						commit
						8515bc7962
					
				@ -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 && (
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user