Pop up message for first time visitors - javascript

I am trying to write a code that will display a pop-up message when a site is first visited and I want it to never display again if I already see it.. Here's my code, I hope someone could help me to prevent the pop up from appearing when I refresh the page although it shouldn't.
<SCRIPT LANGUAGE="JavaScript">
<!--
function GetCookie(cookie) {
var arg=name+"=";
var alen=arg.length;
var clen=document.cookie.length;
var i=0;
while (i<clen) {
var j=i+alen;
if (document.cookie.substring(i,j)==arg)
return "here";
i=document.cookie.indexOf(" ",i)+1;
if (i==0) break;
}
return null;
}
var visit=GetCookie("cookie");
if (visit==null){
alert("Your Message Goes here and you only get to see it once!");
var expire=new Date();
expire=new Date(expire.getTime()+7776000000);
document.cookie="cookie=here; expires="+expire;
}
// -->
</SCRIPT>

You have problems in your getCookie function. Try with this:
CODE
function getCookie(c_name) {
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1) {
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1) {
c_value = null;
} else {
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1) {
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start, c_end));
}
return c_value;
}
example here: http://jsfiddle.net/TWB68/1/

Related

Listening for Cookie, Refreshing page when set - Javascript

I am using a popup plugin which sets a cookie.
I've restricted content to those with the cookie in single.php like so:
<?php if(isset($_COOKIE['pum-88881'])){
the_content();
}
else {
echo apply_filters( 'the_content', wp_trim_words( strip_tags( $post->post_content ), 55 ) ) . '<p>The full article is only available to subscribers to our newsletter.<a class="opensub">Subscribe to our Newsletter to Continue Reading</a></p>';
}
?>
This code works. When there is a cookie with the value pum-88881, the full content is displayed. Only problem is, it requires a refresh.
So, to try and remedy this, I've been trying to write a listener in Javascript:
function getCookie(c_name) {
var c_value = document.cookie,
c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1) c_start = c_value.indexOf(c_name + "=");
if (c_start == -1) {
c_value = null;
} else {
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1) {
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start, c_end));
}
return c_value;
}
setTimeout(function(){
var username = getCookie("pum-88881");
if (username != "") {
}
else{
location.reload()
}
}, 1000);
It is not working. No messages in the console.
What say ye?
Since this is related to Popup Maker I'll post this here. Assuming your setting the cookie on close you would use something like this.
jQuery('#pum-88881').on('pumAfterClose', function () {
window.location.reload(true);
});

Javascript - Check if cookie exists

I have trying to see if a cookie exists or not, Here is my getCookie method:
function getCookie(name)
{
var value = "; " + document.cookie;
var parts = value.split("; " + name + "=");
if (parts.length == 2) return parts.pop().split(";").shift();
}
and here is how I calling that method:
var cookie = getCookie("counter");
and here is my condition I tried:
if(cookie == '')
{
}
else
{
//Always goes here even when I clear my cookies and I know it does not exist.
}
My condition always goes into the else, not matter what, what am I doing wrong?
You can check the value of cookie if not undefined
if (typeof(cookie) === 'undefined'){
CONSOLE.LOG('no cookie');
} else {
CONSOLE.LOG(' cookie exist');
}
Please try following function to get cookie:
function getCookie(c_name){
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1){
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1){
c_value = null;
}
else {
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}

How to change text values in confirmation box?

A cookie must be set and also confirmed.
However, I want to change the text of the confirmation box? Is there any way?
Like OK=Hello and Cancel=Reset in the example below:
HTML:
<body onload="checkCookie()"></body>
Javascript:
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function checkCookie()
{
var username=getCookie("username");
if (username!=null && username!="")
{
var conf = confirm("Welcome again " + username);
if(conf==true)
{
return false;
}
else
{
alert("Your cookies have been reset!");
}
}
else
{
username=prompt("Please input your name below:","");
if (username!=null && username!="")
{
setCookie("username",username,365);
}
}
}
In addition, is there any way to be done like this:
When the entered username is set, being also reset while Cancel/Reset is clicked.
I wouldn't complain if somebody uses jQuery to do so though.
Thanks in advance. I will rep who helps me out :)
http://jsfiddle.net/V6LZE/
There are other options using some jQuery plugin, you can edit OK & Cancel button text. Helpful links:
http://www.codeproject.com/Questions/431829/How-to-change-button-text-of-Alert-message-using-j
Display Yes and No buttons instead of OK and Cancel in Confirm box?
jsfiddle.net/taditdash/PHX2Y/
Hope will help!

