Creating Third-party widgets

I’ve now got a jQuery based loader script that successfully adds a ember-cli based application to the calling window. I.e. a third party widget not wrapped in an iframe.

In config/environment.js, I change ENV.locationType to none and take out ENV.baseURL as it will be unneeded. See Location - 4.6 - Ember API Documentation for backtground (thx @abuiles).

Then I use jQuery to do the following:

  • add the CSS files I need to head if not already present (needs to match exact file names from built ember-cli app as copied into place)
  • add container div to DOM (should match ENV.APP.rootElement in config/environment.js)
  • add meta tag to head for app configuration (should be based on what you have in the head of index.html in your build)
  • add the JS files (vender and your_app, exact file names as with CSS) to DOM after container div

The remaining problem I have is I need to be able instantiate multiple instances of the ember-cli app under different containing divs.

My jQuery loader script can handle tracking of instances and adding the container divs, etc, but I’m not sure how to spin up a different instance of the app from the default. This is what I’ll ask about in a new topic.