Ajax the index page [Updated v3]

steveholt
Jr. Member

Offline

TF Base: Linux 2.x
Posts: 60

Debian Packager

Ajax the index page [Updated v3]

« on: 04-20-2006, 01:35:51 »

I haven't seen anyone posting any Ajax hacks, though there seems to be some discussion about it. So, I hacked together something to get the ball started. It's not finished yet, but so far it seeems to reliably update the drive space, status, status popup, time, progress, total down, total up, free space and server load (and maybe the number of running and number of queued torrents too, I haven't tested that yet).

This change has reduced my server bandwidth from 85,547 bytes every 1 minute, to 554 bytes every 5 seconds. Using the values below for refresh times, it ends up being an 82% reduction in bandwidth!

I made the install completely non-desctructive for now, so you can try it out without changing any of the torrentflux files. Just copy the files linked to below into your torrentflux directory. You do have to add 3 new database entries in the tf_settings table, "ajax_refresh" is the number of seconds between page updates via ajax (I use 5), "ajax_full_refresh" is the number of seconds before a full page reload is done (I use 3600, which is 1 hour), and "use_ajax" is the default of whether or not to use ajax when the page is initially loaded with 0 being don't use ajax and 1 being use ajax (I use 0 to mimic the original program and prevent any problems with people who don't have JavaScript). Then just point your browser to indexAjax.php instead of index.php. It should look exactly the same, except with a new link at the bottom that says "Turn ON ajax". Click that to turn it on and let the updating begin!

Most of my testing has been on FireFox and I think some updates (the status popup update in particular) might not work in IE. Anyone who can test it on non-Firefox or non-Windows browsers, please let me know the results.

*** EDIT: This hack was updated ***

I updated this hack, here are the details: http://www.torrentflux.com/forum/index.php/topic,1228.msg8969.html#msg8969

I edited the paragraphs above to refer to the updated version's functionality, and the attached files should be the latest. If you are upgrading, go to the message link above to see what's different and what you need to do.

*** EDIT: Updated again to v2 ***

I have updated this hack again to fix 3 problems:
* The default after login always left Ajax disabled (link)
* Display error when drive is almost empty (link)
* No refresh when torrents are queued (I found this one myself)

There is no change to the functionality, simply update your indexAjax.php and functionsAjax.php with the new ones.

*** EDIT: Updated again to v3 ***

I have updated this hack so it works with TorrentFlux 2.3, see this post for more information.

Here are the current files:
indexAjax.php
functionsAjax.php
Sajax.php

Save them to your torrentflux directory, and rename them to remove the .txt extension. Sajax.php is the same as the original, so if you're upgrading you only need the other two.

USE THE LINKS ABOVE!


« Last Edit: 04-24-2007, 23:10:38 by Qrome »	Report to moderator Logged

blackwidow
Newbie

Offline

Posts: 44

Re: Ajax the index page

« Reply #1 on: 04-20-2006, 02:38:41 »

I like where you are going with this! 500 bytes is very reasonable for a data refresh. and the custom refresh times is hot! it doesn't seem important that the torrent list update, so don't worry too much about it. but if you want to, you could have AJAX also check for a torrent change and refresh the whole page then.


	Report to moderator Logged

ryaner
Hero Member

Offline

TF Base: Linux 2.x
Posts: 918

Re: Ajax the index page

« Reply #2 on: 04-20-2006, 06:53:25 »

Very nice to see this finally getting done. I've been working on this but everytime I learn something new I end up getting sidetracked adding it to my other system. The hack complements my original sajax details hack nicely. http://www.torrentflux.com/forum/index.php/topic,262.msg3706.html#msg3706


	Report to moderator Logged

Mistar Muffin
Newbie

Offline

Posts: 23

Re: Ajax the index page

« Reply #3 on: 04-20-2006, 10:52:07 »

I applaud your work, but there appears to be a flaw in your implementation. By simply updating the details for the torrents that are already in the list, your ajax updating does not list torrents that were added by other users, or by yourself in different window or tab.

For example, I have several users on my TF, if a user adds a torrent, it does not show up on the page until it refreshes. I tested this myself by opening TF in 2 seperate windows and adding a torrent in one of them. Also, starting a torrent in another window (or another user starting it), does not show up in a window that is refreshing by ajax. It remains as NEW (or INCOMPLETE or DONE).

I did an implementation myself on my own copy, that is my simpler and works better IMO. I simply have a <div> with id="torrentList" and I return (from php) the entire html for the torrentList table, and use javascript to set the innerHTML of that <div> to the returned html. The returned html for 2 torrents is about 3,963bytes, depending on several factors. Updating every 5 seconds thats 792 bytes a second.

