Skip to content

Commit

Permalink
Switch on open to Edit Gallery with images
Browse files Browse the repository at this point in the history
Instead of reopening the Media Gallery, which the Media Upload Button does,
when editing the gallery requires opening the Edit Gallery modal. Also
requires setting selection and event which translates backbone data.

Props to @georgeh, who I paired with developing

See wp.media.editor from wp-includes/js/media-views.js
  • Loading branch information
mkaz committed May 25, 2017
1 parent d5777da commit 0786012
Showing 1 changed file with 19 additions and 4 deletions.
23 changes: 19 additions & 4 deletions blocks/library/gallery/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,16 +11,30 @@ import GalleryImage from './gallery-image';

const { query } = hpq;

const openMediaLibrary = () => {
const editMediaLibrary = ( attributes, setAttributes ) => {
const frameConfig = {
title: wp.i18n.__( 'Select or Upload a media' ),
frame: 'post',
title: wp.i18n.__( 'Update Gallery media' ),
button: {
text: wp.i18n.__( 'Select' ),
},
multiple: true,
state: 'gallery-edit',
selection: new wp.media.model.Selection( attributes.images, { multiple: true } ),
};

wp.media( frameConfig ).open();
const editFrame = wp.media( frameConfig );
function updateFn() {
setAttributes( {
images: this.frame.state().attributes.library.models.map( ( a ) => {
return a.attributes;
} ),
} );
}

editFrame.on( 'insert', updateFn );
editFrame.state( 'gallery-edit' ).on( 'update', updateFn );
editFrame.open( 'gutenberg-gallery' );
};

/**
Expand All @@ -43,14 +57,15 @@ registerBlock( 'core/gallery', {
category: 'common',

attributes: {
// TODO: fix when loading view with existing gallery
images: query( 'div.blocks-gallery' ),
},

controls: [
{
icon: 'format-image',
title: wp.i18n.__( 'Edit Gallery' ),
onClick: () => openMediaLibrary(),
onClick: editMediaLibrary,
},
{
icon: 'align-left',
Expand Down

0 comments on commit 0786012

Please sign in to comment.