Detecting Initial Opening of a Window

for Javascript and PHP

[denzin99]

I have been away from the programming world for over a year and need help.
I have resurrected an old web site and have the following problems:

The web site has three windows: Main, Display, Download. I have Javascript
code in the Display window that preloads several .jpg images. How can I
control the Display window so that it only preloads the .jpg images the
VERY FIRST TIME that the Display window is opened ? The user is likely
to go back to Main and return to Display again more than once. How can
I control this with Javascript ?

I have a similar problem with PHP code. I have a counter in Main.
Every time the Main window is opened, it increments the counter. The
user is likely to jump to the Display or Download window and return back
to the Main window more than once before leaving the site. This causes
the counter to keep incrementing. I only want the counter to increment
the VERY FIRST TIME that the Main window is opened. How can I control
this with PHP code ?

Thanks for your help. denzin99

[Fotiman]

Welcome to WebmasterWorld!
It sounds to me like a session cookie would be a good way to handle this. When the page loads, have your PHP code look for a session cookie. If it doesn't exist, increment the counter. Likewise, have your JavaScript code look for the session cookie and if it doesn't exist, preload the images and set the session cookie, so that additional page refreshes will spot the cookie and not increment counter or preload images.

[denzin99]

Dear Fotiman:
Thanks for your reply. Was hoping for a simpler way since I haven't dealt
with Cookies but I may have to try it. What about some of the Javascript
predetermined variables ? Are there any of those that change when a window
has been loaded once and is redisplayed ?

Sincerely, denzin99

[Fotiman]

JavaScript predetermined variables? I'm not sure what you mean. But no, there is no way to know whether a page is being hit for the first time or whether it's a refresh.

However, working with Cookies is not difficult. If you want to be really simplistic:

<script type="text/javascript" src="http://yui.yahooapis.com/3.0.0/build/yui/yui-min.js"></script>
<script type="text/javascript">
// create a YUI instance and use the cookie module.
YUI().use('cookie', function (Y) {
  if (!Y.Cookie.exists('existingSession')) {
    // This is the first time this page
    // has been visited this session.
    Y.Cookie.set('existingSession', true);
    // Preload images here
  }
});
</script>

Then you would have your PHP code also check for the 'existingSession' cookie.

[denzin99]

Dear Fotiman:
Your code is somewhat beyond my understanding. All I know is that I tried
it and IT WORKS !. Thanks. Hope that I can download the javascript
function into my file so that I don't have to depend on the Internet to
retrieve it.
Thanks again. denzin99

[Fotiman]

The YUI3 library [developer.yahoo.com] is available for download.

I'll try and quickly explain what it's doing:

YUI()

That instantiates a YUI object.

YUI().use('cookie', ...);

That tells the instance that you want to use the 'cookie' module. The YUI instance will load additional JavaScript files as needed, so if you are going to use a local version of the library you will need to pass some configuration data:

YUI({base: '/build/'}).use('cookie', ...);

So if you unpack the YUI files to a directory that maps to the /build/ directory of your web root, this is how you would access those files.

YUI({base: '/build/'}).use('cookie', function (Y) {
  ...
});

You pass a function as the last parameter to use. This function will be executed when all of the modules have been loaded. Note, the parameter "Y" will have the YUI instance object, so inside the function you can access the YUI methods by calling Y.method.

YUI({base: '/build/'}).use('cookie', function (Y) {
  if (!Y.Cookie.exists('existingSession')) { 
    // This is the first time this page 
    // has been visited this session. 
    Y.Cookie.set('existingSession', true); 
    // Preload images here 
  } 
});

The YUI Cookie module has method exists, which returns true if the cookie with the specified name exists. The first time you visit the page, that cookie does not exist, so that code is looking for !Y.Cookie.exists('existingSession'). In other words, if the cookie does not exist. If that's the case, then set the cookie so that subsequent visits will find that the cookie DOES exist.

Hope that helps.