PROBLEM: window.open & accessing parent variables' values

Discussion in 'Javascript' started by Jiri Brada, Apr 5, 2004.

  1. Jiri Brada

    Jiri Brada Guest

    Hi,

    I have got a following problem with using Javascript:

    I have a HTML page with pictures' thumbnails. After clicking on any
    thumbnail, I would like to open a new window with the original size
    picture. In the main window with thumbnails, I have got following
    important stuff:

    <SCRIPT LANGUAGE="JavaScript">

    var images = new Array (
    "2004_Croatia_Brela/Croatia_Brela_083.jpg",
    "2004_Croatia_Brela/Croatia_Brela_090.jpg",
    "2004_Croatia_Brela/Croatia_Brela_107.jpg",
    "2004_Croatia_Brela/Croatia_Brela_108.jpg"
    );
    var image_count = images.length-1;
    var pImageNumber = 0;

    function show_image( pImageNumber ) {

    var pFile = new Image();
    var ht = 0;
    var wd = 0;

    for ( var i=0; i<image_count; i++ ) {
    pFile.src = images;
    if ( pFile.height > ht ) ht = pFile.height;
    if ( pFile.width > wd ) wd = pFile.width;
    }

    pFile.src = images[pImageNumber];
    ht = ht + 20 + 40;
    wd = wd + 20;

    imagewindow = window.open( "GSET_Croatia_Brela_images.htm", "img",
    "innerWidth=" + wd + ",width=" + wd + ",innerHeight=" + ht +
    ",height=" + ht + ",resizable,left=20,top=20");

    // this is commented because I always get a script
    // error that "imagewindow.document.images.changing_image" is
    // null or does not exist - is it because the new page is not loaded
    yet?

    //imagewindow.document.images.changing_image.src = pFile.src;
    //imagewindow.document.images.changing_image.width = pFile.width;
    //imagewindow.document.images.changing_image.height = pFile.height;
    //imagewindow.document.image_number = pImageNumber;
    }
    </SCRIPT>

    and somewhere in the body I have got

    <a href="2004_Croatia_Brela/Croatia_Brela_107.jpg"
    onClick="show_image(2); return false;"><img
    src="2004_Croatia_Brela/Thumbnail_Croatia_Brela_107.jpg" width="154"
    height="115" border="0"></a>

    Now, the new page with original images (GSET_Croatia_Brela_images.htm)
    looks like:

    <html>
    <head>
    <title>GS Radov&aacute;nky</title>
    <meta http-equiv="Content-Type" content="text/html;
    charset=iso-8859-1">
    <link href="Assets/GSET_CSS_Style.css" rel="stylesheet"
    type="text/css">
    <SCRIPT LANGUAGE="JavaScript">

    var images = new Array (
    "2004_Croatia_Brela/Croatia_Brela_083.jpg",
    "2004_Croatia_Brela/Croatia_Brela_090.jpg",
    "2004_Croatia_Brela/Croatia_Brela_107.jpg",
    "2004_Croatia_Brela/Croatia_Brela_108.jpg"
    );
    var image_number = 0;
    var image_count = images.length-1;
    var current_image = new Image();

    function PreviousImage ( ) {
    image_number--;
    if ( image_number == -1 ) image_number = image_count;
    current_image.src = images[image_number];
    document.images.changing_image.src = current_image.src;
    document.images.changing_image.width = current_image.width;
    document.images.changing_image.height = current_image.height;
    }
    function NextImage ( ) {
    image_number++;
    if ( image_number == image_count+1 ) image_number = 0;
    current_image.src = images[image_number];
    document.images.changing_image.src = current_image.src;
    document.images.changing_image.width = current_image.width;
    document.images.changing_image.height = current_image.height;
    }
    function ActualImage ( ) {
    image_number = opener.pImageNumber;
    current_image.src = images[image_number];
    document.images.changing_image.src = current_image.src;
    document.images.changing_image.width = current_image.width;
    document.images.changing_image.height = current_image.height;
    }
    </SCRIPT>
    </head>
    <body onLoad="ActualImage(); return false;">
    <table align="center" cellspacing="0">
    <tr>
    <td align="center" valign="middle"><img name="changing_image"
    src="Images/Empty_image.jpg" onClick="NextImage();" width="640"
    height="480" alt=""></td>
    </tr>
    <tr>
    <td align="center" valign="middle"><table align="center"
    cellspacing="10">
    <tr align="center" valign="middle">
    <td class="white_link"><a href="#"
    onClick="PreviousImage();">Previous</a></td>
    <td class="white_link"><a href="#"
    onClick="NextImage();">Next</a></td>
    </tr>
    </table></td>
    </tr>
    </table>
    </body>
    </html>

    So, I though that by using the onLoad function for body I could set
    the correct image from the list (which is the same as the list on the
    thumbnail page, maybe uselessly?) by using image_number =
    opener.pImageNumber in the ActualImage function executed within
    onLoad, but is simply does not work.

    Do you have any idea what I am doing wrong? I thought that by using
    opener keyword and image_number = opener.pImageNumber I would be able
    to find out what value was used for running the show_image (
    pImageNumber) on the main page.

    Thank you for any help in advance.

    Jiri
    Jiri Brada, Apr 5, 2004
    #1
    1. Advertising

  2. On 4 Apr 2004 21:56:57 -0700, Jiri Brada <> wrote:

    > <SCRIPT LANGUAGE="JavaScript">


    The language attribute is deprecated. You should use the required type
    attribute:

    <script type="text/javascript">

    > var images = new Array (
    > "2004_Croatia_Brela/Croatia_Brela_083.jpg",
    > "2004_Croatia_Brela/Croatia_Brela_090.jpg",
    > "2004_Croatia_Brela/Croatia_Brela_107.jpg",
    > "2004_Croatia_Brela/Croatia_Brela_108.jpg"
    > );


    It's probably better to use the array literal notation:

    var images = [ '2004_Croatia_Brela/Croatia_Brela_083.jpg',
    '2004_Croatia_Brela/Croatia_Brela_090.jpg',
    '2004_Croatia_Brela/Croatia_Brela_107.jpg',
    '2004_Croatia_Brela/Croatia_Brela_108.jpg' ];

    [snipped beginning of show_image()]

    > imagewindow = window.open( "GSET_Croatia_Brela_images.htm", "img",
    > "innerWidth=" + wd + ",width=" + wd + ",innerHeight=" + ht +
    > ",height=" + ht + ",resizable,left=20,top=20");
    >
    > // this is commented because I always get a script
    > // error that "imagewindow.document.images.changing_image" is
    > // null or does not exist - is it because the new page is not loaded
    > // yet?


    Yes, precisely.

    [snip]

    > <SCRIPT LANGUAGE="JavaScript">
    >
    > var images = new Array (
    > "2004_Croatia_Brela/Croatia_Brela_083.jpg",
    > "2004_Croatia_Brela/Croatia_Brela_090.jpg",
    > "2004_Croatia_Brela/Croatia_Brela_107.jpg",
    > "2004_Croatia_Brela/Croatia_Brela_108.jpg"
    > );


    As above.

    [snip]

    > <body onLoad="ActualImage(); return false;">


    Why are you returning false? It's not as if you can cancel loading.

    [snip]

    > <tr align="center" valign="middle">
    > <td class="white_link"><a href="#"
    > onClick="PreviousImage();">Previous</a></td>
    > <td class="white_link"><a href="#"
    > onClick="NextImage();">Next</a></td>


    You should cancel the click events after calling the functions.

    [snipped last bit of HTML]

    > So, I though that by using the onLoad function for body I could set
    > the correct image from the list (which is the same as the list on the
    > thumbnail page, maybe uselessly?) by using image_number =
    > opener.pImageNumber in the ActualImage function executed within
    > onLoad, but is simply does not work.
    >
    > Do you have any idea what I am doing wrong? I thought that by using
    > opener keyword and image_number = opener.pImageNumber I would be able
    > to find out what value was used for running the show_image (
    > pImageNumber) on the main page.


    What you're attempting should work fine, but check the show_image()
    function. At no point do you actually change the pImageNumber variable.

    Hope that helps,
    Mike

    --
    Michael Winter
    d (replace ".invalid" with ".uk" to reply)
    Michael Winter, Apr 6, 2004
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. KenG

    window.open clears parent window

    KenG, Feb 4, 2004, in forum: ASP .Net
    Replies:
    4
    Views:
    7,234
    Mike Hennessy
    Feb 17, 2004
  2. Replies:
    0
    Views:
    125
  3. Replies:
    3
    Views:
    178
  4. Replies:
    1
    Views:
    82
    LÅ‘rinczy Zsigmond
    Dec 9, 2004
  5. Replies:
    0
    Views:
    311
Loading...

Share This Page