Search code examples
javascriptaviary

Script loaded with HeadJS runs only on second click


Script loaded with HeadJS runs only on second click. How to get Aviary launcher on first click?

http://jsfiddle.net/ynts/6hgEb/

function aviary(id, src) {
    var $id = id;
    var $src = src;

    head.load(
        "http://feather.aviary.com/js/feather.js",
        function() {

            var featherEditor = new Aviary.Feather({
                apiKey: 12345,
                apiVersion: 3

                // ... ///
            });

            featherEditor.launch({
                image: $id,


                  url: $src
                });
            }
        ); 
}

$(document).on('click', 'img', function(){
    var $img = $(this).attr('src');
    aviary('edit-pic', $img);
}); 

Solution

  • You need to wait for the plugin to initialize, before calling the launch function. There is onLoad event you can use:

    var featherEditor = new Aviary.Feather({
                    apiKey: 12345,
                    apiVersion: 3,
                    onLoad: function() {
                         featherEditor.launch({
                            image: $id,
                            url: $src
                        });
                    }                                    
                });