Copy GateKeeper files 1
Part 1 | Part 2 | Part 3 | Part 4 (GateKeeper-II) | Version 2.2
Installation Overview | HTTP Authentication | The Vault

These are the individual files used in the basic GateKeeper v3.2 example.
GateKeeper - GateKeeper-II - GateKeeper in frames

 
alternate.html

<HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY BGCOLOR="#BBCCCC"> <H2 ALIGN="center">ALTERNATE PAGE</H2> <CENTER>User is sent here if password is denied.</CENTER> </BODY> </HTML>
end alternate.html

 

 

 
frumpy.html

<HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"><!-- /********************************************************* GateKeeper v3.2 - by Joe Barta http://junior.apk.net/~jbarta/tutor/keeper/ Permission is granted to freely use this script. **********************************************************/ // Replace sluggo/hideout.html below with the directory/filename of the destination page. var target = "sluggo/hideout.html" function speedVerify() { parent.stopTimer(); parent.middleframe.document.clear(); parent.middleframe.document.open(); parent.middleframe.document.write("<H"+"TML><B"+"ODY BGCOLOR='#009900'>"); parent.middleframe.document.write("<CENTER><FONT SIZE=3 FACE='verdana,arial,helvetica'"); parent.middleframe.document.write("COLOR='#FFFFFF'><B>Password Accepted</B></FONT></CENTER>"); parent.middleframe.document.write("<BR>"); parent.middleframe.document.write("</B"+"ODY></H"+"TML>"); parent.middleframe.document.close(); holdup = setTimeout('letThrough()',1250); } function letThrough() { parent.opener.location.href = target; if(parent.keeperBoxStayOpen == 0) { parent.close(); } } //--></SCRIPT> </HEAD> <BODY BGCOLOR="#FFFFFF" onLoad="speedVerify()"> &nbsp; </BODY> </HTML>
end frumpy.html

 

 

 
gateblank.html

<HTML> <BODY BGCOLOR="#FFFFFF"> <P>&nbsp; <P>&nbsp; </BODY> </HTML>
end gateblank.html

 

 

 
gatehelp.html

