Re: [polymer-dev] Loaded Polymer Element with Fetch has no custom methods after inserting to DOM

2016-07-14 Thread Ádám Liszkai
I have opened about this problem a stackoverflow question before I found 
this group 
(http://stackoverflow.com/questions/38376583/ajax-load-polymer-element-and-run-its-methods)
Have you a stackoverflow user what can I mention or if you have, can you 
post an answer to it? :) and sorry for posting the problem here, I try to 
learn and use Polymer but I usally run into a problem what looks weird for 
me.

2016. július 14., csütörtök 20:24:18 UTC+2 időpontban Karl Tiedt a 
következőt írta:
>
> Awesome, glad that helped!
>
> -Karl Tiedt
>

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/ae771e8f-c865-40c5-b7aa-25338d7c5758%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Loaded Polymer Element with Fetch has no custom methods after inserting to DOM

2016-07-14 Thread Karl Tiedt
Awesome, glad that helped!

-Karl Tiedt

On Thu, Jul 14, 2016 at 11:12 AM, Ádám Liszkai  wrote:

> Now it's working! Thank you for your help!
>
> The modified code:
>
> getTemplate( templateName )
> {
> let templateFile = this.baseURL+'templates/'+templateName+'.html';
>
> return new Promise(function(resolve, reject)
> {
> let templateRequest = Polymer.Base.importHref(templateFile,
> function()
> {
>
> Polymer.dom(document.getElementById('templates')).appendChild(templateRequest.import.body);
> resolve(templateRequest);
> },
> function(error)
> {
> reject(error);
> });
> });
> };
>
> 2016. július 14., csütörtök 19:58:16 UTC+2 időpontban Karl Tiedt a
> következőt írta:
>>
>> Sorry I wasn't very clear there, you can use either Polymer.Base.importHref
>> or from an Polymer component, this.importHref I believe.
>>
>> -Karl Tiedt
>>
>> On Thu, Jul 14, 2016 at 10:52 AM, Ádám Liszkai  wrote:
>>
>>> The importHref is not only available in the custom tag? Because in the
>>> program main scope the Polymer.importHref is undefined. I think you are
>>> correct about the parsing, but the strange is that the console global scope
>>> has the methods and the subscope has not. If I create the element and
>>> append to the DOM Im also able to use it's methods but I dont want to
>>> create every template a new element.
>>>
>>> 2016. július 14., csütörtök 19:25:14 UTC+2 időpontban Karl Tiedt a
>>> következőt írta:

 I would suggest using Polymer's importHref method... since it handles
 things similarly to the link rel="import" ... I suspect you're not actually
 getting things parsed how you think you are with this method.

 -Karl Tiedt

>>> 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/ce3caa10-50bb-4066-aeb3-bd1983abda26%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/67ff7dff-4916-4934-a098-66cdbfbd8756%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/CADNgbTH9rqe%3D0aJwNEN8kbVot6ymOPvUC4R6UOEdD3UvKYH04w%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Loaded Polymer Element with Fetch has no custom methods after inserting to DOM

2016-07-14 Thread Ádám Liszkai
Now it's working! Thank you for your help!

The modified code:

getTemplate( templateName )
{
let templateFile = this.baseURL+'templates/'+templateName+'.html';

return new Promise(function(resolve, reject)
{
let templateRequest = Polymer.Base.importHref(templateFile,
function()
{

Polymer.dom(document.getElementById('templates')).appendChild(templateRequest.import.body);
resolve(templateRequest);
},
function(error)
{
reject(error);
});
});
};

2016. július 14., csütörtök 19:58:16 UTC+2 időpontban Karl Tiedt a 
következőt írta:
>
> Sorry I wasn't very clear there, you can use either Polymer.Base.importHref 
> or from an Polymer component, this.importHref I believe.
>
> -Karl Tiedt
>
> On Thu, Jul 14, 2016 at 10:52 AM, Ádám Liszkai  > wrote:
>
>> The importHref is not only available in the custom tag? Because in the 
>> program main scope the Polymer.importHref is undefined. I think you are 
>> correct about the parsing, but the strange is that the console global scope 
>> has the methods and the subscope has not. If I create the element and 
>> append to the DOM Im also able to use it's methods but I dont want to 
>> create every template a new element. 
>>
>> 2016. július 14., csütörtök 19:25:14 UTC+2 időpontban Karl Tiedt a 
>> következőt írta:
>>>
>>> I would suggest using Polymer's importHref method... since it handles 
>>> things similarly to the link rel="import" ... I suspect you're not actually 
>>> getting things parsed how you think you are with this method.
>>>
>>> -Karl Tiedt
>>>
>> 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/ce3caa10-50bb-4066-aeb3-bd1983abda26%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/67ff7dff-4916-4934-a098-66cdbfbd8756%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Loaded Polymer Element with Fetch has no custom methods after inserting to DOM

2016-07-14 Thread Karl Tiedt
Sorry I wasn't very clear there, you can use either Polymer.Base.importHref
or from an Polymer component, this.importHref I believe.

-Karl Tiedt

On Thu, Jul 14, 2016 at 10:52 AM, Ádám Liszkai  wrote:

> The importHref is not only available in the custom tag? Because in the
> program main scope the Polymer.importHref is undefined. I think you are
> correct about the parsing, but the strange is that the console global scope
> has the methods and the subscope has not. If I create the element and
> append to the DOM Im also able to use it's methods but I dont want to
> create every template a new element.
>
> 2016. július 14., csütörtök 19:25:14 UTC+2 időpontban Karl Tiedt a
> következőt írta:
>>
>> I would suggest using Polymer's importHref method... since it handles
>> things similarly to the link rel="import" ... I suspect you're not actually
>> getting things parsed how you think you are with this method.
>>
>> -Karl Tiedt
>>
> 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/ce3caa10-50bb-4066-aeb3-bd1983abda26%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/CADNgbTGAVbBoF3DbHkvU7wGfmqyz-JchtcpnCDSus%2BeOcSdMPA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Loaded Polymer Element with Fetch has no custom methods after inserting to DOM

