[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 351
  • Last Modified:

greeting repeat visitors with javascript

How can I write a greeting for visitors who have previously visited today? It has to reset at midnight each day.

First time they visit it sets a cookie that expires at midnight, next time it detects the cookie and triggers a greeting. I know the logic but don't know how to put in javascript.
0
IH666
Asked:
IH666
  • 4
  • 4
1 Solution
 
BogoJokerCommented:
Hi IH666,

Here is a nice couple functions to work with cookies in javascript:
http://www.w3schools.com/js/js_cookies.asp

If you don't already have some cookie functions you should use the setCookie() getCookie() methods there.  Great start, very flexable, now for setting the expire time.

I modified setCookie() a little, instead of expire days (the common procedure) I worked out some code to find the milliseconds until midnight, and then the cookie will expire.  Here is code in a sample page: (taken from a w3schools example)

<html>
<head>
<script type="text/javascript">
function getCookie(c_name)
{
if (document.cookie.length>0)
{
c_start=document.cookie.indexOf(c_name + "=")
if (c_start!=-1)
{
c_start=c_start + c_name.length+1
c_end=document.cookie.indexOf(";",c_start)
if (c_end==-1) c_end=document.cookie.length
return unescape(document.cookie.substring(c_start,c_end))
}
}
return null
}

function setCookie(c_name,value,expiretime)
{
var d1 = new Date();
d1.setHours(23);
d1.setMinutes(59);
d1.setSeconds(59);
var d2 = new Date();
var diff = d1-d2;
document.cookie=c_name+ "=" +escape(value)+
((expiretime==null) ? "" : "; expires=" + diff)
}

function checkCookie()
{
username=getCookie('username')
if (username!=null)
  {alert('Welcome again '+username+'!')}
else
  {
  username=prompt('Please enter your name:',"")
  if (username!=null||username!="")
    {
    setCookie('username',username,365)
    }
  }
}
</script>
</head>
<body onLoad="checkCookie()">
<script type="text/javascript">
</script>
</body>
</body>
</html>


The only real change I did to the code was:
var d1 = new Date();
d1.setHours(23);
d1.setMinutes(59);
d1.setSeconds(59);
var d2 = new Date();
var diff = d1-d2;
document.cookie=c_name+ "=" +escape(value)+
((expiretime==null) ? "" : "; expires=" + diff)

That creates a date which is the current time, it then sets it to a second before midnight, creates another date which is the current time, finds the difference and then sets expires to just that. =)



Joe P
0
 
IH666Author Commented:
Hi

I'm not very good at JS. How can I strip the code of user prompt and just set it to trigger DoGreeting() function?
0
 
BogoJokerCommented:
Sure, just change;
<body onLoad="checkCookie()">
to:
<body onLoad="DoGreeting()">

You of course would define DoGreeting(), something like this:

function DoGreeting()
{
username=getCookie('username')
if (username!=null)
    alert('Welcome again, '+username+'!');
else
    setCookie('username','joe',365);  // <-- Change the MIDDLE PARAM 'joe' to whatever YOU want displayed!
}

You could then completely remove checkCookie() altogether.  Now it doesn't prompt you to enter a name, it just automatically puts a name into the cookie.  Right now it always puts joe, you can change that depending on the person, or if you want a general message like "Hello Again" I can do that for you.
Joe P
0
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!

 
IH666Author Commented:
Yes please. I need make it just a generic function that shows everyone the same thing. I'm trying to keep it as compact as possible.
0
 
BogoJokerCommented:
function DoGreeting()
{
username=getCookie('username')
if (username!=null)
    alert('Hello again!');
else
    setCookie('username','hello',365);  // <-- Change the MIDDLE PARAM 'joe' to whatever YOU want displayed!
}

That should do it, make sure <body onLoad="DoGreeting();">
Joe P
0
 
IH666Author Commented:
Does this look right to you:

<script type="text/javascript"><--
if (getCookie('v')!=null)
{
    // do greeting
}
else
{
  var d1 = new Date();d1.setHours(23);d1.setMinutes(59);d1.setSeconds(59);var d2 = new Date();var diff = d1-d2;
  document.cookie="v=1;expires="+diff
}
//--></script>

(for sake of minimalism)
0
 
IH666Author Commented:
There was a slight bug with dates. No need to subtract d1-d2, as expires accepts d1 value.

This is as short as I could make it:

<script type="text/javascript"><!--
if (document.cookie.indexOf("v=0")>-1)
{
    document.write("welcome back!");
}
else
{
  var d = new Date();d.setHours(23);d.setMinutes(59);d.setSeconds(59);
  document.cookie="v=0;expires="+d;
  document.write("first visit!");
}
//--></script>

Thanks for the help.
0
 
BogoJokerCommented:
Sure! =)
0

Featured Post

Prep for the ITIL® Foundation Certification Exam

December’s Course of the Month is now available! Enroll to learn ITIL® Foundation best practices for delivering IT services effectively and efficiently.

  • 4
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now