<HTML> <HEAD> <TITLE>GateKeeper Help</TITLE> <SCRIPT language="JavaScript"><!-- /********************************************************* GateKeeper v3.2 - by Joe Barta http://junior.apk.net/~jbarta/tutor/keeper/ Permission is granted to freely use this script. **********************************************************/ /*=============================================================== Transfer variables from gate main to this help window. ================================================================*/ var storedays = opener.parent.storedays; // length of time (in days) to store saved password var webmasterEmail = opener.parent.webmasterEmail; // webmaster's email address var defaulttimer = opener.parent.defaulttimer; // Default length of time for GateKeeper to find the password doc. /*=============================================================== Generic cookie functions ================================================================*/ // Use this function to retrieve a cookie. function getCookie(name){ var cname = name + "="; var dc = document.cookie; if (dc.length > 0) { begin = dc.indexOf(cname); if (begin != -1) { begin += cname.length; end = dc.indexOf(";", begin); if (end == -1) end = dc.length; return unescape(dc.substring(begin, end)); } } return null; } // Use this function to save a cookie. function setCookie(name, value, expires) { document.cookie = name + "=" + escape(value) + "; path=/" + ((expires == null) ? "" : "; expires=" + expires.toGMTString()); } // Use this function to delete a cookie. function delCookie(name) { document.cookie = name + "=; expires=Thu, 01-Jan-70 00:00:01 GMT" + "; path=/"; } var exp = new Date(); exp.setTime(exp.getTime() + (1000 * 60 * 60 * 24 * storedays)); // This sets the timer value to expire in 10 yrs... which for our purposes is never. var exp2 = new Date(); exp2.setTime(exp2.getTime() + (1000 * 60 * 60 * 24 * 3650)); /*=============================================================== Execute onLoading of gatehelp.html ================================================================*/ function loadSavedPassCookieIntoBox() { if (getCookie('gatepass') != null) { window.document.savepassform.enterpass.value=getCookie('gatepass'); } } function getTimerCookie() { if (getCookie('gatetimer') != null) { window.document.gatetimerform.seconds.value=getCookie('gatetimer'); } } /*=============================================================== Store or delete password via this help page ================================================================*/ function testCookiesEnabled() { setCookie('gatetest', 'yeppers', exp); if (getCookie('gatetest') == 'yeppers') {return 1} else {return 0} } function savepassCookie() { if (testCookiesEnabled() == 0) { alert('This won\'t save because your browser is not accepting cookies') }else{ if (window.document.savepassform.enterpass.value.length < 2) { alert ('Password must be at least 2 characters.'); }else{ setCookie('gatepass',window.document.savepassform.enterpass.value,exp); window.document.savepassform.clearpass.checked=false; alert('\nPassword saved.\n\nThe password is saved un-encrypted in your browser\'s cookie file. It will be stored for '+storedays+' days.'); } } } function clearpassCookie() { if (testCookiesEnabled() == 0) { alert('This won\'t clear because your browser is not accepting cookies') }else{ delCookie('gatepass'); window.document.savepassform.enterpass.value='' alert('Password deleted.'); } } /*=============================================================== Timer functions ================================================================*/ function setTimerCookie(numberseconds) { if(isan(numberseconds) == false) { alert ('Enter a whole number between 0 and 600'); } else { if (numberseconds > 600) { alert ('Please enter 600 or less'); } else { if (testCookiesEnabled() == 0) { alert('This won\'t save because your browser is not accepting cookies') }else{ if(numberseconds < 7) { setCookie('gatetimer', numberseconds, exp2); alert ('\n'+numberseconds+' seconds is not very much time. I\'ll adjust it as you wish, but I think it might be a little fast. The change will take effect the next time this GateKeeper is activated.\n\nThis information has been stored in your browser\'s cookie file and will remain there until you change it here again.'); } else { setCookie('gatetimer', numberseconds, exp2); alert ('\nYour timer has been set to ' + numberseconds + ' seconds. The change will take effect the next time this GateKeeper is activated.\n\nThis information has been stored in your browser\'s cookie file and will remain there until you change it here again.'); } } } } } function isan(string) { if (string.length == 0) return false; for (var i=0;i < string.length;i++) if ((string.substring(i,i+1) < '0') || (string.substring(i,i+1) > '9')) return false; return true; } //--></SCRIPT> </HEAD> <BODY BGCOLOR="#FFFFFF" onLoad="loadSavedPassCookieIntoBox();getTimerCookie()"> <TABLE CELLSPACING=0 CELLPADDING=1 BORDER=0 WIDTH="100%"> <TR><TD BGCOLOR="#336600" colspan=2><FONT SIZE=1>&nbsp;</FONT></TD></TR> <TR><TD BGCOLOR="#DDDDCC" align=left valign=middle><FONT COLOR="#000000" SIZE=6>&nbsp;GateKeeper Help</FONT></TD> <TD BGCOLOR="#DDDDCC" align=right valign=middle><FONT COLOR="#000000" SIZE=2><B><A HREF="http://junior.apk.net/~jbarta/tutor/keeper/" TARGET="_blank">GateKeeper v3.2</A></B> by <A HREF="mailto:jbarta@apk.net">Joe Barta</A>&nbsp;&nbsp;<BR><A HREF="http://junior.apk.net/~jbarta/" TARGET="_blank">Professional Web Design</A>&nbsp;&nbsp;</FONT></TD></TR> </TABLE> <P><FORM NAME="savepassform"> <B>I would like to...</B> <BR>1) save this password: <INPUT TYPE="password" NAME="enterpass" SIZE=20><INPUT TYPE="button" VALUE="Save" onClick="savepassCookie()"> <BR>2) <INPUT TYPE="radio" NAME="clearpass" onClick="clearpassCookie()">un-save my password </FORM> <HR SIZE=1 NOSHADE> <P><I>I enter the right password but it keeps getting denied. Why?</I> <P>Well, there are a few possible reasons. The most obvious is that your password is no good anymore. You may want to contact the webmaster of the site you're trying to access. Later on in this help page there is an email link where you can submit a problem to both the webmaster and to the author of GateKeeper. <P>Possibly it's a case problem. In most situations <FONT COLOR="#CC0000"><TT>mypassword</TT></FONT> is not the same as <FONT COLOR="#CC0000"><TT>Mypassword</TT></FONT> or <FONT COLOR="#CC0000"><TT>MYPASSWORD</TT></FONT>. Make sure that you enter the password using the proper case (normally all lower case). Sometimes you can have your Caps Lock on and not realize it. <P>Another possible problem is that the site you are trying to access is down or very slow. The GateKeeper works on a timer. It has <SCRIPT language="JavaScript">document.write(defaulttimer);</SCRIPT> seconds to find your password page. If it can't load the page within that <SCRIPT language="JavaScript">document.write(defaulttimer);</SCRIPT> seconds, you get denied. The good news is that you can increase that number up to 600 seconds (10 minutes). <CENTER><FORM NAME="gatetimerform"> Make GateKeeper keep checking for <INPUT TYPE="text" NAME="seconds" SIZE=4 MAXLENGTH=3> seconds. <INPUT TYPE="button" VALUE="Set" onClick="setTimerCookie(window.document.gatetimerform.seconds.value)"> </FORM></CENTER> <P>If the site is slow, this may help. If it's down, it won't. Note that this won't affect a successful password entry. If your password is valid and you get the password document quickly, you'll just zip right in. The wait only kicks in if the page (for whatever reason) is not loading. <HR SIZE=1 NOSHADE> <P><I>I would like to report a problem.</I> <P>Please do. Below is an email link that will send your email to both the author of GateKeeper and the webmaster of this site (assuming he has configured GateKeeper to do so.) <P>Report the problem using the following general format: <FONT COLOR="#CC3333"><UL> <LI>Browser & Version: <LI>URL of web site with the problem: <LI>Operating System: <LI>Other Info you think we should have along with a full description of the problem. </UL></FONT> <SCRIPT LANGUAGE="JavaScript"> document.write("<P><A HREF=\"mailto:jbarta@apk.net?subject=GateKeeper32_Problem&cc="+webmasterEmail+"\">Email the author of GateKeeper <I>and</I> the webmaster of this site.</A>"); document.write("<BR><A HREF=\"mailto:jbarta@apk.net?subject=GateKeeper32_Problem\">Email the author of GateKeeper only.</A>"); document.write("<BR><A HREF=\"mailto:"+webmasterEmail+"?subject=GateKeeper32_Problem\">Email the webmaster of this site only.</A>"); </SCRIPT> <P><I>When I try to send mail to the webmaster above, there is no email address specified for him.</I> <P>Then hasn't configured GateKeeper with his email address. You'll have to look elsewhere on his site for it. <HR SIZE=1 NOSHADE> <P>Can I get one of these cool GateKeeper thingies for my web site? <P>Sure. Get yourself to <A HREF="http://junior.apk.net/~jbarta/tutor/keeper/" TARGET="_blank">http://junior.apk.net/~jbarta/tutor/keeper/</A> <P><I>Does it cost anything? Is it hard to set up?</I> <P>No. Not very. <P>&nbsp; </BODY> </HTML>
end gatehelp.html

 

 

 
gatemain.html

<HTML> <HEAD> <TITLE>GateKeeper</TITLE> <SCRIPT language="JavaScript"><!-- /********************************************************* GateKeeper v3.2 - by Joe Barta http://junior.apk.net/~jbarta/tutor/keeper/ Permission is granted to freely use this script. **********************************************************/ /*=============================================================== Define a few variables ================================================================*/ var storedays = "90"; // length of time (in days) to store saved password var webmasterEmail = ""; // webmaster's email address var defaulttimer = 10; // Default length of time for GateKeeper to find the password doc. var redirectpage = "" // send visitors to this page if password is denied, full or relative url /*=============================================================== Function that creates top.html & id.html For now, middle & bottom are just blank. ================================================================*/ function createDocs() { /* id.html -----------------------------------------------------------*/ parent.idframe.document.clear(); parent.idframe.document.open(); parent.idframe.document.write("<H"+"TML>"); parent.idframe.document.write("<H"+"EAD>"); parent.idframe.document.write("<T"+"ITLE></T"+"ITLE>"); parent.idframe.document.write("</H"+"EAD>"); parent.idframe.document.write("<B"+"ODY BGCOLOR=\"#FFFFFF\" LINK=\"#FF0000\" VLINK=\"#FF0000\" ALINK=\"#FFCCCC\">"); parent.idframe.document.write("<CENTER>"); parent.idframe.document.write("<FONT SIZE=2 FACE=\"arial,helvetica\"><A"); parent.idframe.document.write(" HREF=\"javascript:parent.gotoGatekeeper()\""); parent.idframe.document.write(" onMouseOver=\"parent.opener.status=\'Get your very own GateKeeper\'; return true\""); parent.idframe.document.write(" onMouseOut=\"parent.opener.status=\'\'; return true\""); parent.idframe.document.write(" onClick=\"parent.gotoGatekeeper();return false\">Protected by GateKeeper</A>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A"); parent.idframe.document.write(" HREF=\"javascript:parent.gatekeeperHelp()\""); parent.idframe.document.write(" onMouseOver=\"parent.opener.status=\'GateKeeper Help\'; return true\""); parent.idframe.document.write(" onMouseOut=\"parent.opener.status=\'\'; return true\""); parent.idframe.document.write(" onClick=\"parent.gatekeeperHelp();return false\">Help</A></FONT>"); parent.idframe.document.write("</CENTER>"); parent.idframe.document.write("<P>&nbsp;"); parent.idframe.document.write("<P>&nbsp;"); parent.idframe.document.write("</B"+"ODY>"); parent.idframe.document.write("</H"+"TML>"); parent.idframe.document.close(); /* top.html -----------------------------------------------------------*/ parent.topframe.document.clear(); parent.topframe.document.open(); parent.topframe.document.write("<H"+"TML>"); parent.topframe.document.write("<H"+"EAD>"); parent.topframe.document.write("<T"+"ITLE></T"+"ITLE>"); parent.topframe.document.write("</H"+"EAD>"); parent.topframe.document.write("<B"+"ODY BGCOLOR=\"#FFFFFF\" onLoad=\"parent.onloadTopFrameStuff()\">"); parent.topframe.document.write("<CENTER><FORM NAME=\"passform\" METHOD=post"); parent.topframe.document.write(" ACTION=\"javascript:parent.checkPassword(window.document.passform.passbox.value)\">"); parent.topframe.document.write("<FONT FACE=\"arial,helvetica\" SIZE=2><B>Password Required</B></FONT><BR>"); parent.topframe.document.write("<INPUT TYPE=\"password\" NAME=\"passbox\" SIZE=22>"); parent.topframe.document.write("</FORM></CENTER>"); parent.topframe.document.write("<P>&nbsp;"); parent.topframe.document.write("<P>&nbsp;"); parent.topframe.document.write("</B"+"ODY>"); parent.topframe.document.write("</H"+"TML>"); parent.topframe.document.close(); } /*=============================================================== Functions for the idframe ================================================================*/ function gotoGatekeeper() { parent.opener.location.href = "http://junior.apk.net/~jbarta/tutor/keeper/index.html"; } var keeperBoxStayOpen = 0; function gatekeeperHelp() { keeperBoxStayOpen = 1; help_window = window.open('gatehelp.html', 'helper', 'width=500,height=340,resizable=yes,scrollbars=yes,status=yes,menubar=yes'); } /*=============================================================== Generic cookie functions ================================================================*/ // Use this function to retrieve a cookie. function getCookie(name){ var cname = name + "="; var dc = document.cookie; if (dc.length > 0) { begin = dc.indexOf(cname); if (begin != -1) { begin += cname.length; end = dc.indexOf(";", begin); if (end == -1) end = dc.length; return unescape(dc.substring(begin, end)); } } return null; } // Use this function to save a cookie. function setCookie(name, value, expires) { document.cookie = name + "=" + escape(value) + "; path=/" + ((expires == null) ? "" : "; expires=" + expires.toGMTString()); } // Use this function to delete a cookie. function delCookie(name) { document.cookie = name + "=; expires=Thu, 01-Jan-70 00:00:01 GMT" + "; path=/"; } var exp = new Date(); exp.setTime(exp.getTime() + (1000 * 60 * 60 * 24 * storedays)); // This sets the timer value to expire in 10 yrs... which for our purposes is never. var exp2 = new Date(); exp2.setTime(exp2.getTime() + (1000 * 60 * 60 * 24 * 3650)); /*=============================================================== Execute onLoading of top.html ================================================================*/ function onloadTopFrameStuff() { parent.topframe.document.passform.passbox.focus() var iscookie = getCookie('gatepass'); if ((iscookie != null) && (iscookie.length > 1) && (iscookie != 'undefined') && (iscookie != 'null')) { parent.topframe.document.passform.passbox.value = iscookie; checkPassword(iscookie); } } /* Get the timer value from a stored cookie -----------------------------------------------------------*/ function getTimer() { var timer = (getCookie('gatetimer')); if ((timer != null) && (timer != 'null') && (timer != 'undefined')) { return (timer * 1000); } else { return (defaulttimer * 1000); } } var timervalue = getTimer(); /*=============================================================== Check the password. If times out, deny entry. ================================================================*/ function checkPassword(password) { parent.bottomframe.location.href = password + ".html"; parent.middleframe.document.clear(); parent.middleframe.document.open(); parent.middleframe.document.write("<H"+"TML><B"+"ODY BGCOLOR='#FFFFFF'>"); parent.middleframe.document.write("<CENTER><FONT SIZE=3 FACE='verdana,arial,helvetica'"); parent.middleframe.document.write("COLOR='#0000FF'><B>Verifying Password</B></FONT></CENTER>"); parent.middleframe.document.write("<BR>"); parent.middleframe.document.write("</B"+"ODY></H"+"TML>"); parent.middleframe.document.close(); pauseScript = setTimeout("denyEntry()",timervalue); } function denyEntry() { if (stoptime == 0) { parent.middleframe.document.clear(); parent.middleframe.document.open(); parent.middleframe.document.write("<H"+"TML><B"+"ODY BGCOLOR='#EE0000'>"); parent.middleframe.document.write("<CENTER><FONT SIZE=3 FACE='verdana,arial,helvetica'"); parent.middleframe.document.write("COLOR='#FFFFFF'><B>Password Denied</B></FONT></CENTER>"); parent.middleframe.document.write("<BR>"); parent.middleframe.document.write("</B"+"ODY></H"+"TML>"); parent.middleframe.document.close(); if (redirectpage.length > 2) { parent.opener.location.href = redirectpage; } } } var stoptime = 0; function stopTimer() { stoptime = 1; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * Many thanks to the folks at www.webcoder.com and www.irt.org for chunks of code that give Gatekeeper some of its neato functionality. Something about standing on the shoulders of giants and all that. * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ //--></SCRIPT> </HEAD> <FRAMESET ROWS="52%,24%,24%,*" BORDER="0" SPACING="0" FRAMEBORDER="0" FRAMESPACING="0" onLoad="createDocs()"> <FRAME SRC="gateblank.html" NAME="topframe" BORDER="0" MARGINWIDTH="0" MARGINHEIGHT="0" SPACING="0" FRAMEBORDER="0" FRAMESPACING="0" SCROLLING="NO"> <FRAME SRC="gateblank.html" NAME="middleframe" BORDER="0" MARGINWIDTH="0" MARGINHEIGHT="0" SPACING="0" FRAMEBORDER="0" FRAMESPACING="0" SCROLLING="NO"> <FRAME SRC="gateblank.html" NAME="idframe" BORDER="0" MARGINWIDTH="0" MARGINHEIGHT="0" SPACING="0" FRAMEBORDER="0" FRAMESPACING="0" SCROLLING="NO"> <FRAME SRC="gateblank.html" NAME="bottomframe" BORDER="0" MARGINWIDTH="0" MARGINHEIGHT="0" SPACING="0" FRAMEBORDER="0" FRAMESPACING="0" SCROLLING="NO"> </FRAMESET> </HTML>
end gatemain.html

 

 

 
index.html

<HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"><!-- /********************************************************* GateKeeper v3.2 - by Joe Barta http://junior.apk.net/~jbarta/tutor/keeper/ Permission is granted to freely use this script. **********************************************************/ // You can edit the following line to change the status bar message. var statusMsg = "Password Protected Area" function gateKeeper() { gateKeeperBox = window.open('gatemain.html', 'theKeeper', 'width=230,height=100,resizable=yes'); } //--></SCRIPT> </HEAD> <BODY> <A HREF="javascript:gateKeeper()" onMouseOver="self.status=statusMsg; return true" onMouseOut="self.status=''; return true" onClick="gateKeeper(); return false">Click here</A> for my secret page! <NOSCRIPT><FONT COLOR="#FF0000"> <BR>Javascript is required to access this area. Yours seems to be disabled. </FONT></NOSCRIPT> </BODY> </HTML>
end index.html

 

 

 
sluggo/hideout.html

<HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY BGCOLOR="#99CCFF"> <H1 ALIGN=center>My secret page!</H1> </BODY> </HTML>
end sluggo/hideout.html

 

 

 
sluggo/index.html

<HTML> <BODY> </BODY> </HTML>
end sluggo/index.html

General Table
of Contents
So, you want to make a Web Page!
Table Tutor - Form Tutor - Frames Tutor
Barebones
HTML Guide
PROFESSIONAL WEB DESIGN Joke BreakJoke Break