Popup windows on page load with specific period

on my page I need to set up a pop up window with special offer but I dont want to harass my customer everytime they go on homepage so I want to use cookies for chcecking and show popup up for specific period. For example once a week woud be great. I am a newbie in javascript, I just downloaded and use Reveal pop up plugin but I dodnt know how to set up it.
here is my code:
<head>
<link rel="stylesheet" href="reveal.css">
<script src="jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="jquery.reveal.js" type="text/javascript"></script>
</head>
This is pop up window
<body>
....
<div id="myModal" class="reveal-modal">
<h1>Modal Title</h1>
<p>Any content could go in here.</p>
<a class="close-reveal-modal">×</a>
</div>
</body>
And now I can run it just by clicking on link that looks like thaht
Click Me For A Modal
But I want to load it on pageload with cookies.
You can view sample on page page by clicking on orange label Click Me For A Modal below the header.
http://mmiuris.sk
Thanks for any ideas.
Edit:
The script is working finr but I cant make reveal plugin box to appear (it doesnt even make cookie file)
The code looks like this, see any error ?
<head>
<link rel="stylesheet" href="reveal.css">
<script src="jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="jquery.reveal.js" type="text/javascript"></script>
<script type="text/javascript">
function setCookie(c_name, value, exdays) {
var exdate = new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
document.cookie = c_name + "=" + c_value;
}
function getCookie(c_name) {
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1) {
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1) {
c_value = null;
}
else {
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1) {
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start, c_end));
}
return c_value;
}
function showModal() {
// Check if cookie existes
var expireDate = getCookie("showpopup");
var today = new Date().toUTCString();
alert(today);
if (expireDate != null && expireDate > today) {
//Do nothing!
}
else {
//ShowPopup here!
$(document).ready(function() {
$('#myModal').reveal();
});
//Create cookie
setCookie("showpopup", "anything", 1);
}
}
</script>
</head>
<body onLoad="showModal()">
<div id="myModal" class="reveal-modal">
<h1>Modal Title</h1>
<p>Any content could go in here.</p>
<a class="close-reveal-modal">×</a>
</div>
...
</body>
Add this code on you homepage. Modify it to show the popup instead of the alert in the show modal. This example sets the cookie to expire everyday. Change it to 7 days or whatever value you want...
<script type="text/javascript">
function setCookie(c_name, value, exdays) {
var exdate = new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
document.cookie = c_name + "=" + c_value;
}
function getCookie(c_name) {
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1) {
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1) {
c_value = null;
}
else {
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1) {
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start, c_end));
}
return c_value;
}
function showModal() {
// Check if cookie existes
var expireDate = getCookie("showpopup");
var today = new Date().toUTCString();
alert(today);
if (expireDate != null && expireDate > today) {
//Do nothing!
}
else {
//ShowPopup here!
alert('This is the popup!');
//Create cookie
setCookie("showpopup", "anything", 1);
}
}
</script>

javascript cookies

can anyone tell me about automatic cookies in JavaScript while clicking a button or URL of a webpage?
It sets for me and I can't delete that also...
var expDate = new Date();
expDate.setYear( parseInt(expDate.getYear())+10);
document.cookie="";
var x = "$user=$val; expires="+expDate.toUTCString();
Here i have two buttons called 'view' and 'save'. If i click the 'save' button this cookie should be set... but when i click the 'view' button a cookie is set. i cant delete tht cookie too
I find the method explained in this article at quirksmode.org to be working just fine. —  Mabye give that a try?
Best code to understand cookie in javascript
Just save my code as html file and open into browser you willeasily understand cookie concept
<!DOCTYPE html>
<html>
<head>
<script>
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
{
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1)
{
c_value = null;
}
else
{
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1)
{
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}
function checkCookie()
{
var username=getCookie("username");
if (username!=null && username!="")
{
alert("Welcome again " + username);
}
else
{
username=prompt("Please enter your name:","");
if (username!=null && username!="")
{
setCookie("username",username,365);
}
}
}
</script>
</head>
<body onload="checkCookie()">
</body>

Categories