Thanks Matt, for that insightful response.
I have decided after all to go with the XTile component. I guess I
had been leaning towards using EventListener, since that seemed the
way of the future, and a way to consolidate all the different AJAX
approaches out there. I find it interesting that your refer to it as
cruft :-) With XTile, the logic is fairly obvious, and thus
maintainable, and the porting is quite easy, requiring only minimal
modifications to the existing javascript, so it seems like the best
solution in this case.
Thanks again,
J
On 13-Feb-07, at 10:44 PM, Matt Brock wrote:
That's a very nice little widget there.
This would be very easy to move to the Tapestry world. I guess it
would
really depend on how much you want to keep on the client side, and
how much
would have to be done on the server. For instance, a good
implementation
might render the page with the items already generated for a
particular day.
Alternatively, you could first render the day planner completely
empty, then
do an Ajax call to populate the day once the page is loaded. It
really
doesn't matter.
Julian Wood wrote:
The javascript has many event hooks which fire off AJAX requests
to it's
PHP backend.
It looks like there's basically just one event (let's call it
updateEvent),
fired in a lot of different ways. updateEvent takes a few different
parameters, but they're all the same no matter what the event
actually is.
You could do all this using a single listener, which then parses it
out and
stores the information however you like and has a simple return
code if
there's an exception thrown, or if there's a date conflict... you
can make
it as smart or dumb as you want.
I'll also need to put in raw URL's to the AJAX services, directly
inside the
javascript.
Have you looked at the XTile component? It's got basically
everything you
need. There's really not much *to* Ajax, which is why I find all
the new
bells and whistles of 4.1 essentially cruft considering all you're
doing is
calling a page listener and maybe receiving return data to the client.
So if I can dip into specifics, I know I can get the planner to
load all the
"appointments" for a week pretty easily. But how to deal with an
appointment
move? A resize (change in duration)? A delete? A double click for
an edit?
I'd need to understand better how your event objects are
represented in
Javascript first and I didn't want to trudge through source code. I'm
guessing that each event has a unique ID, a start and end time, a
date and
some text to go along with it. Something like:
var Events = {
elements: {},
eventObj: function(start, end, date, text) {
this.start = start;
this.end = end;
this.date = date;
this.text = text;
},
add: function(id, start, end, date, text) {
Events.elements[id] = new Event.eventObj(start, end, date,
text);
},
delete: function(id) {
delete Events.elements[id];
},
update: function(id, start, end, date, text) {
Events.elements[id].start = start;
Events.elements[id].end = end;
Events.elements[id].date = date;
Events.elements[id].text = text;
}
}
There's all your event objects on the client side and all your basic
methods. In your page file add the XTile component from the Contrib
library. It's dead-simple to configure. You just give it a Send
function,
a Receive function, and a page Listener.
For instance, in your HTML...
<span jwcid="@contrib:XTile" sendName="literal:updateEvent"
receiveName="literal:recvResponse"
listener="listener:handleRequest" />
The send function is the function you call from the client side
when you
want to instantiate the Ajax request. So when you move a calendar
event and
the date changes, you'd call the update function and pass all the
Event
object elements. Something like,
onWhateverEvent = function() {
var id = // get the id however you like...
updateEvent(id, Events.elements[id].start, Events.elements[id].end,
Events.elements[id].date, Events.elements[id].text);
}
In your java code, you'll have a listener that then does something
with this
info...
public void handleRequest(IRequestCycle cycle) {
String[] ret = null;
Object[] params = cycle.getListenerParameters();
if (params.length < 5)
return;
String id = params[0].toString();
String start = params[1].toString();
String end = params[2].toString();
String date = params[3].toString();
String text = params[4].toString();
// save the updated object
// ret == return message
cycle.setListenerParameters(ret);
}
Then in your javascript you'll need a function to handle the return
data...
function recvResponse(xmlstuff) {
var returnData = xmlstuff.join('');
// do stuff...
}
And that's basically it. If you wanted to be clever, you could use
JSON to
transport your javascript objects. If you wanted to be very
clever, you
could add an additional "action" parameter to your Ajax request to
make
coding the listener a bit easier (stuff like "ADD" or "DELETE" or
"EDIT").
--
View this message in context: http://www.nabble.com/Best-strategy--
tf3201900.html#a8959162
Sent from the Tapestry - User mailing list archive at Nabble.com.
-
Julian Wood <[EMAIL PROTECTED]>
Software Engineer
Teaching & Learning Centre
University of Calgary
http://tlc.ucalgary.ca
