Skip to content
This repository has been archived by the owner on Sep 16, 2019. It is now read-only.

Clean Up JS and Expand Responsive Video Functionality #957

Merged
merged 3 commits into from Mar 16, 2017

Conversation

EricRihlmann
Copy link
Contributor

Moved the Foundation responsive video functionality from the frontend in JS to the backend in PHP. Expanded the support from just YouTube and Vimeo to all WP embed supported video sites. Also, now it supports both 4:3 and 16:9 videos by only adding the .widescreen class when needed.

To test out the new functionality, make a post/page with the following content.
(Note the YouTube videos in both 4:3 and 16:9 aspect ratio.)

<h2>Responsive Video Demo</h2>

<h2>College Humor</h2>
http://www.collegehumor.com/video/7043367/awkward-at-parties-horror-movie-with-allison-williams-and-lil-rel

<h2>Daily Motion</h2>
http://www.dailymotion.com/video/x5ewmxr_bbc-dad-says-he-s-flattered-by-response-to-viral-interview_news

<h2>Funny or Die</h2>
http://www.funnyordie.com/videos/6b57f613f9/paul-shaffer-meets-artie-fufkin-from-this-is-spinal-tap

<h2>TED</h2>
http://www.ted.com/talks/rodney_mullen_pop_an_ollie_and_innovate?utm_source=tedcomshare&utm_medium=referral&utm_campaign=tedspread

<h2>VideoPress</h2>
https://videopress.com/v/kUJmAcSf

<h2>WordPress TV F</h2>
http://wordpress.tv/2016/12/07/matt-mullenweg-state-of-the-word-2016/

<h3>Vimeo</h3>
https://vimeo.com/turbinfilm/northbound

<h3>YouTube</h3>
<h4>Shortened URL youtu.be (still works)</h4>
https://youtu.be/fJQ4hQSusjE

<h4>4:3 Aspect Ratio</h4>
https://www.youtube.com/watch?v=mM5_T-F1Yn4

<h4>16:9</h4>
https://www.youtube.com/watch?v=WUgvvPRH7Oc

<h2>Twitter</h2>
Unaffected by new WP filter.
https://twitter.com/ZURBfoundation/status/842006787385565185

Joyride is not included in Foundation 6.
Better to handle in the backend instead of the frontend. Also, adds support for additional video sites supported by WP embeds and dynamically adds class 'widescreen' to 16:9 videos.
Wrap in immediately-invoked function expression to create variable scope. This also allows the use of '$' in place of 'jQuery' without conflicts with other scripts.
@olefredrik olefredrik merged commit 2242235 into olefredrik:master Mar 16, 2017
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants