Download Counter

PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!

Moderator: General Moderators

Post Reply
MadTogger
Forum Newbie
Posts: 5
Joined: Sat Mar 27, 2010 10:56 am

Download Counter

Post by MadTogger »

Hi,

I have a download counter on my site that I am fiddling around with, see here:-

http://www.madtogger.co.uk/page/software

The counter is printed to the screen using the code below:-

Code: Select all


<center>
<table>
<tr>
<td>File Name</td>
<td>Downloads</td>
</tr>
 <?php 

        foreach($files_array as $key=>$val)
        {
            echo '
<tr>
<td><a href="http://www.madtogger.co.uk/dlc_download.php?file='.urlencode($val).'">'.substr($val, 0, strpos($val, '.')).'</a></td> 
<td><span class="download-count">'.(int)$file_downloads[$val].'</span></td>
</tr>';
        }
    
    ?>

</table>
</center>

The table is populated from reading from a mysql database and at the moment a click event is handled via jquery, see below:-

Code: Select all


$(document).ready(function(){
 /* This code is executed after the DOM has been completely loaded */

 $('tr').click(function(){
 
 var countSpan = $('.download-count',this);
 countSpan.text( parseInt(countSpan.text())+1);
 });
});

I have tried to get help via the jquery forum but all post seem to be under eternal moderation, so I would like to implement this code using PHP instead if at all possible.

At the moment whenever a user clicks on the filename, as well as the download starting, the counter is increase by 1, however because the click event is via the <TR> tag the counter also increases if a user just clicks cell2 of the row but this will not start the download.

I am trying to make it possible so the user can only click on the filename to initiate download and the counter update and that no action is taken if they click elsewhere.

I would be eternally grateful for any help here, like I have said, scripting fully using PHP would be a better option for me.

Kind regards..,

K
User avatar
Zlobcho
Forum Newbie
Posts: 18
Joined: Sun Jun 21, 2009 7:57 pm

Re: Download Counter

Post by Zlobcho »

Why not using event delegation (jQuery.live() implements it).

Code: Select all

<table id="downloads_list">
<td><a class="live_download" href="http://www.madtogger.co.uk/dlc_download.php?file='.urlencode($val).'">'.substr($val, 0, strpos($val, '.')).'</a></td> 

Code: Select all

$(document).ready(function(){
 /* This code is executed after the DOM has been completely loaded */

 $('#downloads_list').live('click', function(event) {
     if (event.button != 0) return false;
     if (event.target.className.indexOf('live_') !== -1) {
     // ... here do what you do
     // return false to prevent default behavior
     }
 });
});
This will listen for clicks inside the table and bubble them up so you can capture it with .live(), once captured, you check if left mouse button was pressed if so, do your thing and decide to return true or false (depending if you want to prevent default behavior or not). Only elements with class names beginning with "live_" will be captured. :)
MadTogger
Forum Newbie
Posts: 5
Joined: Sat Mar 27, 2010 10:56 am

Re: Download Counter

Post by MadTogger »

Thank you for replying, I will have a look at implementing it the way you have suggested but how would I use this and then update the counter i.e. increase it by 1 each time the filename is clicked, or am I been stupid and not seeing that in the code you have posted.

Many thanks..,

K :)
User avatar
Zlobcho
Forum Newbie
Posts: 18
Joined: Sun Jun 21, 2009 7:57 pm

Re: Download Counter

Post by Zlobcho »

You're welcome,

The code inside the if will be executed only if the link is clicked.

Below is an example you can save it as html and try it out.

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<title>Example of jQuery.live() event delegation</title>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
	<script type="text/javascript">
		//<![CDATA[
		jQuery(document).ready(function() {
			jQuery('#download_list').delegate('td', 'click', function(event) {
				var el = event.target;
				if (el.className.indexOf('live_') === -1) return true;
				jQuery(el).text('Downloading...');
				var counter = jQuery(this).children('span');
				counter.text( parseInt(counter.text(), 10) + 1 );
				
				return true;
			});
		});
		//]]>
	</script>
