ajax-ified loading the [*content*] - onepage wanted

Hi guys and gals,

i started to set up the fine MODX for a good friend of mine. He asked me how to prevent loading the whole site. So i think about the one-page solution used in the modx-manager. i read a lot of articles about ajax(and know the principles) and different js-libraries but don’t get the right clue how to put it together.( cause i’m more a designer than the programmer). The goal is to load the content in a defined div. The links are provided by the dropmenu-snippet in the template and the prototype.js comes from the CMS-installation.But where should i start?

Maybe some of you can take me by the hand and till i know the procedure (with your help ;-) ).
A working example can you see here at: http://www.scottydelicious.com/

Here are my first thoughts:
i need a asynchronous load of [*content*] provided by the system. Do i have to modify the system (php)?
To do that mentioned load, i need XMLHttp-Request. (for requests and error-handling). I’m sure i can use protype.js for this, right?
Plus, i need a little nifty js to do the DOM-manipulation? I’m able to read the code and most of the times i undertand the algorithm. So, I need a fingertip on this.

thanks in advance. le block

Well....
since you quoted my site!
There is no ajax involved in my site except for doze’s MaxiGallery.
It is all done with clean XHTML templating and clean CSS. That is the key.
also, my index page which happens to be blog.html if you go back to it from the menu, has caching turned on so all the images (which are the same throughout the site) are loaded and cached on the initial page impression. This creates the illusion of only the [*content*] area changing as the other areas are loaded lickety-split because they have been cached. You are welcome to use my XHTML template and CSS if you want to. everything on my site is Creative Commons in one way or another. You can even have the images, though I would prefer if you get your own, but I am no stickler for the rules !

-sD-

email me if you need help stealing my XHTML and CSS as I could just send you a zip of all the files.

Oups, no AJAX! But, a nice site...

email me if you need help stealing my XHTML and CSS as I could just send you a zip of all the files.

lol. Normally i don’t steal others stuff. i only adapt great ideas .
For a quick solution of the problem mentioned above, i would be thankful receiving a little package from you.
(info[at]leblock[dot]de)

I didn’t catch the sentence.

also, my index page which happens to be blog.html if you go back to it from the menu, has caching turned on so all the images...

Sorry, i’m german.
So, i repeat it for myself. Caching is on. Everything (content+images) goes straight to your browsers cache.in case the user is using the menu, the whole site will loaded (images/styles from cache, content from DB). And thats all happens to your blog.html because it’s your start-page(==index.html ?).
Right?

thanks, le block

If the browser caches the images and other extra files like .js or .css files, then when it gets a new HTML page it will see that those things have not changed and will use them again. The thing that takes the most time to refresh is the images, so if the browser caches them it will seem like the page didn’t refresh at all. It did, but the browser already has the images and doesn’t need to wait for them to download again. It makes a page refresh so fast that it seems like it didn’t refresh at all.

@ sD: i get it. thanks again.

@ all:
Despite the solution in the posts (2nd/3rd) above i’m interested in the AJAX-Thing / DOM-Manipulation (see the 1st post).
So, please don’t stop helping me. I think this is interesting for other MODX-Newbies or people who trying to adapt the asynchronous-loading-technique (done with MODX). An AJAX-Template would be nice too.

of course, i can read more books and articles on the web about the ajax-thing. But my opinion is, it is a much easier way to do this with other people.(more brains - more output). And with a little step-by-step-documentation everybody can reproduce the technique.

That’s why, I wanna explore this with the help of this forum.

le block