Beauty, thanks #2. Especially like the Heisenberg.
On Thu, Mar 20, 2014 at 1:39 PM, Rob Dodson <[email protected]> wrote: > This article rocks, thanks Zeno :D > > > On Thu, Mar 20, 2014 at 11:11 AM, Zeno Rocha <[email protected]> wrote: > >> About element naming Scott, I wrote an article on WebComponents.org: >> >> http://webcomponents.github.io/articles/how-should-i-name-my-element/ >> >> >> On Wednesday, March 19, 2014 8:21:27 PM UTC-3, Eric Bidelman wrote: >> >>> Correct. >>> On Mar 19, 2014 6:13 PM, "Sergey Shevchenko" <[email protected]> wrote: >>> >>>> I think it can be just: >>>> >>>> <template if="{{ show }}"> >>>> >>>> -- the 'bind' part is unnecessary. True or false? >>>> >>>> On Friday, March 14, 2014 3:42:50 AM UTC-7, 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/10718784980935 >>>>>>>>>>>> 4688692 >>>>>>>>>>>> --- >>>>>>>>>>>> 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/10718784980935 >>>>>>>>>> 4688692 >>>>>>>>>> --- >>>>>>>>>> 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/254b38dd-fbd5-416d-9fa8-975240d4d5a4% >>>> 40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/254b38dd-fbd5-416d-9fa8-975240d4d5a4%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/8ecba2a5-ef71-4c0c-81a0-4c811e4b97c1%40googlegroups.com<https://groups.google.com/d/msgid/polymer-dev/8ecba2a5-ef71-4c0c-81a0-4c811e4b97c1%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/CAJj5OwBPmLZJe_%2Bs7MFpUBqwhWPteAZNJCOnB5dN0dR85iw68w%40mail.gmail.com<https://groups.google.com/d/msgid/polymer-dev/CAJj5OwBPmLZJe_%2Bs7MFpUBqwhWPteAZNJCOnB5dN0dR85iw68w%40mail.gmail.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/CAHbmOLbUnnZ4aP3T40OmMxndH6qpo1Y08AE118s0rPoik4OH3g%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
