Re: Ajax Loading Indicator (google style)

2007-02-15 Thread andyhot 

Well, that's a fresh one...
https://svn.apache.org/repos/asf/tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/fx.js

See the tapestry.fx.attachAjaxStatus function and its docs, I think 
you'll like it.


scv wrote:

Hi Daniel,

I was searching for a solution for this problem too. Now I have found a
solution.
Just put this code in you HTMLtemplate.

---
loading...


  dojo.require("dojo.lfx");
  dojo.addOnLoad(function(e) {
dojo.event.connect(tapestry, "loadContent", function(){ document.body.style.cursor="default"; dojo.lfx.html.fadeOut("loading", 300).play(); }); 
   dojo.event.connect(tapestry, "linkOnClick", function(){
document.body.style.cursor="wait";
dojo.lfx.html.fadeIn("loading", 300).play(); }); 
   });

---

Best regards,
Christian Grail


Daniel Anguita O. wrote:
  

Hello all.

I'm using Tapestry 4.1.1 and i'm learning to use ajax with it.
Now i'm trying to make a loading indicator for ajax request when are 
loading, like google. So i make a simple div like this:


Loading...

and i want to make it visible when i run an EventListener and when it's 
finish, make it invisible. In other frameworks making this was very 
easy, but i dont know how to make it with Dojo, using something like
 
Dojo.byId("loader").Show <- when i get "onloading" ajax thing.

Dojo.byId("loader").Hide <- and whern i get "oncomplete" ajax thing.

Anyone knows any way to do this? Theres is something like 
updateComponent to make it visible and invisible?


Cheers

-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]






  



-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]

Re: [WARNING] Ajax Loading Indicator (google style)

2007-02-15 Thread scv 

Hi Daniel,

I was searching for a solution for this problem too. Now I have found a
solution.
Just put this code in you HTMLtemplate.

---
loading...


  dojo.require("dojo.lfx");
  dojo.addOnLoad(function(e) {
   dojo.event.connect(tapestry, "loadContent", function(){ 
document.body.style.cursor="default";
dojo.lfx.html.fadeOut("loading", 300).play(); 
   });
   dojo.event.connect(tapestry, "linkOnClick", function(){
document.body.style.cursor="wait";
dojo.lfx.html.fadeIn("loading", 300).play(); 
   });
   });

---

Best regards,
Christian Grail


Daniel Anguita O. wrote:
> 
> Hello all.
> 
> I'm using Tapestry 4.1.1 and i'm learning to use ajax with it.
> Now i'm trying to make a loading indicator for ajax request when are 
> loading, like google. So i make a simple div like this:
> 
> Loading...
> 
> and i want to make it visible when i run an EventListener and when it's 
> finish, make it invisible. In other frameworks making this was very 
> easy, but i dont know how to make it with Dojo, using something like
>  
> Dojo.byId("loader").Show <- when i get "onloading" ajax thing.
> Dojo.byId("loader").Hide <- and whern i get "oncomplete" ajax thing.
> 
> Anyone knows any way to do this? Theres is something like 
> updateComponent to make it visible and invisible?
> 
> Cheers
> 
> -
> To unsubscribe, e-mail: [EMAIL PROTECTED]
> For additional commands, e-mail: [EMAIL PROTECTED]
> 
> 
> 

-- 
View this message in context: 
http://www.nabble.com/Ajax-Loading-Indicator-%28google-style%29-tf3020804.html#a8985370
Sent from the Tapestry - User mailing list archive at Nabble.com.


-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]

Re: Ajax Loading Indicator (google style)

2007-01-19 Thread Markus Joschko 

Can't help with the previous issue but have someone tried this for a form?

This would mean to connect against the tapestry.form.submitAsync method
I can't get it to work because when addOnLoad fires the corresponding
tapestry js file is not yet fetched so the method does not exist.
I can't see another interception point but really want inform the user
that his form is currently submitted.

regards,
Markus

On 1/16/07, Daniel Anguita O. <[EMAIL PROTECTED]> wrote:

Thanks mkreis.

I was trying to work this out like you told me, but i can't get the
hide/show effect when is loading..
I've been many hours searching on the web for an explination but i still
can't get it. So i dicede to show you the html rendered, maybe you can
find easely what's my problem.
html rendered:






Remote Control
djConfig = 
{"isDebug":true,"debugContainerId":"debug","baseRelativePath":"/RemoteControl/app?service=asset&path=%2Fdojo%2F","preventBackButtonFix":false,"parseWidgets":false,"locale":"es-ar"}
 

 


dojo.registerModulePath("tapestry", 
"/RemoteControl/app?service=asset&path=%2Ftapestry%2F");



dojo.require("dojo.logging.Logger");
dojo.log.setLevel(dojo.log.getLevel("WARNING"));
dojo.require("tapestry.namespace");




Remote Control


dojo.require("dojo.lfx.html.*");
dojo.event.connect("around", tapestry, "loadContent", this, 
"postLoading");
dojo.event.connect("around", tapestry, "linkOnClick", this, 
"preLoading");
function preLoading(miObj){
//
// Get the id of updated component
var id = miObj.args[1];
//
// Here your code
dojo.lfx.html.fadeShow(dojo.byId('loader'), 500).play();

return miObj.proceed();
}

function postLoading(miObj){
//
// Get the id of updated component
var id = miObj.args[0];
//
// Here your code
dojo.lfx.html.fadeHide(dojo.byId('loader'), 500).play();

return miObj.proceed();
}






<!--
dojo.require("tapestry.event");
// -->
Loading...


...etc...

and when i make a componentUpdate with an EventListener nothing happens.. no 
loading indicator appears.. and the ldx fade effect works fine in onload...
i think the functions are'nt called... or maybe i'm just doing the hole thing 
wrong!?

please help!

Cheers



[EMAIL PROTECTED] escribió:
> I think I forgot to mention that fx.js was my inspiration ;)
>
> @ShowOnAjax should also have a parameter with a list of components. 
@ShowOnAjax then only reacts on Ajax-Events within those components. @ShowOnAjax 
could also have two subcomponents like a4j:status.
>
> ciao.michael.
>
>
>> -Ursprüngliche Nachricht-
>> Von: "Tapestry users" 
>> Gesendet: 16.01.07 15:27:12
>> An: Tapestry users 
>> Betreff: Re: Ajax Loading Indicator (google style)
>>
>
>
>
>> Yep, that's a nice way of doing this...
>>
>> It's also how effects are currently implemented
>> 
http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/fx.js?view=markup
>>
>> Anyway, Daniel, it wouldn't hurt adding a JIRA request for this feature
>> - i know i'll need something like this
>> in the very near future.
>>
>> I also think i like the Microsoft way of doing this, i.e. with a component
>>  ... 
>> instead of the tacos way, i.e. with the statusElement parameter for
>> every link of form
>> component ( http://tacos.sourceforge.net/components/AjaxDirectLink.html )
>>
>>
>> [EMAIL PROTECTED] wrote:
>>
>>> Hi Daniel,
>>>
>>> in the onLoad of Dojo you have to registered two functions
>>>
>>> dojo.event.connect("around", tapestry, "loadContent", this, "postLoading");
>>> dojo.event.connect("around", tapestry, "linkOnClick", this, "preLoading");
>>>
>>> These functions surround the tapestry functions responsible for updating 
content.
>>>
>>> function preLoading(miObj)
>>> {
>>> //
>>> // Get the id of updated component
>>> var id = miObj.args[1];
>>> //
>>> // Here

Re: Ajax Loading Indicator (google style)

2007-01-16 Thread Daniel Anguita O. 

Thanks mkreis.

I was trying to work this out like you told me, but i can't get the 
hide/show effect when is loading..
I've been many hours searching on the web for an explination but i still 
can't get it. So i dicede to show you the html rendered, maybe you can 
find easely what's my problem.

html rendered:






Remote Control
djConfig = 
{"isDebug":true,"debugContainerId":"debug","baseRelativePath":"/RemoteControl/app?service=asset&path=%2Fdojo%2F","preventBackButtonFix":false,"parseWidgets":false,"locale":"es-ar"}
 




dojo.registerModulePath("tapestry", 
"/RemoteControl/app?service=asset&path=%2Ftapestry%2F");



dojo.require("dojo.logging.Logger");
dojo.log.setLevel(dojo.log.getLevel("WARNING"));
dojo.require("tapestry.namespace");




Remote Control


dojo.require("dojo.lfx.html.*");
</pre><tt>		dojo.event.connect("around", tapestry, "loadContent", this, "postLoading");  
</tt><tt>		dojo.event.connect("around", tapestry, "linkOnClick", this, "preLoading");
</tt><pre style="margin: 0em;">
function preLoading(miObj){
//
// Get the id of updated component
</pre><tt>			var id = miObj.args[1];  
</tt><tt>			//
</tt><pre style="margin: 0em;">
// Here your code
dojo.lfx.html.fadeShow(dojo.byId('loader'), 500).play();

</pre><tt>			return miObj.proceed(); 
</tt><tt>		}
</tt><pre style="margin: 0em;">

</pre><tt>		function postLoading(miObj){ 
</tt><tt>			//
</tt><pre style="margin: 0em;">
// Get the id of updated component
var id = miObj.args[0];
//
// Here your code
dojo.lfx.html.fadeHide(dojo.byId('loader'), 500).play();

</pre><tt>			return miObj.proceed(); 
</tt><tt>		}
</tt><pre style="margin: 0em;">


 




<!--
dojo.require("tapestry.event");
// -->
Loading...


...etc...

and when i make a componentUpdate with an EventListener nothing happens.. no 
loading indicator appears.. and the ldx fade effect works fine in onload...
i think the functions are'nt called... or maybe i'm just doing the hole thing 
wrong!?

please help! 


Cheers



[EMAIL PROTECTED] escribió:

I think I forgot to mention that fx.js was my inspiration ;)

@ShowOnAjax should also have a parameter with a list of components. @ShowOnAjax 
then only reacts on Ajax-Events within those components. @ShowOnAjax could also 
have two subcomponents like a4j:status.

ciao.michael.

  

-Ursprüngliche Nachricht-
Von: "Tapestry users" 
Gesendet: 16.01.07 15:27:12
An: Tapestry users 
Betreff: Re: Ajax Loading Indicator (google style)




  

Yep, that's a nice way of doing this...

It's also how effects are currently implemented
http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/fx.js?view=markup

Anyway, Daniel, it wouldn't hurt adding a JIRA request for this feature 
- i know i'll need something like this

in the very near future.

I also think i like the Microsoft way of doing this, i.e. with a component
 ... 
instead of the tacos way, i.e. with the statusElement parameter for 
every link of form

component ( http://tacos.sourceforge.net/components/AjaxDirectLink.html )


[EMAIL PROTECTED] wrote:


Hi Daniel,

in the onLoad of Dojo you have to registered two functions

dojo.event.connect("around", tapestry, "loadContent", this, "postLoading");  
dojo.event.connect("around", tapestry, "linkOnClick", this, "preLoading");


These functions surround the tapestry functions responsible for updating 
content.

function preLoading(miObj)
{
//
// Get the id of updated component
	var id = miObj.args[1];  
	//

// Here your code
Dojo.byId("loader").Show

	return miObj.proceed(); 
}


function postLost(miObj)
{ 
	//

// Get the id of updated component
var id = miObj.args[0];
//
// Here your code
Dojo.byId("loader").Show

	return miObj.proceed(); 
} 


ciao.michael.

  
  

-Ursprüngliche Nachricht-
Von: "Tapestry users" 
Gesendet: 16.01.07 14:03:40
An: Tapestry users 
Betreff: Ajax Loading Indicator (google style)


  
  

Hello all.

I'm using Tapestry

Re: Ajax Loading Indicator (google style)

2007-01-16 Thread imkreis 
I think I forgot to mention that fx.js was my inspiration ;)

@ShowOnAjax should also have a parameter with a list of components. @ShowOnAjax 
then only reacts on Ajax-Events within those components. @ShowOnAjax could also 
have two subcomponents like a4j:status.

ciao.michael.

> -Ursprüngliche Nachricht-
> Von: "Tapestry users" 
> Gesendet: 16.01.07 15:27:12
> An: Tapestry users 
> Betreff: Re: Ajax Loading Indicator (google style)


> Yep, that's a nice way of doing this...
> 
> It's also how effects are currently implemented
> http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/fx.js?view=markup
> 
> Anyway, Daniel, it wouldn't hurt adding a JIRA request for this feature 
> - i know i'll need something like this
> in the very near future.
> 
> I also think i like the Microsoft way of doing this, i.e. with a component
>  ... 
> instead of the tacos way, i.e. with the statusElement parameter for 
> every link of form
> component ( http://tacos.sourceforge.net/components/AjaxDirectLink.html )
> 
> 
> [EMAIL PROTECTED] wrote:
> > Hi Daniel,
> >
> > in the onLoad of Dojo you have to registered two functions
> >
> > dojo.event.connect("around", tapestry, "loadContent", this, "postLoading"); 
> >  
> > dojo.event.connect("around", tapestry, "linkOnClick", this, "preLoading");
> >
> > These functions surround the tapestry functions responsible for updating 
> > content.
> >
> > function preLoading(miObj)
> > {
> > //
> > // Get the id of updated component
> > var id = miObj.args[1];  
> > //
> > // Here your code
> > Dojo.byId("loader").Show
> >
> > return miObj.proceed(); 
> > }
> >
> > function postLost(miObj)
> > { 
> > //
> > // Get the id of updated component
> >     var id = miObj.args[0];
> > //
> > // Here your code
> > Dojo.byId("loader").Show
> >
> > return miObj.proceed(); 
> > } 
> >
> > ciao.michael.
> >
> >   
> >> -Ursprüngliche Nachricht-
> >> Von: "Tapestry users" 
> >> Gesendet: 16.01.07 14:03:40
> >> An: Tapestry users 
> >> Betreff: Ajax Loading Indicator (google style)
> >> 
> >
> >
> >   
> >> Hello all.
> >>
> >> I'm using Tapestry 4.1.1 and i'm learning to use ajax with it.
> >> Now i'm trying to make a loading indicator for ajax request when are 
> >> loading, like google. So i make a simple div like this:
> >>
> >> Loading...
> >>
> >> and i want to make it visible when i run an EventListener and when it's 
> >> finish, make it invisible. In other frameworks making this was very 
> >> easy, but i dont know how to make it with Dojo, using something like
> >>  
> >> Dojo.byId("loader").Show <- when i get "onloading" ajax thing.
> >> Dojo.byId("loader").Hide <- and whern i get "oncomplete" ajax thing.
> >>
> >> Anyone knows any way to do this? Theres is something like 
> >> updateComponent to make it visible and invisible?
> >>
> >> Cheers
> >>
> >> -
> >> To unsubscribe, e-mail: [EMAIL PROTECTED]
> >> For additional commands, e-mail: [EMAIL PROTECTED]
> >>
> >>
> >> 
> >
> >
> > ___
> > Viren-Scan für Ihren PC! Jetzt für jeden. Sofort, online und kostenlos.
> > Gleich testen! http://www.pc-sicherheit.web.de/freescan/?mc=02
> >
> >
> > -
> > To unsubscribe, e-mail: [EMAIL PROTECTED]
> > For additional commands, e-mail: [EMAIL PROTECTED]
> >
> >
> >
> >   
> 
> 
> -- 
> Andreas Andreou - [EMAIL PROTECTED] - http://andyhot.di.uoa.gr
> Tapestry / Tacos developer
> Open Source / J2EE Consulting 
> 
> 
> -
> To unsubscribe, e-mail: [EMAIL PROTECTED]
> For additional commands, e-mail: [EMAIL PROTECTED]
> 
> 


__
XXL-Speicher, PC-Virenschutz, Spartarife & mehr: Nur im WEB.DE Club!
Jetzt gratis testen! http://freemail.web.de/home/landingpad/?mc=021130


-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]

Re: Ajax Loading Indicator (google style)

2007-01-16 Thread andyhot 

Yep, that's a nice way of doing this...

It's also how effects are currently implemented
http://svn.apache.org/viewvc/tapestry/tapestry4/trunk/tapestry-framework/src/js/tapestry/fx.js?view=markup

Anyway, Daniel, it wouldn't hurt adding a JIRA request for this feature 
- i know i'll need something like this

in the very near future.

I also think i like the Microsoft way of doing this, i.e. with a component
 ... 
instead of the tacos way, i.e. with the statusElement parameter for 
every link of form

component ( http://tacos.sourceforge.net/components/AjaxDirectLink.html )


[EMAIL PROTECTED] wrote:

Hi Daniel,

in the onLoad of Dojo you have to registered two functions

dojo.event.connect("around", tapestry, "loadContent", this, "postLoading");  
dojo.event.connect("around", tapestry, "linkOnClick", this, "preLoading");


These functions surround the tapestry functions responsible for updating 
content.

function preLoading(miObj)
{
//
// Get the id of updated component
	var id = miObj.args[1];  
	//

// Here your code
Dojo.byId("loader").Show

	return miObj.proceed(); 
}


function postLost(miObj)
{ 
	//

// Get the id of updated component
var id = miObj.args[0];
//
// Here your code
Dojo.byId("loader").Show

	return miObj.proceed(); 
} 


ciao.michael.

  

-Ursprüngliche Nachricht-
Von: "Tapestry users" 
Gesendet: 16.01.07 14:03:40
An: Tapestry users 
Betreff: Ajax Loading Indicator (google style)




  

Hello all.

I'm using Tapestry 4.1.1 and i'm learning to use ajax with it.
Now i'm trying to make a loading indicator for ajax request when are 
loading, like google. So i make a simple div like this:


Loading...

and i want to make it visible when i run an EventListener and when it's 
finish, make it invisible. In other frameworks making this was very 
easy, but i dont know how to make it with Dojo, using something like
 
Dojo.byId("loader").Show <- when i get "onloading" ajax thing.

Dojo.byId("loader").Hide <- and whern i get "oncomplete" ajax thing.

Anyone knows any way to do this? Theres is something like 
updateComponent to make it visible and invisible?


Cheers

-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]






___
Viren-Scan für Ihren PC! Jetzt für jeden. Sofort, online und kostenlos.
Gleich testen! http://www.pc-sicherheit.web.de/freescan/?mc=02


-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]



  



--
Andreas Andreou - [EMAIL PROTECTED] - http://andyhot.di.uoa.gr
Tapestry / Tacos developer
Open Source / J2EE Consulting 



-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]

Re: Ajax Loading Indicator (google style)

2007-01-16 Thread imkreis 
Hi Daniel,

in the onLoad of Dojo you have to registered two functions

dojo.event.connect("around", tapestry, "loadContent", this, "postLoading");  
dojo.event.connect("around", tapestry, "linkOnClick", this, "preLoading");

These functions surround the tapestry functions responsible for updating 
content.

function preLoading(miObj)
{
//
// Get the id of updated component
var id = miObj.args[1];  
//
// Here your code
Dojo.byId("loader").Show

return miObj.proceed(); 
}

function postLost(miObj)
{ 
//
// Get the id of updated component
var id = miObj.args[0];
//
// Here your code
Dojo.byId("loader").Show

return miObj.proceed(); 
} 

ciao.michael.

> -Ursprüngliche Nachricht-
> Von: "Tapestry users" 
> Gesendet: 16.01.07 14:03:40
> An: Tapestry users 
> Betreff: Ajax Loading Indicator (google style)


> Hello all.
> 
> I'm using Tapestry 4.1.1 and i'm learning to use ajax with it.
> Now i'm trying to make a loading indicator for ajax request when are 
> loading, like google. So i make a simple div like this:
> 
> Loading...
> 
> and i want to make it visible when i run an EventListener and when it's 
> finish, make it invisible. In other frameworks making this was very 
> easy, but i dont know how to make it with Dojo, using something like
>  
> Dojo.byId("loader").Show <- when i get "onloading" ajax thing.
> Dojo.byId("loader").Hide <- and whern i get "oncomplete" ajax thing.
> 
> Anyone knows any way to do this? Theres is something like 
> updateComponent to make it visible and invisible?
> 
> Cheers
> 
> -
> To unsubscribe, e-mail: [EMAIL PROTECTED]
> For additional commands, e-mail: [EMAIL PROTECTED]
> 
> 


___
Viren-Scan für Ihren PC! Jetzt für jeden. Sofort, online und kostenlos.
Gleich testen! http://www.pc-sicherheit.web.de/freescan/?mc=02


-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]

Ajax Loading Indicator (google style)

2007-01-16 Thread Daniel Anguita O. 

Hello all.

I'm using Tapestry 4.1.1 and i'm learning to use ajax with it.
Now i'm trying to make a loading indicator for ajax request when are 
loading, like google. So i make a simple div like this:


Loading...

and i want to make it visible when i run an EventListener and when it's 
finish, make it invisible. In other frameworks making this was very 
easy, but i dont know how to make it with Dojo, using something like


Dojo.byId("loader").Show <- when i get "onloading" ajax thing.
Dojo.byId("loader").Hide <- and whern i get "oncomplete" ajax thing.

Anyone knows any way to do this? Theres is something like 
updateComponent to make it visible and invisible?


Cheers

-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]