Youtube iFrame embeds not working on iOS devices – FIX!

March 23, 2012 at 10:08 am | Design, Programming, web.

Seems like a lot of people are having problems with youtube iFrame embeds working correctly on iOS devices (iPhone, iPad). Sometimes they will work, other times they wont. I have seen a bunch of different fixes for this but nothing that worked consistently for me.

The problem seems to come from the extra parameters that people put at the end of the URL string to get certain functionality. Some of these are very nice additions that Youtube has put in there.

All of the following query string parameters that the Youtube iFrame uses to add functionality to the embedded video, will cause problems when the URL is used to load an HTML5 video for the iOS device.

HTML with params

<iframe width="519" height="350" src="http://www.youtube.com/embed/D2p0UKDrC_o?
  enablejsapi=1&amp;version=3&amp;rel=0&amp;controls=1&amp;playerapiid=ytplayer&amp;modestbranding=1&amp;autohide=1" 
frameborder="0" allowfullscreen></iframe>

HTML without the params.

<iframe width="519" height="350" src="http://www.youtube.com/embed/D2p0UKDrC_o" 
frameborder="0" allowfullscreen></iframe>

You can use a JS script to load one iFrame for regular users and one for iOS devices

Gist with how to check for iOS and how to embed with a function

How to setup a case sensitive subversion repository in the sites folder on a Mac

at 9:28 am | Apple, Design, Programming, web.

If you have run into problems checking out a case sensitive site repository to work on locally, you may know this frustration. Someone may have created a file in your repository that has the same name as another file but with different cases. eg. (imagename.png, ImageName.png) Your repository may know these as two different files but your Mac won’t (At least out of the box)

So what are you to do?

Well you can follow the following steps like I learned from some friends

Goto Disk Utility and create a new disk image that is the size needed for your repository
Make it a sparse disk image
pick the size that you need
Save it in your sites folder (or where ever your apache or web server is running)
Open terminal and go to the folder in your new volume (cd /Volumes/name of your image/)
check out your repository into your new volume (svn co http://svn.reposname.com/repos/nameofrepository/trunk .)
Now go to your Sites folder in terminal cd /Users/your name/sites/ (or where ever your web server is looking for your local sites)
create a symbolic link from a folder where your webserver will be looking for your new repository to the new case-sensitive volume you have created
ln -s /Volumes/Name of Disk Image/ nameOfFolderInYourSitesDirectory/
It’s important that there is NOT already a folder with this name already in your Sites directory.