You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@tapestry.apache.org by stephanos2k <st...@googlemail.com> on 2011/07/24 13:24:43 UTC
Ajax Navigation
I have a web page similar to GMail: one list of items, sub-folders (like
Spam/Inbox) and separate items to 'go in to'. Everything works via AJAX, but
now I want to have bookmarkable URLs.
Any recommendations on how to achieve this with Tapestry?
Cheers
--
View this message in context: http://tapestry.1045711.n5.nabble.com/Ajax-Navigation-tp4627764p4627764.html
Sent from the Tapestry - User mailing list archive at Nabble.com.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org
Re: Ajax Navigation
Posted by Barry Books <tr...@gmail.com>.
Tests are on the todo list, probably in the next day or two. Here is
any example that implements tabs with a zone.
<t:zone t:id="tabs" id="tabs">
<t:pagelink page="index" t:mixins="click" title="Image"
click.event="tab" click.context="0" t:zone="^"
zoneUpdate="highlight">Image
</t:pagelink>
<t:pagelink page="index" t:mixins="click" title="Description"
click.event="tab" click.context="1" t:zone="^"
zoneUpdate="highlight">Description
</t:pagelink>
<t:pagelink page="index" t:mixins="click" title="Room"
click.event="tab" click.context="2" t:zone="^"
zoneUpdate="highlight">In A Room
</t:pagelink>
<br />
<t:if test="isTab(0)">
<div t:type="any" t:mixins="jquery/ui/widget"
widget.name="draggable">tab0</div>
</t:if>
<t:if test="isTab(1)">
<div>
<div t:type="any" t:mixins="jquery/ui/widget,slidechange"
widget.name="slider"
options="{min:0, max:100, value: 10, step: 2}"
slidechange.event="slidechange"
slidechange.contextFunction="function(url,ui) { return
url.addContext(url.ui.value); }"/>
</div>
</t:if>
<t:if test="isTab(2)">
<div t:type="any" t:mixins="jquery/ui/widget" name="progressbar"
options="{value: 10}"/>
</t:if>
</t:zone>
The java side is this
@InjectComponent
private Zone tabs;
@Property
private Integer tab;
Object onTab(Integer tab) {
this.tab = tab;
return tabs.getBody();
}
public boolean isTab(Integer index) {
if ( tab == index ) {
return true;
}
return false;
}
If you wanted history you just include history="function(event,ui,url)
{ your code }" in the pagelink element. I'm still trying to figure out
which jQuery history library to use, but I'm not going to make the
mixin depend on any of them. Also in this case bind in subclassed like
this
public class Click extends Bind {
}
to create a click handler. This allows you to name your mixin
parameters and bind multiple event types. There is also a slideChange
event that was created the same way. That component returns slide
change events back to Tapestry via
void onSlideChange(Integer value) {
logger.info("slideChange {}",value);
}
Hope that helps some. I'm still working on the api but I'm hoping to
have it finished in a few days.
Barry
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org
Re: Ajax Navigation
Posted by "dragan.sahpaskix@gmail.com" <dr...@gmail.com>.
Nice,
Do you have some tests for it to see it in action?
I couldn't find any using the bind mixin.
Cheers,
Dragan Sahpaski
On Mon, Jul 25, 2011 at 2:12 AM, Barry Books <tr...@gmail.com> wrote:
> If you look in my fork of tapestry5-jquery on github
>
> https://github.com/trsvax/tapestry5-jquery
>
> there is a mixin called bind that supports this. You can bind jQuery
> events to Tapestry component events and provide a tittle and history
> callback when the event is triggered. It also supports Tapestry zones.
> Since there is no standard jQuery history module the implementation is
> pretty generic.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
>
>
Re: Ajax Navigation
Posted by Barry Books <tr...@gmail.com>.
If you look in my fork of tapestry5-jquery on github
https://github.com/trsvax/tapestry5-jquery
there is a mixin called bind that supports this. You can bind jQuery
events to Tapestry component events and provide a tittle and history
callback when the event is triggered. It also supports Tapestry zones.
Since there is no standard jQuery history module the implementation is
pretty generic.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org
Re: Ajax Navigation
Posted by "dragan.sahpaskix@gmail.com" <dr...@gmail.com>.
HI,
On Sun, Jul 24, 2011 at 7:14 PM, stephanos2k
<st...@googlemail.com>wrote:
> Thanks a lot for your post! :-)
>
> I looked at what you suggested, are there any hints/tips on how to
> integrate
> such functionality with Tapestry?
>
> Well it's obviously not trivial.
> I suppose a JS script (like history.js) should receive and handle + request
> and 'call' Tapestry to actually do the rendering. But I can't seem to come
> up with a good way on how to 'squeeze' the library in-between.
>
> Basically the short example here <https://github.com/balupton/History.js> relies
on rendering JSON in different states (all the logic is based on states).
Using tapestry you can make a GET request and return a JSON response. So
that's maybe the simplest scenario.
More complex scenario would be that you integrate zone's in the whole
picture. This one's tricky and I wouldn't suggest much at the moment. Maybe
one idea would be: when you make an ajax request using an EventLink you
somehow put the name of the action (or some other ID) in the URL and also
the context and the parameters in the URL (basically all info that the
EventLink carries), so if you bookmark and make a GET you make an Ajax call
using those parameters and update the corresponding zone reconstructing the
link that triggers the update.
I'm not sure if this is a good idea, but as I said generalizing
the functionality using zones is not trivial.
Cheers
Dragan Sahpaski
> Cheers
>
> --
> View this message in context:
> http://tapestry.1045711.n5.nabble.com/Ajax-Navigation-tp4627764p4628324.html
> Sent from the Tapestry - User mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
>
>
Re: Ajax Navigation
Posted by stephanos2k <st...@googlemail.com>.
Thanks a lot for your post! :-)
I looked at what you suggested, are there any hints/tips on how to integrate
such functionality with Tapestry?
I suppose a JS script (like history.js) should receive and handle + request
and 'call' Tapestry to actually do the rendering. But I can't seem to come
up with a good way on how to 'squeeze' the library in-between.
Cheers
--
View this message in context: http://tapestry.1045711.n5.nabble.com/Ajax-Navigation-tp4627764p4628324.html
Sent from the Tapestry - User mailing list archive at Nabble.com.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
For additional commands, e-mail: users-help@tapestry.apache.org
Re: Ajax Navigation
Posted by "dragan.sahpaskix@gmail.com" <dr...@gmail.com>.
Hi,
The approach in general is either use HTML5 history (works for html5
compatible browsers only), or use the hash change mechanism.
As far as I know there is no out of the box integration with tapestry5, but
there are various js scripts like the
history.js<http://plugins.jquery.com/project/history-js>jquery plugin
(supports html5 history and fallback for html4 with the hash
change mechanism), that you can try and share your experience with
community.
Cheers,
Dragan Sahpaski
On Sun, Jul 24, 2011 at 1:24 PM, stephanos2k
<st...@googlemail.com>wrote:
> I have a web page similar to GMail: one list of items, sub-folders (like
> Spam/Inbox) and separate items to 'go in to'. Everything works via AJAX,
> but
> now I want to have bookmarkable URLs.
>
> Any recommendations on how to achieve this with Tapestry?
>
> Cheers
>
> --
> View this message in context:
> http://tapestry.1045711.n5.nabble.com/Ajax-Navigation-tp4627764p4627764.html
> Sent from the Tapestry - User mailing list archive at Nabble.com.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@tapestry.apache.org
> For additional commands, e-mail: users-help@tapestry.apache.org
>
>