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.

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

[RNMobile] Initial support for VideoPress v5 #35637

Merged
merged 24 commits into from
Feb 23, 2024
Merged
Show file tree
Hide file tree
Changes from 23 commits
Commits
Show all changes
24 commits
Select commit Hold shift + click to select a range
3b4fe9b
feat: Enable usage of v5's editor component
Feb 12, 2024
07a7b96
docs: Add changelog entry
Feb 12, 2024
ea3a0a9
feat: Dupe Video block for basis of v5 support
Feb 13, 2024
f5e9233
feat: Fetch VideoPress metadata in edit component
Feb 13, 2024
79b062d
fix: Ensure plays inline toggle works as expected
Feb 13, 2024
6c8d50e
fix: Remove typo in settings component
Feb 13, 2024
87db30a
refactor: Update logic for fetching video's URL
Feb 13, 2024
a5d7df8
feat: Ensure poster displays in thumbnail
Feb 13, 2024
9fecddc
fix: Ensure isUploadFailed state is always correct
Feb 14, 2024
92904ee
feat: Show activity indicator if video's uploading
Feb 14, 2024
1aa07e5
refactor: Ensure fetchMetadata logic is correct
Feb 14, 2024
1b98f61
refactor: Call poster directly, no redundant var
Feb 14, 2024
b4d689c
fix: Return early if GUID is falsey, avoid crash
Feb 16, 2024
7804db2
refactor: Tidy up consts for improved readability
Feb 16, 2024
85a30ac
refactor: Replace inline styles with object ref
Feb 16, 2024
11a8a8a
refactor: Pass token to support private sites
Feb 16, 2024
6c5e18b
Merge branch 'trunk' into rnmobile/support-for-videopress-v5
Feb 17, 2024
ce02a7c
fix: Return URL for non-VideoPress videos
Feb 20, 2024
ae25e26
Merge branch 'trunk' into rnmobile/support-for-videopress-v5
Feb 20, 2024
1955fc1
fix: Ensure failed state is reset when users retry
Feb 22, 2024
95a7277
refactor: Tweaks to allow reusing translations
Feb 22, 2024
f1ae7fb
refactor: Align id definition with the video block
Feb 22, 2024
e1de824
feat: Enable embed block convert after URL insert
Feb 23, 2024
e88d3d4
refactor: Fix missing period at end of sentence
Feb 23, 2024
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
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
Significance: patch
Type: other

RNMobile: Enable support for editing v5 of the VideoPress block in the Jetpack app.
Original file line number Diff line number Diff line change
Expand Up @@ -15,3 +15,5 @@ export const VIDEO_PRIVACY = {
PRIVATE: 1,
SITE_DEFAULT: 2,
};

export const DEFAULT_EMBED_BLOCK = 'core/embed';
Copy link
Contributor

Choose a reason for hiding this comment

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

In the future, it would be interesting if we provide the same settings of the VideoPress block:

  • Title
  • Description
  • Playback Bar Color
  • Privacy and Rating

Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
/**
* WordPress dependencies
*/
import { ToggleControl, SelectControl } from '@wordpress/components';
import { useMemo, useCallback } from '@wordpress/element';
import { __, _x } from '@wordpress/i18n';

const options = [
{ value: 'auto', label: _x( 'Auto', 'VideoPress preload setting', 'jetpack' ) },
{
value: 'metadata',
label: _x( 'Metadata', 'VideoPress preload setting', 'jetpack' ),
},
{ value: 'none', label: _x( 'None', 'VideoPress preload setting', 'jetpack' ) },
];

const VideoSettings = ( { setAttributes, attributes } ) => {
const { autoplay, controls, loop, muted, playsinline, preload } = attributes;

const toggleFactory = useMemo( () => {
const toggleAttribute = attribute => {
return newValue => {
setAttributes( { [ attribute ]: newValue } );
};
};

return {
autoplay: toggleAttribute( 'autoplay' ),
loop: toggleAttribute( 'loop' ),
muted: toggleAttribute( 'muted' ),
controls: toggleAttribute( 'controls' ),
playsinline: toggleAttribute( 'playsinline' ),
Copy link
Author

@SiobhyB SiobhyB Feb 13, 2024

Choose a reason for hiding this comment

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

Note, the changed capitalisation of playsinline (previously playsInline) is intended, it's necessary to fix a bug with that setting. (See this relevant web change for an example of a change to fix a similar bug.)

};
}, [ setAttributes ] );

const onChangePreload = useCallback(
value => {
setAttributes( { preload: value } );
},
[ setAttributes ]
);

return (
<>
<ToggleControl
__nextHasNoMarginBottom
label={ __( 'Autoplay', 'jetpack' ) }
onChange={ toggleFactory.autoplay }
checked={ !! autoplay }
help={ __( 'Autoplay may cause usability issues for some users', 'jetpack' ) }
fluiddot marked this conversation as resolved.
Show resolved Hide resolved
/>
<ToggleControl
__nextHasNoMarginBottom
label={ __( 'Loop', 'jetpack' ) }
onChange={ toggleFactory.loop }
checked={ !! loop }
/>
<ToggleControl
__nextHasNoMarginBottom
label={ __( 'Muted', 'jetpack' ) }
onChange={ toggleFactory.muted }
checked={ !! muted }
/>
<ToggleControl
__nextHasNoMarginBottom
label={ __( 'Playback Controls', 'jetpack' ) }
onChange={ toggleFactory.controls }
checked={ !! controls }
/>
<ToggleControl
__nextHasNoMarginBottom
label={ __( 'Play Inline', 'jetpack' ) }
onChange={ toggleFactory.playsinline }
checked={ !! playsinline }
/>
<SelectControl
__nextHasNoMarginBottom
label={ __( 'Preload', 'jetpack' ) }
value={ preload }
onChange={ onChangePreload }
options={ options }
hideCancelButton={ true }
/>
</>
);
};

export default VideoSettings;
Loading
Loading