Hit Counter using PHP & Flash

Learn how to create a hit counter in Flash with the aid of PHP.

Note: To test the hit counter above press the Refresh Button at the top of your Browser:  (Usually F5).

The count number should go up by one.

Step one: A PHP Enabled Server & CHMOD Settings

If you have a PHP Enabled Sever and can change the CHMOD settings of your remote files please go to the next step.

Cross Ref: If you don't have a PHP Enabled Server or you are not able change the CHMOD settings for your remote files (or don't know what these things are) please read the tutorial: Intro to Flash & PHP

Step two: Creating the Flash Movie

1. Open a new: Flash Movie
2. Go to: Modify > Document
3. Set the size to: 350 x 50 pixels
4. If you wish select a: Background Colour
5. Click: OK
6. Select the Text tool:
7. On Stage drag out a: Text Box
8. Return to the Selection tool:
9. If the Property Inspector is closed, open it: Window > Properties (Ctrl F3)
10. In the Property Inspector set the Text Box to: Dynamic Text
    
    
    

    Selecting Dynamic Text.
    
    
11. Give the Text Box a Variable Name (Var): myCount
    
    
    

    Properties for the Text Box. (Click to enlarge)

Note: In the Property Inspector above the text alignment is set to right. This is normal for numbers, but not essential.


12. Create a new Text Box and add other text that you may want. I added: This Flash Movie has been viewed: times

Note: The space in the sentence above is to give room for the count number to appear.


13. As your first text box was set to Dynamic Text the next Text Box will take on this attribute. Reset the new Text Box to: Static Text
    
    
    

    Two Text Boxes sitting one on top of the other.
    
    
14. Select Frame 1 in the timeline and add the following ActionScript (you may leave out the gray comments):

// loadVariablesNum loads an external file into Flash as a variable // PHPCounter.php is the name of the external file //Zero is the level number loadVariablesNum ("PHPCounter.php", 0);

Cross Ref: A variable is a way of getting a computer to remember something. The level number is like a layer. An in-depth understanding of these is not important for this tutorial but if you want to learn more look at this tutorial: Levels

15. The Flash Movie is now finished so make sure you go to: File > Save (Ctrl S)
16. Name your file: PHPCounter
17. Then go to: File > Publish > Publish Settings
18. Under formats select: Flash and HTML

    

    File Formats.

19. Click: Publish
20. Click: OK

Note: Publishing creates an SWF file (Shockwave file or Flash Movie) and an HTML file (web page). The web page will automatically have the Flash Movie visible on the page.

Step three: Creating a Text file to store the Count Number

You will need a very simple file which stores the current count number.

1. You will need to open a Plain Text Editor:
   

   PC: Go to: Windows Start Button > Programs > Accessories > Note Pad

   Mac: Open: Applications> Simple Text

2. Type the number following: myCount=0

Note: The start number is zero so that the first time the page is viewed it will go up to 1 and the Flash counter will display 1 not zero. Of course you could start your page count on any number you wish. Remember - Don't believe everything you read. Just because a web site boosts that there have been a trillion visitors since yesterday - well it's only as trust worthy as the site itself. Of course I never doctor any of the webwasp page counts (I'm telling the truth !!).

3. Save your file to the same location as your Flash Movie that you Published earlier and use the file name: PHPCounter

Note: Because you are in a Text Editor it will automatically add the standard file extension. So your file will actually be called: PHPCounter.txt

Step four: Creating the PHP file

If you remember the line of ActionScript in your Flash Movie refers to a file called: PHPCounter.php This is the file you are about to create and that the Flash Movie actually reads. The Flash Movie does not read the previous text file which actually stores the count number. At first this may seem strange but I will explain why after we have looked at the PHP code.

1. If you have closed your Text Editor re-open it or if your Text Editor is still open go to: File > New
2. Type the following code (you may leave out the gray comments):

<? // Creates a variable which remembers the file name that has the count number in it. $filename = "PHPCounter.txt"; // Open the text file $fp = fopen( $filename,"r"); // Reads the text file $Old = fread($fp, 100); // Closes the text file fclose( $fp ); // Ignores the texts and gets the number following the equals sign $Old = split ("=", $Old, 5); // Add 1 to the current number $NewCount = $Old[1] + '1'; // Creates a variable called NewCount to remember the new number $New = "myCount=$NewCount"; // Opens the text file $fp = fopen( $filename,"w+"); // Locks the text file so that other programs cannot write to it. if (flock($fp, 2)) { // Write the new number fwrite($fp, $New, 100); } // Closes the text file fclose( $fp ); // Display the new count on the PHP web page print "myCount=$NewCount"; ?>

3. Save the file in the same location as the previous files as: PHPCounter.php

How the PHP Script Works

This last line of the PHP script could be confusing. What is this web page?

The PHP file you are currently working on is a web page. It is just like an HTML web page except it is dynamically created by the script above and simply displays the count. This page is not designed for human eyes but for the Flash file to read.

• To view this invisible page click here: PHPCounter.php

The number you see will be at least one higher than the Flash Counter at the top of this page because by clicking on the link the PHP script runs again and thus adds one to the count. If someone else has viewed the page since you first opened this page the number will be yet higher again.

So it is this PHP file that the Flash Movie reads not the text file that stores the count number! You could easily get the Flash file to read the text file. In the Flash file you would simply replace the swap the name of the line of ActionScript to point towards the text file like this:

loadVariablesNum ("PHPCounter.txt", 0); // Do not do this!!

Although this would accurately read the count number because the PHP script has not run the number would never get any higher. So the counter would not count. So by getting the Flash Movie to read the PHP file you are achieving two things at once:

• Gets the PHP script to run, which increments the count number.
• Reads the new count number.

If you clicked on the PHPCounter.php link above you will have noticed that the PHP web page displays something like this:

myCount=10179

Flash cannot handle information unless it is contained in a variable. In this case the variable is called: myCount

You will remember that when you created the Flash file you gave the Text Box on stage the Variable name: myCount

Giving the Text Box a Variable Name in Flash. (Click to enlarge)

Because the Variable Name of the Text Box and the Variable Name that Flash reads off the PHP file are the same Flash Because knows to display the number in the Text Box that we placed on the Stage. In fact Flash will display anything placed after the equals sign. In this case that is a number.

So to sum up:

• Flash calls the PHP script into action.
• The PHP script reads the Text file.
• The PHP script adds one to the Text file number.
• The PHP script saves the updated Text file.
• The PHP file displays the new count number.
• Flash reads this new count number.
• Flash displays the new count number in the Text box.

Step five: Up Loading the Files

You should now have the following 5 files:

Cross Ref: The files above all have the same name except for the file extension (the letters after the dot). If you cannot see the file extensions on your computer you may wish to look at the previous tutorial which covers file extensions: Into to Flash & PHP

1. You now need to upload all the files except for the Fla file:

Note: All the files need to be in the same folder on your web server.

1. When you have uploaded all the files you have to change the CHMOD setting for the text file: .
   
   This is so that the PHP script has the correct permission to save to the text file. Change the setting to: 666
   
   
   

   CHMOD set to 666 for the Text file: PHPCounter.txt

Cross Ref: If you don't know what CHMOD settings are or how to change them see the tutorial: Intro to Flash and PHP

2. You are now ready to test your Flash counter. Go to Internet Explorer (or other Browser) and type in the full web address for the file:

   Note: Unless you have a PHP Server on your own computer (which is unlikely) you will not be able to test this file from the web page saved on your local hard drive. Testing the file in Flash will not work either. You have to save all the files to a PHP enabled Server and then test them. This is why you upload and then test the web page directly from the web server (which has to be PHP Enabled).

   Cross Ref: If you do not know what a PHP Enabled Server is see the tutorial on: Intro to Flash and PHP

That is all there is to it. Your Flash Counter should now be happily counting away.