Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adds the new replace flow to the video block #19162

Merged
merged 3 commits into from
Jan 7, 2020
Merged

Adds the new replace flow to the video block #19162

Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
7a81852
adds the new replace flow to the video block
draganescu Dec 16, 2019
960fdaa
removes useless editing and src state
draganescu Jan 6, 2020
f82e730
removed obsolete comments
draganescu Jan 7, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
43 changes: 15 additions & 28 deletions packages/block-library/src/video/edit.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import {
Button,
Disabled,
PanelBody,
ToolbarGroup,
withNotices,
} from '@wordpress/components';
import {
Expand All @@ -17,6 +16,7 @@ import {
MediaPlaceholder,
MediaUpload,
MediaUploadCheck,
MediaReplaceFlow,
RichText,
} from '@wordpress/block-editor';
import { Component, createRef } from '@wordpress/element';
Expand Down Expand Up @@ -47,10 +47,6 @@ class VideoEdit extends Component {
super( ...arguments );
// edit component has its own src in the state so it can be edited
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The src state was removed in #6820, so we can remove this comment.

// without setting the actual value outside of the edit UI
this.state = {
editing: ! this.props.attributes.src,
};

this.videoPlayer = createRef();
this.posterImageButton = createRef();
this.onSelectURL = this.onSelectURL.bind( this );
Expand All @@ -76,7 +72,6 @@ class VideoEdit extends Component {
setAttributes( { src: url } );
},
onError: ( message ) => {
this.setState( { editing: true } );
noticeOperations.createErrorNotice( message );
},
allowedTypes: ALLOWED_MEDIA_TYPES,
Expand All @@ -95,8 +90,7 @@ class VideoEdit extends Component {
const { attributes, setAttributes } = this.props;
const { src } = attributes;

// Set the block's src from the edit component's state, and switch off
// the editing UI.
// Set the block's src from the edit component's state
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We also can remove this comment, it's not valid since #6820

if ( newSrc !== src ) {
// Check if there's an embed block that handles this URL.
const embedBlock = createUpgradedEmbedBlock(
Expand All @@ -108,8 +102,6 @@ class VideoEdit extends Component {
}
setAttributes( { src: newSrc, id: undefined } );
}

this.setState( { editing: false } );
}

onSelectPoster( image ) {
Expand Down Expand Up @@ -146,25 +138,20 @@ class VideoEdit extends Component {
attributes,
setAttributes,
} = this.props;
const { editing } = this.state;
const switchToEditing = () => {
this.setState( { editing: true } );
};
const onSelectVideo = ( media ) => {
if ( ! media || ! media.url ) {
// in this case there was an error and we should continue in the editing state
// previous attributes should be removed because they may be temporary blob urls
// in this case there was an error
// previous attributes should be removed
// because they may be temporary blob urls
setAttributes( { src: undefined, id: undefined } );
switchToEditing();
return;
}
// sets the block's attribute and updates the edit component from the
// selected media, then switches off the editing UI
// selected media
setAttributes( { src: media.url, id: media.id } );
this.setState( { src: media.url, editing: false } );
};

if ( editing ) {
if ( ! src ) {
return (
<MediaPlaceholder
icon={ <BlockIcon icon={ icon } /> }
Expand All @@ -184,14 +171,14 @@ class VideoEdit extends Component {
return (
<>
<BlockControls>
<ToolbarGroup>
<Button
className="components-toolbar__control"
label={ __( 'Edit video' ) }
onClick={ switchToEditing }
icon="edit"
/>
</ToolbarGroup>
<MediaReplaceFlow
mediaURL={ src }
allowedTypes={ ALLOWED_MEDIA_TYPES }
accept="video/*"
onSelect={ onSelectVideo }
onSelectURL={ this.onSelectURL }
onError={ this.onUploadError }
/>
</BlockControls>
<InspectorControls>
<PanelBody title={ __( 'Video Settings' ) }>
Expand Down