[wp-trac] [WordPress Trac] #34323: Make customizer media control placeholders clickable

[WordPress Trac]

#34323: Make customizer media control placeholders clickable
-------------------------+-----------------------------
 Reporter:  NateWr       |      Owner:
     Type:  enhancement  |     Status:  new
 Priority:  normal       |  Milestone:  Awaiting Review
Component:  Customize    |    Version:  trunk
 Severity:  normal       |   Keywords:
  Focuses:  ui           |
-------------------------+-----------------------------
 This patch transforms the image placeholder for media controls in the
 customizer into a click-able area which loads the media manager.

 Here is a demonstration GIF attached to Slack #core-customize.
 https://wordpress.slack.com/archives/core-customize/p1444593134000052

 This patch represents a bare minimum of changes to implement this
 enhancement. However, while creating it I came across a couple of things
 worth considering:

 1. `api.HeaderTool.CurrentView` has a `getHeight` function which was
 previously used to set a fixed height to the placeholder div. This is no
 longer needed, so I just chopped the one line out of the `setPlaceholder`
 function. However, as far as I could tell, this `getHeight` function
 doesn't appear to be getting used. It does set a `savedHeight` value to
 the view's model, but I couldn't find that used anywhere. Perhaps it could
 get cut out completely?

 2. `api.HeaderControl` uses `api.HeaderTool.CurrentView` to render the
 placeholder. It seems most appropriate for the click event listener to be
 registered within `api.HeaderTool.CurrentView`. For this to happen,
 though, the view would need some way to pass the click event to the
 control, or the view would need to know how to open the media manager. I
 couldn't see any simple way to do that. To keep this initial patch as
 small as possible, I went ahead and added event listeners into the
 control. But perhaps someone with a better knowledge of the overall
 architecture wants to suggest a better way to handle this event listener.

 I did a bit of browser testing on this and all was ok:

 Chrome 45.0.2454.101/Ubuntu 14.04
 Firefox 41.0.1/Ubuntu 14.04
 Chrome/Android
 IE11/Win7 (VM)
 IE10/Win7 (VM)
 IE9/Win7 (VM)

 I have also attached a theme for testing. It will add all the core
 controls which extend the media control: Header, Background, Media, Image,
 Upload.

--
Ticket URL: <https://core.trac.wordpress.org/ticket/34323>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform