I want to put cookie to my page.
Here's the logic :
When I load the page, I want it to load a popup or bootstrap modal. But the modal only load once when the browser is active. And only will load again when the browser tab is closed or exits the browser application. I have used session to do this, but I prefer to use cookie for personal preferences.
Is there a way to do this with javascript?
I've tried with $(window).load(), and $(window).on('beforeunload',function());
Javascript :
<script type="text/javascript">
$(window).load(function () {
if( $.cookie('firstLoad') == 'unloaded' || $.cookie('firstLoad') == 'null' || $.cookie('firstLoad') == null ) {
$('#openLoading').modal('show');
var time_exp = 1;
$.cookie('firstLoad','loaded',{ expires: time_exp });
}
});
$(window).on('beforeunload', function (){
alert($.cookie('firstLoad'));
$.cookie('firstLoad','unloaded');
});
</script>
The problem is sometimes the app browser will execute location.reload() and will reset the cookie in some way and make the popup appear again.
Please provide solution, thanks.
PS : the var time_exp and expires : time_exp is a last resort if the unload doesn't work
The beforeunload event doesn't just fire when the tab is closed. It will fire whenever the user goes to a new page in the same tab, including a page on your site. So you are resetting your cookie every time the user navigates between pages.
There is no event you can use to tell you the user is leaving your site specifically. The closest you can do is not set an expires, so that the cookie will automatically be deleted when the browser exits.
You could put a close button in the modal, and set a cookie when it is clicked so you know the user has viewed the modal and you don't need to show it again for however long you decide.
Related
I have a scenario trying to redirect DNS to another URL and i.e http://oldexample.com to another page of new website https://example.com.com/newpage
I am trying to make a script that detects traffic to https://example.com/newpage from http://oldexample.com and if it's detects that trigger to open modal/popup/alert message will saying some information on this page (https://example.com/newpage).
I have tried following solution but it does not work? Is it right way to implement it?
$(document).ready(function($) {
var isExternal = document.referrer;
console.log(isExternal);
if (isExternal === "https://oldexample.com") {
// Do something
alert('Referred from expected page. Probably.');
}
});
I'm using a simple script to show a popup with a checkbox to not show it again, and it works just fine, and it works perfectly to delete the cookie via the script.
My problem is that if i delete the cookies in IE11 (company browser), the cookie is still set!
So what am i missing? Is the cookie stored somewhere other than the standard directory when using jquery.cookie.js ?
I want to be able to see the popup by delete the cookie locally.
My code for reference:
<script type="text/javascript">
$("#Cookiehandler").change(function() {
if(this.checked) {
$.cookie('the_cookie', 'no');
}
});
window.jQuery(document).ready(function() {
if($.cookie('the_cookie') == null) {
$.fancybox.open('#popup_box');
}
else {
// placeholder
}
});
//$.removeCookie("the_cookie");
//alert( $.cookie("the_cookie") );
</script>
Best regards,
Marcus
I think the best way might be for you to have an administrative page with a script that deletes the cookie and just to visit that page whenever you want the cookie to be killed. That's a browser-independent method and you don't have to worry about where the cookie was stored, nor do you have to worry about doing it from a bunch of different browsers manually. Just visit the admin page from some or all of your browsers and it's done...for those browsers...while leaving the other ones alone unless you browse the kill page from them too.
I have a notification functionality in my chrome extension which is managed by a background page (background.html)
This page calls the setNotificationDelay() function which is basically a deletion of the previous timer followed by a setTimeOut.
function setNotificationDelay() {
clearNotificationTimer();
newDelay = getNotificationDelay()
notificationTimer = setTimeout(showNotification, newDelay);
}
}
I have also an options.html page which allows the configuration of the notification hour. I want to modify the background timeout when the configuration is modified, but when I call the setNotificationDelay() from the Option page it doesn't work, and I presume it's because the scope of the timers are attached to the parent page.
If I let the Option page opens the timeout is triggered, if I close it the notification never happened.
How can I attach this timer to the background page ?
Is there a better way to achieve it ?
Thanks.
EDIT: The chrome.extension have the getBackground page method which returns the window object for the background page:
function setNotificationDelay() {
clearNotificationTimer();
newDelay = getNotificationDelay()
notificationTimer = chrome.extension.getBackgroundPage().setTimeout(showNotification, newDelay);
}
}
options.js is only active while the options.html page is open, and I presume you don't want to leave the page open while you're waiting for the notification. What you want (I think) is to have background.js set the notification (both background.js and options.js access the same string variable localStorage.yourNotificationDelay).
One thing to watch out for is that if you are using event pages instead of background pages, a notification of more than a few seconds won't happen because Chrome will unload the background page. In that case, you'll need to use alarms instead.
Edit: Your edit makes me think I'm not understanding you. Perhaps you're expecting the user to change the interval while the timer is running? Then I'd recommend sending a message to background.js with newDelay, and use that to call setNotificationDelay().
I'm showing the pop-up window from the page. The popup has one page, which then redirects to another (LinkedIn authorization one, to be clear), and then, after the successful login, the initial authorization page is opened again.
I want to reload the parent page when the popup is closed, but cannot do this.
The code is the following:
function OpenAuthorizePopUp() {
var w = window.open("AuthorizePage.aspx", "PopUp", "width=450,height=540");
w.onunload = function () {
SubmitPage();
};
return false;
}
function SubmitPage() {
alert("SUBMIT!");
}
The issue here is that SubmitPage() function is called not when window is closed, but just after the popup is shown. I guess it's because of redirect inside the popup, and unload is raised when we move from the first page.
Is there a way to catch the actual moment when the window is closed in this case?
So the flow of the popup goes like this:
1. Your page -> 2. LinkedIn Page -> 3. Your Page
Can you change the URL that LinkedIn sends you back to (3.) ? If so, have LinkedIn send you back to a page that has window.onunload = window.parent.SubmitPage; on it.
If you can't- ie, LinkedIn always sends you back to the first page- make the third page test for a successful connection to LinkedIn and if it's present, execute window.onunload = window.parent.SubmitPage;.
A possible improvement to your idea would be to just have the "success" page call window.parent.SubmitPage(); and then window.close(); since you won't need the popup anymore.
Found the solution. Instead of accessing parent window with window.parent, wrote
opener.location.reload(true);
And it works.
I am using a Facebook login method in my code on page load, but when I execute this code, the pop-up blocker closes the Facebook permission window.
How can I open this window with Javascript without needing to make an exception in the pop-up blocker?
Below is my code:
FB.login(function(response)
{
if(response.session!=null)
{
window.location.href='http://example.com';
}
},
{ perms: 'email,user_birthday,publish_stream' });
You can do something like -
var uri = encodeURI('http://example.com');
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
window.location.href=uri;
} else {
window.location = encodeURI("https://www.facebook.com/dialog/oauth?client_id=YOUR_APP_ID&redirect_uri="+uri+"&response_type=token");
}
This will just redirect directly instead of opening a pop-up
This is specifically denied in the documentation:
"You should only call this on a user event as it opens a popup. Most browsers block popups, unless they were initiated from a user event, such as a click on a button or a link."
It's also simply poor UX.
There'd be no point in popup blockers existing if you could just code around them. You'll either need to find a method that doesn't use a popup or require some user interaction with the browser to open the popup.
Yeah you need to call it with a user event, but strictly the onclick event, not any other:
Login <!-- works -->
Login <!-- doesnt work -->
Login <!-- doesnt work -->
If you try to open a popup automatically then there is a high possibility that popup blockers will become activated, as far as I know, it has to be based on some User action, for example click of a button. Try to execute this code on click of a button, it should work.