2016-07-14 Thread Ádám Liszkai
The importHref is not only available in the custom tag? Because in the 
program main scope the Polymer.importHref is undefined. I think you are 
correct about the parsing, but the strange is that the console global scope 
has the methods and the subscope has not. If I create the element and 
append to the DOM Im also able to use it's methods but I dont want to 
create every template a new element. 

2016. július 14., csütörtök 19:25:14 UTC+2 időpontban Karl Tiedt a 
következőt írta:
>
> I would suggest using Polymer's importHref method... since it handles 
> things similarly to the link rel="import" ... I suspect you're not actually 
> getting things parsed how you think you are with this method.
>
> -Karl Tiedt
>

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/ce3caa10-50bb-4066-aeb3-bd1983abda26%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Loaded Polymer Element with Fetch has no custom methods after inserting to DOM

2016-07-14 Thread Karl Tiedt
I would suggest using Polymer's importHref method... since it handles
things similarly to the link rel="import" ... I suspect you're not actually
getting things parsed how you think you are with this method.

-Karl Tiedt

On Thu, Jul 14, 2016 at 8:51 AM, Ádám Liszkai  wrote:

> Here is my situation: I have an app shell and have controller classes to
> load templates which have custom polymer elements in it. So far I load the
> template and add to the DOM and everything is work fine for first sight.
> After the template contents are added to the DOM I try to access to the
> custom-element methods but I could not access to it. If I try to debug the
> code and run the important steps in console then I can acces to the element
> methods.
>
> *My Element:*
>
> 
> 
> 
> 
>:host { display: block; }
>:host.hide { display: none; }
> 
>  samle content 
> 
> 
> Polymer({
> is: 'app-login',
> run: function() {
> return new Promise(function(resolve, reject) {
> resolve({'id':0,'name':'user'});
> });
> }
> });
> 
> 
>
> *My Program:*
>
> // [...]
>
> // this works fine, I just add for better understanding
> getTemplate( templateName ) {
> return new Promise(function(resolve, reject)
> {
> fetch( 'templates/'+templateName+'.html' ).then(response => {
> document.getElementById('templates').innerHTML += response
> .text();
> resolve(response);
> }).catch(error => { reject(error); });
> });
> };
> // [...]
> // this method called by the main program and cant't access to the
> element methods
> doLogin() {
> this.getTemplate('login').then(templateResponse => {
> let Login = document.querySelector('app-login'); //
> ...
> Login.run(); // TypeError: Login.run is not a function
> });
> };
> // [...]
>
> *templates/login.html:*
>
> 
> 
>
> *Console debugging:*
>
> let Login = document.querySelector('app-login');
> //Return: ...
> Login.run();
> //Return: Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]:
> undefined}
>
> I tried search for this but I could not find any relevant answer yet,
> somebody solved this issue in some way before? Did I make something just
> bad?
>
> *Already tried:*
>  - setTimeout (300ms) after adding element to the DOM » same result
>  - adding _ to the method name (like paper elements methods) » same result
>  - waiting for WebComponentsReady event after inserting the element into
> the DOM » event not fired, the program stopped
>
> 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/aedc791c-3e32-425e-b9ff-4cd6e71aac81%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/CADNgbTGjXJs4xX5pTTwwhmDrAvWv2u4w2nJtMyg3b%3D8Zmww%2B6A%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


[polymer-dev] Loaded Polymer Element with Fetch has no custom methods after inserting to DOM

2016-07-14 Thread Ádám Liszkai
Here is my situation: I have an app shell and have controller classes to 
load templates which have custom polymer elements in it. So far I load the 
template and add to the DOM and everything is work fine for first sight.
After the template contents are added to the DOM I try to access to the 
custom-element methods but I could not access to it. If I try to debug the 
code and run the important steps in console then I can acces to the element 
methods.

*My Element:*





   :host { display: block; }
   :host.hide { display: none; }

 samle content 


Polymer({
is: 'app-login',
run: function() {
return new Promise(function(resolve, reject) {
resolve({'id':0,'name':'user'});
});
}
});



*My Program:*

// [...]

// this works fine, I just add for better understanding
getTemplate( templateName ) {
return new Promise(function(resolve, reject)
{
fetch( 'templates/'+templateName+'.html' ).then(response => {
document.getElementById('templates').innerHTML += response.
text();
resolve(response);
}).catch(error => { reject(error); });
});
};
// [...]
// this method called by the main program and cant't access to the 
element methods
doLogin() {
this.getTemplate('login').then(templateResponse => {
let Login = document.querySelector('app-login'); // 
...
Login.run(); // TypeError: Login.run is not a function
});
};
// [...]

*templates/login.html:*




*Console debugging:*

let Login = document.querySelector('app-login');
//Return: ...
Login.run();
//Return: Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]: 
undefined}

I tried search for this but I could not find any relevant answer yet, 
somebody solved this issue in some way before? Did I make something just 
bad?

*Already tried:*
 - setTimeout (300ms) after adding element to the DOM » same result
 - adding _ to the method name (like paper elements methods) » same result
 - waiting for WebComponentsReady event after inserting the element into 
the DOM » event not fired, the program stopped

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/aedc791c-3e32-425e-b9ff-4cd6e71aac81%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.