LiveOak Polymer Web Components

index.html

<link rel="import"
   href="charts.html" />

<link rel="import"
   href="liveoak.html" />

<polymer-element name="liveoak-demo">
   <template>
      <liveoak-config clientid="xyz" realm="my-app" />
      
      <liveoak-authenticate>
         <div not-authenticated>
            <button>Login</button>
         </div>
         <div authenticated>
            <img />            
         </div>
      </liveoak-authenticate>

      <liveoak-authorized role="admin">
         <liveoak-storage
            location="storage/my-data"
            response="{{data}}" 
            subscribe="{{updateCart}}"/>

         <my-chart id="chart" data="{{data}}" />
      </liveoak-authorized>

   </template>
   <script>
   Polymer('liveoak-demo', {
      updateChart: function(data) {
         this.$.chart.add(data);
      }
   });
   </script>
</polymer-element>