Re: [polymer-dev] Polymer app on Adobe Experience Manager

2019-10-03 Thread 'Justin Fagnani' via Polymer
I don't know Adobe Experience Manager at all, but I do know that Electronic
Arts has quite a large set of sites using it with Polymer. I believe they
have some sort of server template for each component they use in markup
(not necessarily all their components) in order to SSR render the tag and
attributes needed to instantiate it.

On Thu, Oct 3, 2019 at 7:37 AM Ivelin Ivanov 
wrote:

> Hi,
>
>
> Is it possible to host the Polymer starter app on AEM ? If yes what would
> be the way/ folder structure ?
>
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/1bc8d70c-5707-4cc5-af49-981c25993390%40googlegroups.com
> 
> .
>

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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmAUFT9UaMEFWc7yJXgQtfHPvhm4VF3TFjc7KPJMrL0CMw%40mail.gmail.com.


Re: [polymer-dev] Polymer without build step?

2019-09-12 Thread 'Justin Fagnani' via Polymer
Note that there's basically nothing about switching from HTML imports to JS
modules involved here. Both only support URLs as imports natively. It's
really the switch from Bower to npm, and from custom to standard tools,
that necessitated the change to use package names.

On Thu, Sep 12, 2019, 1:46 AM Max Waterman 
wrote:

> That helps a lot, thanks. The open-wc.org web site is especially
> interesting.
>
> I'm glad that the value of build-less development is not lost on those
> working on 'the platform'. I find myself wondering if the dropping of html
> imports was done a bit too soon, but I guess it's really more like the
> alternatives are taking too long to arrive to replace them.
>
> Anyway, thanks.
>
> Regards,
>
> Max.
>
> On Thu, 12 Sep 2019, at 12:37 AM, Justin Fagnani wrote:
> > When we moved to npm we needed a way for modules to reference each
> > other, and unlike with Bower where all packages are siblings of each
> > other, there's no stable relative URL that we could use for this. The
> > overwhelming community pattern on npm is to use package names for
> > cross-package references and a tool (or Node) to resolve them. So we
> > went with the community standard and used package names, knowing that
> > there are a plethora of tools that can resolve ment, and that future
> > browser standards like import maps will support package name resolution
> > directly in the browser.
> >
> > Until import-maps land, you can use a number of tools:
> >  * `polymer serve` will automatically resolve bare specifiers on the
> > fly.
> >  * open-wc.org tooling will as well
> >  * Bundlers like Rollup, Parcel, and Webpack will resolve names. Rollup
> > with the rollup-node-resolve plugin.
> >
> > Hope that helps!
> >
> > On Tue, Sep 10, 2019 at 10:51 PM Max Waterman
> >  wrote:
> > > Hi,
> > >
> > > Is there a way to use a polymer element in a project without having a
> build step - neither one I run manually (eg polymer build), or
> automatically (eg polymer serve)?
> > >
> > > I recently attempted this, but it seemed like I needed to have some
> import paths converted, and so I needed to use 'polymer serve'.
> > >
> > > I don't recall needing any such step with the older versions of
> polymer - I just added an html import, and used the element. Perhaps I'm
> mis-remembering.
> > >
> > > Is there a way to avoid any build step?
> > >
> > > Regards,
> > >
> > > Max.
> >
> > >  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 polymer-dev+unsubscr...@googlegroups.com.
> > >  To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/d725e36a-04b7-4d0a-8974-571d8336bff1%40googlegroups.com
> <
> https://groups.google.com/d/msgid/polymer-dev/d725e36a-04b7-4d0a-8974-571d8336bff1%40googlegroups.com?utm_medium=email_source=footer
> >.
>

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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmA5H-PTtdUd6ZbrNukZ8khV5vEk6q5cqUQBdcFtNRBszA%40mail.gmail.com.


Re: [polymer-dev] Polymer without build step?

2019-09-11 Thread 'Justin Fagnani' via Polymer
When we moved to npm we needed a way for modules to reference each other,
and unlike with Bower where all packages are siblings of each other,
there's no stable relative URL that we could use for this. The overwhelming
community pattern on npm is to use package names for cross-package
references and a tool (or Node) to resolve them. So we went with the
community standard and used package names, knowing that there are a
plethora of tools that can resolve ment, and that future browser standards
like import maps will support package name resolution directly in the
browser.

Until import-maps land, you can use a number of tools:
 * `polymer serve` will automatically resolve bare specifiers on the fly.
 * open-wc.org tooling will as well
 * Bundlers like Rollup, Parcel, and Webpack will resolve names. Rollup
with the rollup-node-resolve plugin.

Hope that helps!

On Tue, Sep 10, 2019 at 10:51 PM Max Waterman 
wrote:

> Hi,
>
> Is there a way to use a polymer element in a project without having a
> build step - neither one I run manually (eg polymer build), or
> automatically (eg polymer serve)?
>
> I recently attempted this, but it seemed like I needed to have some import
> paths converted, and so I needed to use 'polymer serve'.
>
> I don't recall needing any such step with the older versions of polymer -
> I just added an html import, and used the element. Perhaps I'm
> mis-remembering.
>
> Is there a way to avoid any build step?
>
> Regards,
>
> Max.
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/d725e36a-04b7-4d0a-8974-571d8336bff1%40googlegroups.com
> 
> .
>

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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDmFf-qLtgnhawbCtuCtkGWe%2BsgHTYC1i68UMxZTL0-yA%40mail.gmail.com.


Re: [polymer-dev] Polymer to lit element migration

2019-06-20 Thread 'Justin Fagnani' via Polymer
Are you migrating one element at a time, or a whole app?

The best way to do style sharing with LitElement is to use static styles:

share-styles.js:

export const sharedStyles = css`
  h1 { color: blue; }
`;

element.js:

import {sharedStyles} from './shared-styles.js';

export class MyElement extends LitElement {
  static get styles() {
return [sharedStyles, css`
  :host {
display: inline-flex;
  }
`];
  }
}

If you're migrating incrementally and need to use Polymer shared styles, I
think you'll need to use the DomModule class to find the style sheet. I can
look up some code for you if this is the case.

On Thu, Jun 20, 2019 at 9:17 AM Suvarnnan Vasudev <
suvarnnanvasu...@gmail.com> wrote:

> Hi,
> I have following code  snippet in polymer .This code uses
> shared-styles .This internally has implementation as below .
>
>Polymer element
>
> *class SHButton extends PolymerElement {*
>
> *  static get template() {*
>
> *return html`*
>
> **
>
> *

Re: [polymer-dev] Polymer CLI 1.9.7 fails to install

2019-03-04 Thread 'Justin Fagnani' via Polymer
polymer-project-config@4.0.3 is published, so I'm not sure why it wouldn't
be found.

On Mon, Mar 4, 2019 at 12:01 PM Thad Humphries 
wrote:

> The install for the Polymer CLI 1.9.7 appears to be broken. I just
> upgraded Node.js from 10.15.1 to 10.15.2, and npm from 6.4.1 to 6.8.0. I
> was told
>
> ╭╮
> ││
> │Update available 1.9.6 → 1.9.7  │
> │   Run npm i -g polymer-cli to update   │
> ││
> ╰╯
>
> but got the following error:
>
> $ npm i -g polymer-cli
> npm ERR! code ETARGET
> npm ERR! notarget No matching version found for
> polymer-project-config@4.0.3
> npm ERR! notarget In most cases you or one of your dependencies are
> requesting
> npm ERR! notarget a package version that doesn't exist.
> npm ERR! notarget
> npm ERR! notarget It was specified as a dependency of 'polymer-cli'
> npm ERR! notarget
>
> npm ERR! A complete log of this run can be found in:
> npm ERR! /Users/thad/.npm/_logs/2019-03-04T16_18_14_852Z-debug.log
>
> I see the same error on two Macs, both running Mojave 10.14.3
>
> Another user on the on the Slack channel sees the same problem:
> https://polymer.slack.com/archives/C03PF4L4L/p1551727465278900
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/61c47e0b-18f6-4e17-8437-74288c1e7e38%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmAB50LgXX9cDtOvi20vGtR%2BkRh6yzj1-O7tDiaAZu5YBw%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: How to use app-localize-behavior in LitElement?

2019-02-07 Thread 'Justin Fagnani' via Polymer
app-localize just wraps format.js. You'd be bringing in a lot of Polymer
weight just for that. I'd try to use format.js directly or something
lit-html specific like https://www.npmjs.com/package/@appnest/lit-translate

On Thu, Feb 7, 2019 at 1:44 PM  wrote:

> try this:
>
>
> // Import AppLocalizeBehavior
> import {AppLocalizeBehavior} from '@polymer/app-localize-behavior';
>
> // Import a utility class to treat legacy behaviors as mixins
> import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class';
>
> class Editor extends connect(store)(mixinBehaviors([AppLocalizeBehavior],
> LitElement)) {
> constructor() {
> super();
>
> this.resources = {
> 'en': { 'cancel':'Cancel' },
> 'es': { 'cancel':'Cancelar'}
> };
>
> this.language = 'en';
> }
>
> protected render() {
> return html`
>
> ${this.localize('close')}
>
> `;
> }
>
>
>
> On Monday, January 28, 2019 at 5:02:20 PM UTC-2, Juan Lorenzo Llanes wrote:
>>
>> could Anyone resolve this issue?
>>
>> On Sunday, July 22, 2018 at 11:58:42 AM UTC-3, dokfile...@gmail.com
>> wrote:
>>>
>>> Hi All,
>>>
>>> Have any way to attache a behaviour in (LitElement)
>>> lit-element, I want use : app-localize-behavior
>>> (https://www.polymer-project.org/3.0/toolbox/localize) to localize a
>>> lit-element.
>>>
>>> Any idea how to port it to use with  lit-element.? like in
>>> mixinBehaviors([AppLocalizeBehavior], PolymerElement) ?
>>> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/abde19a1-9fce-4ac6-b24e-dcbc32f3a077%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmAL9QLwp0%2B8GdAGDZFDCOtYoEXLFg0ApkWKkMCiMY7YhQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] I have an error when implement AppLocalizeBehavior in LitElement

2019-01-23 Thread 'Justin Fagnani' via Polymer
Polymer Behaviors are a Polymer-specific abstraction, and you can't apply
them to non-Polymer elements even as a mixin because they assume certain
API from the base class that LitElement doesn't provide.

I don't know much about AppLocalizeBehavior for FormatJS, but in this case
I think you should be able to use FormatJS directly.

On Wed, Jan 23, 2019 at 8:06 PM Juan Lorenzo Llanes 
wrote:

> Hi everyone
>
> I'm working whith pwa-starter-kit LitElement and AppLocalizeBehavior and I
> have the following error when I implement AppLocalizeBehavior in LitElement
> app
>
> ---package.json ---
>
> "dependencies": {
> "@polymer/app-layout": "^3.0.0",
> "@polymer/app-localize-behavior": "^3.0.1",
> "@polymer/polymer": "^3.1.0",
> "@webcomponents/webcomponentsjs": "^2.2.4",
> "lit-element": "^2.0.0-rc.3",
> "pwa-helpers": "^0.9.0",
> "redux": "^4.0.0",
> "redux-thunk": "^2.3.0",
> "reselect": "^4.0.0"
>   },
>   "devDependencies": {
> "@polymer/test-fixture": "^4.0.2",
> "axe-core": "^3.0.0",
> "chai": "^4.1.2",
> "del": "^3.0.0",
> "gulp": "^4.0.0",
> "gulp-rename": "^1.3.0",
> "gulp-replace": "^1.0.0",
> "mocha": "^5.2.0",
> "pixelmatch": "^4.0.2",
> "polymer-cli": "^1.9.3",
> "polyserve": "^0.27.0",
> "prpl-server": "^1.4.0",
> "puppeteer": "^1.5.0",
> "wct-mocha": "^1.0.0"
>   }
>
>
>
>
> --- old my-app.js--
>
> class MyApp extends connect(store)(LitElement) {
> 
>
>
>
> ---AppLocalizeBehavior my-app.js ---
>
>
>
> import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
> import {AppLocalizeBehavior} from
> '@polymer/app-localize-behavior/app-localize-behavior.js';
>
>
>
>
> class MyApp extends connect(store)(mixinBehaviors([AppLocalizeBehavior],
> LitElement)) {
>  .
>
> - ERROR--
>
>
> updating-element.ts:487 Uncaught TypeError: Cannot read property 'forEach'
> of undefined
> at HTMLElement._saveInstanceProperties (updating-element.ts:487)
> at HTMLElement.initialize (updating-element.ts:467)
> at HTMLElement.initialize (lit-element.ts:130)
> at new UpdatingElement (updating-element.ts:230)
> at new LitElement (lit-element.ts:76)
> at new PropertiesChanged (properties-changed.js:170)
> at new PropertyAccessors (property-accessors.js:115)
> at new TemplateStamp (template-stamp.js:125)
> at new PropertyEffects (property-effects.js:1195)
> at new PropertiesMixin (properties-mixin.js:115)
>
>
>
> Thanks in advance
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/4de87ba7-005d-441c-aea6-a11f2be159ed%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmBQa5iii5U-RFJ%2BV%3DFK451cesQtmL9g5-rFEi8RNKKMOg%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: Add an event listener inside a / vaadin

2018-12-17 Thread 'Justin Fagnani' via Polymer
 technically "works" in lit-html now, but most bindings, but
especially property and event listeners, aren't going to work properly
inside template elements. In this case the event listener is added to a
node in a template, but then the template is probably cloned by
 and event listeners aren't cloned with nodes.

 is probably expecting a Polymer-style template, with
Polymer binding syntax. They'll need a new version (if one doesn't already
exist) that's more agnostic towards templates and take a render function or
something similar.



On Mon, Dec 17, 2018 at 6:48 AM Thad Humphries 
wrote:

> I recommend you ask Vaadin on the Slack channel. I had a question about
> using vaadin-grid in lit-html back in the summer, before vaadin-grid 5.2.
> IIRC it was that  didn't work inside html``. I used P3 wrapping a
> P2 grid until vaadin-grid 5.2 was out. (I might be remembering this wrong,
> so ask on Slack.)
>
> On Monday, December 17, 2018 at 8:23:06 AM UTC-5, rtf...@gmail.com wrote:
>>
>> I have this code (Polymer 3/TS), and I can not put event to fire inside a
>> template! Anyone can help!
>>
>> class LangueageMenu extends LitElement {
>> //...
>>
>> render() {
>> return html `
>> 
>>
>>
>> 
>>
>>
>> 
>> English> vaadin-item> <<-- DO NOT WORK
>> Español <<-- DO NOT WORK
>>
>> 
>>
>> 
>>
>> 
>> 
>> `;
>> }
>> _es() {
>> // no not work
>> }
>> }
>>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/02fe5ec0-5ddf-4921-97fe-fec9ebf5d129%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDcsA8Cv8c6wqO6X1B2KGy7F%3DR2WYcP1JK3XGAWeoXzcQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: Polymer 2 and Polymer 3 together - what's the route?

2018-11-27 Thread 'Justin Fagnani' via Polymer
I first want to point out that the transitions that we dealt with in
Polymer 2 and Polymer 3 we mostly out of our control. The Web Components v1
spec we just different in some important ways, and we tried our best to
ease that transition in Polymer 2 with hybrid mode. Then HTML Imports was
clearly not going to be adopted while JS modules were implemented in every
browser, and Bower was deprecated and didn't have many important packages
available on it. We tried to mitigate those transitions by not changing the
Polymer 3 API at all and building Modulizer.

But there's really not much we can do about libraries that haven't made the
transition. There really isn't a way to import HTML Imports into JS, which
is one of the reasons it didn't get adoption. The difficulty of using
Polymer 2 components in Polymer 3 is the same difficulty that the entire
rest of the web development ecosystem has had with Polymer until Polymer 3.

The best thing going is that if the components you use are open source they
can be forked and converted, and again, the Polymer API itself didn't
change.

The good news is that the Web Components v1 specs are stable and
implemented in 3 major engines and in-development in the 4th. So we won't
have a Polymer 1 -> Polymer 2 like transition again. And JS modules are
implemented in all engines, and the whole ecosystem has coalesced around
npm, so we won't have a Polymer 2 -> Polymer 3 like transition again.

What we will have is much smoother, incremental transitions like Polymer ->
LitElement, where we can easily mix and match components from different
vendors or built with different helper libraries. The largest barrier there
is needing to manually listen for Polymer's {property}-changed events to
implement 2-way data-binding if you use that, and there are helpers for
that popping up. There's no application-wide blocker like incompatible
specs or package managers.

So I apologize for the pains, and we really have tried to minimize them.
The only way this could have been avoided though, would be if the Web
Component v0 specs, including HTML Imports, were implemented by all
browsers, and the ecosystem coalesced around Bower. That just didn't happen
though.

Cheers,
  Justin



On Tue, Nov 27, 2018 at 8:35 AM  wrote:

> I share your frustration Joerm, as a small startup who started with
> Polymer 1 we still have some of our components in V1. It's messy business
> but V2 upgrade to 3 is even worst just like you mentioned, having issue
> with many components in V2 still. luckily we sort of invested some time and
> just made pretty much all the components ourselves but that comes with it's
> own cost. Overall, we're grateful for Polymer team's great work and yet
> expect a little bit more attention to the service they're providing
> otherwise they can easily send many people down some rabbit wholes and
> leave us in a ditch.
>
> Cheers
>
> On Tuesday, November 27, 2018 at 8:03:13 AM UTC-7, Joern Turner wrote:
>>
>> We're still developing Polymer 2 applications but considering the move.
>>
>> However there's one big questions that comes up. What to do with
>> third-party components that still rely on Polymer 2? I know there's the
>> Polymer Modularizer but shall we really convert third-party code so that it
>> works in our newly ported Polymer 3 apps? That doesn't feel very good as
>> you suddenly end up with maintaining foreign code and have to look after
>> updates and fixes for those components yourself.
>>
>> There are piles of good components around at webcomponents.org which are
>> still in Polymer 2 and you never know if they will ever be ported to
>> Polymer 3.
>>
>> Are there alternatives to the conversion?
>>
>> Another worry: what happens with the next major update? Will we need to
>> port all our our components (which are certainly hundreds already) with
>> every new major release? That really puts a huge burden on developers (and
>> project leads looking for the budget).
>>
>> I understand that the standard itself is still moving but these questions
>> should be considered before such breaking changes are set in place.
>>
>> Thanks for your thoughts on this,
>>
>> Joern
>>
>>
>>
>>
>> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/f05dd191-3948-480e-b9e1-de473834eefb%40googlegroups.com
> 
> .
> 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 

Re: [polymer-dev] Re: vanishing documentation

2018-10-15 Thread 'Justin Fagnani' via Polymer
Hi Joern,

There's a "View Bower docs" link in the left-nav that will take you to the
Bower-based package docs. Then you can choose 2.x versions from the version
dropdown.

As for you other questions...

On Sat, Oct 13, 2018 at 5:24 AM Joern Turner  wrote:

>
>
> Am Donnerstag, 11. Oktober 2018 20:55:44 UTC+2 schrieb John Teague:
>>
>> Unfortunately, HTML Imports is deprecated, which makes long term use of
>> Polymer 2 unworkable. So, migrating to Polymer 3 and ES modules fixes that,
>> and with migrator tool, which admittedly isn't perfect, can speed that. The
>> docs for polymer 2 are still in the polymer 2 site. I can't help with
>> search performance, but I suspect the index is logically favoring Polymer
>> 3, which are the most current docs.
>
>
> i know that html imports is deprecated but is that a reason to take
> documentation for 2.0 offline? I'm not talking about polymer-project.org
> but webcomponents.org where docs for version before 3.0 are missing.
>
> I wonder for whom Polymer is built - for those that follows the last hype
> (seems so) or for those that build serious applications.
>

Polymer is built to make Web Components easier to write. It's not about
hype, but about reducing the boilerplate needed to make fast, high-quality
Web Components with a great developer experience. We have customers that
quite serious applications with Polymer and Web Components, like YouTube
that was mentioned, and enterprise operations like large banks, publishers,
and companies with dozens to hundreds of properties that they need to share
components across.


> These applications cannot always be migrated quickly to a newer version
> and furthermore economic reasons always play a major role. How shall i sell
> that to a customer: the new version does not bring much benefit (if at all)
>

Polymer 3 and Polymer 2 share their same code, and they offer the same
benefits in terms of make Web Component authoring easier. The main benefit
of Polymer 3 are
- It doesn't require any Polyfills on Safari, Firefox as of version 63, and
soon Edge (they're implementing Web Components now).
- Polymer 3 elements are available on npm, and can have npm dependencies.
Bower is deprecated and has very few packages compared to npm.
- Polymer 3 elements are importable into other JavaScript modules. There
was no way to import Polymer 2 elements into JavaScript.

These are huge advantages.


> but we have to spent x days to migrate to the latest? Why just change if
> apps do well?
>
> Furthermore we'll likely never migrate to Polymer3 which is a major step
> backwards in our opinion (lack of descriptive templates). We love
> webcomponents and Polymer 2 but the latest directions the spec went are a
> clear mistake - efficiency over architecture. It's a pitty that specs not
> always evolve in the right direction.
>

The specs didn't change between Polymer 2 and 3. Yes, we stopped using HTML
Imports, but HTML Imports were already not going to be implemented by other
browsers. We simply stopped requiring a polyfill indefinitely.


> Sorry - but you hit that button in me again. It's pure frustration - i'm
> still hoping for HTML modules but certainly will never go with literal
> templates. That's simply rubbish
>

Polymer 3 and Polymer 2 component implementations are essentially
identical, we just have HTML-in-JS rather than JS-in-HTML. All the lines of
code are basically the same. The change in container format doesn't
fundamentally change the code you have to write, or the operations Polymer
has to do to instantiate elements and render templates. It's really all the
same code.

Sorry for your frustrations. We are trying to make Polymer simpler to use
by aligning with current standards and tools. We can't be an island forever.

Cheers,
  Justin


> - sorry again - it's not you i'm targetting.
>
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/d4a6fcd2-fe16-429a-b085-3895e706cd68%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmBQfYg%2BRBo4_YZefkCdWhw%2BkBXjHRe%3DvEzgMY7yAofz8w%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Web Components - where are you heading (Polymer 3 blues)?

2018-05-14 Thread 'Justin Fagnani' via Polymer
Joern,

I'm sorry for your disappointment. You're not alone and we hear you. But I
do think that a lot of the concerns you mentioned come from a slight
misalignment of exactly what _has_ changed from Polymer 2.x to 3.0, and
what has been _perceived_ to change from Polymer 2.x to 3.0.

First of all Web Components have not changed at all. They are an HTML
standard and don't change when Polymer does. This means that all APIs for
defining and consuming Web Components are 100% exactly the same as they
were before. And the Web Components APIs have always been JavaScript
centric for defining Custom Elements - from extending HTMLElement, to the
lifecycle callbacks, to customElements.define(). And the APIs for consuming
Custom Elements are the same, whether via markup, or script.

I understand that a lot of people were drawn to Polymer because of the HTML
format, but Polymer has primarily been focused on enabling the easy
authoring and consumption of Web Components and that remains the focus.
HTML Imports were dead in the water and we had to move to a natively
supported format so we didn't require polyfills indefinitely even on
browsers that were natively implementing Web Components.

Second, Polymer has always been a nearly 100% JavaScript-based library.
We've had people say they liked Polymer because it was HTML-based, but
Polymer's HTML only contained 

Re: [polymer-dev] Polymer lit element error

2018-05-11 Thread 'Justin Fagnani' via Polymer
You don't have to use TypeScript.

Are you implementing _render() in your subclass? The default implementation
of _render() throws to tell you to implement it.

On Fri, May 11, 2018 at 6:47 PM Lorenzo Wagner  wrote:

> How implement polymer lit-element and use repeat and until as lit-html  
> *https://alligator.io/web-components/lit-html/
>  .  *?
>
> With examples of GitHub *https://github.com/Polymer/lit-element
> * .  I get a error  implement
> _render method
>
> You have to use TypeScript ?
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/d0a0025e-22d2-44a0-a958-7c2ce990e009%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmAOocBZgmSqM6jAJ4kpQk4tcz2J0k8nFNXjEbY760qcdw%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Child html within lit-html

2018-02-19 Thread 'Justin Fagnani' via Polymer
Safari and Opera support Shadow DOM, Firefox has it under development. The
polyfills work, and lit-html has ShadyCSS integration as of 0.9.0.

On Feb 19, 2018 10:26 AM, "Ronn Ross"  wrote:

> Thanks everyone. I also read about slot on MDN and it makes sense. I saw
> that chrome only supports this, so will this be covered by the polyfill in
> other browsers?
>
> On Monday, February 19, 2018 at 11:27:00 AM UTC-5, Justin Fagnani wrote:
>>
>> For projecting child content, you need to use s:
>> https://developers.google.com/web/fundamentals/web-
>> components/shadowdom#slots
>>
>> class MyButton extends LitElement {
>>   constructor(...args) {
>> super();
>>   }
>>
>>   render() {
>> return html`
>>   
>> 
>>   
>> `;
>>   }
>> }
>>
>> On Mon, Feb 19, 2018 at 8:18 AM, Ronn Ross  wrote:
>>
>>> I have a simple button component.
>>>
>>>
>>> I trying to get the child content and pass it through to the button.
>>> Here is an example:
>>>
>>> 
>>> this is some content
>>> 
>>>
>>> I can't figure out how MyButton can pass along the children
>>>
>>> class MyButton extends LitElement {
>>> constructor(...args) {
>>> super();
>>> }
>>>
>>> render({children}) {
>>> return html`
>>> 
>>> ${children}
>>> 
>>> `
>>> }
>>> }
>>>
>>>
>>> I tried capturing all the args pass into render and the constructor, but
>>> found nothing that I can use to capture the content. Can someone point me
>>> in the right direction?
>>>
>>> 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 polymer-dev...@googlegroups.com.
>>> To view this discussion on the web visit https://groups.google.com/d/ms
>>> gid/polymer-dev/c25cc110-144d-46a2-9aff-0eae71de366c%40googlegroups.com
>>> 
>>> .
>>> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/polymer-dev/e8a356c2-75db-4f40-a9ea-ca1ca67693a5%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDUZTZF3fRTL9xwadymoxVXjRNzEk2x2ppFy5GnyVLphQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Adding dynamic css class using lit-html

2018-02-19 Thread 'Justin Fagnani' via Polymer
Neither lit-html or LitElement really help here yet, because the host
element is not under control of its own template.

Right now using className or classList in render() is the best option.

render() {
  this.className = this.kind;
}

or if you have other classes you need to not disturb:

const kinds = ['primary', 'secondary'];
render() {
  kinds.forEach((k) => this.classList.toggle(k, this.kind === k));
}


On Mon, Feb 19, 2018 at 5:19 AM, Ronn Ross  wrote:

> I'm attempting to dynamically apply a css class using a property. For
> example I want to pass in a string:
>
> some stuff
>
> My component looks like so:
>
> class MyButton extends LitElement {
> static get properties() {
> return {
> kind: String
> }
> }
>
> constructor() {
> super();
> }
>
> render({ kind }) {
> return html`
> 
> .primary {
> color: red;
> }
> 
>  class="${kind}"
> type="button">
> Press Me!
> 
> `
> }
> }
>
> When I hard-code the class on the element it works. Any ideas?
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/polymer-dev/8f731c01-2f4d-470a-ac21-804d15050957%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmA-nh7MUueeHGNf6P32ygm_aY_0gLN41s4S%3DLp8BnUKgg%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Child html within lit-html

2018-02-19 Thread 'Justin Fagnani' via Polymer
For projecting child content, you need to use s:
https://developers.google.com/web/fundamentals/web-components/shadowdom#slots

class MyButton extends LitElement {
  constructor(...args) {
super();
  }

  render() {
return html`
  

  
`;
  }
}

On Mon, Feb 19, 2018 at 8:18 AM, Ronn Ross  wrote:

> I have a simple button component.
>
>
> I trying to get the child content and pass it through to the button. Here
> is an example:
>
> 
> this is some content
> 
>
> I can't figure out how MyButton can pass along the children
>
> class MyButton extends LitElement {
> constructor(...args) {
> super();
> }
>
> render({children}) {
> return html`
> 
> ${children}
> 
> `
> }
> }
>
>
> I tried capturing all the args pass into render and the constructor, but
> found nothing that I can use to capture the content. Can someone point me
> in the right direction?
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/polymer-dev/c25cc110-144d-46a2-9aff-0eae71de366c%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmAFqkbu3O%2BbUZaU2h5ZOn12JbCB%2BuNQD0yDgeJdwqPhzg%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Polymer 3 lit-html example

2018-02-16 Thread 'Justin Fagnani' via Polymer
ready() is a Polymer-specific lifecycle callback that LitElement inherits.

LitElement is very likely to receive long-term support and be recommended
for new components.

On Fri, Feb 16, 2018 at 11:53 AM, Ronn Ross  wrote:

> Justin,
>
> That worked. Thanks for the quick response. Is ready() a special method?
> Do you think lit-element will get long term support in polymer 3?
>
> Thanks!
>
> On Friday, February 16, 2018 at 2:32:48 PM UTC-5, Justin Fagnani wrote:
>>
>>
>>
>> On Fri, Feb 16, 2018 at 11:16 AM, Ronn Ross  wrote:
>>
>>> Greetings,
>>>
>>> I'm attempting to create a small polymer 3 lit-html project. I'm getting
>>> hung up when lit-html enters the picture. I followed this tutorial:
>>>
>>> https://www.polymer-project.org/blog/2017-08-23-hands-on-30-preview
>>>
>>> and was able to get the demo project running locally. Then I felt
>>> inspired and imported lit-html and tried to convert it over. Here is what I
>>> have
>>>
>>> import { Element as PolymerElement } from '../node_modules/@polymer/poly
>>> mer/polymer-element.js';
>>> import { html, render} from '../node_modules/lit-html/lit-html.js';
>>>
>>> export class MyApp extends PolymerElement {
>>>constructor() {
>>>super();
>>>this.name = '3.0 preview';
>>>}
>>>
>>> static get properties() {
>>>name: {
>>>Type: String
>>>}
>>>}
>>>static get template() {
>>>return render(this.render());
>>>}
>>>
>>> render() {
>>>return html`
>>>
>>>This is my ${name} app.
>>>
>>>`;
>>>}
>>> }
>>>
>>> customElements.define('my-app', MyApp);
>>>
>>> When I run the app it goes from working to
>>>
>>> Uncaught TypeError: this.render is not a function
>>>
>>> Seems strange since it is a method on the class. I'm sure that I'm
>>> missing something obvious. Could someone please point me in the right
>>> direction?
>>>
>>
>> The problem here is that `render()` is an instance method and you're
>> trying to call it from a static method using `this`. You can't really use
>> lit-html with the static template system that PolymerElement comes with.
>> We've made a new base class called LitElement that includes the
>> non-template parts of Polymer and adds lit-html integration:
>> https://github.com/PolymerLabs/lit-element
>>
>>
>>
>>>
>>> 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 polymer-dev...@googlegroups.com.
>>> To view this discussion on the web visit https://groups.google.com/d/ms
>>> gid/polymer-dev/9cb1b757-8752-4317-98f2-b68f2465ef1e%40googlegroups.com
>>> 
>>> .
>>> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/polymer-dev/6d16b912-4c5a-4822-961d-ec13ea94de5d%40googlegroups.com
> 
> .
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDp0%2BwpzjMPqkB-yvfMOdGOMKzwjv0jVZCNAQ8bP9OY9A%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Polymer 3 lit-html example

2018-02-16 Thread 'Justin Fagnani' via Polymer
On Fri, Feb 16, 2018 at 11:16 AM, Ronn Ross  wrote:

> Greetings,
>
> I'm attempting to create a small polymer 3 lit-html project. I'm getting
> hung up when lit-html enters the picture. I followed this tutorial:
>
> https://www.polymer-project.org/blog/2017-08-23-hands-on-30-preview
>
> and was able to get the demo project running locally. Then I felt inspired
> and imported lit-html and tried to convert it over. Here is what I have
>
> import { Element as PolymerElement } from '../node_modules/@polymer/
> polymer/polymer-element.js';
> import { html, render} from '../node_modules/lit-html/lit-html.js';
>
> export class MyApp extends PolymerElement {
>constructor() {
>super();
>this.name = '3.0 preview';
>}
>
> static get properties() {
>name: {
>Type: String
>}
>}
>static get template() {
>return render(this.render());
>}
>
> render() {
>return html`
>
>This is my ${name} app.
>
>`;
>}
> }
>
> customElements.define('my-app', MyApp);
>
> When I run the app it goes from working to
>
> Uncaught TypeError: this.render is not a function
>
> Seems strange since it is a method on the class. I'm sure that I'm missing
> something obvious. Could someone please point me in the right direction?
>

The problem here is that `render()` is an instance method and you're trying
to call it from a static method using `this`. You can't really use lit-html
with the static template system that PolymerElement comes with. We've made
a new base class called LitElement that includes the non-template parts of
Polymer and adds lit-html integration:
https://github.com/PolymerLabs/lit-element



>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/polymer-dev/9cb1b757-8752-4317-98f2-b68f2465ef1e%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmBBSzC1ABD4bSoSdO-gAmtTSiV%3Dgnrb%2B9hBtheEdPUyTQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: Why use yarn as a dependency in Polymer 3.0?

2017-10-18 Thread 'Justin Fagnani' via Polymer
On Wed, Oct 18, 2017 at 8:16 AM,  wrote:

> Specifically, NPM 5 does not accomplish #3 of your list.
>

This is exactly right


> I've heard that they are working on enabling that in a future release but
> for now the only package manager based off of the npm registry that can
> handle flat dependency trees is yarn.
>
> On Sunday, October 1, 2017 at 9:30:14 AM UTC-5, Mark wrote:
>>
>> I was reading Polymer's 3.0 Preview documentation
>> 
>> and see that they've announced that yarn is a dependency.
>>
>> Why? instead of just using NPM 5
>> , which does a lot
>> of the same things yarn does?
>> In the summit, they have said 
>> that they needed a  package manager to:
>>
>>1. Manages dependencies
>>2. Resolves version conflicts
>>3. Supports a flat dependency tree
>>4. Has an active community
>>
>>
>> AFAIK, npm already does this in later versions. So why use yarn which is
>> unnecessary?
>> I get that yarn may be the hot dependency manager today but a lot of
>> people are fine with just using npm.
>>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/polymer-dev/2e9f6920-4a45-4c84-9a5d-7208653c98ba%40googlegroups.com
> 
> .
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmBJt876cOyit45LZq_4E2Z%2BUVC-ANAAfDnwP6R5cv0W7A%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Case study shop-app not using hash in link

2016-06-10 Thread 'Justin Fagnani' via Polymer
Shop uses window.pushState() to change the URL:
https://developer.mozilla.org/en-US/docs/Web/API/History_API#The_pushState()_method

It's supported by all major browsers (except Opera mini):
http://caniuse.com/#search=pushstate


On Fri, Jun 10, 2016 at 2:18 AM,  wrote:

> If I look on what is loaded in the browser dev tools, it seems that the
> app is not reloaded when switching from the homepage to, for example,
> https://shop.polymer-project.org/list/mens_outerwear . Normally you would
> expect to have a hash in the link somewhere to do so. I know that this case
> study uses app-route, but the pages explaining this element doesn' mention
> on how this is done...
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/0e026767-d3c6-4201-bfa1-670bf94cede7%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmA3C%3D0kiWkB7Wamz7Nu7sMavsp6WPW80rU1Ukqb%2BTns3Q%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Managing imports

2016-05-24 Thread 'Justin Fagnani' via Polymer
On Tue, May 24, 2016 at 12:02 PM, Nicolas Ocquidant 
wrote:

> If I had understood correctly, managing imports in one big html file for
> the entire app (for instance elements.html) is not a best practice anymore.
> Indeed, PRPL and polymer-cli requires each component (or view) to manage
> its dependencies.
>

elements.html was never really a best practice, IMO. It completely
bottlenecks the import graph so that you can't tell what depends on what.
It's a convenience at first, but then gets harder and harder to maintain.
If you stop using an import in one element, it makes it hard to know if you
can remove the import from elements.html, or if another element is still
using it.


> Unfortunately, IDE are not a great help here. Do you have a tool to check
> (or automatically add if no conflict?) that a component declares all
> imports for the elements it uses?
>

`polymer lint --entrypoint x.html` should work most of the time, but we
have a few outstanding issues to make it work correctly with lazy-loaded
imports and it currently prefers the project configuration to the
command-line args.

Cheers,
  Justin



>
> Thanks a lot
> --nick
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/b9f59980-353f-4761-a528-ed99622fd994%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmC%2BNQdYi846VGKXpH757dCArFYugPfZhnWXnQ2ZAU8iJQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Polymer cli implemented in Typescript? What gives?

2016-05-24 Thread 'Justin Fagnani' via Polymer
Using TypeScript in tool has really helped our development process - from
documentation, refactoring, and code-completion, to the type checking and
errors that compliments our tests. We've been converting our tools projects
to TypeScript for months now, so this is nothing new.

There are extremely few downsides that we've experienced in practice. The
TypeScript compiler is so fast that the project is build be the time we
switch tabs to run tests or a command. The main outstanding issue is stack
traces referencing the compiled output, but this hasn't been much of a
hinderance - the output is very similar to the input, and we're going to
look into source map support. I'm not aware what other drawbacks might be
big issues.

I personally don't think that the "Use the Platform" philosophy is in
conflict with TypeScript, or many other compile-to-JS languages for that
matter - in node or the web. For tools, we don't run some huge abstraction
over node's processing model, or it's core libraries. On the web, all of
the critical platform features are available as with JS: The entire DOM,
including Custom Elements, Mutation Observer, Custom Events, Shadow DOM,
the CSSOM, and all JS features like classes, Promises, etc. TypeScript
doesn't define it's own object model, and always uses JS features directly.

The tools team really needs to maximize it's output, and TypeScript helps
us do that while still targeting Node, which our customers appreciate. so
there's no reservations from us here. In fact, we grow happier with the
decision every day.

Cheers,
  Justin


On Tue, May 24, 2016 at 11:10 AM, Daniel Llewellyn 
wrote:

> Personally, I am a bit ambivalent towards Typescript.
>
> On one hand I like the types system helping me during development; but on
> the other, like you, I like to use the language of the platform natively to
> prevent weirdness in machine-written code that is less understandable to a
> human reader. The IO mentions of using the platform rather than
> abstractions also points towards not using Typescript.
>
> Sent from Nylas N1 , the extensible, open
> source mail client.
> On May 24 2016, at 7:06 pm, mar...@maklesoft.com wrote:
>
>> I mean nothing against Typescript but after all the talk at I/O about
>> sticking to standards and reducing the amount of necessary tooling, whoever
>> thought this was a good idea? I understand that there are a lot of things
>> that speak for Typescript in general but I haven't seen it used anywhere
>> else in the Polymer ecosystem and I don't understand why the team chose to
>> start using it now. I'm not going to list all the reasons why I think this
>> is a bad idea - I think everybody in the team is aware of the drawbacks -
>> but I'd love to hear the reasoning behind this.
>>
>> 
>>
>> Sorry, but I just had to get this out of my system. Really love the work
>> you're doing! Keep it up!
>>
>> 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 polymer-dev+unsubscr...@googlegroups.com.
>> To view this discussion on the web visit
>> https://groups.google.com/d/msgid/polymer-dev/80b27bd8-d3ea-4de1-819c-9f1825084f38%40googlegroups.com
>> 
>> .
>> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/82rafzmqajtm5etkxzvm9okdi-0%40mailer.nylas.com
> 
> .
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDP%2BfdHEr1Q3m8QcCguBfrodi%2Bwm%2Be0T1V5PPKkXaOsAQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Polymer build Error: Cannot find module 'gulp'

2016-05-24 Thread 'Justin Fagnani' via Polymer
By any chance do you have a gulpfile?

On Tue, May 24, 2016 at 4:08 AM, Marco Stolle 
wrote:

> Hello
>
> i'm trying the new polymer-cli, everything works but when i try to build i
> get the error
>
> Error: Cannot find module 'gulp'
>
>
> gulp is installed global and local
>
>
> gulp --version = 3.9.1
>
>
> searched Google and this forum but no results
>
>
> Any ideas?
>
>
> thanks
>
>
> Marco
>
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/a0eb12f0-5480-43a7-95fa-643c2dd2711f%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmA%3D2Rj3KpiNPTVExCRjzx5nJgUsLiab1zkCYkgTnkeP-w%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Polymer Future: Without Framework? Dart?

2016-04-14 Thread 'Justin Fagnani' via Polymer
On Thu, Apr 14, 2016 at 5:14 AM, Samuel Schwebel 
wrote:

> Hi Justin,
>
> Thanks for reply. It is nice to know that internally Google is using only
> Polymer on large projects. This gives us the confidence to decide on.
>
> About data-management I feel that could have a definition/implementation
> pattern like MVC, MVP e MVVM (concern separation) more clear on Polymer
> with data-model focus and an official datatable component too.This is very
> important for business applications that are focused intensivante data.
>
> The decision by Dart lang is almost taken on our project, importants
> features to consider in large business applications as typed language, code
> structure - "no spaguetti", among others. It is a pity that there is no
> official plan for a native version of Dart for Polymer. But we will try to
> use the wrapper library available on pub Dart.
>

Which package is that? I'm not aware of any that are regularly updated. The
current polymer package on Pub uses Polymer 0.5.x, which is very, very old
and very, very, very unsupported. Other wrappers like polymerjs haven't
been updated in 9 months. This may or may not be much an issue right now,
but we're pushing forward on Polymer a lot, and I suspect that eventually
the wrapper would need to be updated or cause problems. This will likely be
especially true as the new Web Components standards are adopted.


> About ProjectTS perhaps could be the way, but seeing the latest
> information, for example, Adwords decision to use Dart, Angular have a
> native Dart think the future trend is that technologies/libraries could
> also be implemented Dart lang.
>
> Cheers,
>
> Samuel.
>
>
>
>
>
> Em qua, 13 de abr de 2016 às 18:49, Justin Fagnani <
> justinfagn...@google.com> escreveu:
>
>> On Wed, Apr 13, 2016 at 2:32 PM, Samuel Schwebel <
>> samuel.schwe...@gmail.com> wrote:
>>
>>> Hi,
>>>
>>> I need to build a large business application.
>>>
>>> I love Polymer and if possible, I would like to use Polymer without
>>> another libraries and frameworks like Angular, React, etc. I read on
>>> Internet and normaly the recomendation is to use Polymer + anthor framework.
>>>
>>> I have used Dart Lang too. A nice and modern language.
>>>
>>> Then, I would like to get an opinion:
>>>
>>> *1. Can I to development a large business application just with Polymer
>>> without another frameworks?*
>>>
>>
>> Absolutely. We have many large apps at Google built with just Polymer.
>> We're continuing to work on more app-level features like the new Carbon
>> router (in beta). Data-management and APIs are an area where we're not very
>> prescriptive, and there are a number of techniques out there, including
>> using libraries popular with other frameworks, like Redux.
>>
>> *2. Is there plans to implement Polymer in native Dart lang, like Angular
>>> has been implemented?*  (I know that there is a project, but it is a
>>> wrapper from Polymer (java script):
>>> https://github.com/dart-lang/polymer-dart)
>>>
>>
>> None that I know of.
>>
>> I'm not sure how well supported Polymer.dart is right now. It doesn't
>> seem to be receiving many commits at this point. I've been using TypeScript
>> recently, and while it's not Dart, with strict linting it's quite an
>> improvement on vanilla JS. There's a PolymerTS project that lets you use
>> very nice class declarations for Polymer elements.
>>
>> Cheers,
>>   Justin
>>
>>
>>
>>> Thanks,
>>>
>>> Samuel.
>>>
>>> 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 polymer-dev+unsubscr...@googlegroups.com.
>>> To view this discussion on the web visit
>>> https://groups.google.com/d/msgid/polymer-dev/CAHo81rKg5UzFsyzTNTnV4aLDGN9kKU-Bm_knWQkwFTz2c4shgw%40mail.gmail.com
>>> 
>>> .
>>> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmA_WJo6gJVsEAfM2ueHx2f1%3Dz74pUZsKMMhBfLiQiEyVQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Polymer Future: Without Framework? Dart?

2016-04-13 Thread 'Justin Fagnani' via Polymer
On Wed, Apr 13, 2016 at 2:32 PM, Samuel Schwebel 
wrote:

> Hi,
>
> I need to build a large business application.
>
> I love Polymer and if possible, I would like to use Polymer without
> another libraries and frameworks like Angular, React, etc. I read on
> Internet and normaly the recomendation is to use Polymer + anthor framework.
>
> I have used Dart Lang too. A nice and modern language.
>
> Then, I would like to get an opinion:
>
> *1. Can I to development a large business application just with Polymer
> without another frameworks?*
>

Absolutely. We have many large apps at Google built with just Polymer.
We're continuing to work on more app-level features like the new Carbon
router (in beta). Data-management and APIs are an area where we're not very
prescriptive, and there are a number of techniques out there, including
using libraries popular with other frameworks, like Redux.

*2. Is there plans to implement Polymer in native Dart lang, like Angular
> has been implemented?*  (I know that there is a project, but it is a
> wrapper from Polymer (java script):
> https://github.com/dart-lang/polymer-dart)
>

None that I know of.

I'm not sure how well supported Polymer.dart is right now. It doesn't seem
to be receiving many commits at this point. I've been using TypeScript
recently, and while it's not Dart, with strict linting it's quite an
improvement on vanilla JS. There's a PolymerTS project that lets you use
very nice class declarations for Polymer elements.

Cheers,
  Justin



> Thanks,
>
> Samuel.
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/CAHo81rKg5UzFsyzTNTnV4aLDGN9kKU-Bm_knWQkwFTz2c4shgw%40mail.gmail.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDA%2BLux7s7_6PXqy7nn-E_giDL2VQXJ53qviHTFEbvHwA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Multiple instances of elements seem to be sharing property values ?

2016-03-20 Thread 'Justin Fagnani' via Polymer
There's really no way to do that. Critically, there's no way to fully clone
an object.
On Mar 18, 2016 9:57 AM, "Rob Stone"  wrote:

> Would it be feasible for polymer to auto-wrap array/object types in a
> function call? I can't imagine anyone wanting the existing behaviour - but
> if this was deemed to be necessary, then a new 'disableAutoWrap' option
> could be added to the type definition object?
>
>
> On Friday, 18 March 2016 16:13:54 UTC, Karl Tiedt wrote:
>>
>> It is how Javascript has always worked... Arrays and Objects are by
>> reference, so in this situation, you have to return a new instance to get
>> that separation.
>>
>> In other libraries this was usually handled in the constructor with
>> this.varname = []; but in Polymer, if you want to handle it in the
>> properties definition (recommended way) requires the function call.
>>
>> -Karl Tiedt
>>
>> On Fri, Mar 18, 2016 at 9:00 AM, Rob Stone  wrote:
>>
>>> Thinking about the mechanics of this, I can now see why it works this
>>> way. However, it is still a pretty nasty gotcha and it might be worth
>>> looking at that area of the documentation and making this issue a bit more
>>> obvious.
>>>
>>> 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 polymer-dev...@googlegroups.com.
>>> To view this discussion on the web visit
>>> https://groups.google.com/d/msgid/polymer-dev/08b6ea93-1fde-4d29-8271-71b5cf859343%40googlegroups.com
>>> 
>>> .
>>>
>>> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/efa312f3-1cdc-4775-8efc-b3edec890adc%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmCftjMBdEy4D2Px5D-gV6X1JmhFNqxTTiSTS2CadeCMww%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: translate javascript to typescript

2016-03-19 Thread 'Justin Fagnani' via Polymer
Just wanted to point out that this isn't TypeScript specific, arrow
functions are part of ES2015.

On Thu, Mar 17, 2016 at 2:52 AM, Mallegriss  wrote:

> sorted out.
>
>
>
> .attr("d", d3.svg.symbol()
>
> .size(d => d.size))
>
>
>
> On Wednesday, March 16, 2016 at 10:42:51 PM UTC+13, Mallegriss wrote:
>>
>> Hi guys,
>>
>> I'd like to know how to translate below piece code into typescript:
>>
>> this.nodes = svg.selectAll(".node")
>> .data(this.forceLayout.nodes()) //<-- get all
>> nodes in data
>> .enter().append("path")
>> .attr("class", "node")
>> .attr("d", function (d) { return d3.svg.symbol()
>>  .size(d.size); })
>>
>>
>> I tried this:
>>
>> .attr("d", (d) => { d3.svg.symbol()
>>
>> .size(d.size)})
>>
>>
>> it turned out to be below, which doesn't work.
>> .attr("d", function (d) {
>> d3.svg.symbol()
>> .size(d.size);})
>>
>>
>> Thanks,
>> M
>>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/8c129908-c89a-4dfd-8bc1-cbd503a96845%40googlegroups.com
> 
> .
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmC90pY8d8CxnDG7GxMSUgmz9D7YNyj_nqSgeOGRyT5sQg%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Polymer 0.5 and production use

2016-03-04 Thread 'Justin Fagnani' via Polymer
On Fri, Mar 4, 2016 at 3:43 AM,  wrote:

>
> Hi, so you think that if moved to 1.0 and ofcourse not use
> iron-flex-layout at least some period there would be no problems like this
> :)
> I tried to migrate some of the logic last days from .5 to 1.0, and I was
> surprised that the normal dynamic creation of elements is not working for
> 1.0. exp:
> var g = dom.createElement("paper-radio-group");
> g.appendChild(dom.createElement("paper-radio-button"));
> the group element was holding the radio button but when clicked it was
> removed from the dom...
> Is 1.0 not supporting dynamic creation/usage of elements?
> Any idea on this one?
>

By default Polymer 1.0 does not use the full Shadow DOM polyfill, so most
DOM operations need to go through a special "Shady DOM" API so that Polymer
knows to re-compute the composed DOM when the document changes. These APIs
are available by calling Polymer.dom() on the element you wish to modify,
in your example:
Polymer.dom(g).appendChild(document.createElement('paper-radio-button'))

See these docs for more:
https://www.polymer-project.org/1.0/docs/devguide/local-dom.html#dom-api

Hope that helps!
  Justin



>
> Tnx
> Blaze
>
>
> On Thursday, March 3, 2016 at 8:22:37 PM UTC+1, arthure wrote:
>>
>> I'd add that the Polymer element catalog still uses some `/deep/` and
>> `::shadow` styling, so if you're looking at that site, even though it's
>> written using the 1.0 elements, you'll see console warnings.
>>
>> Cheers,
>> Arthur
>>
>> On Mon, Feb 29, 2016 at 3:35 PM, 'Taylor Savage' via Polymer <
>> polym...@googlegroups.com> wrote:
>>
>>> Hi Blaze,
>>>
>>> I would highly recommend upgrading to the Polymer 1.0 elements. The 0.5
>>> components are no longer actively supported and are based on some
>>> experimental API's, whereas the 1.0 elements are actively supported.
>>>
>>> The /deep/ selector is deprecated in the platform and will be eventually
>>> removed from Chrome. Polymer 1.0+ elements do not rely on this selector at
>>> all. The deprecation warning you might see is because iron-flex-layout
>>>  does pull in some
>>> /deep/ styles for backwards-compatibility, but none of the
>>> PolymerElements  rely on this.
>>>
>>> You can learn more about the /deep/ deprecation on the Polymer blog.
>>> 
>>>
>>> Hope that helps!
>>>
>>> Taylor
>>>
>>> On Tue, Mar 1, 2016 at 5:03 AM,  wrote:
>>>
 Hi,

 I use some of the polymer 0.5 components in production. In the console
 are emited some deprications related to deep and shadow dom. So i was
 wondering if 0.5 components are based on experimental apis? Is it posible
 that the components brake totally in near future? If this happen, can we
 force the lib to use the polifil for every browser?

 I also see some of this deprications logged in the console when I open
 the 1.0 polymer components on the polymer.org web page. Are this
 components also not stable and can have big api changes in neer future?

 Tnx
 Blaze

 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 polymer-dev...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/3251deb2-43ab-4c0d-825a-1baf30d99fe7%40googlegroups.com
 .
 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 polymer-dev...@googlegroups.com.
>>> To view this discussion on the web visit
>>> https://groups.google.com/d/msgid/polymer-dev/CAN-z2fsPDukL4d%2B_VNut-8VR8DxtE5TY4JooLV1wx5%2BvpHgX8g%40mail.gmail.com
>>> 
>>> .
>>>
>>> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/3524ce48-a531-4f76-8abd-5d98f15f3100%40googlegroups.com
> 

Re: [polymer-dev] Re: Issue with HTTP2 Push and Polymer- Dom Content Ready Time Much Longer Even Though Time On Files Shorter

2016-02-16 Thread 'Justin Fagnani' via Polymer
Can you post the ordering of the files? The timeline screenshot didn't give
much info. Again, to clarify, the html files are actually arriving later?
On Feb 16, 2016 6:18 PM, "Darin Hensley"  wrote:

> Yes, I mean the time per a individual file is much shorter with http2
> push. I had this both on an Amazon and Rackspace server...one Ubuntu and
> one Gentoo and had the same user experience. The set up is pretty
> simple, so I don't think I was doing anything wrong...nothing pointed out
> in the github issue I filed for nghttpx. Not sure where the problem would
> be. I liked be able to brag I was using http2 push and not having to worry
> about concatenation, but happy enough without it.
>
>
>
>
>
> On Tuesday, February 16, 2016 at 12:57:47 PM UTC-6, Justin Fagnani wrote:
>>
>> I'm trying to follow along here, but I'm having some trouble seeing
>> what's happening. The timeline images you have don't show the .html files,
>> so I can't see when they're downloaded. When you say "The individual
>> time on the files requested are much shorter" do you only mean that the
>> time per file is shorter, or do you also mean that the timeline is showing
>> that they're downloaded earlier?
>>
>> I'm particularly interested in the case where the files are downloaded
>> earlier with http2 push, but DOMContentLoaded is still firing later. That
>> would indicate that something is going wrong in the browser that delays the
>> ready/load events. The other case, where the files download quicker, but
>> later in the timeline, would line up with the diagnosis that this is a
>> server-related issue, or priority+push support in the browser.
>>
>> Cheers,
>>   Justin
>>
>>
>> On Mon, Feb 15, 2016 at 10:07 AM, Eric Bidelman  wrote:
>>
>>> AFAIK, App engine's h2 push doesn't push based on priority. It pushes
>>> all resources at high priority. I'm not sure Chrome even supports resource
>>> prioritization (yet) for h2 push. But this could definite be a source of
>>> your issue if your sure env is pushing html files at a lower priority.
>>>
>>> One thing you could do is still vulcanize, and vulcanize with crisper.
>>> Then h2 push the .js file separately from the rest of the .html.
>>>
>>> On Sun, Feb 14, 2016 at 5:11 PM Darin Hensley 
>>> wrote:
>>>

 Not at the momentbut curious, ya'll did your http2 push testing
 with Google App engine, correct? I don't have a google cloud(using the
 Amazon free for a year cloud) and so I use nginx with nghttpx. I asked the
 author and he mentioned it could be that html files get the lowest
 prioritization in http2 push.

 Here is the thread for more information:

 https://github.com/tatsuhiro-t/nghttp2/issues/501

 Can I please get your opinion/input on it? I'm basically resorting back
 to vulcanize and not pushing the html files.


 On Sunday, February 7, 2016 at 7:25:02 PM UTC-6, ric...@gmail.com
 wrote:
>
> Huh, that's unexpected, and I haven't seen that in our tests. Do you
> have a demo deployed anywhere that we can test with?

 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 polymer-dev...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/3ce650e5-52f7-4ee7-8e18-67925ea41bd0%40googlegroups.com
 
 .
 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 polymer-dev...@googlegroups.com.
>>> To view this discussion on the web visit
>>> https://groups.google.com/d/msgid/polymer-dev/CACGqRCCcsoTUC-TE%3DtoHVMod13uFbOSj67T-MGD7%2BDH8nU9DAQ%40mail.gmail.com
>>> 
>>> .
>>>
>>> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/e849778d-3e94-4f53-97ed-5149236b15f4%40googlegroups.com
> 

Re: [polymer-dev] Re: Polymer Designer (2)

2016-02-16 Thread 'Justin Fagnani' via Polymer
As you can see on the git activity, there's not much happening on Designer
2.0 at the moment.

Right now we're focusing on our other tools and making sure that we have a
great developer experience across all the tools, and consolidating them
into a few more easily accessible offerings. This is some of the highest
priority work we have in 2016 because it impacts all of our users.

I'm very eager to get Designer work started again, it's very important to
the team and me personally, but it's a matter of priority and time at the
moment.

Cheers,
  Justin




On Mon, Feb 15, 2016 at 10:02 AM, Eric Bidelman  wrote:

> +Justin Fagnani 
>
> On Mon, Feb 15, 2016 at 8:05 AM Milan Raj  wrote:
>
>> Looks like the last commits were back in December:
>> https://github.com/Polymer/designer
>>
>> I'm very interested in Polymer Designer 2 as well. Especially using it as
>> an embedded WYSIWIG editor for composing with web components (based on
>> Polymer or otherwise).
>>
>> Best,
>> Milan
>>
>>
>> On Sunday, February 14, 2016 at 3:04:52 AM UTC-6, micha...@gmail.com
>> wrote:
>>>
>>> HI,
>>> any updates on timeline and roadmap for  Polymer Designer (2) . There
>>> haven't been updates on the repo for quite some time . Wondering about the
>>> future of it
>>>
>>> Cheers, Mike
>>>
>> 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 polymer-dev+unsubscr...@googlegroups.com.
>> To view this discussion on the web visit
>> https://groups.google.com/d/msgid/polymer-dev/45ef90e2-96ee-4afa-9eed-85f584cad5a6%40googlegroups.com
>> 
>> .
>> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmC0dAaNGeQmzOVBoR7M8ehLDRsnF70WtouQCo_69mr85A%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: Issue with HTTP2 Push and Polymer- Dom Content Ready Time Much Longer Even Though Time On Files Shorter

2016-02-16 Thread 'Justin Fagnani' via Polymer
I'm trying to follow along here, but I'm having some trouble seeing what's
happening. The timeline images you have don't show the .html files, so I
can't see when they're downloaded. When you say "The individual time on the
files requested are much shorter" do you only mean that the time per file
is shorter, or do you also mean that the timeline is showing that they're
downloaded earlier?

I'm particularly interested in the case where the files are downloaded
earlier with http2 push, but DOMContentLoaded is still firing later. That
would indicate that something is going wrong in the browser that delays the
ready/load events. The other case, where the files download quicker, but
later in the timeline, would line up with the diagnosis that this is a
server-related issue, or priority+push support in the browser.

Cheers,
  Justin


On Mon, Feb 15, 2016 at 10:07 AM, Eric Bidelman  wrote:

> AFAIK, App engine's h2 push doesn't push based on priority. It pushes all
> resources at high priority. I'm not sure Chrome even supports resource
> prioritization (yet) for h2 push. But this could definite be a source of
> your issue if your sure env is pushing html files at a lower priority.
>
> One thing you could do is still vulcanize, and vulcanize with crisper.
> Then h2 push the .js file separately from the rest of the .html.
>
> On Sun, Feb 14, 2016 at 5:11 PM Darin Hensley 
> wrote:
>
>>
>> Not at the momentbut curious, ya'll did your http2 push testing with
>> Google App engine, correct? I don't have a google cloud(using the Amazon
>> free for a year cloud) and so I use nginx with nghttpx. I asked the author
>> and he mentioned it could be that html files get the lowest prioritization
>> in http2 push.
>>
>> Here is the thread for more information:
>>
>> https://github.com/tatsuhiro-t/nghttp2/issues/501
>>
>> Can I please get your opinion/input on it? I'm basically resorting back
>> to vulcanize and not pushing the html files.
>>
>>
>> On Sunday, February 7, 2016 at 7:25:02 PM UTC-6, ric...@gmail.com wrote:
>>>
>>> Huh, that's unexpected, and I haven't seen that in our tests. Do you
>>> have a demo deployed anywhere that we can test with?
>>
>> 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 polymer-dev+unsubscr...@googlegroups.com.
>> To view this discussion on the web visit
>> https://groups.google.com/d/msgid/polymer-dev/3ce650e5-52f7-4ee7-8e18-67925ea41bd0%40googlegroups.com
>> 
>> .
>> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/CACGqRCCcsoTUC-TE%3DtoHVMod13uFbOSj67T-MGD7%2BDH8nU9DAQ%40mail.gmail.com
> 
> .
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDUn%2BH_13020GJTx8OJKe%2B4%3DTZAHmEk2BedukvEEcCmYA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Ask for globals

2016-02-16 Thread 'Justin Fagnani' via Polymer
On Sun, Feb 14, 2016 at 3:08 PM, Pedro Nicolás Cuadra Guamán <
pedrxcua...@gmail.com> wrote:

> Don't worry, I solved the problem using jQuery:
>
> $("").on("paper-radio-group-changed",function(){
>//...
> })
>
>
You shouldn't need jQuery, with Polymer or just with plain JS. In fact,
jQquery is dangerous because it doesn't know about the Shady DOM scoping
and will select elements across shadow boundaries.

In a Polymer element, this.$$(s) is an alias for
this.root.querySelector(s), so to add an event handler just do:

this.$$('paper-radio-group').addEventListener('paper-radio-group-changed',
() => { ... });

This query is scoped to the element both in native shadow DOM and in
ShadyDOM.

If you want a document-level handlers, you can just use standard DOM APIs:

document.querySelector('paper-radio-group').addEventListener('paper-radio-group-changed',
() => { ... });

Note that under shady DOM that query won't be scoped to just the document's
light-dom, but will select the first paper-radio-group, even in a shadow.
Same with jQuery. I'd use that pattern with great caution, or better not at
all.

Cheers,
  Justin



> Greetings from Chile
>
> 2016-02-14 18:48 GMT-03:00 Pedro Nicolás Cuadra Guamán <
> pedrxcua...@gmail.com>:
>
>> PD: I want to control a 
>>
>> 2016-02-14 18:47 GMT-03:00 Pedro Nicolás Cuadra Guamán <
>> pedrxcua...@gmail.com>:
>>
>>> Sorry i'm not expert with Polymer, but, How can I manipulate an
>>> "on-change" event external to the web component in JS? any link? I would
>>> appreciate you so much
>>>
>>>
>>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/CABUE4gjpppD1%2B7CZkaFuXPdZ3sH53cOU26%2BUUdrW5995e%2B_-Zg%40mail.gmail.com
> 
> .
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmC1t%2Bkfh999_YPi6pnj%3DAQLBtAV9%3Dq_%2BOavFoNbyVkZeg%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Shape-shifter 2.0 - now with more shapes!

2015-12-03 Thread 'Justin Fagnani' via Polymer
Very nice!
On Dec 3, 2015 12:14 AM, "Martin Kleinschrodt" 
wrote:

> Check it out: http://maklesoft.github.io/shape-shifter/
>
> 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 polymer-dev+unsubscr...@googlegroups.com.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/polymer-dev/258f25ae-552b-4692-917e-a5562d2d419f%40googlegroups.com
> 
> .
> 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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmCowzjTopG3-4CSKmV48Z6WnUNZLwP8MChHjPyiNQLv7A%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


[polymer-dev] Polymer DevTools Extenstion

2015-09-24 Thread 'Justin Fagnani' via Polymer
Greetings Polymer People!

If you don't know already, we've been developing a Polymer Chrome DevTools
extension to help track performance of your elements on a fine-grained
level - per tag-name and per lifecycle callback.

This extension was recently created (just the week prior to the Polymer
Summit), and is still in the very earliest stages of development. Normally
it wouldn't be publicized much yet, but it ended up looking like it could
be very valuable to our developers, even in it's current larval form, so we
published it to the Chrome Web Store, and it was briefly hinted at in some
Summit talks, and has been mentioned in the Slack channel.

I wanted to take a quick moment to both let you know of its existence if
you didn't already, and set some expectations at this point in time.

The extension works by hooking all custom element lifecycle callbacks, all
async-related APIs in the browser, and a few Polymer async and data-binding
methods. These hooks must be installed very early, before we even know that
a page uses Polymer, and on every page.

As you can guess this is pretty invasive and there's the potential that the
extension breaks some sites. I've already fixed breakages of GitHub and the
Google homepage (positive note: web components are already more popular
that we thought!).

As such, we *strongly* recommend that the extension is installed to a
separate development-only Chrome profile. To add a new profile, use the
People > Add Person... menu in Chrome. If you've installed the extension to
a normal browsing profile, you can uninstall it in the chrome://extensions
page.

I'd also like to add a little disclaimer about the numbers reported by the
extension. We *think* they're correct, but due to the complexity of
tracking async tasks and associating them back to the correct element,
there could be some discrepancies. Of course, tackling this problem is the
primary value of the extension :)

The extension has very little test coverage at the moment, and likely won't
see much development for a few weeks while the Polymer team re-unites into
its full Voltronic form after post-Summit travels. So... use at your own
risk, and if you do use it, please report any issues.

The extension can be found on the Chrome Web Store here:
https://chrome.google.com/webstore/detail/polymer-devtools-extensio/mmpfaamodhhlbadloaibpocmcomledcg

And issues can be reported here:
https://github.com/PolymerLabs/polydev/issues

Thanks, and happy developing!
  Justin

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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmAYxiDuvksXPE2fjAOo%2BpNOVOr-PFnOjY7a6Ajf9eKGcw%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] How to use css variable to style distributed nodes?

2015-09-16 Thread 'Justin Fagnani' via Polymer
The ::content pseudo element should help. It's applied to 
elements so you can style their distributed content. See
http://www.html5rocks.com/en/tutorials/webcomponents/shadowdom-201/

On Tue, Sep 15, 2015 at 1:29 PM, Aleks Totic  wrote:

> The --css-variable is the new, recommended way of styling shadow DOM. How
> do I use css variables to style distributed nodes?
>
> Example:
>
> 
>   
> done
>   
> 
>
> I'd like my-toolbar to apply different color to its content's
> paper-button[disabled].
>
> paper-button exposes --paper-button-disabled variable to be used for
> styling its disabled state, so that's what I want to use.
>
> My first attempt was to set '--paper-button-disabled' inside my-toolbar
> style definition:
>
> 
>   
> 

Re: [polymer-dev] Re: Help with Polymer 1.0 CSS Styling

2015-07-16 Thread 'Justin Fagnani' via Polymer
On Thu, Jul 16, 2015 at 1:57 PM, Kelly St. John ke...@qfin.net wrote:

 On a somewhat related note, is there a reason the demos/docs are not in
 place for paper-styles in the new 1.0 element catalog? (
 https://elements.polymer-project.org/elements/paper-styles)

 Should I be using paper-styles, or is it experimental?


It's not experimental. I'm not sure why the documentation isn't showing up.





 On Thursday, 16 July 2015 12:39:25 UTC-7, Kelly St. John wrote:

 Hi All,

 I'm currently in the midst of migrating an app built on polymer 0.5.4 to
 1.0.  In the 0.5 app I leveraged the core-style element throughout in order
 to apply common styling amongst the various custom elements.  I'm not a CSS
 expert by any means (a relative newbie actually), and could really use an
 example of how to do the same using the new 1.0 styling paradigms.  I like
 the idea of using a document-level element (via an external html file) to
 store application-level common styles.  For instance, one would presume I
 could then place something like this in that document level external file:

 style is=custom-style

 .center {
 @apply(--layout-center);
 }

 .horizontal {
 @apply(--layout-horizontal);
 }

 .vertical {
 @apply(--layout-vertical);
 }


 /style


  And use these document level styles by applying classes to any tag in
 the app, like:

 div class=horizontal center

 However, that approach doesn't seem to be working at the moment.


This is as intended. The styles are scoped on purpose so that they don't
leak downward. It's totally possible that in some component you're using
that .center is supposed to have a slightly different styling (especially
considering how many ways there are to center), and you wouldn't want to
override it.

The correct approach is to apply the properties where you need them. In the
host of that div, use @apply:

.my-class {
  @apply(--layout-center);
}

div class=my-class/div

If you want to pass styles down the tree, and through scope boundaries,
then you can use CSS custom properties, but it's always up to the element
in a scope to choose to apply the property. In that way it's opt-in from
the element's point of view.

Does that help?

Cheers,
  Justin



  I'm likely missing something with the scoping of CSS styles in Polymer
 1.0, or maybe even barking down the wrong path entirely.  I want to employ
 a theming strategy that will continue working as Polymer evolves beyond
 1.0.  I do not want to rewrite this application anytime soon...or it will
 likely be necessary for me to look for other employment.  Can someone
 kindly point me in the right direction, please?

 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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/3759a8f4-2da7-4fca-b51a-77f57d2d8d8f%40googlegroups.com
 https://groups.google.com/d/msgid/polymer-dev/3759a8f4-2da7-4fca-b51a-77f57d2d8d8f%40googlegroups.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDK-shKBHJ%2BnX6g2JqUBJW9p9-cSC0fee0KthyWvvs2rw%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: Help with Polymer 1.0 CSS Styling

2015-07-16 Thread 'Justin Fagnani' via Polymer
CSS custom properties are the way to do theming. Polymer includes support,
and the paper elements use them extensively.

On Thu, Jul 16, 2015 at 3:30 PM, Kelly St. John ke...@qfin.net wrote:

 That said...it appears that the use of CSS custom properties may not be
 wise based on current browser support for that feature.  Is that the case?



 On Thursday, 16 July 2015 15:21:33 UTC-7, Kelly St. John wrote:

 Thanks Justin.  I just read more of the Styling documentation from the
 Styling section of the 1.0 Developer Guide.  Here is an important extract
 pertaining to my issue (see below).  It seems application-wide 'theming'
 capability is a bit of a casualty stemmed from the necessary removal of
 /deep/ and ::shadow selectors used previously in polymer 0.5.  As you
 eluded to above, it seems I'll have to look into how to incorporate the use
 of Custom CSS properties in order to apply 'theming' across elements.

 One solution the Shadow DOM spec authors provided to address the theming
 problem are the /deep/ and::shadow combinators, which allow writing
 rules that pierce through the Shadow DOM encapsulation boundary. Although
 Polymer 0.5 promoted this mechanism for theming, it was ultimately
 unsatisfying for several reasons:

-

Using /deep/ and ::shadow for theming leaks details of an otherwise
encapsulated element to the user, leading to brittle selectors piercing
into the internal details of an element’s Shadow DOM that are prone to
breakage when the internal implementation changes. As a result, the
structure of of an element’s Shadow DOM inadvertently becomes API surface
subject to breakage, diminishing the practical effectiveness of Shadow DOM
as an encapsulation primitive.
-

Although Shadow DOM’s style encapsulation *improves* the
predictability of style recalc performance since the side effects of a
style change are limited to a small subset of the document, using
/deep/ and::shadow re-opens the style invalidation area and reduces
Shadow DOM’s effectiveness as a performance primitive.
-

Using /deep/ and ::shadow leads to verbose and difficult to
understand selectors.

 For the reasons above, the Polymer team is currently exploring other
 options for theming that address the shortcomings above and provide a
 possible path to obsolescence of /deep/ and ::shadow altogether.



 On Thursday, 16 July 2015 14:15:58 UTC-7, Justin Fagnani wrote:



 On Thu, Jul 16, 2015 at 1:57 PM, Kelly St. John ke...@qfin.net wrote:

 On a somewhat related note, is there a reason the demos/docs are not in
 place for paper-styles in the new 1.0 element catalog? (
 https://elements.polymer-project.org/elements/paper-styles)

 Should I be using paper-styles, or is it experimental?


 It's not experimental. I'm not sure why the documentation isn't showing
 up.





 On Thursday, 16 July 2015 12:39:25 UTC-7, Kelly St. John wrote:

 Hi All,

 I'm currently in the midst of migrating an app built on polymer 0.5.4
 to 1.0.  In the 0.5 app I leveraged the core-style element throughout in
 order to apply common styling amongst the various custom elements.  I'm 
 not
 a CSS expert by any means (a relative newbie actually), and could really
 use an example of how to do the same using the new 1.0 styling paradigms.
 I like the idea of using a document-level element (via an external html
 file) to store application-level common styles.  For instance, one would
 presume I could then place something like this in that document level
 external file:

 style is=custom-style

 .center {
 @apply(--layout-center);
 }

 .horizontal {
 @apply(--layout-horizontal);
 }

 .vertical {
 @apply(--layout-vertical);
 }


 /style


  And use these document level styles by applying classes to any tag in
 the app, like:

 div class=horizontal center

 However, that approach doesn't seem to be working at the moment.


 This is as intended. The styles are scoped on purpose so that they don't
 leak downward. It's totally possible that in some component you're using
 that .center is supposed to have a slightly different styling (especially
 considering how many ways there are to center), and you wouldn't want to
 override it.

 The correct approach is to apply the properties where you need them. In
 the host of that div, use @apply:

 .my-class {
   @apply(--layout-center);
 }

 div class=my-class/div

 If you want to pass styles down the tree, and through scope boundaries,
 then you can use CSS custom properties, but it's always up to the element
 in a scope to choose to apply the property. In that way it's opt-in from
 the element's point of view.

 Does that help?

 Cheers,
   Justin



  I'm likely missing something with the scoping of CSS styles in Polymer
 1.0, or maybe even barking down the wrong path entirely.  I want to employ
 a theming strategy that will continue working as Polymer evolves beyond
 1.0.  I do not want to rewrite this application anytime soon...or it 

Re: [polymer-dev] Wordpress Plugin Development

2015-07-15 Thread 'Justin Fagnani' via Polymer
On Wed, Jul 15, 2015 at 10:58 AM, Keegan Francis 
kfran...@timespacemedia.com wrote:

  Dear Polymer,



 I am very happy with Polymer, it has greatly accelerated the amount of
 functionality I am able to implement in the websites that I work on. The
 documentation is very easy to understand and the code is simple to
 implement. It has been a while since I used an web-language tool that is so
 easy and so powerful at the same time.



 The reason why I am contacting you is I am developing a website for a
 client of mine and they have asked me to implement a google analytics
 dashboard for them. Their website is running on wordpress at the moment.
 There currently exists a Polymer plugin for wordpress but it appears to
 only include the core-components and the paper-components of the polymer
 library. I am wondering if you are intending on providing an update for the
 plugin to allow the use of the google-charts and google-dashboard elements.


Can you provide a link to the wordpress plugin you're referring to? I'm not
aware that we maintain one.


 I am currently working on a work-around for this problem but having the
 plugin support this functionality would make my life a lot easier. If you
 know of a way to include the libraries necessary to make the google
 components work on wordpress I would greatly appreciate the tip.


Is there anything that needs to be done besides including the proper
imports and custom element tags in your wordpress template? I'm curious
what this plugin does.

Cheers,
  Justin





 Thank you for taking the time to read my email and I hope you continue to
 write many more powerful and impressive elements for the polymer platform.



 Sincerely,



 *Keegan Francis*
 *Digital Analytics Implementation Consultant*

 Time + Space Media Ltd.

 P 902-429-8463 ext. 807

 F 902-422-1199

 *www.timespacemedia.com* http://www.timespacemedia.com/



 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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/CO2PR0601MB0936A72028F272AADAD5B776A99A0%40CO2PR0601MB0936.namprd06.prod.outlook.com
 https://groups.google.com/d/msgid/polymer-dev/CO2PR0601MB0936A72028F272AADAD5B776A99A0%40CO2PR0601MB0936.namprd06.prod.outlook.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmB5MwG1CoC7B4yEJOcOf6dSfwusT5PozCRYAmQ24t2NuA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Polymer and Google Blockly

2015-06-02 Thread 'Justin Fagnani' via Polymer
Hi Phil,

While Google may seem like it has infinite resources to coordinate and
build bridges between all of it's projects, it isn't remotely true. Google
is a collection of teams and individuals that have their own set of goals
and priorities and of course, time limitations, that also fit together
within the greater direction of their larger organizations and company.
It's simply not feasible for every project to even share the same goals,
much less be seamlessly integrated even if they did.

Ultimately, Blockly and Polymer don't necessarily share the same goals or
audiences.

Blockly is indeed a cool project, especially as a teaching tool. It's been
around even longer than 3 years as part of various project Neil has worked
on, and at least I am keenly aware of it and have talked to Neil several
times before. Blocky attempts to make syntax errors impossible, and to
guide novice programmers towards the discovery of constructs that are
compatible with each other. Blockly is still an imperative programming
language, just not a text-based one, and while it limits syntax errors it
does much less to prevent logic errors. Blockly is also not very well
known, not exactly fast to program in for experienced programmers, and not
likely to be a popular choice for experienced engineers, nor designers and
more general web developers that we target with Polymer, it's mostly
targeted at education.

Polymer is not trying to completely replace JavaScript, but to offer an
easier way to build custom elements. Our philosophy and methodology include
some aspects, like declarative templating and data-binding, that do
replace imperative programming (this is language-agnostic even) for some
focused tasks, but for other tasks programmers still use JavaScript. If you
wish you can use a compile-to-JS language like Dart, TypeScript,
CoffeeScript, etc., but we by default use the lingua-franca of the web, and
feel strongly that this is the productive choice to reach and be usable by
the broadest audience.

And so, we have limited resources, we should spend them on things that will
be the most useful to the most users in our audience. Right now that
includes things like more elements, testing infrastructure, performance
tuning, addressing high-demand features in data-binding, styling and
layout, modules, etc., and my personal favorite: Polymer Designer. We know
there's more to do than that (and it's not an exhaustive list of what we're
working on), and if you're frustrated that we haven't done the thing you
care about, we're more frustrated that we don't have infinite time.

We are very sympathetic to the idea that programming and building web apps
should be easier. It's why we want elements to be usable by
non-programmers. It's why some elements simply wrap other APIs to make them
usable via markup and data-binding. And it's why we work on Polymer
Designer.

If Blockly can be shown to fit well in this world of custom elements, then
I'm sure it's something that interested community members can drive, and we
would help out as much as we can. I certainly can see how it might be used
to build the logic portion of elements.

I'm personally interested in non-imperative logic building for use in
Polymer, but my current experiments focus on a non-imperative dataflow
programming approach that fits nicely with our data-binding system. If
you're interested in that, I'll be sure to announce any interesting
developments in the usual places.

Cheers,
  Justin




On Mon, Jun 1, 2015 at 1:51 PM, phil cleaver gigglestheth...@gmail.com
wrote:

 I'm the biggest fan of Google and everything they have done.  Google
 Blockly and Polymer are my absolute two favourite things that's going on
 online right now.  Google tells us that with Polymer they have completely
 reinvented the way the web works, and they have.  What they have done with
 Polymer is mind-blowingly awesome.  It does away with most of the
 JavaScript needed to write apps and now you do it all in HTML.

 Throw in Firebase, another Google company and they have utterly and
 completely made all our lives (as long as you're a Web Developer) far far
 easier.  It's nothing short of genius.

 Polymer has been around for 2 years now, Blockly has been around for at
 least 3 years, so why oh why am I struggling to make these two things work
 together?  It is completely unfathomable to me that a company with as many
 resources as it has, a company so ahead of it's time has made 2 completely
 awesome products, yet has apparently spent no time getting the left hand to
 talk to the right one, and linking them up.

 There is a Blockly Web Component at
 https://github.com/gmp26/blockly-element.  It kind of works, but there's
 no data-binding on the workspace, or on the generated code, making it
 (almost) totally useless for anything serious.  It works when the
 blockly-element is in regular DOM, but put 2 of them in shadow DOM and see
 if you can find the workspace xml?  I've spent all in all probably a 

Re: [polymer-dev] Some questions about polymer1.0

2015-06-02 Thread 'Justin Fagnani' via Polymer
On Tue, Jun 2, 2015 at 8:47 AM, Eric Eslinger eric.eslin...@gmail.com
wrote:

 Yes. Angular-material is good if you already use angular, and does not use
 webcomponents to implement the design spec. Notably, if you use angular,
 you should use angular-material as the newer polymer shady / local dom
 implementation does not look to be out-of-the-box compatible with angular
 (both libraries do dom manipulation, but polymer requires all dom
 manipulation to go through its local dom api, see my other thread about
 this).

 MaterializeCSS is a nice material design implementation (I haven't used it
 for anything real, but I did run through some demo code with it to see how
 it works) that is also not webcomponents-based. Furthermore, MaterializeCSS
 doesn't use flexbox for layouts, and does have a jquery dependency for its
 javascript controls.

 So: they're all different approaches to the material design spec.
 Materialize is the most agnostic in terms of the rest of your framework,
 ngMaterial is an angular-only thing, and paper-components are built on
 polymer/webcomponents. Depends on the rest of your application.


I do like to point out that custom elements at least hold the promise of
working with any framework or existing app/page - they're just elements.
That's the point of all this work :)

-Justin


 e

 On Tue, Jun 2, 2015 at 5:18 AM 王納米 namihe...@gmail.com wrote:

 Hi Peng,

 About your last question, AFAIK, material design is just a design spec,
 angular-material and paper-elements are two different implementations.
 Polymer itself does nothing about it.

 NanoWANG


 On Tue, Jun 2, 2015 at 12:18 PM Peng Kim lomoonmoonb...@gmail.com
 wrote:

 Hi,Eric

 Thanks for replying

 I think we have reason to cut out IE browser,because it is passed ,MS
 has published a new browser Edge which is isolated from IE, and this is new
 era of web,we should think about the future.Because I'm from China,and my
 customers are almost Chinese,So,in addition to the popular browsers like
 chrome,Firefox,safari,opera,etc,we have our own browsers which is based on
 chrome V8 engine,but they are quite different from chrome on displaying or
 anything compatibility stuff,so,it is quite hard to me to make decision.

 I found AngularJS has its own Material design libs,
 https://material.angularjs.org  ,what is the differences between
 Polymer and  Materialize http://materializecss.com/ , when you choose
 what Material design libs work with Angular,why Polymer?not angular
 materializer or something else?

 Peng

 Best Regards

 On Saturday, May 30, 2015 at 5:00:15 AM UTC+8, Eric Eslinger wrote:

 I am not on the polymer team, but in my own experience:

 1) polymer works well (especially polymer 1.0 with the new shady dom)
 on modern browsers; like last two versions of stuff. So not IE8, but it
 works on IE11 in my experience. It doesn't run well (or at all) on the old
 stock android browser, but mobile chrome / safari run it fine on modern
 phones.

 3) Angularjs works just fine with polymer when polymer is in full
 shadow-dom mode, but that introduces browser slowness and some
 incompatibilities. In shady DOM mode, (see my earlier thread) at the
 current time, angular's DOM manipulation functions (ng-if, ng-repeat, etc)
 will alter the DOM without telling polymer that the DOM was just altered,
 which can potentially lead to errors in class isolation, where the css
 classes don't get distributed properly to newly-added stuff.

 e



 On Fri, May 29, 2015 at 9:20 AM Peng Kim lomoonm...@gmail.com wrote:

 Hi,Polymer team

 I was so exciting when i saw the brand new official version 1.0  of
 Polymer ,Thanks to the Polymer team for bringing us so amazing stuff.I 
 cant
 wait trying it out for my big project.But I want to eliminate my worries
 and doubts before utilize it in my project.

 1,What about the compatibility?does it work great on
 IE7-11?safari5+?chrome*?firefox*?opera*?and even in mobile built-in 
 browser?

 2,Can this version be used for social networking website or e-commerce
 website for a company?

 3,I want to use it with Angularjs,what is the best practice to work
 well with Angularjs?

 Thanks in advanced,Any reply will be appreciated!

 Peng

 Best Regards

 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 polymer-dev...@googlegroups.com.


 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/1d345c35-6758-4393-9a23-d2c4c3a919a4%40googlegroups.com
 https://groups.google.com/d/msgid/polymer-dev/1d345c35-6758-4393-9a23-d2c4c3a919a4%40googlegroups.com?utm_medium=emailutm_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
 

Re: [polymer-dev] localDom API and other libraries

2015-05-20 Thread 'Justin Fagnani' via Polymer
On Wed, May 20, 2015 at 9:51 AM, Eric Eslinger eric.eslin...@gmail.com
wrote:

 Hmm, the good news is that just shutting my eyes, going la la la and
 pretending that Polymer.dom doesn't exist seems to work just fine. I built
 a test angular application that uses paper-drawer-panel,
 paper-header-panel, and paper-icon-button to add paper-icon-buttons to a
 list on a timeout using angular's $interval callback to append items to an
 array and angular's ng-repeat and ng-if directives to manipulate the DOM.

 My hypothesis here is that I'm only ever really adding new child nodes in
 the already-distributed DOM elements.


Yes, you can probably get away with a lot as long as your only ever
creating new Polymer elements, and not modifying their direct light
children.

I whipped up a simple bunch of test cases for most of my UI elements here:

 https://github.com/ericeslinger/paulAnka

 in the event anyone cares to keep score at home. I'd love someone to point
 out areas where the Polymer shady DOM is going to bite me in the .. well
 any place would be a bad place to be bitten. If I can get this working for
 all of the polymer elements I currently use in production, I'll move
 forward on it.


The time it'll bite you is when you want to use some awesome element that
uses it's light-children as APIm like marked-element, or you use an
ng-repeat in a Polymer element, etc. I do think there will be workarounds,
such as forking ng-repeat to use Polymer.dom, but in Angular1 I suspect
it'll be piecemeal patches, rather than a single fix as with Angular2.

Of course your other option is to just use Polymer for your whole app ;)



 e

 On Tue, May 19, 2015 at 12:48 PM 'Steve Orvell' via Polymer 
 polymer-dev@googlegroups.com wrote:

 We have experimented with patching dom traversal and mutation api's, and
 there's an experimental import in Polymer that does this. It can let some
 libraries interoperate more smoothly with Shady DOM powered elements that,
 for example, perform distribution. We're continuing to work on it and
 explore if it should be integrated out of the box or be available as an opt
 in layer.

 On Tue, May 19, 2015 at 6:09 AM, jim.j.si...@gmail.com wrote:

 Was there a reason that the built-in versions of the Polymer.dom API
 couldn't be monkeypatched?  In other words, why not make
 document.querySelector or element.querySelector behave like Polymer.dom's
 version?  Wouldn't this increase interoperability with third party
 libraries?

 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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/2ed4c38f-8544-4a29-b79d-aad0ee0c40aa%40googlegroups.com
 .
 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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/CA%2BrMWZhJJtkY_jKm8mSaLavGj3tRSk8Gonka%3DVfgEdD%2BoUaBeQ%40mail.gmail.com
 https://groups.google.com/d/msgid/polymer-dev/CA%2BrMWZhJJtkY_jKm8mSaLavGj3tRSk8Gonka%3DVfgEdD%2BoUaBeQ%40mail.gmail.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/CABsi40%2Bf2zvKe3annQgqer8Pq06wwLGM3xgFYt7af%2Be5cbDZVw%40mail.gmail.com
 https://groups.google.com/d/msgid/polymer-dev/CABsi40%2Bf2zvKe3annQgqer8Pq06wwLGM3xgFYt7af%2Be5cbDZVw%40mail.gmail.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDGvkYjmkuXPciujrJCv3PNrONSeU2DXhzpg36RmJuhnw%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: localDom API and other libraries

2015-05-20 Thread 'Justin Fagnani' via Polymer
On Wed, May 20, 2015 at 10:36 AM, jim.j.si...@gmail.com wrote:

 Is the experimental import for avoiding Polymer.dom documented anywhere?
 I'd be interested in trying it out.


It's not experimental, it's the same Shadow DOM polyfill that we've had for
a a long time: https://github.com/webcomponents/webcomponentsjs

webcomponents.js includes the full polyfill, webcomponents-lite.js doesn't.





 On Monday, May 18, 2015 at 8:46:20 PM UTC-4, Eric Eslinger wrote:

 One of the really rad things about Polymer (0.5) and webcomponents is
 that everything is just DOM. You can pretty easily use core- and paper-
 components libraries inside of an (say) angular app to render out content.
 Doesn't matter if you're using jQuery raw or ember or what have you- DOM is
 DOM, and it mostly works (modulo some property / attribute bindings)

 The new localDom API seems to indicate that this may no longer be the
 case- if I'm redistributing DOM content, I need to use the polymer dom
 interface, rather than just plain parent/child/append calls on document.

 This seems to indicate that modern polymer isn't going to be compatible
 with angular, or with any other library that manipulates the DOM, or is it
 the case that this only matters when there's more complicated shady/light
 manipulations?

 As an example, if I have content in the drawer part of a
 paper-drawer-panel, and then, using jquery or some other element selector,
 inject nodes inside of the already-projected menu div, will this break
 things? Or is it only the case that I need to use the local DOM api when if
 I'm changing the nodes that would be selected as content to project (and
 not their child nodes)?

 Is there some way to shim the document-level query selectors in there or
 add a mutation observer that calls distributeContent as needed? I'm
 guessing it was this shimming and mutation observer that contributed to the
 slowness of 0.5 in non-chrome browsers.

 I've got next week blocked out to actually work on getting angular 1.4 to
 play nice with polymer 0.9 (we use angular to build the page and manage
 data, and polymer for handy flexbox directives and material design ui
 bindings). So I guess I'll figure it out then.

 e

  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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/65c523d0-47b1-4786-8584-fdd2d2fd8047%40googlegroups.com
 https://groups.google.com/d/msgid/polymer-dev/65c523d0-47b1-4786-8584-fdd2d2fd8047%40googlegroups.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmBBB4Ru-YP%3DzV8MNh0efK6J%3D%3DqhYj-uHeFfudRGzA14xQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: localDom API and other libraries

2015-05-20 Thread 'Justin Fagnani' via Polymer
On Wed, May 20, 2015 at 12:40 PM, razb...@gmail.com wrote:

 Just wanna make sure...
 If I build a web-app that targets the Chrome browser, or any browser that
 will have native Shadow DOM support, can I refrain from using the
 Polymer.dom APIs, and use native DOM APIs?


I would not do this. If you're writing code, use Polymer.dom and everything
will just work, whether in a browser with native Shadow DOM or not, or
using the full polyfill or not. The question here is what to do about other
libraries that you don't control that don't use Polymer.dom. That's where
adapters, patching or falling back to the polyfill come into play.




 On Tuesday, May 19, 2015 at 3:46:20 AM UTC+3, Eric Eslinger wrote:

 One of the really rad things about Polymer (0.5) and webcomponents is
 that everything is just DOM. You can pretty easily use core- and paper-
 components libraries inside of an (say) angular app to render out content.
 Doesn't matter if you're using jQuery raw or ember or what have you- DOM is
 DOM, and it mostly works (modulo some property / attribute bindings)

 The new localDom API seems to indicate that this may no longer be the
 case- if I'm redistributing DOM content, I need to use the polymer dom
 interface, rather than just plain parent/child/append calls on document.

 This seems to indicate that modern polymer isn't going to be compatible
 with angular, or with any other library that manipulates the DOM, or is it
 the case that this only matters when there's more complicated shady/light
 manipulations?

 As an example, if I have content in the drawer part of a
 paper-drawer-panel, and then, using jquery or some other element selector,
 inject nodes inside of the already-projected menu div, will this break
 things? Or is it only the case that I need to use the local DOM api when if
 I'm changing the nodes that would be selected as content to project (and
 not their child nodes)?

 Is there some way to shim the document-level query selectors in there or
 add a mutation observer that calls distributeContent as needed? I'm
 guessing it was this shimming and mutation observer that contributed to the
 slowness of 0.5 in non-chrome browsers.

 I've got next week blocked out to actually work on getting angular 1.4 to
 play nice with polymer 0.9 (we use angular to build the page and manage
 data, and polymer for handy flexbox directives and material design ui
 bindings). So I guess I'll figure it out then.

 e

  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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/ac30e4b1-77df-4145-b642-ee20b65bd9af%40googlegroups.com
 https://groups.google.com/d/msgid/polymer-dev/ac30e4b1-77df-4145-b642-ee20b65bd9af%40googlegroups.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmDBtGJP9DgKLYjgChEFWzD1AdK5toK7em7_tMQ0EH87Ww%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] localDom API and other libraries

2015-05-18 Thread 'Justin Fagnani' via Polymer
On Mon, May 18, 2015 at 5:46 PM, Eric Eslinger eric.eslin...@gmail.com
wrote:

 One of the really rad things about Polymer (0.5) and webcomponents is that
 everything is just DOM. You can pretty easily use core- and paper-
 components libraries inside of an (say) angular app to render out content.
 Doesn't matter if you're using jQuery raw or ember or what have you- DOM is
 DOM, and it mostly works (modulo some property / attribute bindings)

 The new localDom API seems to indicate that this may no longer be the
 case- if I'm redistributing DOM content, I need to use the polymer dom
 interface, rather than just plain parent/child/append calls on document.

 This seems to indicate that modern polymer isn't going to be compatible
 with angular, or with any other library that manipulates the DOM, or is it
 the case that this only matters when there's more complicated shady/light
 manipulations?


The full answer is that there are a range of options with various
trade-offs, and for Polymer.dom() there will be a set of workarounds for
integration with various libraries.

The best option, if available, is native Shadow DOM. But that's not so
interesting because everything just works :) So, without native, there are
now two options: Shady DOM and Shadow DOM polyfill. It's important to note
that you can still use the full polyfill.

The polyfill has the upside that it's _mostly_ compatible with existing
code (there are some cases that aren't wrapped, like `document`). The
downside is that it's slow, possibly unacceptably slow in mobile Safari,
say.

Shady DOM is fast, but brings up the compatibility issue.

But... we've done experiments with making other libraries use Shady DOM and
it looks like it'll work well enough in a lot of situations.

One strategy is custom adapters. Angular2 for instance has a complete DOM
abstraction so that it can use different APIs, like virtual DOM and Dart's
dart:html. It's really trivial to implement a Shady DOM version, and it all
works as expected. I'm guessing that virtual-dom-ish oriented frameworks
like React and Ember will be amenable to this kind of adaptor, though they
may not be as easily hookable as Angular2.

Another strategy is patching just enough of the DOM APIs to make a
framework happy. We think we can do enough for React, since it uses a
pretty small portion of the DOM APIs.



 As an example, if I have content in the drawer part of a
 paper-drawer-panel, and then, using jquery or some other element selector,
 inject nodes inside of the already-projected menu div, will this break
 things? Or is it only the case that I need to use the local DOM api when if
 I'm changing the nodes that would be selected as content to project (and
 not their child nodes)?

 Is there some way to shim the document-level query selectors in there or
 add a mutation observer that calls distributeContent as needed? I'm
 guessing it was this shimming and mutation observer that contributed to the
 slowness of 0.5 in non-chrome browsers.


Exactly, but again the full polyfill is still available.



 I've got next week blocked out to actually work on getting angular 1.4 to
 play nice with polymer 0.9 (we use angular to build the page and manage
 data, and polymer for handy flexbox directives and material design ui
 bindings). So I guess I'll figure it out then.


I'm guessing that Angular1 will be a little harder to get working than
Angular2, but since I know my way around Angular a _little_, I'd be very
happy to help out.

Cheers,
  Justin




 e

 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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/CABsi40JyUq76PSwF%2Bxx_k9CXcJtJmnXEOVXstdQu6BVRoYRc6g%40mail.gmail.com
 https://groups.google.com/d/msgid/polymer-dev/CABsi40JyUq76PSwF%2Bxx_k9CXcJtJmnXEOVXstdQu6BVRoYRc6g%40mail.gmail.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmCE5qMh6anu9RBs3a8vSteYZaWn%3DKxrvvb96yd4CVH7LA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Social Integration

2015-04-01 Thread 'Justin Fagnani' via Polymer
On Tue, Mar 31, 2015 at 11:42 PM, Siddharth Padhi sidd...@gmail.com wrote:

 Are there any plans to include social integration (such as Facebook,
 twitter etc ) into polymer?


No, this wouldn't fit as part of Polymer itself...


 something like :
 a developer types in  facebook-login/facebook-login and he gets a
 Login via facebook button through which the user can login into the
 application.


but people have already made exactly this :)
https://github.com/davidwittenbrink/facebook-login

http://customelements.io/ is a great resource for custom elements - made
with Polymer or not.

Cheers,
  Justin

 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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/194bbb71-08e3-4ef1-9d30-ca804689d834%40googlegroups.com
 https://groups.google.com/d/msgid/polymer-dev/194bbb71-08e3-4ef1-9d30-ca804689d834%40googlegroups.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmBjpKeboOR52EKChwmvS836O0SgKorkX3oaiwR7gXXRNA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: Binding to e.g. input value= in 0.8

2015-03-30 Thread 'Justin Fagnani' via Polymer
Hi Michael,

There's a branch of 0.8 where work is being done to let you specify an
event that will trigger an update of a binding. This will let you make
two-way bindings to native elements, and custom elements that don't follow
Polymer's event firing and naming conventions.

I'm not 100% sure, but I think the syntax right now looks like this:

input value={{data.name::change}}

where the ::change part basically means on 'change' events, read the
'value' property and write it to the binding

Not sure when this will land in 0.8, probably soon. You can file an issue
and we'll notify it when it's in.

Cheers!
  Justin




On Sat, Mar 28, 2015 at 9:35 PM, Aleks Totic ato...@gmail.com wrote:

 firebase port is not straightforward. Firebase-element uses observers to
 detect changes for auto-save, and the observers are not used in 0.8. I
 would not start porting until I fully understand 0.8 data flow.

 As for your question:

 In 0.5, property binding used observers. Which was lovely, the model and
 the editor did not need to know anything about each other, everything just
 worked
 In 0.8, property binding is implemented using custom events to broadcast
 poperty changes. Native tags like input do not broadcast these custom
 events. So, you'd have to do something like this:

 input on-change='handleChange'

 handleChange: function() {
 firebaseElement.setPath('data.name', this.$.input.value);
 }

 Which is a lot more verbose than it used to be. This area is still in a
 lot of flux.

 Aleks


 On Saturday, March 28, 2015 at 2:09:55 PM UTC-7, Michael Bleigh wrote:

 I started trying to port firebase-element to 0.8
 https://github.com/Polymer/firebase-element/pull/46 and got stuck on
 simple two-way binding to input values. Is two-way binding only supported
 via custom elements in 0.8? How would I do the equivalent of this in 0.5:

 firebase-element location=https://example.firebaseio.com/demo; data=
 {{data}}/firebase-element

 input value={{data.name}}

 Or, if that ought to work properly can you take a look at this example
 https://github.com/Polymer/firebase-element/blob/master/demos/firebase.html
 and tell me what's wrong with it?

 Cheers,
 Michael Bleigh

  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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/2c34bd26-f6b0-4fa7-a6d3-219694f4392b%40googlegroups.com
 https://groups.google.com/d/msgid/polymer-dev/2c34bd26-f6b0-4fa7-a6d3-219694f4392b%40googlegroups.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmD0vFM0%2BvQmhgeHYje-iuFOHowO-rZm94sewdJU0uD%2BqA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: Custom Polymer designer: Please help!

2015-02-27 Thread 'Justin Fagnani' via Polymer
Hi,

I'm working on designing a new version of Designer, rebuilt from the ground
up to be more modular (yes - storage plugins :) ), support arbitrary
components, template editing, Polymer 0.8-1.0, and more. We're very open to
code and design contributions, I just have to get things in a state where I
can publish some design docs.

As for changes to the existing version, I support that, but honestly would
rather see effort go towards the new Designer. I'm working fast to get it
out there.

Cheers,
  Justin


On Fri, Feb 27, 2015 at 6:38 AM, Boualem boualemsek...@gmail.com wrote:

 I like your suggestions in your post. (issue 78)

 In fact, we were thinking along the same lines. In our current
 implementation, Polymer designer may save/load design files from a
 web-server or from the local file system. The latter is when designer is
 bundled in a nw.js.

 We were thinking about submitting some of our enhancements to the Polymer
 Designer project.

 I'm not sure how open are the guys in charge, to these type of
 enhancements.





 On Friday, 27 February 2015 08:47:10 UTC-5, Martin Amm wrote:

 It would be nice if the designer gets a plugin architecture where you add
 your own storage providers. I had suggested that already in the past at
 https://github.com/Polymer/designer/issues/78

 Even the current, Gist based storage already allows to load previously
 saved code. There is no UI to select a gist, but when you append a Gist Id
 to the designer url then the saved code will already be loaded.


 On Thursday, February 26, 2015 at 8:37:04 AM UTC-5, bouale...@gmail.com
 wrote:

 Thanks Martin for your feedback.

 So far, the approach we have taken is to minimize the changes to the
 designer so that we are able to apply them when new versions are released.

 While we did create new custom components for our users to consume, for
 Polymer designer we've only modified 3 existing files. All modification are
 tagged for easy extraction and application to new Polymer designer release.

 Martin,

 In your implementation, are you able to load an existing design that was
 previously saved and continue editing it in the designer?





 On Thursday, 26 February 2015 08:24:38 UTC-5, Martin Amm wrote:

 It it possible - we've build our own designer version communicating
 with our backend by replacing the design-preview and designer-element
 components with our own implementations.

  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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/4fcb820f-8446-408e-88f3-8daa6e49aa8f%40googlegroups.com
 https://groups.google.com/d/msgid/polymer-dev/4fcb820f-8446-408e-88f3-8daa6e49aa8f%40googlegroups.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmB6MZBG3e-1EiEWApUBDj95hrUz0rW7au2KSmHem9R0aA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Re: Polymer 0.8 Module Registry

2015-02-22 Thread 'Justin Fagnani' via Polymer
This is a very active topic of discussion and experimentation on the team.
The module registry in 0.8 is basically the minimally viable system given
that html imports already do the dependency loading, de-duping, and
ordering. And it really is minimal at  40 lines of code, since it only
deals with registry and lookup, while other loaders do much more. If it's a
knee-jerk reaction, it's really just to our own need to manage JS
dependencies in a relatively new world of html imports, and a demonstration
of how simple a task that is in the new world.

We have some use cases that are important: library referencing internal to
Polymer, using JS libs in Polymer elements, and using Polymer elements in
other JS libraries and frameworks. Our ideal would be ES6 module loading
that works well with html imports, and the whole world switching to that,
but something has to work in the meantime. We're going to look into whether
or not the module registry as is should stick around, change, be internal
only, be replaced, and how we could either make other loaders, or at least
the API of other loaders, play nice with html imports.

Stay tuned.

-Justin

On Sun, Feb 22, 2015 at 3:10 PM, Michael Bleigh mble...@gmail.com wrote:

 I think module loading is maybe the biggest unsolved question wrt Web
 Components (and maybe the web in in general). With Mozilla backing away
 from HTML imports, it seems less certain that they will become part of a
 final, widely-adopted spec. There's also the duplicate import issue that
 makes it more or less impossible to work with Web Components without using
 a flat-hierarchy-package-manager like Bower.

 I don't have the answers to these questions, but they do need to be
 answered. I think it's both necessary and important to have a mechanism for
 modularizing HTML and CSS in addition to JavaScript, but at the same time
 especially in Polymer 0.8 where component definitions seem much more
 JS-centric an HTML file with a script tag and nothing else doesn't quite
 seem right either.

 Web Components are paving the way for the elimination of framework silos
 like jQuery plugins, etc. in terms of their it's just DOM interaction
 model, but I think there's still significant work to be done on the
 resource loading side. What we really need are lower-level primitives that
 can be hooked into. We need some kind of standard primitive upon which ES6
 modules, HTML Imports, and RequireJS could all be built. Without that,
 we're just going to see further fragmentation and the continued reliance on
 build steps.

 Again, reliance on a build step isn't that big of a deal for people
 building larger-scale apps (where a build step is expected and/or
 necessary), but what about when Web Components want to start going down
 market? When we want it so that anyone with a blog is just a link
 rel=import to a CDN URL away from doing big complex things?

 Hard questions to answer, but good discussion to have.


 On Sunday, February 22, 2015 at 12:24:12 PM UTC-8, Erik Ringsmuth wrote:

 Polymer 0.5 is good because it isn't a framework. It has a limited scope
 of adding template binding and event mapping to custom elements and the
 template tag. The addition of a module registry is crossing the line from
 library to framework.
 https://github.com/Polymer/polymer/blob/0.8-preview/
 PRIMER.md#module-registry

 This feels like a knee jerk reaction to the people asking for the ability
 to load JS. It looks like a combination of RequireJS and Angular 1.0 DI
 which is just a glorified namespace system.

 The module registry looks like a very small subset of RequireJS that only
 implements named modules http://requirejs.org/docs/api.html#modulename
 and requires loading them beforehand either with HTML imports with inline
 script tags, or loading a JS file that calls modulate(). Named modules are
 one of the dangerous/sketchy features of RequireJS and was implemented so
 the r.js optimization tool could bundle modules into a single file.

 When Angular 1.0 was released, there was only RequireJS. Now we are in
 the era of SystemJS, RequireJS, and soon ES6 modules. There is a huge
 amount of utility in offering a module system, but why create yet another
 one? I see this leading to a future where everyone is writing Polymer
 modules rather than ES6 modules. It's tightly coupling the module system to
 the framework just like Angular 1.0.

 I know I don't really have any say in the matter, but I would leave out
 the module registry altogether or have it be a separate library and give
 people the option between that, and some of the other options like these.

 System.import
 https://github.com/ModuleLoader/es6-module-loader#getting-started

 module tag
 https://github.com/ModuleLoader/es6-module-loader#module-tag

 SystemJS
 https://github.com/systemjs/systemjs

 RequireJS
 http://requirejs.org/

 Browserify, Webpack, etc.

 Everything else about Polymer is awesome, but I'm struggling with my
 feelings about 0.8 solely due to the 

Re: [polymer-dev] Attribute Web Components

2014-06-18 Thread 'Justin Fagnani' via Polymer
Hi Clayton, I did something like this for Dart called behaviors (it's
hosted at https://github.com/justinfagnani/behaviors.dart )

Unless I'm missing something your example doesn't use mutation observers so
it won't be able to attach mixins to newly created elements. Is there some
other mechanism for handling that?

Cheers,
  Justin



On Wed, Jun 18, 2014 at 3:20 PM, cletusw clet...@gmail.com wrote:

 First stab at Angular attribute directive-style native web components
 (mixins? decorators?). I'm sure there are tons of problems. Any comments
 would be great!

 I wasn't able to get it to work under the platform polyfills after a
 grueling 2 minutes of trying, so you'll have to use Chrome Canary.

 http://plnkr.co/edit/wm8Pzl8QtXv2bNbbwuHe?p=preview

 Clayton

 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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/18023b18-b667-4551-9314-d77753ba51b2%40googlegroups.com
 https://groups.google.com/d/msgid/polymer-dev/18023b18-b667-4551-9314-d77753ba51b2%40googlegroups.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmBFFXo1wQB2WuAPEGzbTNwMiy4t%3DQVdYvwkH5QuBzuxVw%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Binding initialization when model is null

2014-06-03 Thread 'Justin Fagnani' via Polymer
On Mon, Jun 2, 2014 at 11:13 AM, Scott Miles sjmi...@google.com wrote:

 When two properties are bound together we must merge two sources-of-truth
 into one, which entails inherent conflicts. The rule has always been that
 if one of the two properties is _valued_ (not null or undefined), then it
 becomes the new shared value, regardless of direction.


I understand why undefined is considered not valued in JavaScript, but how
come null is not? Null seems to be a completely valid value. I know that
bindings are two-way by default, but they aren't really symmetric and I
expect the data flow to be biased to go from model to element, so in this
case I would expect the element property to be initialized to null.

Another issue is that not all expressions are assignable, and this behavior
results in initialization trying to assign to non-assignable expressions
and limits our ability to warn users.

Consider a binding like x-foo a={{ x + 1 }}. If x is null, the
expression is null, and initialization will try and fail to make the
assignment x + 1 = a. We like to warn when assigning to a non-assignable
expression, because if you write input value={{ x + 1 }} this is likely
a mistake. But since any binding may now attempt to assign to an expression
that warning becomes console spam. Now I think we are forced to remove that
warning.



 Recently we decided to also prevent transitions between undefined and null
 from being reported as `*Changed`. It's true this is a lossy change, but it
 prevents a lot of unwanted side-effects at construction time where various
 properties tend to be in either state, but are almost always indicative of
 an _uninitialized_ state.



 On Mon, Jun 2, 2014 at 10:32 AM, 'Justin Fagnani' via Polymer 
 polymer-dev@googlegroups.com wrote:

 I came across the following code in Polymer the other day:

   // capture A's value if B's value is null or undefined,
   // otherwise use B's value
   function resolveBindingValue(oldValue, value) {
 if (value === undefined  oldValue === null) {
   return value;
 }
 return (value === null || value === undefined) ? oldValue : value;
   }


 https://github.com/Polymer/polymer-dev/blob/master/src/instance/properties.js#L167

 The last line is what interests me. From where this is called in
 bindProperty(), it means that if a model property being bound to is null,
 it's set to the element property. Otherwise the flow is from model to
 element by default, if the binding is not two way.

 What's the reasoning behind this special initialization path? The
 behavior is a bit surprising to me. When my model's property that I'm
 binding to is null, I don't expect any special initialization behavior.
 Especially since null might be a valid value for the model property. This
 also makes all bindings potentially two way, even when you think you know
 that the element property you're binding to doesn't ever update.

 Thanks,
   Justin

  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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/CAEKsHmD-%2BMHFL3J%2BbRJEcG3WG3eZz90TPbaqj1rRPkX94CD7%2BQ%40mail.gmail.com
 https://groups.google.com/d/msgid/polymer-dev/CAEKsHmD-%2BMHFL3J%2BbRJEcG3WG3eZz90TPbaqj1rRPkX94CD7%2BQ%40mail.gmail.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmAWepsYkCE69-CAB2qokF1JRji8Nq%3DQkDg%3D8bvuCkwULQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


[polymer-dev] Re: Binding UI Events

2014-05-08 Thread 'Justin Fagnani' via Polymer
Did anything ever happen here?

I'm trying to work up an example of a list with selection, and it'd be most
natural if I could either use a function expression as the binding, similar
to what Rafael was talking about in 2).

My template is something like:

template repeat={{ item in items }}
  div class=item on-click={{ selectItem }}{{ item }}/div
/template

The pain is in trying to figure which data object is being referenced,
since selectItem receives DOM objects, not my model objects. Looking at
core-list, I see I can get the model from the templateInstance, but that's
not so obvious. What I really want to do is:

  div class=item on-click={{ selectItem(item) }}{{ item }}/div

or even:

  div class=item on-click={{ item.select() }}{{ item }}/div


Cheers,
  Justin



On Fri, Oct 18, 2013 at 4:24 PM, Scott Miles sjmi...@google.com wrote:

 Ok, I think I see what you mean: you would like to be able to delegate to
 a method on the sub-object in the iteration.

 I think we may be able to have our cake and eat it too here. Give us a few
 days to work on it.

 Scott




 On Fri, Oct 18, 2013 at 3:48 PM, Scott Miles sjmi...@google.com wrote:

 On Fri, Oct 18, 2013 at 3:35 PM, Pete Blois bl...@google.com wrote:

 Sorry, the view-model duality of the host always trips me up. Is there a
 better term than model for what the contents of a template repeat is
 bound to?


 No, IMO that's definitely a model in the standard sense.

 For the host node itself, I believe a close pattern is
 Model-View-Presenter. Most properly then the host contains the
 presenter-model, but we usually cheat and call it a view-model, or simply
 model.

 The presenter-model is used to drive the UI and can be completely
 distinct from your business-model (or overlapping or the same). And yes,
 the `element` is it's own model, presenter, and view. This is the
 packaging-by-functionality aspect of Polymer.



 With a deeply nested/bound UI such as:
 template bind='{{somePath}}'
   ...
   template repeat='{{deeperStill}}'
 ...
 div on-click='{{goOffline}}'/div

 The relation between the div and what the div is bound to is tight,
 but their relation to the host is somewhat loose, so it seems like the
 polymer-element code often just turns into some boilerplate 'fetch the
 model and call a method on it' which may as well be a static method.


 Inside a template repeat you are potentially dealing with a sub-model,
 depending on syntax, but it's by design that elements declared in a
 polymer-element are under the purview of the host node.

 We probably need to see a problem case with more context.

 Scott



 P.S. I still have difficulty reasoning about model-view separation when
 the model is a view.

 On Friday, October 18, 2013 3:01:08 PM UTC-7, Scott Miles wrote:

  I'd still like to see binding to methods on the model, but
 understand moving with caution.

 By design, when looking at a polymer-element, the host `element` is the
 model and the methods are are on the `element`, so the `on-` syntax is
 already binding to methods on the model.

 I think I'm misunderstanding your point here.


 On Fri, Oct 18, 2013 at 2:43 PM, Pete Blois bl...@google.com wrote:

 Great to hear!
 I'd still like to see binding to methods on the model, but understand
 moving with caution.


 On Friday, October 18, 2013 1:32:15 PM UTC-7, Steve Orvell wrote:

 Yeah, we're exploring doing all of polymer's event handlers via
 binding for the reasons noted.

 My first stab is similar to the gist in that it overrides
 Element.prototype.bind. I'm planning to move to the approach recommended 
 by
 @jmesserly above, using expressions.

 We cannot do Rafael's #1 because we want to handle:

 div on-click={{clickHandler}}

 and this is not a custom element.


 On Fri, Oct 18, 2013 at 1:19 PM, Rafael Weinstein 
 raf...@google.comwrote:

 I believe Steve is already working on this. I imagine he will chime
 in soon. We discussed it yesterday.

 There are two (progressively fancier) versions of this:

 1) div on-click={{ handleClick }

 This would provide the benefits already mentioned. The
 implementation is likely inside the polymer base class whose bind() 
 method
 will treat any on-* binding as a request to add an event listener to the
 provided function.

 2) div on-click={{ addItem(currentItem) }}, e.g. allow the
 function be an expression

 This would additionally require polymer-expressions to treat
 expressions inside on-* bindings specially. Notably, it will not 
 register
 observers on anything in the expression, but will return an object whose
 value property is a wrapper function which closes over the model and
 evaluates the expression when it is invoked.

 I'm not a security expert, but I think we need to take care in
 designing both of these to avoid risk of creating XSS attack surface. 
 One
 approach may be to only white list model functions are methods of 
 polymer
 elements.



 On Fri, Oct 18, 2013 at 1:05 PM, John Messerly 
 jmes...@google.comwrote:

Re: [polymer-dev] Re: is there a way to disable shadow DOM?

2014-05-01 Thread 'Justin Fagnani' via Polymer
I think Diego is talking about about making elements that don't use shadow
DOM, presumably because something like (just making this up) $('p').hide()
won't effect nodes inside shadow trees.

Diego,

  If you think through it, non-shadow DOM elements don't work out so well.
The first issue is the conflict between the element's children and it's
template if the template is stamped out into the light DOM. For example,
lets say you have my-element with a template with nodes that would
normally go in the shadow root:

polymer-element name=my-element
  template
h1My Element/h1
content/content
  /template
/polymer-element

And now let's say you use my-element with a child:

my-element
  pHello Polymer/p
/my-element

var e = document.querySelector('my-element');

How many children does the element have: 1 or 2? What is e.children[0]? Is
it h1MyElement/h1 or pHello Polymer/p?

You might want to post more details about what you're trying to accomplish,
and quite possibly it can with with shadow DOM.

One thing I tell people is to focus on the fact that you're implementing an
element, not a page. You can use many libraries just fine to help implement
an element, and you can use them to help you use elements. What's
difficult, by design, is to use them to cross the using / implementing (or
outside / inside) element boundary. If there's a node inside your element's
shadow root, that's an implementation detail and you don't want scripts
outside the element to mess with it.

Often the simplest solution is to just use the library, but make the
context of what your doing be the shadow root, or some nodes within it.
Using jQuery as an example again, instead of $('p').hide(), you can write
$('p', this.shadowRoot).hide().

Hope that helps,
  Justin


On Thu, May 1, 2014 at 8:42 AM, 'Erik Arvidsson' via Polymer 
polymer-dev@googlegroups.com wrote:

 Could you file bugs for the issues you are running into with the Shadow
 DOM polyfill? (Native Shadow DOM is shipping and cannot be turned off).


 On Wed, Apr 30, 2014 at 9:03 PM, ruah...@gmail.com wrote:

 sometime a third party library need access to the sub DOM from outside
 the custom element.


 On Wednesday, April 30, 2014 7:55:09 PM UTC-5, rua...@gmail.com wrote:

 I'm just interested in the custom elements part.  Shadow DOM inter fears
 with some third party libraries I want to use.  is there a way to disable
 this?

  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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/1b075422-0b93-4a12-a4ab-88f2fbc0689e%40googlegroups.comhttps://groups.google.com/d/msgid/polymer-dev/1b075422-0b93-4a12-a4ab-88f2fbc0689e%40googlegroups.com?utm_medium=emailutm_source=footer
 .

 For more options, visit https://groups.google.com/d/optout.




 --
 erik


  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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/CAJ8%2BGogS3oy4V673iivr3HpgGaFprVHBhEibAbpEEtAym2g0rw%40mail.gmail.comhttps://groups.google.com/d/msgid/polymer-dev/CAJ8%2BGogS3oy4V673iivr3HpgGaFprVHBhEibAbpEEtAym2g0rw%40mail.gmail.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmBCMxiZuHvLV6aS-%3DqUGxSRcWxuZ5PMNy4F5k0nDaz05A%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] equivalent to angularjs attribute directive?

2014-04-30 Thread 'Justin Fagnani' via Polymer
Hi James,

I built something similar to Angular directives for Dart called behaviors.
It's based on mutation observers and Element.matches and you could pretty
easily port it to JavaScript.

The repo is here https://github.com/justinfagnani/behaviors.dart

An announcement with some details is here:
https://plus.google.com/108970026289541541510/posts/EjdR14bA7Dj

Cheers,
  Justin
On Apr 30, 2014 4:12 PM, James Campos james.r.cam...@gmail.com wrote:

 is there a polymer equivalent to angularjs attribute directives? i want to
 define an 'autosave' attribute, which i can add to arbitrary elements, and
 will automatically save their contents to local storage. is there a way to
 do this with polymer?

 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 polymer-dev+unsubscr...@googlegroups.com.
 To view this discussion on the web visit
 https://groups.google.com/d/msgid/polymer-dev/f3b35c62-e908-4128-9daa-77ab08bf12c5%40googlegroups.comhttps://groups.google.com/d/msgid/polymer-dev/f3b35c62-e908-4128-9daa-77ab08bf12c5%40googlegroups.com?utm_medium=emailutm_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 polymer-dev+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAEKsHmBH_g9DeNRY2p7xQ-zwir%3D93uw1H6%2BRegt9W_0uLF%2BFAg%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.