define([
    'app'
  , 'text!header.html!strip'
  , 'css!header'
  ],
  function (App, source) {
    var response = {}, def;

    response.data = source;
    response.callback = function (self) {
      // TODO: this should be inside renderJs, although its application-specific
      // but the problem with using async-render-require will be everything
      // being loaded at the same time, so the user should have the opportunity
      // to run his callback no matter where. Still not sure where to wait
      // (app-init or render-init), but it would be nice if a renderjs application
      // would allow for a first page load deferred on all gadgets until some
      // flag is set. In rjs2, we will not have to set globals, but we will
      // have the problem of trying to access methods published by other gadgets
      // BEFORE they have been published, so it's pretty much the same thing.
      if (App === undefined) {
        def = new $.Deferred;

        def.done(function(gadget) {
          // prefix instance-ids, pass JSON
          App.renderGadgets(gadget);
        });

        window.fallbackLoader.deferreds.push(def);
        window.fallbackLoader.args.push(self);
      } else {
        // prefix instance-ids, pass JSON
        App.renderGadgets(self);
      }
    };

  // return response object
  return response;
  }
);
