Thanks Eric. I’ve since noticed and read/watched some great blog posts and screencasts on Polymer app architecture by the Divshot team. They recommend an app level element to encapsulate everything inside body as a component, turtles all the way down from there… I think this is the best approach and makes intuitive perfect sense :)
https://github.com/divshot/polymer-firebase-qa/blob/master/app/elements/app.html <https://github.com/divshot/polymer-firebase-qa/blob/master/app/elements/app.html> <body fullbleed unresolved> <qa-app></qa-app> <!-- build:js scripts/app.js --> <script src="scripts/app.js"></script> <!-- endbuild--> </body> --- <firebase-login id="baseLogin" user="{{user}}" statusKnown="{{statusKnown}}" location="https://{{globals.firebase}}.firebaseio.com"; provider="github" on-login="{{onLogin}}" on-error="{{onLoginError}}"></firebase-login> <pvc-globals values="{{globals}}"></pvc-globals> <core-header-panel> <script> (function () { 'use strict'; Polymer({ ready: function() { this.globals.firebase = '<your-firebase>'; }, > On 04 Dec 2014, at 21:57, Eric Bidelman <[email protected]> wrote: > > > > On Thu, Dec 4, 2014 at 4:53 AM, <[email protected] > <mailto:[email protected]>> wrote: > In the Polymer docs I see this pattern for adding event listeners to > app-level elements... however this seems to break with the "everything is a > component" idea. > Does it make sense to treat the main app element (child of body) as it's own > Custom element and then encapsulate the event listeners via normal Polymer > conventions using `Polymer` constructor? > > The examples in the docs show examples of using elements outside of > polymer-element and inside of it. For this particular example, users of > paper-tabs don't have to know anything about Polymer to use it. They just > attached listeners and set properties like any other element. > > For more power, we often create higher level app components because on-* > handlers and data-binding features are darn convenient! Also saves a bit of > boilerplate and typing. > > All that said, create components where it makes sense for you. > <script> > var tabs = document.querySelector('paper-tabs'); > var list = document.querySelector('post-list'); > > tabs.addEventListener('core-select', function() { > list.show = tabs.selected; > }); > </script> > > Follow Polymer on Google+: plus.google.com/107187849809354688692 > <http://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] > <mailto:[email protected]>. > To view this discussion on the web visit > https://groups.google.com/d/msgid/polymer-dev/84ebb061-21cc-4075-9f85-af8493519fdd%40googlegroups.com > > <https://groups.google.com/d/msgid/polymer-dev/84ebb061-21cc-4075-9f85-af8493519fdd%40googlegroups.com?utm_medium=email&utm_source=footer>. > For more options, visit https://groups.google.com/d/optout > <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/43A7A5A9-EBD6-44A6-A728-62BA691FDE33%40gmail.com. For more options, visit https://groups.google.com/d/optout.
