Chapter 7, Online Photo Album, Ajax, cannot upload to subdirectories

kenj · March 31st, 2010, 09:19 PM

My online photo album is working.
Here are a couple of issues.

ISSUE # 1

PROBLEM

Upload file does not allow you to upload files to subdirectories
of your photo album. You can upload only to the album directory.

SOLUTION:

I have added some code so you can add files to subdirectories.

I have added two functions:

1. OpenSelectedForUploadFile
If a directory file is selected, it opens the directory, so
you will be loading your files into that directory.

2. OpenSelectedAndShowUploadFile.
If a file is selected, it calls the above mentioned
function, OpenSelectedForUploadFile.
It calls showUploadFile

Here is the code for OpenSelectedForUploadFile.
I just took the OpenSelected function and took out the
else blocks. This way it only deals with the directories, which
is what we want.

Code:

    // Used for uploading files. If a directory
    // is selected it opens that directory.
    // Invoked from OpenSelectAndShowUploadFile
    function openSelectedForUploadFile()
    {
        var url = 'process.php?action=open&dir=' + window.directory + '&file=' +
            window.filename + '&nocache=' + (new Date()).getTime();
    
        httpObj = createXMLHTTPObject();
        httpObj.open('GET', url , true);
    
        httpObj.onreadystatechange = function()
        {
            if (httpObj.readyState == 4 && httpObj.responseText)
            {
                var result = eval('(' + httpObj.responseText + ')');
                if (result.retType == 'directory')
                {
                    window.directory = result.directory;
                    refreshFilesList();
                }
            }
        }
        httpObj.send(null);
        return false;
    }

Here is the code for OpenSelectedAndShowUploadFile.

Code:

    function openSelectedAndShowUploadFile() {
       if (window.filename){ // if a file is selected
          openSelectedForUploadFile(); // if selected file is directory open it.
       }
       showUploadFile(); // shows the upload text fields and buttons.
       }

Now, you will need to change the line in the window.onload function.
Change it from:

Code:

     document.getElementById('btn_upload_file').onclick = showUploadFile;

to:

Code:

     document.getElementById('btn_upload_file').onclick = openSelectedAndShowUploadFile;

Basically, we are still calling showUploadFile like we did before;
we are just inserting some code to get us to the right directory

ISSUE # 2 - filename issues

I am using the download code, and it has a file named
public_files/index.php.
In the book they are calling this file
public_files/album.php.
I prefer album.php

By the way, there are some file names used here that are
also used in other chapters, so be careful not to overwrite.
Here they are:

public_files/view.php - same name is used in chapter 2.
Chapter2 code is different than this view.php file.
I renamed mine view7.php
There is also a file named view.php used in chapter 10.

lib/JpegThumbnail.php - used in chapter 2. They are same content.

config.php - File was used in Chapter 3, also chap 6. I just keep
adding to it.

common.php - Same as in chapters 1 and 2.