-Muffin


	Report to moderator Logged

lord_nor
Full Member

Offline

TF Base: Linux 2.x
Posts: 173

Re: Ajax the index page

« Reply #4 on: 04-20-2006, 11:14:42 »

Quote from: steveholt on 04-20-2006, 01:35:51

Currently, if a torrent finishes downloading, or someone else adds a new torrent, some of the changes (like button updates) won't appear until the next full reload.

He was already aware of that...


	Report to moderator Logged

If they give you lined paper, write the other way.

Freebsd 6.1 | PHP 5.1.4 | MySql 5.1.9-beta | Apache 1.3.36

steveholt
Jr. Member

Offline

TF Base: Linux 2.x
Posts: 60

Debian Packager

Re: Ajax the index page

« Reply #5 on: 04-20-2006, 11:43:56 »

Quote from: blackwidow on 04-20-2006, 02:38:41

Thanks blackwidow, I think that's the way to go. I'll try implementing that.

I was also thinking of switching to XML for the format of data sent. The custom urlencoding that I did was not the best choice, in retrospect.


	Report to moderator Logged

blackwidow
Newbie

Offline

Posts: 44

Re: Ajax the index page

« Reply #6 on: 04-20-2006, 11:49:17 »

Quote from: Mistar Muffin on 04-20-2006, 10:52:07

The returned html for 2 torrents is about 3,963bytes, depending on several factors. Updating every 5 seconds thats 792 bytes a second.

