WordPress.org

Make WordPress Core

Opened 6 years ago

Closed 6 years ago

#27698 closed enhancement (fixed)

Add hooks to the wpeditimage tinymce plugin and to the image details portion of the media modal

Reported by: gcorne Owned by: gcorne
Milestone: 3.9 Priority: normal
Severity: normal Version: 3.9
Component: Editor Keywords: has-patch commit
Focuses: javascript, administration Cc:

Description

In order to extend the new image details media modal, there are some hooks that are needed both inside the wpeditimage tinymce plugin and also in media-template.php. This will allow us to bring back the border and padding in a plugin if needed and also allow plugin authors an opportunity to incorporate custom functionality.

Attachments (5)

27698-01.patch (1.6 KB) - added by gcorne 6 years ago.
27698-02.patch (1.8 KB) - added by gcorne 6 years ago.
27698-03.patch (6.9 KB) - added by gcorne 6 years ago.
27698-04.patch (8.6 KB) - added by gcorne 6 years ago.
image-edit-advanced.zip (1.5 KB) - added by gcorne 6 years ago.

Download all attachments as: .zip

Change History (15)

@gcorne
6 years ago

#1 @azaozz
6 years ago

Patch looks good. Wondering if it would be better/easier to trigger custom jQuery events instead of TinyMCE events, and pass the editor instance. Something like:

if ( typeof window.jQuery !== 'undefined' ) {
  window.jQuery( document ).triggerHandler( 'WPImageData', { editor: editor, metadata: metadata, image: imageNode } );
}

Then that can be used without needing to make a TinyMCE plugin.

This ticket was mentioned in IRC in #wordpress-dev by gcorne. View the logs.


6 years ago

This ticket was mentioned in IRC in #wordpress-dev by gcorne. View the logs.


6 years ago

@gcorne
6 years ago

@gcorne
6 years ago

@gcorne
6 years ago

#4 @gcorne
6 years ago

Moving this ticket to the 3.9 milestone, although it may be punted in favor of #27706

In 27698-04.patch, I have revised both what is used for the hooks and also several aspects of the image details modal works in order to create an unfinished plugin that demonstrates how a developer could hook in and add additional functionality. The plugin in its current form just adds a border to the image in a rough fashion.

Some notes about the patch that may warrant discussion:

  • Adds wp.media.hooks which is intended to be a global media event bus. The idea is that it would make sense when in the context of media to have an event bus that third-party code can listen for events on. I think this is cleaner than using jQuery when in the context of media, and is a starting point for adding more places for developers to hook in to media.
  • Adds a post-render event to the ImageDetails view that third-party code can leverage to add subviews. While incorporating this, I discovered a drawback with the Settings view and its magic, which is that the parent Settings view will still respond to events that occur as a result of user actions in the subview. This is magnified because the event bindings are quite generic. One way around this would be to break up the various blocks of settings into separate subviews.
  • I now fully understand the relationship between the create region event and the render region event. There are places where she should be using create, which simplifies the code a bit and more importantly opens the door to 3rd-party developers being able to add render events that add subviews or override the view.
  • The patch also adds a performance improvement change to how the PostImage model is initialized. If the user opens a modal referencing a image that has already been fetched, it is probably safe to just reuse the existing model instead of fetching again.
  • Adds a bit more markup to the image details template to make it easier to add a view to the image portion of advanced options.

#5 @gcorne
6 years ago

  • Milestone changed from Awaiting Review to 3.9

This ticket was mentioned in IRC in #wordpress-dev by gcorne. View the logs.


6 years ago

This ticket was mentioned in IRC in #wordpress-dev by nacin. View the logs.


6 years ago

#8 @azaozz
6 years ago

  • Keywords has-patch commit added

27698-04.patch looks good.

#9 @nacin
6 years ago

  • Owner set to gcorne
  • Status changed from new to assigned

I suggested to gcorne we rename hooks to events; he agreed. I think this is pretty much good to go.

Assigning to gcorne for tracking purposes.

#10 @azaozz
6 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 28095:

Add hooks to the wpeditimage tinymce plugin and to the image details portion of the media modal.

  • Add wp.media.events which is intended to be a global media event bus.
  • Add a post-render event to the ImageDetails view that third-party code can leverage to add subviews.
  • Performance improvement for the initialization of the PostImage model.
  • A bit more markup to the image details template to make it easier to add a view to the advanced options.

Props gcorne, fixes #27698

Note: See TracTickets for help on using tickets.