</head>
<body>
	<table id="download_list">
		<tbody>
			<tr>
				<td><a href="http://www.google.com/search?q=plizzy" class="live_download">Plizzy 0.9</a><span>4</span></td>
			</tr>
			<tr>
				<td><a href="http://www.google.com/search?q=" class="live_download">Archivacho 1</a><span>16</span></td>
			</tr>
			<tr>
				<td><a href="http://www.google.com/search?q=psmeyli" class="live_download">pSmeyli</a><span>50</span></td>
			</tr>
			<tr>
				<td><a href="http://www.google.com/search?q=onfacebooklive" class="live_download">onFacebookLive 1.4</a><span>11</span></td>
			</tr>
		</tbody>
	</table>
</body>
</html>
This is how you use event delegation with jQuery.delegate() which I find to be easier to use. So, when you click on one of the links, the browser fires click event to this element and if the event is not captures it will bubble up until it reach DOM root (most top element). So basically what we are doing here is attaching event handler to the table and waiting for click events to bubble to the <table> and then capture them, get the element who fired the event and perform some action. You can use this example code in your project. However, the actual counter incrementing is done in your php script, where you should issue sql query (basically something like this):

Code: Select all

UPDATE table_where_files_are SET download_counter_column = download_counter_column + 1 WHERE file_name = FILE_NAME_BEING_DOWNLOADED
I hope this helps. :)

P.S. I think I got your question right, correct me if I didn't.
Last edited by Zlobcho on Sat Mar 27, 2010 2:25 pm, edited 1 time in total.
MadTogger
Forum Newbie
Posts: 5
Joined: Sat Mar 27, 2010 10:56 am

Re: Download Counter

Post by MadTogger »

Thank you Zlobcho, that is exactly what I was trying to achieve, superb.

Cheers..,

K :D
User avatar
Zlobcho
Forum Newbie
Posts: 18
Joined: Sun Jun 21, 2009 7:57 pm

Re: Download Counter

Post by Zlobcho »

Hi,

You're welcome. :)

I forgot to add one if condition, so only elements with className containing "live_" in will be proceeded, I've updated my previous post code to include this code.
MadTogger
Forum Newbie
Posts: 5
Joined: Sat Mar 27, 2010 10:56 am

Re: Download Counter

Post by MadTogger »

Thanks, I have now got it working but have another problem that I need help with.

I am trying to display an icon for each file and I thought that I could use some of the original code in order to make it work.

see below:-

Code: Select all

<center>
<table border="2" rules="rows" frame="box">
<tr bgcolor="#496b88">
<td><U>Icon</U></td>
<td><U>File</U></td>
<td><U>D/L's</U></td>
</tr>
 <?php 

        foreach($files_array as $key=>$val)
        {
            echo '
<tr>
<td><img src="/img/'.substr($val, 0, strpos($val, '.')).' + '.png'" border="0"></td>
<td><a href="/dlc_download.php?file='.urlencode($val).'">'.substr($val, 0, strpos($val, '.')).'</a></td> 
<td><span class="download-count">'.(int)$file_downloads[$val].'</span></td>
</tr>';
        }
    
    ?>

</table>
</center>
In the 1st <td> tag, see where I have used <img src.....
I thought that using the '.substr($val, 0, strpos($val, '.')).' piece of code which generates the filename minus the file extension and then add on the .png extension would work as the icons are stored in a folder as .png's

Problem is that when I use this it will not display the table at all.

What am I missing?

Regards..,

K
User avatar
Zlobcho
Forum Newbie
Posts: 18
Joined: Sun Jun 21, 2009 7:57 pm

Re: Download Counter

Post by Zlobcho »

:)

Code: Select all

echo '<img src="/img/' .substr($val, 0, strpos($val, '.')). '.png" border="0"></td>';
In php . is used as concatenate operator not + sign as in many other languages. The code above should be working now. Also "echo" does have the ability to output multiple arguments, like so:

Code: Select all

echo
	'<img src="/img/',
	substr($val, 0, strpos($val, '.')),
	'.png" border="0"></td>'
;
MadTogger
Forum Newbie
Posts: 5
Joined: Sat Mar 27, 2010 10:56 am

Re: Download Counter

Post by MadTogger »

Thanks buddy, I got it sorted.

K, :)
Post Reply