I like the idea of updating the torrent list as well. by updating all that HTML every 5 seconds, you still transfer around 48KB per minute, with two torrents. My server has a whopping 21 at the moment, so I assume that estimate would be higher. steveholt has it at 7KB/m (I'm guessing that TCP/IP overhead brings it to around 12KB/m), which is significantly less than 85KB. but we don't get torrent status update.

Muffin, I would like to see your implemtation check every 5 seconds, but only refreshed the torrent HTML when there is a status change.


	Report to moderator Logged

steveholt
Jr. Member

Offline

TF Base: Linux 2.x
Posts: 60

Debian Packager

Re: Ajax the index page

« Reply #7 on: 04-20-2006, 12:01:52 »

Quote from: Mistar Muffin on 04-20-2006, 10:52:07

I did an implementation myself on my own copy, that is my simpler and works better IMO. I simply have a <div> with id="torrentList" and I return (from php) the entire html for the torrentList table, and use javascript to set the innerHTML of that <div> to the returned html. The returned html for 2 torrents is about 3,963bytes, depending on several factors. Updating every 5 seconds thats 792 bytes a second.

Thanks for the suggestion.

I did try using this method, but I was less successful than you were. I found that it was a bit flaky, especially when changing browsers, though YMMV. Mainly though, you're only reducing the bandwidth in half, as 3963 bytes every 5 seconds is almost 48,000 bytes every minute. My implementation uses much less data, it's actually 554 bytes every 5 seconds, or 111 bytes a second.

You're right that it needs some way to update the torrent list when new torrents start or are added and old torrents end or are removed. I think blackwidow's idea is great, as a change in the torrent list can just trigger a full page reload. As that doesn't happen very often (at least for me), the data transferred will still be much less. If I get that implemented, I could see increasing the "ajax_full_refresh" value to much higher, say 3600 secs (1 hour). Then the reduction in total bandwidth over that hour will be even greater, 91%!


	Report to moderator Logged

Mistar Muffin
Newbie

Offline

Posts: 23

Re: Ajax the index page

« Reply #8 on: 04-20-2006, 14:30:47 »

Steveholt,

I have this implementation working in IE 6.0+, Firefox 1.5+, and Opera 8+ so browsers are not an issue for me. However, both you and the previous poster are correct. This implementation is much heavier on the bandwith side. However, reducing bandwidth usage is not my ultimate goal. My ultimate goal in implementing ajax (which I did several months ag) was to create a much more streamlined and desktop-app-like feeling to TF, making it ultimately more pleasing to use. I did endeavor to make the process easy on the server, and as blackwidow said, it uses 48kB/min. I find that to be very satisfactory considering that my TF uses 62kB each refresh of the entire page. Of course, that number is probably lower if you take cached images into account, so its probably somewhere around the 48kB that my ajax implementation uses. That makes me perfectly happy. It is 100x more functional and user friendly in its interactiveness and presentation of the data, but also uses the same (if not less) amount of bandwith per minute. Also you have to figure other factors into the equation. I almost never wait for TF to refresh itself manually, when I went and looked at my TF I always wanted to know what the stats were RIGHT THEN, and I would just click the refresh button and see. I know I'm not the only one who constantly refreshes the TF page out of impatience. So you have to figure that into how much bandwidth TF really uses, and becuase of that, my implementation is signficantly less.

-Muffin


	Report to moderator Logged

steveholt
Jr. Member

Offline

TF Base: Linux 2.x
Posts: 60

Debian Packager

Re: Ajax the index page

« Reply #9 on: 04-20-2006, 21:40:07 »

Hi Muffin,

That's great that you got it working so well! Have you considered posting your changes here so others can use it or learn from it? As I said in my first post, I only started doing this because it seemed like no one else was.

As you pointed out, it seems our methods accomplish different goals. My goal is to increase the functionality, while at the same time reduce the bandwidth required. If you will post your changes, then others can decide which goal they have and choose a hack accordingly.

As you mentioned the caching of images, I thought I would mention that my TorrentFlux doesn't use cached data. Looking at my server logs, it seems that when I refresh the index page manually that cached data is used, however when I let the refresh time expire and the page refresh automatically the cached data is not used and all the images/files are redownloaded. This occurs for me in http and https, and with and without the hack above. The lack of caching is one of the reasons I seek to reduce the bandwidth.


	Report to moderator Logged

ryaner
Hero Member

Offline

TF Base: Linux 2.x
Posts: 918

Re: Ajax the index page

« Reply #10 on: 04-21-2006, 03:22:59 »

Your right in saying that TF doesn't use cache'd image (or anything else for that matter). It's caused by the headers generated by using php sessions. It can be overriden BUT it's highly unadviseable in a system with a login like this.


	Report to moderator Logged

Mistar Muffin
Newbie

Offline

Posts: 23

Re: Ajax the index page

« Reply #11 on: 04-21-2006, 11:11:50 »

Quote from: steveholt on 04-20-2006, 21:40:07

Unfortunately my TF is so far hacked I really can't post it. I'd have to post a copy of my TF "branch", something I'm not quite ready to do.

Quote from: ryaner on 04-21-2006, 03:22:59

Interesting, I was not quite aware of this. Can you link me to any documentation on why this is the case, and the pro's and con's of enabling the cache with a login system like this?


	Report to moderator Logged

Mistar Muffin
Newbie

Offline

Posts: 23

Re: Ajax the index page

« Reply #12 on: 04-21-2006, 11:22:47 »

More:

I took a look at my apache logs and it does not appear that the images are being reloaded every 5 seconds. Let me explain.

I never reload the entire page, in fact that was one of my goals. Mine can upload torrents without reloading the page, the same goes for deleting, stopping of torrents etc. I looked in apache, and the page images are loaded initially, and every 5 seconds this is the line from the log:

"GET /index.php?rs=getTorrents&rst=&rsrnd=1145632428408&rsargs[]=/home/xxxxxx/public_html/downloads/.torrents/ HTTP/1.1" 200 1868 "-" "Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.2) Gecko/20060308 Firefox/1.5.0.2"

No images were requested from the server until I started a torrent, at which point the red status image (for a dead torrent) was requested because it hadn't connected to any seeders yet. It also requested the image for "stop torrent".

Having eliminated the need for a page refresh at all, I would bet that my implementation uses less bandwidth in the long run.

-Muffin


	Report to moderator Logged

gringo
Full Member

Offline

TF Base: Linux 1.x
Posts: 110

Re: Ajax the index page

« Reply #13 on: 04-21-2006, 12:19:43 »

That's great news, but unfortunately the rest of us won't be able to try it, will we =P


	Report to moderator Logged

Mistar Muffin
Newbie

Offline

Posts: 23

Re: Ajax the index page

« Reply #14 on: 04-21-2006, 14:14:22 »

Yeah, you will. What I'm saying is that about 6 months ago I decided to privately fork the TF project, something which is encouraged under the OSS GPL model. I implemented a XMLHTTP/DOM (Ajax) interface that goes beyond just updating the data on the page. Some of the features are:

*Never having to refresh index.php. The following all function without refreshing the page:
*Upload torrents (multiple torrent upload included)
*Start torrent
*Kill torrent
*Delete torrent
*Wizard interface for MakeTorrent with dynamic ajax progress bars
*Ajax directory listing in dir.php. Browse files/folders without reloading the page

All features of TF 2.1 such as priority selection and qManager.

Since I have forked the project, it has a different name and is branded as such. Want a screenshot?


	Report to moderator Logged

Pages: [1] 2 3 ... 8

« previous next »

	Hey, OppTupacShakur, you have 11 messages, 0 are new. 05-07-2007, 12:11:59

News: