?
Solved

JavaScript - Preserving Window Position Between Sessions

Posted on 2006-03-21
7
Medium Priority
?
4,495 Views
Last Modified: 2009-12-16
I need to preserve the window (i.e., browser) position between sessions for a give web page.  So a user opens a particular web page (an ASP.NET page) and moves it around then closes it.  When the user opens that page again I want it to open at the same location that it was last at.  I can get the window’s position using window.screenLeft and window.screenTop and preserve this in a cookie.  I could then move the window to the former position on an onload event.  What I don’t know what to do is when to trigger this process.  What I need is something like an onmove event to trigger the process when the user moves the window.  Does such an event exist?  Or is there some better way to do this?  I am using ASP.NET 2.0, Internet Explorer and JavaScript.

Thanks!
0
Comment
Question by:stminfo
  • 3
  • 2
  • 2
7 Comments
 
LVL 10

Expert Comment

by:pvginkel
ID: 16254582
I take it you mean to ask when to store the position? Use the body event onunload for this.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 16254938
That would not be useful since the position of the window is actually the hack to find when the window is closed because it gets a silly value like 6000 or so.
Better is to set a cookie at intervals if allowed. Set one and if that cookie is correctly set, set one every second or so or monitor when the window moves and set one when it stops

Michel
0
 
LVL 10

Expert Comment

by:pvginkel
ID: 16254985
Well, you could always use the onresize event of the window. You have to set that in javascript though (not in HTML) like this:

window.onresize = function() {
  // set the cookie here
}
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:stminfo
ID: 16260574
Thanks for your feedback thus far.

How do I set an interval to save the window position or how can I monitor window movement?

Using the onresize event wouldn't work since the window that I am concerned with is of a fixed size.
0
 
LVL 10

Expert Comment

by:pvginkel
ID: 16260598
The window also has an onmove event:

window.onmove = function() {
  // set the cookie here
}

Does this help?
0
 

Author Comment

by:stminfo
ID: 16270644
I don't think that Internet Explorer has a window.onmove event.

Based on some of the comments, I was able to come up with the following:

---------------------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Saving Position With Cookies</title>
       
    <script language="javascript" type="text/javascript">
   
    // Global variables
    var formerXPos = 0;
    var formerYPos = 0;
   
    // The following interval is how often the page will
    //   check if it's been moved (1000 = 1 second)
    var myInterval = window.setInterval("checkPosition()", 500);
   
    // This function get the specified cookie's value and returns
    //   as a number.
    //   returns NaN is not a number.
    function getTheCookieNumber(cookieName)
    {
        var ret = NaN;
        var xStr = "";
        var theCookie = document.cookie;
        var startIdx = theCookie.indexOf(cookieName);
        var endIdx;
       
        if (startIdx != -1)
        {
            endIdx = theCookie.indexOf(";", startIdx);
            if (endIdx == -1)
            {
                // no ending semicolon, us end of string
                endIdx = theCookie.length;
            }
            xStr = theCookie.substr(startIdx + cookieName.length, endIdx);            
            ret = parseInt(xStr, 10);          
            return ret;
         }      
    }
   
    function myOnLoad()
    {
       var xTheStr = "";
       var xCoordinate = -1;
       var yCoordinate = -1;
       
       // Check for former position cookie
        var xCookieStr = "FormerWinPosX=";
        var yCookieStr = "FormerWinPosY=";
        xCoordinate = getTheCookieNumber(xCookieStr);
        yCoordinate = getTheCookieNumber(yCookieStr);
       
        if ((isNaN(xCoordinate)) || (isNaN(yCoordinate)))
        {            
            // No cookies set coordinates to middle bottom of the screen
            xCoordinate = (screen.availWidth - WindWidth) / 2;
            yCoordinate = screen.availHeight - WindHeight;
         }
         else
         {
            // Use the former position cookie
            // Adjust for border            
            xCoordinate = xCoordinate - 3;
            yCoordinate = yCoordinate - 10;
         }        
         window.moveTo(xCoordinate, yCoordinate);
     }
   
    function checkPosition()
    {
        var expiresOn = new Date();
       
        if ((formerXPos != window.screenLeft) ||
             (formerYPos != window.screenTop))
        {
            // set cookie expiration for 6 months;
            expiresOn.setMonth(expiresOn.getMonth() + 6);        
            document.cookie = "FormerWinPosX=" + window.screenLeft + ";expires=" + expiresOn + ";";
            document.cookie = "FormerWinPosY=" + window.screenTop + ";expires=" + expiresOn + ";";
           
            // Save position
            formerXPos = window.screenLeft;
            formerYPos = window.screenTop;
         }
    }
   
    </script>
</head>
<body onload="myOnLoad()">
    <div>
        This is sample page of how to save position!</div>
</body>
</html>

---------------------------------------------------------------------------------------

The one problem is that this code is not generic.  window.screenLeft and window.screenTop give the coordinates of the client area and so you need to adjust for the boarders.  In in my case, I have a set window size (not included in the code above) so I can hard code the adjustment.  It would be nice to be able to not hard code the adjustment.

Does anyone know of a way to get the coordinates of the entire browser window (i.e. Internet  Explorer) and not just the client area?
0
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 1500 total points
ID: 16270824
If you open the window yourself the very first time, you know where it is, then you can use the screenLeft and top to calculate where to open it next time
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

850 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question