19
WordPress Media In a post-Koop Universe

WordPress Media in a post-Koop Universe

Embed Size (px)

DESCRIPTION

Presentation from WordCamp NYC 2014

Citation preview

Page 1: WordPress Media in a post-Koop Universe

WordPress MediaIn a post-Koop Universe

Page 2: WordPress Media in a post-Koop Universe

Scott Taylor• Core Committer

• Sr. Software Engineer, The New York Times

• @wonderboymusic

• I like music

• I like Mexican food

Page 3: WordPress Media in a post-Koop Universe

How I got started with WordPress

Page 4: WordPress Media in a post-Koop Universe

How I got started contributing

Page 5: WordPress Media in a post-Koop Universe

How I got started with Backbone

Page 6: WordPress Media in a post-Koop Universe

How I got started with MEDIA

Page 7: WordPress Media in a post-Koop Universe

MEDIA!WordPress 3.5

Page 8: WordPress Media in a post-Koop Universe

WordPress 3.9MORE MEDIA!

Page 9: WordPress Media in a post-Koop Universe

Backbone/Underscore• Views

• Models

• Collections

• Frames

• Regions

• States

Page 10: WordPress Media in a post-Koop Universe

Underscore

• Utility belt

• Does not require jQuery

• Smells like Ruby

• List iterators

Page 11: WordPress Media in a post-Koop Universe

Backbone

• Un-opinionated

• MVC

• Ruby-like

• Hard to know what you are doing right/wrong

Page 12: WordPress Media in a post-Koop Universe

MediaElement

• Facade layer for HTML5 media

• Cross-browser compatibility

• It just works

Page 13: WordPress Media in a post-Koop Universe

[audio], [video], [playlist]

Page 14: WordPress Media in a post-Koop Universe

Shortcodes

• Containers for data

• Placeholders

• Forward-compatible

• Shortcode API

Page 15: WordPress Media in a post-Koop Universe

Use what exists• Galleries are playlists

• Video is audio

• Video playlists are audio playlists

• Things are collections

• Embed are media

Page 16: WordPress Media in a post-Koop Universe

$( ‘.thing’ ).mediaelementplayer();

Page 17: WordPress Media in a post-Koop Universe

Front End JS

• Needs to automagically work for every possible use-case

• Needs to not be overly bloated

Page 18: WordPress Media in a post-Koop Universe

Admin

• TinyMCE view

• JS version of PHP code

• Iframe sandboxes

• WYSIWYG

Page 19: WordPress Media in a post-Koop Universe

wp.media.audio = { // click the view edit: { . . . }, ! // shortcode returned to the editor shortcode: { . . . }, // default props }

wp.mce.views.register( ‘audio’, . . . )