Added JQuery nap plugin from here: http://www.frebsite.nl/werk/scripts/jquery_nap_plugin/index_en.php (MIT Licenced)

include/nap-1.0.0/nap_en.html

@@ -0,0 +1 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
		<title>jQuery nap</title>
		<script language="javascript" type="text/javascript" src="js/jquery.js"></script>
		<script language="javascript" type="text/javascript" src="js/jquery.nap-1.0.0.js"></script>
		<script language="javascript" type="text/javascript" src="js/jquery.cycle.min.js"></script>
		<script language="javascript" type="text/javascript" src="js/jquery.carouFredSel-1.2.1.js"></script>
		<script type="text/javascript" language="javascript">
			$(document).ready(function() {
				$('#caroufredsel_foo').carouFredSel().nap('pause', ['next', 'play'], 5);
				$('#cycle_foo').cycle({
					timeout: 2500,
					speed: 500
				}).nap(
					function() { $('#cycle_foo').cycle('pause'); },
					function() { $('#cycle_foo').cycle('next').cycle('resume'); }
				);
				$(document).nap(
					function() { 
						$('#custom_foo').addClass('sleep').find('p').html('You fell asleep!<br />CarouFredSel and Cycle paused.');
					},
					function() { 
						$('#custom_foo').removeClass('sleep').find('p').html('You woke up!<br />CarouFredSel and Cycle resumed.');
					}
				);
			});
		</script>
		<style type="text/css" media="all">
			div.carouselholder {
				position: relative;
				width: 200px;
			}
			div.carouselholder ul, div.carouselholder li {
				display: block;
				list-style: none;
				margin: 0;
			}
			div.carouselholder ul {
				padding: 0;
			}
			div.carouselholder li {
				border: 1px solid #ccc;
				background-color: #eee;
				float: left;
				width: 48px;
				height: 38px;
				text-align: center;
				font-size: 30px;
				padding: 10px 0 0 0;
			}

			div.sleep, div.border.sleep {
				background-color: #ccc;
			}
			div.border {
				padding: 9px;
				border: 1px solid #ccc;
				background-color: white;
			}
		</style>
	</head>
	<body>
		<small>Deze pagina in het <a href="nap_nl.html">Nederlands</a></small>
		<h1>jQuery nap plugin</h1>
		<ul>
			<li><a href="nap.zip" target="_blank">Download</a></li>
			<li><a href="#introductie">Introduction</a></li>
			<li><a href="#voorbeelden">Examples</a></li>
			<li><a href="#installeren">Installation</a></li>
			<li><a href="#configuratie">Configuration</a></li>
			<li><a href="#licentie">License</a></li>
		</ul>
		<br />
		<br />
		<br />
		<h2 id="introductie">Introduction</h2>
		<p>jQuery.nap is a plugin that detects when the user is &quot;taking a nap&quot; and executes the defined functions when the user &quot;falls asleep&quot; and &quot;wakes up&quot;.</p>
		<p>The so called nap  does ofcourse not mean the user actually fell asleep, it merely indicates that the user has been idle on the page for a given amount of time. For example when the page stays open during a break or while doing the groceries, or when the user is visiting another website while keeping yours open.</p>
		<p>To minimize the computers CPU-use, running animations can be paused to be resumed as soon as the user becomes active again.<br />
			The plugin could also be used to automatically log the user out if he has been idle for some time.</p>

		<br />
		<br />
		<br />
		<h2 id="voorbeelden">Examples</h2>
		<p>Below the nap-plugin is applied 3 times: on the carouFredSel-plugin, the Cycle-plugin and with self defined functions.<br />
			Let go of your mouse and keyboard and wait for 5 seconds.</p>
		<br />


		<h4 id="_vb_caroufredsel">carouFredSel-plugin</h4>
		<div class="carouselholder border">
			<ul id="caroufredsel_foo">
				<li>a</li>
				<li>b</li>
				<li>c</li>
				<li>d</li>
				<li>e</li>
				<li>f</li>
				<li>g</li>
				<li>h</li>
				<li>i</li>
				<li>j</li>
				<li>k</li>
				<li>l</li>
			</ul>
			<div style="clear:both;"></div>
		</div>
<pre>
$('#caroufredsel_foo')
	.carouFredSel()
	.nap('pause', ['next', 'play']);
</pre>
		<br />
		<br />


		<h4>Cycle-plugin</h4>
		<div class="border" style="width: 200px; height: 150px;">
			<div id="cycle_foo">
				<img src="img/bigboned.jpg" alt="bigboned" width="200" height="150" border="0" />
				<img src="img/jblletje.jpg" alt="jblletje" width="200" height="150" border="0" />
				<img src="img/luierkonteritus.jpg" alt="luierkonteritus" width="200" height="150" border="0" />
			</div>
			<div style="clear: both;"></div>
		</div>

<pre>
$('#cycle_foo').cycle().nap(
	function() { 
		$('#cycle_foo').cycle('pause'); 
	},
	function() { 
		$('#cycle_foo').cycle('next').cycle('resume'); 
	}
);
</pre>
		<br />
		<br />


		<h4>Self defined functions</h4>
		<div class="border" id="custom_foo" style="width: 350px;">
			<p>Here's some custom napping.<br />
				Let go of your mouse and keyboard and wait...</p>
		</div>
<pre>
$(document).nap(
	function() { 
		$('#custom_foo')
			.addClass('sleep')
			.find('p')
			.html('You fell asleep!&lt;br /&gt;CarouFredSel and Cycle paused.');
	},
	function() {Line truncated