Notice: Function _load_textdomain_just_in_time was called incorrectly. Translation loading for the acf domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. Please see Debugging in WordPress for more information. (This message was added in version 6.7.0.) in /home/jwblogger/jwBlogger/wp-includes/functions.php on line 6121

Notice: Function wp_enqueue_script was called incorrectly. Scripts and styles should not be registered or enqueued until the wp_enqueue_scripts, admin_enqueue_scripts, or login_enqueue_scripts hooks. This notice was triggered by the codepen-embed-script handle. Please see Debugging in WordPress for more information. (This message was added in version 3.3.0.) in /home/jwblogger/jwBlogger/wp-includes/functions.php on line 6121
bootstrap – Jeff Wilkerson's Blog https://blog.jeffwilkerson.net The yoga of web development Mon, 11 Jan 2016 23:08:35 +0000 en-US hourly 1 https://wordpress.org/?v=6.8.5 AngularJS Module using Youtube API https://blog.jeffwilkerson.net/2016/01/11/angularjs-module-using-youtube-api/ https://blog.jeffwilkerson.net/2016/01/11/angularjs-module-using-youtube-api/#respond Mon, 11 Jan 2016 23:08:35 +0000 http://www.jeffwilkerson.net/?p=201 After about 6 months of casually dabbing in AngularJS, I have learned enough to start producing useful, production-ready modules. It has been an awkward learning curve to say the least, but I have kept with it, and now would like to document a module I have created for a client. I have replaced the Youtube links used for the client with videos from The Tonight Show.

The Objective

The client has buttons linking to Youtube videos throughout the site. Each link was going directly to the external Youtube page. The client wanted to keep the buttons, but have the videos launch a modal window taking up as much screen space as possible. Some pages had one link, other pages had many links. The site is using AngularJS and Bootstrap.

The Process

First, as with many projects, I surveyed Google to see if anyone had created what I needed. I found many tutorials showing how to create modals (see Ben Nadel). I also found this widget that uses the Youtube Developer API inside an AngularJS Directive, but no examples showing how to use the Youtube Developer API to load a video in a modal window. Nonetheless, I found Ben Nadel’s blog and Fran Dios’s jukebox app valuable as I continue to learn how to organize my AngularJS moduler.

The Results

View the full demo here.

This project taught me about module.run(), and how to compile templates inside directives.

]]> https://blog.jeffwilkerson.net/2016/01/11/angularjs-module-using-youtube-api/feed/ 0