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

Implement image copy paste on GB-RN mobile #14802

Merged
merged 8 commits into from
Apr 5, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
26 changes: 25 additions & 1 deletion packages/block-editor/src/components/rich-text/index.native.js
Original file line number Diff line number Diff line change
Expand Up @@ -302,11 +302,35 @@ export class RichText extends Component {
const isPasted = true;
const { onSplit } = this.props;

const { pastedText, pastedHtml } = event.nativeEvent;
const { pastedText, pastedHtml, files } = event.nativeEvent;
const currentRecord = this.createRecord( event.nativeEvent );

event.preventDefault();

// Only process file if no HTML is present.
// Note: a pasted file may have the URL as plain text.
if ( files && files.length > 0 ) {
const uploadId = Number.MAX_SAFE_INTEGER;
let html = '';
files.forEach( ( file ) => {
html += `<img src="${ file }" class="wp-image-${ uploadId }">`;
} );
const content = pasteHandler( {
HTML: html,
mode: 'BLOCKS',
tagName: this.props.tagName,
} );
const shouldReplace = this.props.onReplace && this.isEmpty();

if ( shouldReplace ) {
this.props.onReplace( content );
} else {
this.splitContent( currentRecord, content, isPasted );
}

return;
}

// There is a selection, check if a URL is pasted.
if ( ! isCollapsed( currentRecord ) ) {
const trimmedText = ( pastedHtml || pastedText ).replace( /<[^>]+>/g, '' )
Expand Down
10 changes: 9 additions & 1 deletion packages/block-library/src/image/edit.native.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import {
requestMediaPickFromMediaLibrary,
requestMediaPickFromDeviceLibrary,
requestMediaPickFromDeviceCamera,
requestMediaImport,
mediaUploadSync,
requestImageFailedRetryDialog,
requestImageUploadCancelDialog,
Expand Down Expand Up @@ -77,9 +78,16 @@ class ImageEdit extends React.Component {
componentDidMount() {
this.addMediaUploadListener();

const { attributes } = this.props;
const { attributes, setAttributes } = this.props;

if ( attributes.id && ! isURL( attributes.url ) ) {
if ( attributes.url.indexOf( 'file:' ) === 0 ) {
requestMediaImport( attributes.url, ( mediaId, mediaUri ) => {
if ( mediaUri ) {
setAttributes( { url: mediaUri, id: mediaId } );
}
} );
}
mediaUploadSync();
}
}
Expand Down
18 changes: 18 additions & 0 deletions packages/blocks/src/api/raw-handling/image-corrector.native.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@

/**
* This method check for copy pasted img elements to see if they don't have suspicious attributes.
*
* @param {Node} node The node to check.
*
* @return {void}
*/
export default function( node ) {
SergioEstevao marked this conversation as resolved.
Show resolved Hide resolved
if ( node.nodeName !== 'IMG' ) {
return;
}

// Remove trackers and hardly visible images.
SergioEstevao marked this conversation as resolved.
Show resolved Hide resolved
if ( node.height === 1 || node.width === 1 ) {
node.parentNode.removeChild( node );
}
}