I have this counter and everything is working great with it but i would like to modify it. I cant code shit and i dont understand code but im tryiing my best and google stuff and test stuff by myself.
So what do i need it to do? When 10 clicks are made a redirect is made to ''http://stackoverflow.com'' When 10 clicks are made the counter restarts. The value cant reach negative like -1 -2 -3 etc. If i click and close the site it counts it like -1 click or simplier sed it removes my click.
The code.
index.php
<meta http-equiv="Refresh" content="60">
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
<title>AJAX & PHP Click-Counter with Flat File Storage (text file)</title>
<!-- http://blog.fofwebdesign.co.uk/23-click-counter-with-flat-file-storage-text-file-ajax-php -->
<style>
html, body { margin:0; padding:0; font:16px/1.75 Verdana, Arial, Helvetica, sans-serif }
.page-content { padding:1em; max-width:64em; margin:auto }
.click-count { color:green; font-weight:bold }
</style>
</head>
<body>
<div class="page-content">
<?php
$clickcount = explode("
", file_get_contents('counter.txt'));
foreach($clickcount as $line){
$tmp = explode('||', $line);
$count[trim($tmp[0])] = trim($tmp[1]);
}
?>
<center><b class="click-trigger" data-click-id="click-001">+1 click me</b> | <b class="click-trigger2" data-click-id="click-001">-1 click me</b>
| Clicked <span id="click-001" class="click-count"><?php echo $count['click-001'];?></span> times.</center>
<script>
var clicks = document.querySelectorAll('.click-trigger'); // IE8
for(var i = 0; i < clicks.length; i++){
clicks[i].onclick = function(){
var id = this.getAttribute('data-click-id');
var post = 'id='+id; // post string
var req = new XMLHttpRequest();
req.open('POST', 'counter.php', true);
req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
req.onreadystatechange = function(){
if (req.readyState != 4 || req.status != 200) return;
document.getElementById(id).innerHTML = req.responseText;
};
req.send(post);
}
}
</script>
<script>
var clicks = document.querySelectorAll('.click-trigger2'); // IE8
for(var i = 0; i < clicks.length; i++){
clicks[i].onclick = function(){
var id = this.getAttribute('data-click-id');
var post = 'id='+id; // post string
var req = new XMLHttpRequest();
req.open('POST', 'counter2.php', true);
req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
req.onreadystatechange = function(){
if (req.readyState != 4 || req.status != 200) return;
document.getElementById(id).innerHTML = req.responseText;
};
req.send(post);
}
}
</script>
</body>
</html>counter.php (counts only +1 +1 +1 etc)
<?php
/* Notes - add items manually to 'counter.txt'
one item per line, in this format;
id||0
e.g. click-005||0
e.g. my-id||0
e.g. download-01||0
*/
$file = 'counter.txt'; // path to text file that stores counts
$fh = fopen($file, 'r+');
$id = $_REQUEST['id']; // posted from page
$lines = '';
while(!feof($fh)){
$line = explode('||', fgets($fh));
$item = trim($line[0]);
$num = trim($line[1]);
if(!empty($item)){
if($item == $id){
$num++; // increment count by 1
echo $num;
}
$lines .= "$item||$num
";
}
}
file_put_contents($file, $lines);
fclose($fh);
?> counter2.php ( counts - clicks like -1 -2 -3 etc)
<?php
/* Notes - add items manually to 'counter.txt'
one item per line, in this format;
id||0
e.g. click-005||0
e.g. my-id||0
e.g. download-01||0
*/
$file = 'counter.txt'; // path to text file that stores counts
$fh = fopen($file, 'r+');
$id = $_REQUEST['id']; // posted from page
$lines = '';
while(!feof($fh)){
$line = explode('||', fgets($fh));
$item = trim($line[0]);
$num = trim($line[1]);
if(!empty($item)){
if($item == $id){
$num--; // increment count by 1
echo $num;
}
$lines .= "$item||$num
";
}
}
file_put_contents($file, $lines);
fclose($fh);
?> counter.txt ( stores the clicks )
click-001||0
click-002||0
click-003||0</div>