Hi Taha,
Thanks for sharing your code.
It make me discover the CaptureResultCallback (new in 5.2).
If I understand well your sample, to get progress value
the progressBar component raise a server side event called 'update' and
get the value from this callback.
is it right?
2010/12/11 Taha Hafeez <tawus.tapes...@gmail.com>
> Hi,
>
> Here is a simple example
>
> Java Code :-
>
> import org.apache.tapestry5.BindingConstants;
> import org.apache.tapestry5.ComponentResources;
> import org.apache.tapestry5.Link;
> import org.apache.tapestry5.MarkupWriter;
> import org.apache.tapestry5.annotations.AfterRender;
> import org.apache.tapestry5.annotations.Environmental;
> import org.apache.tapestry5.annotations.Import;
> import org.apache.tapestry5.annotations.Parameter;
> import org.apache.tapestry5.internal.util.CaptureResultCallback;
> import org.apache.tapestry5.ioc.annotations.Inject;
> import org.apache.tapestry5.json.JSONObject;
> import org.apache.tapestry5.services.Request;
> import org.apache.tapestry5.services.javascript.JavaScriptSupport;
>
> @Import(library = "progressbar.js")
> public class ProgressBar {
> @Parameter(value = "1", defaultPrefix=BindingConstants.LITERAL)
> private int period;
>
> @Parameter(defaultPrefix = BindingConstants.LITERAL)
> private String clientFunc;
>
> @Inject
> private ComponentResources resources;
>
> @Environmental
> private JavaScriptSupport javaScriptSupport;
>
> @Inject
> private Request request;
>
> @AfterRender
> void afterRender(MarkupWriter writer){
> Link link = resources.createEventLink("timer");
> JSONObject spec = new JSONObject();
> spec.put("url", link.toAbsoluteURI());
> spec.put("period", period);
> spec.put("clientFunc", clientFunc);
> javaScriptSupport.addScript("new ProgressBar(%s);", spec);
> }
>
> Object onTimer(){
> JSONObject spec = new JSONObject();
> double value = 0.0;
> try {
> value = Double.parseDouble(request.getParameter("value"));
> }catch(NumberFormatException nfe){
> return spec;
> }
>
> CaptureResultCallback<Double> callback = new
> CaptureResultCallback<Double>();
> resources.triggerEvent("update", new Object[]{value}, callback);
> value = callback.getResult();
> System.out.println("Value = " + value);
> spec.put("value", value);
> return spec;
> }
> }
>
> JavaScript Code :-
>
> ProgressBar = Class.create({
> initialize:function(spec){
> this.value = 0;
> this.url = spec.url;
> this.clientFunc = spec.clientFunc;
> this.executer = new PeriodicalExecuter(this.execute.bind(this),
> spec.period);
> },
>
> execute:function(transport){
> new Ajax.Request(this.url + "?value=" + this.value, {
> method:"get",
> onSuccess:function(transport){
> this.onSuccess(transport);
> }.bind(this)
> }, this.period);
> },
>
> onSuccess:function(transport){
> var json = transport.responseText.evalJSON();
> if(typeof(json.value) == "undefined"){
> alert(transport.responseText + ": returned")
> this.stopExecuter();
> }
> this.value = json.value;
> if(this.clientFunc){
> var func = this.clientFunc +"(" + json.value+")";
> eval(func);
> }
>
> if(json.value >= 100){
> this.stopExecuter();
> }
> },
>
> stopExecuter:function(){
> this.executer.stop();
> }
> });
>
>
> Usage :-
>
> <t:progressbar clientFunc="updateFunc"/>
> <div id='progressBar'>
> </div>
> <script>
> updateFunc = function(percentage){
> $("progressBar").update(percentage + "%");
> };
> </script>
>
>
> Hope it helps
> regards
> Taha
>
> On Fri, Dec 10, 2010 at 6:55 PM, Richard Hill <r...@su3analytics.com>
> wrote:
>
> > Hi Cameron,
> >
> > For an example of how to make an ajax call from your own js see the mail
> > I sent yesterday.
> >
> > Richard.
> >
> >
> >
> > On Fri, 2010-12-10 at 09:14 -0200, Thiago H. de Paula Figueiredo wrote:
> > > On Fri, 10 Dec 2010 09:04:49 -0200, Newham, Cameron <
> > cameron.new...@bl.uk>
> > > wrote:
> > >
> > > > Hi,
> > >
> > > Hi!
> > >
> > > > I imagine that if I wanted just a simple field on a page that updated
> > > > with a % then I would have Javascript make an AJAX get and obtain a
> > > > value from the server. However, as I'm a complete newbie to AJAX, an
> > > > example of how to do this would be extremely helpful.
> > >
> > > The AJAX part itself is completely Tapestry-unrelated and there are
> many
> > > examples in the Internet, maybe even in this mailing list archives. I
> > > answered something similar yesterday. The AJAX Prototype documentation
> is
> > > here: http://api.prototypejs.org/ajax/Ajax/Request/.
> > >
> > > > Example silly
> > > > questions: does my field have to be in a Zone?
> > >
> > > No, as long as you write your own JavaScript code to do and handle an
> > AJAX
> > > request and then update the page DOM.
> > >
> > > > Also, would the % value updated by my process just be held in a
> > @Persist
> > > > field?
> > >
> > > Absolutely no. Just get the % value when handling the request. You
> don't
> > > even need a field for that.
> > >
> >
> >
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
> > For additional commands, e-mail: users-h...@tapestry.apache.org
> >
> >
>
