CODEWITHSUNDEEP
javascriptjquerypopupwindow.open
danipen
danipen

Reputation: 341

Check if a popup is opened or not


I need to open a popup on page load and than on each new page load I need to check if the popup is still there or not. When the is loaded a cookie is stored so, if the user closes the popup it will never opens again unless the user click to open it.
On page load I open the popup if the cookie is not set:

var page_id = getURLParameter('pageID'),
    popup_opened = readCookie('music_popup'),
    musicPopup;


if(page_id !== 'music_popup' & !popup_opened){
    musicPopup = window.open('?pageID=music_popup', 'musicPopup', 'height=720,width=980');
};

What I need is a control on click event.
1- If user click on a link and the popup is still there, then focus on the popup.
2- if the popup is closed, than open it with focus.
I tried this code:

$('.c_music').click(function (event) {
    event.preventDefault();
    if (musicPopup !== undefined) {
        musicPopup.focus();
    } else {
        musicPopup = window.open('?pageID=music_popup', 'musicPopup', 'height=720,width=980');
    };
});

This doesn't work because if I'm in a page that hasn't opened the popup "musicPopup" is always undefined and the popup is opened even if it is just open... I found this question: js open popup window and acces it's element in another page where this code is suggested:
from page 1

var popup = window.open("test.html","mypopup","width=500,height=300");
popup.document.getElementById("player").someFunction();

from page 2

var popup = window.open('','mypopup');
// now popup is know again
popup.document.getElementById("player").someFunction();

this works fine if the popup is still opened when page 2 load, but if the popup is closed than page 2 open a black popup...

I'm going crazy... Any help would be really appreciate!

Upvotes: 0

Views: 10054

Answers (1)

danipen
danipen

Reputation: 341

I've just found out a workaround.
It seems not posibile to check if windows exist from a page how doesn't is the windows.opener
but what is possible to do is to check if the popup is loading whit no content.
As I state in the above question, using this code you can call the windows if it is open, or load an empty popup:

var popup = window.open('','mypopup');
// now popup is know again
popup.document.getElementById("player").someFunction();

If I check if the re-called popup is empty I can then fit it again with the desired content. so my final code is:

var page_id = getURLParameter('pageID'),
    popup_opened = readCookie('music_popup'),
    popup_url = '?pageID=music_popup',
    popup_name = 'musicPopup',
    popup_wh = 'height=720,width=980',
    musicPopup;

// open the popup if there isn't the popup_opened cookie 
if(!popup_opened){
    musicPopup = window.open( popup_url, popup_name, popup_wh);
};

$('.c_music').click(function(event) {
    event.preventDefault();
    //when the user click on a .c_music link check if popup is defined (I'm in the opener page)
    if(musicPopup !== undefined) {
        musicPopup.focus();
        musicPopup.document.getElementById("start").click();
        return false;
    } else {
        // I'm not in the opener page, so a call the popup again
        var musicPopup = window.open('', popup_name, popup_wh) ;
        // if popup doesn't exist a blank one would be opened
        if(musicPopup.location == 'about:blank' ){
            // load the desired content in the popup
            musicPopup.location = popup_url;
            return false;
        }
        // the popup still exist, so start the music again
        musicPopup.document.getElementById("start").click();
    };
});

This work fine for my needs and I hope it could be useful for others.

Upvotes: 1

Related Questions