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

Try to figure out which is the right LinkDestination value for an image #17401

Closed
wants to merge 3 commits into from
Closed

Try to figure out which is the right LinkDestination value for an image #17401

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
cd40048
Try to figure out which is the right LinkDestination value for an image
jesusangel Mar 12, 2019
f7096a9
Fix lint errors.
jesusangel Mar 13, 2019
773d6ec
Fix onSelectURL to manage default LinkDestination values other
jesusangel Mar 13, 2019
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
75 changes: 72 additions & 3 deletions packages/block-library/src/image/edit.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -142,6 +142,30 @@ export class ImageEdit extends Component {
} );
}
}

// Try to figure out right values for LinkDestination and href if
// user has changed the default linkDestination value (none) and
// the user edits a post created with a different linkDestination
// default value.
if ( ! this.state.isEditing ) {
if (
attributes.href &&
attributes.linkDestination === LINK_DESTINATION_NONE
) {
if ( attributes.href === attributes.url ) {
attributes.linkDestination = LINK_DESTINATION_MEDIA;
} else if ( attributes.href.indexOf( 'attachment' ) ) {
attributes.linkDestination = LINK_DESTINATION_ATTACHMENT;
} else {
attributes.linkDestination = LINK_DESTINATION_CUSTOM;
}
} else if (
! attributes.href &&
attributes.linkDestination !== LINK_DESTINATION_NONE
) {
attributes.linkDestination = LINK_DESTINATION_NONE;
}
}
}

componentDidUpdate( prevProps ) {
Expand Down Expand Up @@ -177,9 +201,14 @@ export class ImageEdit extends Component {
return;
}

const { id, url, alt, caption, linkDestination } = this.props.attributes;

const { id, url, alt, caption } = this.props.attributes;
let mediaAttributes = pickRelevantMediaFiles( media );
const linkAttributes = this.buildLinkAttributes(
this.props.attributes.linkDestination,
{ ...this.props.attributes, ...mediaAttributes },
null
);

// If the current image is temporary but an alt or caption text was meanwhile written by the user,
// make sure the text is not overwritten.
Expand Down Expand Up @@ -220,17 +249,57 @@ export class ImageEdit extends Component {
this.props.setAttributes( {
...mediaAttributes,
...additionalAttributes,
...linkAttributes,
width: undefined,
height: undefined,
} );

this.setState( {
isEditing: false,
} );
}

onSetLinkDestination( value ) {
this.props.setAttributes(
this.buildLinkAttributes( value, this.props.attributes, this.props.image )
);
}

buildLinkAttributes( value, attributes, image ) {
let href;

if ( value === LINK_DESTINATION_NONE ) {
href = undefined;
} else if ( value === LINK_DESTINATION_MEDIA ) {
href = ( image && image.source_url ) || attributes.url;
} else if ( value === LINK_DESTINATION_ATTACHMENT ) {
href = ( image && image.link ) || attributes.link;
} else {
href = attributes.href;
}

return {
linkDestination: value,
href,
};
}

onSelectURL( newURL ) {
const { url } = this.props.attributes;
const { url, linkDestination } = this.props.attributes;
let newLinkDestination = linkDestination;

// Images from URL doesn't have an attachment link
if ( linkDestination === LINK_DESTINATION_ATTACHMENT ) {
newLinkDestination = LINK_DESTINATION_NONE;
}

if ( newURL !== url ) {
this.props.setAttributes( {
url: newURL,
href: linkDestination === LINK_DESTINATION_MEDIA ? newURL : null,
id: undefined,
sizeSlug: DEFAULT_SIZE_SLUG,
linkDestination: newLinkDestination,
} );
}
}
Expand Down