0 Replies Latest reply on May 26, 2015 10:56 PM by Ichabodcole

    Proposal for a better way to integrate Edge Animations with modern dev workflows and SPAs.

    Ichabodcole

      I'm not sure if this is the appropriate place to make this request, but here it goes.

       

      I am a web developer using a modern front-end stack consisting of gulp and browserify, with frameworks like angular / react, etc, and often building single page apps where all the code is minimized and concatenated. I would like to be able to use Edge animations in my projects in an easy and dev friendly manner, but the current loading process and exports that are created when publishing for the web are frankly not up to the task. I would like to propose that in addition to the current web export option there would be an advanced export option, and some additional API methods in the runtime as listed below.

       

      1. The Edge Animate run-time should use a UMD wrapper to make the AdobeEdge object accessible via CommonJs, AMD, es6 modules or the window object if necessary (and ideally registered on npm and bower).

      2. The animation definition code should also be exported using a UMD wrapper, and exclude the AdobeEdge.registerCompositionDefn call, which could later be explicitly called by the developer if necessary.

      3. A developer should be able to add compositions directly to the AdobeEdge composition array without the runtime adding scripts to the head tag. Ideally this method would also allow the developer to add animation definition objects in the same call.

      4. After adding a composition and animation definition a developer should be able to explicitly initialize the composition on a dom element. Initializing the composition would start the actual dom creation and manipulation, and should fire a callback or promise after the dom elements have been added and the composition is ready to play / be interacted with.

      5. A developer should be able to remove / destroy compositions that have been added to the AdobeEdge compositions array, and optionally remove the associated dom.

      6. A developer should be able to reuse or re-initialize compositions, such as in the case of a single page app where a view template will be continually exited and entered and the dom element must be recreated or cached in some manner.

       

      In addition to the above I think it could also be very interesting to have this "addComposition" or some other method return an html fragment, which would contain all of the generated markup, that the developer could then explicitly add to the dom, and then call play / init on to start the timeline / interaction.

       

      I have been doing a bit of hacking on the run-time already to get a little bit of this to work for a project I'm currently working on, albeit in a very hacky fashion, and would love an official channel to make this workflow feasible.

      ichabodcole/edge-animate-hack · GitHub

       

      I would also really appreciate it if the runtime src was in an accessible place like github, where developers could submit issues and improve / fork the library in a more transparent way ( I know that is asking a lot ).

       

      Heck, while I'm at it, can we get an SDK, to extend the application itself.