Re: Web Component templates (and Polymer)

On 30 Jun 2014, at 13:57 , Tandy, Jeremy <jeremy.tandy@metoffice.gov.uk> wrote:

> Hi Dan - it certainly seems like the HTML5 <template> element & Polymer are running in the same direction as us; although whether we're on the same track is hard to tell from the docs :-)
> 
> What's obvious is that they use a {{...}} syntax compared to our {...} which is borrowed from URI templates.

I had an ugly idea last night...

The problem with the '{' syntax is that it does not goes well with JSON. But it works well with turtle and/or XML. Maybe we will have to have an 'abstract' template language specification with two different concrete syntaxes, one with '{...}' and the other with, say, '<...>' to work with Turtle/XML and JSON, respectively...

It is ugly. But I am not sure what else we would do...

Ivan

> 
> I guess that the next step would be to try to apply the HTML5 template / Polymer model to one of the example scenarios you're creating?
> 
> Jeremy
> 
>> -----Original Message-----
>> From: Dan Brickley [mailto:danbri@google.com]
>> Sent: 27 June 2014 23:39
>> To: public-csv-wg@w3.org
>> Subject: Web Component templates (and Polymer)
>> 
>> Just to bookmark a thought, while watching
>> https://www.youtube.com/watch?v=8OJ7ih8EE7s
>> 
>> Web Components (a browser-based Web standards effort) has a data
>> binding / templates aspect.
>> 
>> http://webcomponents.org/
>> http://www.whatwg.org/specs/web-apps/current-work/multipage/scripting-
>> 1.html#the-template-element
>> 
>> Polymer adds a layer over the base specs, http://www.polymer-
>> project.org/docs/polymer/databinding.html
>> 
>> Here's an example:
>> 
>> <polymer-element name="greeting-tag">
>>  <!-- outermost template defines the element's shadow DOM -->
>>  <template>
>>    <ul>
>>      <template repeat="{{s in salutations}}">
>>        <li>{{s.what}}: <input type="text" value="{{s.who}}"></li>
>>      </template>
>>    </ul>
>>  </template>
>>  <script>
>>    Polymer('greeting-tag', {
>>      ready: function() {
>>        // populate the element’s data model
>>        // (the salutations array)
>>        this.salutations = [
>>          {what: 'Hello', who: 'World'},
>>          {what: 'GoodBye', who: 'DOM APIs'},
>>          {what: 'Hello', who: 'Declarative'},
>>          {what: 'GoodBye', who: 'Imperative'}
>>        ];
>>      }
>>    });
>>  </script>
>> </polymer-element>
>> 
>> 
>> I'm not sure what to conclude from this, but thought I'd pass this
>> along as a start.
>> 
>> Dan
> 


----
Ivan Herman, W3C 
Digital Publishing Activity Lead
Home: http://www.w3.org/People/Ivan/
mobile: +31-641044153
GPG: 0x343F1A3D
WebID: http://www.ivan-herman.net/foaf#me