riotjs and rapyd, how to publish field's javascript in dataembed

[zofe]

when widget is embedded and built by a dataembed we have a problem: if the widget contains javascripts and/or css this "inclusion" stack is not "propagated" to the "container" i.e.:

+------------------------------------------+
|  page                                    |
|    rapyd::styles()                       |
|                                          |
|   +---------------+   +--------------+   |
|   | dataembed     |   |  dataembed   |   |
|   |               |   |              |   |
|   |               |   |              |   |
|   +---------------+   +--------------+   |
|                                          |
|   rapyd::scripts()                       |
|                                          |
+------------------------------------------+

Styles and Scripts are printed on page, but dataembeds are loaded asynchronously, "after" page is loaded.So we need to found a way to share the assets stack to the "page".

1. At this moment I think to make a javascript function (at the end of scripts()) with an async call to a rapyd-route (like the one I made for the autocomplete field) on serverside I'll get from user-session a stack of assets to be included
2. A better option should be using riot mixins.. someone can suggest how-to?

[tacone]

Furthermore, the onload event will not be applied on newly created widgets.

[tacone]

1. refactor onready events into a rapydInit(selector) javascript function.
2. call that function at page load: $(function(){ rapidyInit('body'); });
3. call it again on the mount event of the dataembed: rapydInit('.my-data-embed');

[zofe]

first of all 'mixins' seems to share behaviors across different tags, but it's not our case.. dataembed is the same for each widget.

what about place the logic in the "build" context of each widget?

1. on build() we can detect if the request is ajax / pjax,
2. if not, rapyd::script, rapyd::css, rapyd::js will work as usual
3. if yes, we just take care to include css and js on parent page dom, and append inline scripts to the widget output.

about 3, we can check if css or js is already included or append assets to the parent via jquery:

//widget->output ..then, for each css/js asset 
if (!$("script[src='path/to/rapyd/assets/compoment.js']").length){
  $.getScript( "path/to/rapyd/assets/compoment.js");
} 
//then ..inline script for component

It seems reasonable, logic is serverside.. needed refactoring is:

• create a method on field.php that detect if request is ajax, if so it will do the iteration on css, js and scripts stack to build the javascript output
• update in each extended field the build() function, appending to the field output the javascript stuff.

Ill work on it asap