Can you combine Rikulo UXL templates/views

45 Views Asked by At

I would like to know if, or how to, combine Rikulo UXL templates -- That is, provided it is possible.

Just to keep things simple I took the ScrollViewDemo and LoginDemo from the UXL Overview web page as an experiment. My aim would is to see something like this (which you cannot do, of course) in Dart.

index.dart

   <body>
     <style> ... </style>

     <script src="ScrollViewDemo.dart"  type="application/dart" ></script>
     <script src="SignInDemo.dart"      type="application/dart" ></script>

     <script src="packages/browser/dart.js"></script>
     </body>
   </html>

In Dart you are only permitted one dart script per document.

So what I'm looking for is a way to do as shown above with Rikulo mark-up.

Can we do that?

1

There are 1 best solutions below

4
On

There are a few options for adding a tree of views into the document. Please refer to addToDocument for details.

For example, you can have two different DIV in the HTML pages:

<body>
  <div id="scrollView" class="scrollView"></div>
  <div id="signinView" class="signinView"></div>

Then, you can invoke addToDocument with the target element you prefer:

scrollView.addToDocument(node: document.query("#scrollView"));

Then, the other program can add the sign-in view to #signinView.

You can have multiple dart programs running at the same page as long as they cooperate, such as residing separated DIV blocks as illustrated. The only catch is that each dart program will be compiled a separated JS file and the resulted size will be larger than putting them all in the same program.