There's definitely awareness of this issue. I believe it's not quite as easy as you suggest because of the interconnectedness of elements.
IOW, elements and style sheets tend to refer to other elements by name, and it's potentially difficult to modulate all possible references to a name at run-time like that. But as I say, we recognize this problem and will include your suggestion in the discussions. On Fri, Mar 14, 2014 at 10:10 AM, Barak Bar Orion <[email protected]>wrote: > Hi Scott. > > First thanks for the good work! > > Do you know if there is a plan to add some kind of name mapping to the > html import > something like: > > <link rel="import" href="goodies.html" *with-prefix:foo*> > > That will add the prefix foo to every elements defined in goodies.html > that way it will be possible to use components without name collisions. > > Barak. > > On Friday, March 14, 2014 6:17:55 PM UTC+2, Scott Miles wrote: > >> Thanks for sharing! >> >> Btw, another thing we need to communicate better is about element naming. >> >> The intent of the 'polymer-*' prefix in our stuff is to indicate >> 'elements made by the polymer team', and not 'element made using polymer'. >> >> Because part of the notion of Polymer is that users of an element don't >> necessarily *need* to know it's made with Polymer (it should Just Work) >> then don't feel like you need to identify it as such with 'polymer-*' >> >> Anyway, just making a note of that. >> >> Scott >> >> >> On Fri, Mar 14, 2014 at 5:17 AM, <[email protected]>wrote: >> >>> Thanks, worked great! >>> >>> If any one wants to take a look at the working code or have some other >>> advise please feel free: https://github.com/beldar/polymer-tfl-status >>> >>> >>> On Friday, 14 March 2014 10:42:50 UTC, Barak Bar Orion wrote: >>>> >>>> You will have to use nested template, see example at: >>>> https://github.com/Polymer/TemplateBinding/blob/master/examp >>>> les/how_to/conditional_template.html >>>> >>>> >>>> <template id="example" bind> >>>> <span>Show?: <input type="checkbox" checked="{{ show }}"></span> >>>> <template bind if="{{ show }}"> >>>> <span>Yay! I'm shown</span> >>>> </template> >>>> >>>> </template> >>>> >>>> Other from that you can use conditional attribute inside template: >>>> hidden?="{{ hide }}" >>>> see: >>>> https://github.com/Polymer/TemplateBinding/blob/master/examples/how_to/conditional_attributes.html >>>> >>>> On Friday, March 14, 2014 12:17:41 PM UTC+2, >>>> [email protected] wrote: >>>>> >>>>> Hi Scott, >>>>> >>>>> Thanks for the reply, another small question if I may, >>>>> >>>>> I can't find anywhere how to create an IF statement in the Polymer >>>>> templating system, I would like to do something like: >>>>> >>>>> {{if line.disruptions}} >>>>> <ul class"line-disruptions">....</ul> >>>>> {{endif}} >>>>> >>>>> >>>>> How is that done? >>>>> >>>>> Thanks! >>>>> >>>>> >>>>> On Friday, 14 March 2014 05:47:16 UTC, Scott Miles wrote: >>>>>> >>>>>> Thanks for the follow up question. That model-from-event expression >>>>>> is critical information that we (engineering) haven't communicated >>>>>> properly. >>>>>> >>>>>> >>>>>> On Thu, Mar 13, 2014 at 10:38 PM, Michael Bleigh <[email protected]>wrote: >>>>>> >>>>>>> Good to know! Thanks. >>>>>>> >>>>>>> >>>>>>> On Thu, Mar 13, 2014 at 10:17 PM, Scott Miles <[email protected]>wrote: >>>>>>> >>>>>>>> First off, I gave the example on the wrong element, I believe this >>>>>>>> is more accurately what was asked for: >>>>>>>> >>>>>>>> <ul class="line-disruptions" on-tap="{{tapHandler}}"> >>>>>>>> >>>>>>>> >>>>>>>> >> would it be possible to make tapHandler aware of the specific >>>>>>>> disruption instance >>>>>>>> >>>>>>>> Yes. The handler can do: >>>>>>>> >>>>>>>> tapHandler: function(event) { >>>>>>>> // get the specific `line` object associated with the target >>>>>>>> element >>>>>>>> var line = event.target.templateInstance.model; >>>>>>>> >>>>>>>> // do stuff with `line` >>>>>>>> ... >>>>>>>> >>>>>>>> } >>>>>>>> >>>>>>>> >>>>>>>> Scott >>>>>>>> >>>>>>>> P.S. This expression `event.target.templateInstance.model` is so >>>>>>>> handy that we plan on sugaring it in the near future, maybe by >>>>>>>> promoting >>>>>>>> the `model` property to the `event` object, or possibly as another >>>>>>>> argument >>>>>>>> to the handler. >>>>>>>> >>>>>>>> >>>>>>>> On Thu, Mar 13, 2014 at 9:32 PM, Michael Bleigh >>>>>>>> <[email protected]>wrote: >>>>>>>> >>>>>>>>> This isn't 100% related, but in the event of a declarative event >>>>>>>>> in a repeat, is there any way to pass non-rendered data through to the >>>>>>>>> event handler? For instance, in the example given, would it be >>>>>>>>> possible to >>>>>>>>> make tapHandler aware of the specific disruption instance short of >>>>>>>>> passing >>>>>>>>> some kind of index reference via data attributes etc. >>>>>>>>> >>>>>>>>> On Thursday, March 13, 2014 2:18:38 PM UTC-7, Scott Miles wrote: >>>>>>>>> >>>>>>>>>> The easiest way is to use Polymer's declarative event sugaring: >>>>>>>>>> >>>>>>>>>> <li class="line-disruption {{disruption.class}}" >>>>>>>>>> *on-tap="{{tapHandler}}"*>{{disruption.from}} to {{disruption.to}}: >>>>>>>>>> {{disruption.status}}</li> >>>>>>>>>> >>>>>>>>>> See here for documentation: http://www.polymer-project.org >>>>>>>>>> /docs/polymer/polymer.html#declarative-event-mapping >>>>>>>>>> >>>>>>>>>> >> this.shadowRoot.querySelectorAll('ul.line-disruptions') >>>>>>>>>> >>>>>>>>>> This should work, as long as those elements exist at the time you >>>>>>>>>> perform the query. IOW, only after the template has stamped actual >>>>>>>>>> 'ul' >>>>>>>>>> elements will you be able to query for them. >>>>>>>>>> >>>>>>>>>> >>>>>>>>>> On Thu, Mar 13, 2014 at 4:14 AM, Martà Planellas < >>>>>>>>>> [email protected]> wrote: >>>>>>>>>> >>>>>>>>>>> Hi all, I've been fighting this for a while, I have this html in >>>>>>>>>>> my polymer element: >>>>>>>>>>> >>>>>>>>>>> <div class="container"> >>>>>>>>>>> <ul class="lines"> >>>>>>>>>>> <template id="line" repeat="{{line in lines}}"> >>>>>>>>>>> <li class="line {{line.class}}"> >>>>>>>>>>> <div class="line-label"> >>>>>>>>>>> <span class="line-name >>>>>>>>>>> {{line.nameclass}}"> >>>>>>>>>>> {{line.name}} >>>>>>>>>>> </span> >>>>>>>>>>> <span class="line-status {{line.class}}"> >>>>>>>>>>> {{line.status}} >>>>>>>>>>> </span> >>>>>>>>>>> </div> >>>>>>>>>>> <ul class="line-disruptions"> >>>>>>>>>>> <template id="disruption" >>>>>>>>>>> repeat="{{disruption in line.disruptions}}"> >>>>>>>>>>> <li class="line-disruption >>>>>>>>>>> {{disruption.class}}">{{disruption.from}} to {{disruption.to}}: >>>>>>>>>>> {{disruption.status}}</li> >>>>>>>>>>> </template> >>>>>>>>>>> </ul> >>>>>>>>>>> </li> >>>>>>>>>>> </template> >>>>>>>>>>> </ul> >>>>>>>>>>> </div> >>>>>>>>>>> >>>>>>>>>>> So there're two nested templates, now I want to add some click >>>>>>>>>>> event on the *ul.line-disruptions* elements, but I have no idea >>>>>>>>>>> how to get to these elements... >>>>>>>>>>> >>>>>>>>>>> I tried this.shadowRoot.querySelectorAll('ul.line-disruptions') >>>>>>>>>>> but nothing is returned. >>>>>>>>>>> >>>>>>>>>>> How do I access those nodes? >>>>>>>>>>> >>>>>>>>>>> Thanks. >>>>>>>>>>> >>>>>>>>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >>>>>>>>>>> --- >>>>>>>>>>> You received this message because you are subscribed to the >>>>>>>>>>> Google Groups "Polymer" group. >>>>>>>>>>> To unsubscribe from this group and stop receiving emails from >>>>>>>>>>> it, send an email to [email protected]. >>>>>>>>>>> >>>>>>>>>>> To view this discussion on the web visit >>>>>>>>>>> https://groups.google.com/d/msgid/polymer-dev/76621c93-187f- >>>>>>>>>>> 4810-a3ef-026c080b4383%40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/76621c93-187f-4810-a3ef-026c080b4383%40googlegroups.com?utm_medium=email&utm_source=footer> >>>>>>>>>>> . >>>>>>>>>>> For more options, visit https://groups.google.com/d/optout. >>>>>>>>>>> >>>>>>>>>> >>>>>>>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >>>>>>>>> --- >>>>>>>>> You received this message because you are subscribed to the Google >>>>>>>>> Groups "Polymer" group. >>>>>>>>> To unsubscribe from this group and stop receiving emails from it, >>>>>>>>> send an email to [email protected]. >>>>>>>>> To view this discussion on the web visit >>>>>>>>> https://groups.google.com/d/msgid/polymer-dev/6edef541-f33d- >>>>>>>>> 44f7-b976-d2d1f1379806%40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/6edef541-f33d-44f7-b976-d2d1f1379806%40googlegroups.com?utm_medium=email&utm_source=footer> >>>>>>>>> . >>>>>>>>> >>>>>>>>> For more options, visit https://groups.google.com/d/optout. >>>>>>>>> >>>>>>>> >>>>>>>> >>>>>>> >>>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >>> --- >>> You received this message because you are subscribed to the Google >>> Groups "Polymer" group. >>> To unsubscribe from this group and stop receiving emails from it, send >>> an email to [email protected]. >>> To view this discussion on the web visit https://groups.google.com/d/ >>> msgid/polymer-dev/234c3f37-b0aa-4143-8f0d-49cd625a68b7% >>> 40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/234c3f37-b0aa-4143-8f0d-49cd625a68b7%40googlegroups.com?utm_medium=email&utm_source=footer> >>> . >>> >>> For more options, visit https://groups.google.com/d/optout. >>> >> >> Follow Polymer on Google+: plus.google.com/107187849809354688692 > --- > You received this message because you are subscribed to the Google Groups > "Polymer" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To view this discussion on the web visit > https://groups.google.com/d/msgid/polymer-dev/ac07a555-5389-449c-a637-ed86f6daa8db%40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/ac07a555-5389-449c-a637-ed86f6daa8db%40googlegroups.com?utm_medium=email&utm_source=footer> > . > > For more options, visit https://groups.google.com/d/optout. > Follow Polymer on Google+: plus.google.com/107187849809354688692 --- You received this message because you are subscribed to the Google Groups "Polymer" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/CAHbmOLbCynCt%3DdUexyqLBU8ARA2GJTEBbC3eUAYZfaf9yQ498Q%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
