// @cmd.optimizer.requires.async
/**
 * This mixin allows users to easily require external scripts in their classes. This load
 * process delays application launch (`Ext.onReady`) until all such scripts are loaded
 * ensuring that your class will have access to its required scripts from the start.
 *
 * For example:
 *
 *      Ext.define('Feed', {
 *          mixins: ['Ext.mixin.Mashup'],
 *
 *          requiredScripts: [
 *              '//www.foo.com/code/bar.js' // preserve http/s
 *          ],
 *
 *          // The code in "bar.js" will be available at application launch
 *      });
 *
 * If your required script needs to be dynamic, for example it contains a key for an API, you can
 * use the {@link Ext.Manifest#mashup mashup} object.
 *
 * @since 5.0.0
 */
Ext.define('Ext.mixin.Mashup', function(Mashup) { return { // eslint-disable-line brace-style
    extend: 'Ext.Mixin',

    mixinConfig: {
        id: 'mashup',

        extended: function(baseClass, derivedClass) {
            Mashup.process(derivedClass);
        }
    },

    /**
     * @cfg {String/String[]} requiredScripts
     * Scripts that are required to be loaded in order for your Mashup to work.
     * These scripts can also use {@link Ext.Template template} syntax if there is data in the
     * {@link Ext.Manifest#mashup mashup} object for the class `xtype`.
     *
     * For example, `Ext.ux.google.Map` needs an API key and so its `requiredScripts` looks
     * like this:
     *
     *      requiredScripts: {
     *          '//maps.googleapis.com/maps/api/js?key={key}'
     *      }
     *
     * The `key` property is provided in `app.json` or directly in `Ext.manifest`:
     *
     *      "mashup": {
     *          "map": {  // the xtype
     *              "key": "[GOOGLE_MAPS_KEY]"
     *          }
     *      }
     *
     * For non-components (classes that have no `xtype`), the `mashupConfig` can be used
     * to supply the configuration key:
     *
     *      mashupConfig: {
     *          key: 'map'
     *      }
     */

    /**
     * @cfg {Object} mashup
     * An object that allows developers to pass values into templates used to populate
     * {@link Ext.Mashup#requiredScripts requiredScripts}.
     *
     * Here is an example of passing a key along to `Ext.ux.google.Map`.
     *
     *      "mashup": {
     *          "map": {  // the xtype
     *              "key": "[GOOGLE_MAPS_KEY]"
     *          }
     *      }
     *
     * @member Ext.Manifest
     */

    statics: {
        process: function(targetClass) {
            var body = targetClass.prototype,
                requiredScripts = body.requiredScripts,
                hooks = targetClass._classHooks,
                onCreated = hooks.onCreated,
                xtypes = targetClass.prototype.xtypes,
                mashup = Ext.manifest.mashup || {},
                options = body.mashupConfig,
                i, script;

            if (requiredScripts) {
                delete body.requiredScripts;

                hooks.onCreated = function() {
                    var me = this,
                        scripts = [],
                        args = Ext.Array.slice(arguments),
                        redirect = mashup.redirect || {};

                    requiredScripts = scripts.concat(requiredScripts);

                    options = options && mashup[options.key];

                    if (xtypes) {
                        for (i = 0; !options && i < xtypes.length; ++i) {
                            options = mashup[xtypes[i]];
                        }
                    }

                    for (i = 0; i < requiredScripts.length; i++) {
                        script = requiredScripts[i];

                        if (redirect[script] === false) {
                            continue;
                        }

                        script = redirect[script] || script;

                        if (script.indexOf('{') > -1) {
                            if (options) {
                                script = new Ext.Template(script).apply(options);
                            }
                            //<debug>
                            else {
                                Ext.log.error('Missing mashup options for ' +
                                    body.$className + ' script "' + script + '"');
                            }
                            //</debug>
                        }

                        scripts.push(script);
                    }

                    if (!scripts.length) {
                        hooks.onCreated = onCreated;
                        hooks.onCreated.call(me, args);

                        return;
                    }

                    Ext.Loader.loadScripts({
                        url: scripts,
                        cache: true, // no cache busting
                        onError: function(opts, error) {
                            targetClass.scriptError = targetClass.prototype.scriptError = error;
                            hooks.onCreated = onCreated;
                            hooks.onCreated.call(me, args);
                        },
                        onLoad: function() {
                            hooks.onCreated = onCreated;
                            hooks.onCreated.call(me, args);
                        }
                    });
                };
            }
        }
    },

    onClassMixedIn: function(targetClass) {
        Mashup.process(targetClass);
    }
};
});