<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/rss2full.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" version="2.0">

<channel>
	<title>Javascript Kata</title>
	
	<link>http://www.javascriptkata.com</link>
	<description>Advanced katas for javascripters</description>
	<pubDate>Tue, 12 May 2009 15:52:33 +0000</pubDate>
	<generator>http://wordpress.org/?v=2.6.3</generator>
	<language>en</language>
			<image><link>http://www.javascriptkata.com</link><url>http://www.javascriptkata.com/wp-content/themes/javascriptkata1.3/images/jk_logo_small.png</url><title>Javascript Kata</title></image><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" href="http://feeds.feedburner.com/JavascriptKata" type="application/rss+xml" /><feedburner:emailServiceId>JavascriptKata</feedburner:emailServiceId><feedburner:feedburnerHostname>http://feedburner.google.com</feedburner:feedburnerHostname><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com" /><item>
		<title>Easy loop for every element of an array</title>
		<link>http://feedproxy.google.com/~r/JavascriptKata/~3/uhoQZhlOsMo/</link>
		<comments>http://www.javascriptkata.com/2009/05/12/easy-loop-for-every-element-of-an-array/#comments</comments>
		<pubDate>Tue, 12 May 2009 15:24:21 +0000</pubDate>
		<dc:creator>Dan</dc:creator>
		
		<category><![CDATA[white belt]]></category>

		<guid isPermaLink="false">http://www.javascriptkata.com/?p=85</guid>
		<description><![CDATA[There's something bugging me with javascript <em>for</em> loop : the extra work to loop though all elements of an array. Suppose I want to <em>alert</em> each element of an array, there are three ways of doing it.]]></description>
			<content:encoded><![CDATA[<p>There&#8217;s something bugging me with javascript <em>for</em> loop : the extra work to loop though all elements of an array. Suppose I want to <em>alert</em> each element of an array, there are three ways of doing it.</p>
<p>First, you loop with an index and assign the element to a variable.</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1"><span class="kw2">var</span> items = <span class="br0">&#91;</span><span class="st0">&quot;a&quot;</span>, <span class="st0">&quot;b&quot;</span>, <span class="st0">&quot;c&quot;</span><span class="br0">&#93;</span>;</div>
</li>
<li class="li1">
<div class="de1"><span class="kw1">for</span> <span class="br0">&#40;</span><span class="kw2">var</span> i = <span class="nu0">0</span>; i &lt; items.<span class="me1">length</span>; i++<span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp; <span class="kw2">var</span> <span class="kw1">item</span> = items<span class="br0">&#91;</span>i<span class="br0">&#93;</span>;</div>
</li>
<li class="li1">
<div class="de1">&nbsp; <span class="kw3">alert</span><span class="br0">&#40;</span><span class="kw1">item</span><span class="br0">&#41;</span>;</div>
</li>
<li class="li2">
<div class="de2"><span class="br0">&#125;</span></div>
</li>
</ol>
</div>
<p>You always have to have that extra assignment at the beginning of the loop.</p>
<p>Second, you loop with a <em>for each</em>.</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1"><span class="kw2">var</span> items = <span class="br0">&#91;</span><span class="st0">&quot;a&quot;</span>, <span class="st0">&quot;b&quot;</span>, <span class="st0">&quot;c&quot;</span><span class="br0">&#93;</span>;</div>
</li>
<li class="li1">
<div class="de1"><span class="kw1">for</span> <span class="br0">&#40;</span><span class="kw2">var</span> i <span class="kw1">in</span> items<span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp; <span class="kw2">var</span> <span class="kw1">item</span> = items<span class="br0">&#91;</span>i<span class="br0">&#93;</span>;</div>
</li>
<li class="li1">
<div class="de1">&nbsp; <span class="kw3">alert</span><span class="br0">&#40;</span><span class="kw1">item</span><span class="br0">&#41;</span></div>
</li>
<li class="li2">
<div class="de2"><span class="br0">&#125;</span></div>
</li>
</ol>
</div>
<p>In javascript, the <em>for each</em> <strong>loops though the index</strong> of the array instead of looping though the elements, like in most other languages. Thus, you also have to make the extra assignment at the beginning of the loop.</p>
<p><strong>The easiest way</strong> of doing it is the third one.</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1"><span class="kw2">var</span> items = <span class="br0">&#91;</span><span class="st0">&quot;a&quot;</span>, <span class="st0">&quot;b&quot;</span>, <span class="st0">&quot;c&quot;</span><span class="br0">&#93;</span>;</div>
</li>
<li class="li1">
<div class="de1"><span class="kw1">for</span> <span class="br0">&#40;</span><span class="kw2">var</span> i = <span class="nu0">0</span>, <span class="kw1">item</span>; <span class="kw1">item</span> = items<span class="br0">&#91;</span>i<span class="br0">&#93;</span>; i++<span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp; <span class="kw3">alert</span><span class="br0">&#40;</span><span class="kw1">item</span><span class="br0">&#41;</span>;</div>
</li>
<li class="li1">
<div class="de1"><span class="br0">&#125;</span></div>
</li>
</ol>
</div>
<p><strong>How does it work?</strong> First it uses multi-assignment on one line. In javascript, you could write <em>var i = 0, j = 1;</em> and it would create two variables, <em>i</em> and <em>j</em>.</p>
<p>The second part of the <em>for</em> is confusing : it assigns the item but it never check if <em>i</em> it is out of bounds of the array (using <em>i < items.length</em>). It works because when javascript tries to assign an item after the end of the array (in our case <em>items[3]</em>), it returns <em>null</em> which is considered by javascript as <em>false</em>.</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~ff/JavascriptKata?a=uhoQZhlOsMo:LTtj_qxqxXQ:F7zBnMyn0Lo"><img src="http://feeds.feedburner.com/~ff/JavascriptKata?i=uhoQZhlOsMo:LTtj_qxqxXQ:F7zBnMyn0Lo" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/JavascriptKata?a=uhoQZhlOsMo:LTtj_qxqxXQ:V_sGLiPBpWU"><img src="http://feeds.feedburner.com/~ff/JavascriptKata?i=uhoQZhlOsMo:LTtj_qxqxXQ:V_sGLiPBpWU" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/JavascriptKata?a=uhoQZhlOsMo:LTtj_qxqxXQ:cGdyc7Q-1BI"><img src="http://feeds.feedburner.com/~ff/JavascriptKata?d=cGdyc7Q-1BI" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/JavascriptKata?a=uhoQZhlOsMo:LTtj_qxqxXQ:gIN9vFwOqvQ"><img src="http://feeds.feedburner.com/~ff/JavascriptKata?i=uhoQZhlOsMo:LTtj_qxqxXQ:gIN9vFwOqvQ" border="0"></img></a> <a href="http://feeds.feedburner.com/~ff/JavascriptKata?a=uhoQZhlOsMo:LTtj_qxqxXQ:qj6IDK7rITs"><img src="http://feeds.feedburner.com/~ff/JavascriptKata?d=qj6IDK7rITs" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.javascriptkata.com/2009/05/12/easy-loop-for-every-element-of-an-array/feed/</wfw:commentRss>
		<feedburner:origLink>http://www.javascriptkata.com/2009/05/12/easy-loop-for-every-element-of-an-array/</feedburner:origLink></item>
		<item>
		<title>Be ahead of the trend, try CouchDB</title>
		<link>http://feedproxy.google.com/~r/JavascriptKata/~3/VzDtm9FOF_k/</link>
		<comments>http://www.javascriptkata.com/2009/01/12/be-ahead-of-the-trend-try-couchdb/#comments</comments>
		<pubDate>Mon, 12 Jan 2009 15:49:28 +0000</pubDate>
		<dc:creator>Dan</dc:creator>
		
		<category><![CDATA[couchdb]]></category>

		<guid isPermaLink="false">http://www.javascriptkata.com/?p=79</guid>
		<description><![CDATA[I always loved and hated databases. When I was a younger programmer, I asked to switch to DB administrator and, thank God, they didn&#8217;t agree to let me mutate in a DBA. I ended up fired like 80% of the company (except the DBA). In fact, I wanted to be DBA because I thought I [...]]]></description>
			<content:encoded><![CDATA[<p>I always loved and hated databases. When I was a younger programmer, I asked to switch to DB administrator and, thank God, they didn&#8217;t agree to let me mutate in a DBA. I ended up fired like 80% of the company (except the DBA). In fact, I wanted to be DBA because I thought I knew how to work with a DB better than them. The rest of my life proved me wrong. Nobody knows what they&#8217;re doing because relational databases are a mess.</p>
<p>Then came the non-relational database. <a href="http://aws.amazon.com/simpledb/" target="_blank">Amazon&#8217;s SimpleDB</a> was the first NRDBMS (as opposed to RDBMS) that got a public attention. When I read the specs, I really thought it was cool but I wondered &#8220;Is it scalable?&#8221;. Then I remembered that <strong>there is no such thing as a scalable database</strong>. Databases need to be smashed and hurt in order to be as scalable as we want them to. I wanted to give it a try but I wasn&#8217;t ready to <a href="http://aws.amazon.com/simpledb/#pricing" target="_blank">pay</a> for it yet.</p>
<p>Working with xmpp/jabber, I saw <a href="http://metajack.im/2008/11/14/relax-databases-are-fun-again/" target="_blank">a post by the well-known metajack</a> (his blog is mainly about xmpp) about couchdb and I knew the time as come for me to be different. I had to try it so I opened a terminal and wrote <em>sudo apt-get install couchdb</em>. This was the beginning of a great adventure for me&#8230;</p>
<p>What&#8217;s the link between CouchDB and Javascript? <strong>CouchDB is completly JSON</strong>. You can write <a href="http://jchris.mfdz.com/posts/129" target="_blank">an application that is completly JSON/Ajax</a> without a single line of PHP/Ruby/Python/whatever.</p>
<p>I&#8217;m currently writing a simple app for CouchDB and this is the first of some posts about writing an app with CouchDB. I currently use version 0.8.0 and I ran through a lot of problems and I wish these posts will <strong>help you succeeding in building an application supported by CouchDB without all the hassle I went through</strong>.</p>
<p>Because my main project is <a href="http://www.timmyontime.com/" target="_self">TimmyOnTime</a> (and don&#8217;t forget to check out our new blog <a href="http://behindtheclock.timmyontime.com/" target="_blank">behind the clock</a>), I will work partial-time on this project so it might not go as fast as I (and you) want. But don&#8217;t despair, you will still be ahead of the trend when NRBDMS will go mainstream.</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~f/JavascriptKata?a=N2Xps2LM"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=N2Xps2LM" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=WrQlIF5Y"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=WrQlIF5Y" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=myr5dUbP"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=131" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=bf0x30KO"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=bf0x30KO" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=1Zpxf46c"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=52" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.javascriptkata.com/2009/01/12/be-ahead-of-the-trend-try-couchdb/feed/</wfw:commentRss>
		<feedburner:origLink>http://www.javascriptkata.com/2009/01/12/be-ahead-of-the-trend-try-couchdb/</feedburner:origLink></item>
		<item>
		<title>Cleanest way of executing javascript code on page load</title>
		<link>http://feedproxy.google.com/~r/JavascriptKata/~3/DxMz8bHMq6k/</link>
		<comments>http://www.javascriptkata.com/2008/12/01/cleanest-way-of-executing-javascript-code-on-page-load/#comments</comments>
		<pubDate>Mon, 01 Dec 2008 15:01:08 +0000</pubDate>
		<dc:creator>Dan</dc:creator>
		
		<category><![CDATA[white belt]]></category>

		<guid isPermaLink="false">http://www.javascriptkata.com/?p=69</guid>
		<description><![CDATA[Everytime that I work on a new project, I'm always unsure about which way to execute javascript on page load.]]></description>
			<content:encoded><![CDATA[<p>Everytime that I work on a new project, I&#8217;m always unsure about which way to execute javascript on page load. These are the different techniques :</p>
<h3>Your old buddy body.onload()</h3>
<p>The safest way to execute javascript when a page loads is to use the body.onLoad method.</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">&lt;body onload=&quot;doSomething();&quot;&gt;&lt;/body&gt;</div>
</li>
</ol>
</div>
<h3>The document.ready function with jquery</h3>
<p>This technique requires jquery and is similar to the <strong>body.onLoad technique</strong> (see above).</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">&lt;body&gt;&lt;script&gt;$(document).ready()&lt;/script&gt;&lt;/body&gt;</div>
</li>
</ol>
</div>
<p>The problem is that I don&#8217;t like that the javascript code is too close to the HTML code. There&#8217;s really something that I don&#8217;t like.</p>
<h3>The #ID.ready</h3>
<p><strong>DO NOT USE!</strong> It doesn&#8217;t work. At first, I tought that this technique worked but in fact, even if the element corresponding to the ID doesn&#8217;t exists, the function is called. To understand it better, I&#8217;ll give you an example. Suppose that I want to load a user list with ajax after the page load and that list correspond to <strong>ul#users</strong>, I&#8217;d write the following code</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">$<span class="br0">&#40;</span><span class="st0">&quot;ul#users&quot;</span><span class="br0">&#41;</span>.<span class="me1">ready</span><span class="br0">&#40;</span><span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp; loadUsersWithAjax<span class="br0">&#40;</span><span class="br0">&#41;</span>;</div>
</li>
<li class="li1">
<div class="de1"><span class="br0">&#125;</span><span class="br0">&#41;</span>;</div>
</li>
</ol>
</div>
<p>Unfortunately, it doesn&#8217;t work.</p>
<h3>The document.ready + #ID.each</h3>
<p>After the failure of the #ID.ready technique (see above), I tried a similar thing that is working but ugly looking. Suppose I want to do the same as above, I&#8217;d write this :</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">$<span class="br0">&#40;</span>document<span class="br0">&#41;</span>.<span class="me1">ready</span><span class="br0">&#40;</span><span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp; $<span class="br0">&#40;</span><span class="st0">&quot;ul#users&quot;</span><span class="br0">&#41;</span>.<span class="me1">each</span><span class="br0">&#40;</span><span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp; &nbsp; &nbsp; loadUsersWithAjax<span class="br0">&#40;</span><span class="br0">&#41;</span>;</div>
</li>
<li class="li1">
<div class="de1">&nbsp; <span class="br0">&#125;</span><span class="br0">&#41;</span>;</div>
</li>
<li class="li2">
<div class="de2"><span class="br0">&#125;</span><span class="br0">&#41;</span>;</div>
</li>
</ol>
</div>
<p>That way, it would execute the loadUsersWithAjax() method for each <strong>ul#users</strong> and because element IDs are unique to a page, the method would be called only once. It looks bad but it&#8217;s the &#8220;prettiest&#8221; way I found of executing javascript code on page load.</p>
<p>Now, I want to know <strong>what would you suggest? Which technique is your?</strong></p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~f/JavascriptKata?a=CEgFE2u8"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=CEgFE2u8" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=mMSqAgt7"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=mMSqAgt7" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=M9sm2vkM"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=131" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=frdZGHgR"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=frdZGHgR" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=E5fhXDlF"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=52" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.javascriptkata.com/2008/12/01/cleanest-way-of-executing-javascript-code-on-page-load/feed/</wfw:commentRss>
		<feedburner:origLink>http://www.javascriptkata.com/2008/12/01/cleanest-way-of-executing-javascript-code-on-page-load/</feedburner:origLink></item>
		<item>
		<title>JavascriptKata now ad free</title>
		<link>http://feedproxy.google.com/~r/JavascriptKata/~3/kZXbxVR-Ohw/</link>
		<comments>http://www.javascriptkata.com/2008/11/28/javascriptkata-now-ad-free/#comments</comments>
		<pubDate>Fri, 28 Nov 2008 17:11:41 +0000</pubDate>
		<dc:creator>Dan</dc:creator>
		
		<category><![CDATA[white belt]]></category>

		<guid isPermaLink="false">http://www.javascriptkata.com/?p=68</guid>
		<description><![CDATA[JavascriptKata was created in the blog bubble. In a time when all you had to do was to create a blog, put ads on it and you were rich. It never was true. The ads on this blog gave me about 100$ in a year so I finally felt discouraged and left it for dead. [...]]]></description>
			<content:encoded><![CDATA[<p>JavascriptKata was created in the blog bubble. In a time when <cite>all you had to do was to create a blog, put ads on it and you were rich</cite>. It never was true. The ads on this blog gave me about 100$ in a year so I finally felt discouraged and left it for dead. Nevertheless, this blog as a good share of traffic and more subscribers in the feed than any blog that I&#8217;ve owned/I own/will own. In fact, I call it a blog but it&#8217;s not really a blog. I used wordpress and that&#8217;s the main reason why I&#8217;m calling it a blog.</p>
<p>I tried several things to keep my interest in writing about javascript but they all failed because there was the devil saying &#8220;anyways, you don&#8217;t make any money out of it&#8221;. But there was the angel saying &#8220;maybe you don&#8217;t make money but you like javascript and should continue to write about it&#8221;. As usual, the devil won.</p>
<p>I won&#8217;t try to make another revival of this blog but I&#8217;ll try to write more about little things that happens between me and javascript, about the daily problems that I encounter. I&#8217;ll write a lot about <a href="http://www.jquery.com" target="_blank">jquery</a> too since for me, there can be no javascript without jquery.</p>
<p>Thanks to all of you!</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~f/JavascriptKata?a=7zea4SbF"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=7zea4SbF" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=5VX58Dq2"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=5VX58Dq2" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=NbhVm8HQ"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=131" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=nt5l7AMK"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=nt5l7AMK" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=BDvOsb8o"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=52" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.javascriptkata.com/2008/11/28/javascriptkata-now-ad-free/feed/</wfw:commentRss>
		<feedburner:origLink>http://www.javascriptkata.com/2008/11/28/javascriptkata-now-ad-free/</feedburner:origLink></item>
		<item>
		<title>Load a page with javascript</title>
		<link>http://feedproxy.google.com/~r/JavascriptKata/~3/-o1HouhMXNI/</link>
		<comments>http://www.javascriptkata.com/2008/02/12/load-a-page-with-javascript/#comments</comments>
		<pubDate>Tue, 12 Feb 2008 14:31:20 +0000</pubDate>
		<dc:creator>Dan</dc:creator>
		
		<category><![CDATA[Ask Dan a javascript question]]></category>

		<category><![CDATA[white belt]]></category>

		<guid isPermaLink="false">http://www.javascriptkata.com/2008/02/12/load-a-page-with-javascript/</guid>
		<description><![CDATA[Someone asked me : "I would like this site to automatically load a certain page (1-31) depending on what day of the month it is (1-31)"]]></description>
			<content:encoded><![CDATA[<p>I receive javascript-related questions in my inbox from time to time and here&#8217;s the last one.</p>
<blockquote><p> I am ok with HTML but awfully new to JavaScript and I know very little at this point. My question is for this web site I&#8217;m building. I need to know the exact JavaScript code and placement of the code in an HTML document for this goal. I would like this site to <strong>automatically load a certain page (1-31) depending on what day of the month it is (1-31)</strong>. I don&#8217;t need to worry about what month or year it is, just the date in the month. For instance when it is the eleventh day in the month, page11.html will automatically load when you click on to the site. I would like it to take the time(Date) from the client side not the server. This way no mater what time zone your in the right HTML page will pop up at midnight.</p></blockquote>
<p>Most people can&#8217;t give the <em>exact javascript code placement of the code in an HTML document</em> because it would always be buggy. They can give hints and/or snippets of code but rarely a complete working piece. Sorry&#8230;</p>
<p>Secondly, relying on javascript to do all this work would be a mistake because <strong>if javascript is disabled, the site will not work</strong>. Most users have javascript enabled but you should always think about web-crawlers (google, yahoo!, etc) that will try to index your page but will hit an empty page.</p>
<p>It&#8217;s always hard to guess all the reasons why someone would want a different page everyday of the month and I don&#8217;t know more about the project than what is written above. Considering this, maybe there are just parts of the page that are changing everyday and you could load them on the server-side thus having a single page loading including other pages depending on the day. The problem is that you would have to ask the timezone of the user and keep it in a cookie.</p>
<p>Just remember, <strong>javascript should not be a requirement to navigate in a site</strong>.</p>
<p>Finally, if I would really want to load a complete new page in javascript, I would do the following.</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1"><span class="kw2">var</span> dayOfTheMonth = <span class="br0">&#40;</span><span class="kw2">new</span> Date<span class="br0">&#40;</span><span class="br0">&#41;</span><span class="br0">&#41;</span>.<span class="me1">getDate</span><span class="br0">&#40;</span><span class="br0">&#41;</span>;</div>
</li>
<li class="li1">
<div class="de1">location.<span class="me1">href</span>=<span class="st0">&quot;page&quot;</span> + dayOfTheMonth.<span class="me1">toString</span><span class="br0">&#40;</span><span class="br0">&#41;</span> + <span class="st0">&quot;.html&quot;</span>;</div>
</li>
</ol>
</div>
<p style="margin-bottom: 2em">&nbsp;</p>
<p>This is the way I would do it, <strong>do you have any other suggestions?</strong></p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~f/JavascriptKata?a=on6bCxvY"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=on6bCxvY" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=l3SpQmnp"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=l3SpQmnp" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=bk1r9nM4"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=131" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=5TMC5zHj"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=5TMC5zHj" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=Ihf2ruPp"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=52" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.javascriptkata.com/2008/02/12/load-a-page-with-javascript/feed/</wfw:commentRss>
		<feedburner:origLink>http://www.javascriptkata.com/2008/02/12/load-a-page-with-javascript/</feedburner:origLink></item>
		<item>
		<title>Javascript for PHP lovers</title>
		<link>http://feedproxy.google.com/~r/JavascriptKata/~3/VjMkX3qRAl0/</link>
		<comments>http://www.javascriptkata.com/2008/01/30/javascript-for-php-lovers/#comments</comments>
		<pubDate>Wed, 30 Jan 2008 12:57:23 +0000</pubDate>
		<dc:creator>Dan</dc:creator>
		
		<category><![CDATA[Echo chamber]]></category>

		<category><![CDATA[librairie]]></category>

		<category><![CDATA[php]]></category>

		<guid isPermaLink="false">http://www.javascriptkata.com/2008/01/30/javascript-for-php-lovers/</guid>
		<description><![CDATA[I&#8217;m not a PHP guy and I like to use standards for the languages I&#8217;m using so this php.js thing is not for me at all. In fact, I really dislike PHP and though I use it often, there is no reason in the world I would want to use its syntax to write javascript.
Import [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;m not a PHP guy and I like to use standards for the languages I&#8217;m using so this <a href="http://kevin.vanzonneveld.net/techblog/article/javascript_equivalent_for_phps_strrpos/" target="_blank">php.js</a> thing is not for me at all. In fact, <a href="http://ihatephp.net/" target="_blank">I really dislike PHP</a> and though I use it often, there is no reason in the world I would want to use its syntax to write javascript.</p>
<p>Import the <a href="http://kevin.vanzonneveld.net/code/php_equivalents/php.js" target="_blank">librairie</a> (<a href="http://kevin.vanzonneveld.net/code/php_equivalents/php.packed.js" target="_blank">packed</a>) and write javascript like you never wrote it before.</p>
<p>Example, you want to use the good ol&#8217; <a href="http://ca3.php.net/strrpos" target="_blank">strrpos</a> to <em>find position of last occurrence of a char in a string (example from the site)</em></p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">strrpos<span class="br0">&#40;</span><span class="st0">&#8216;Kevin van Zonneveld&#8217;</span>, <span class="st0">&#8216;e&#8217;</span><span class="br0">&#41;</span>;</div>
</li>
</ol>
</div>
<p>would return <strong>16</strong>.</p>
<p>But what happens if a non-PHP guy as to modify your PHPed javascript?</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~f/JavascriptKata?a=bY18V5KG"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=bY18V5KG" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=p09QIKEG"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=p09QIKEG" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=W4TpBBLr"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=131" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=ukcym5BM"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=ukcym5BM" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=Wdzm97Y2"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=52" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.javascriptkata.com/2008/01/30/javascript-for-php-lovers/feed/</wfw:commentRss>
		<feedburner:origLink>http://www.javascriptkata.com/2008/01/30/javascript-for-php-lovers/</feedburner:origLink></item>
		<item>
		<title>How to have jQuery and prototype.js in the same project</title>
		<link>http://feedproxy.google.com/~r/JavascriptKata/~3/R9EwKiiuhhk/</link>
		<comments>http://www.javascriptkata.com/2008/01/28/how-to-have-jquery-and-prototypejs-in-the-same-project/#comments</comments>
		<pubDate>Mon, 28 Jan 2008 11:02:41 +0000</pubDate>
		<dc:creator>Dan</dc:creator>
		
		<category><![CDATA[black belt]]></category>

		<category><![CDATA[how to]]></category>

		<category><![CDATA[librairies]]></category>

		<guid isPermaLink="false">http://www.javascriptkata.com/2008/01/28/how-to-have-jquery-and-prototypejs-in-the-same-project/</guid>
		<description><![CDATA[I&#8217;m a big fan of jQuery. This librarie is just the best and simplest one around. I really noticed it when I wanted to get rid of jQuery in TimmyOnTime and try to use prototype.js instead, just to be more &#8220;rails-oriented&#8221; (that&#8217;s a pretty lame excuse don&#8217;t you think?)
Why I didn&#8217;t like prototype.js
There was not [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;m a big fan of <a href="http://jquery.com/" target="_blank">jQuery</a>. This librarie is just the <strong>best</strong> and <strong>simplest</strong> one around. I really noticed it when I wanted to get rid of jQuery in <a href="http://timmyontime.com/" target="_blank">TimmyOnTime</a> and try to use <a href="http://www.prototypejs.org/" target="_blank">prototype.js</a> instead, just to be more &#8220;rails-oriented&#8221; (that&#8217;s a pretty lame excuse don&#8217;t you think?)</p>
<h3>Why I didn&#8217;t like prototype.js</h3>
<p>There was not a lot of javascript written for the project so I thought that getting rid of jQuery and using prototype.js would be easy. It turned out to be hell on earth. <strong>Prototype.js made me feel like I was back in the 90s writing C++</strong>. A simple click event turns out to be a awful lot of ugly code with ugly function names.</p>
<p>Example, <strong>if I wanted to show the content of a DIV I clicked</strong> in prototype.js, I would use things like <a href="http://www.prototypejs.org/api/event/observe" target="_blank">Event.observe</a>, <a href="http://www.prototypejs.org/api/function/bindAsEventListener" target="_blank">bindAsEventListener</a>, a mix of native DOM element and prototype.js element, and worst of all, an <a href="http://www.prototypejs.org/api">unintelligible documentation</a>.</p>
<p>jQuery as a complete different way of doing it in a single easy-to-understand line :<br />
<em>$(&#8221;#a_div&#8221;).click(function() { alert($(this).text()); });</em>.<br />
As simple as that!</p>
<h3>The problem</h3>
<p>I wanted to use some interface element in Rails that requires prototype.js so I had to have both librairies. The problem is that there&#8217;s a conflict between them. Prototype.js doesn&#8217;t seem to give a damn about it but jQuery is nicer with you. It offers a <a href="http://docs.jquery.com/Core/jQuery.noConflict" target="_blank">noConflict</a> method.</p>
<p><strong>With Rails</strong>, prototype.js is the default librairie so to override this, you could do</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">&lt;%= javascript_include_tag &quot;prototype&quot;, &quot;jquery&quot; %&gt;
</div>
</li>
<li class="li1">
<div class="de1">&lt;script&gt;$j = jQuery.noConflict();&lt;/script&gt;</div>
</li>
</ol>
</div>
<p>This way, you will have to use <strong>$j</strong> instead of <strong>$</strong> to call jQuery.<strong>$</strong> would still call prototype.</p>
<p>Another thing you could do is to use <a href="http://ennerchi.com/projects/jrails" target="_blank">jQuery on Rails</a> and don&#8217;t give a damn about scriptaculous. I personally prefer to use librairies that are fully tested instead of using a &#8220;by-pass&#8221; that could break my code. It&#8217;s your choice&#8230;</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~f/JavascriptKata?a=jSnxEvHM"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=jSnxEvHM" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=obng6kWp"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=obng6kWp" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=OwX9WBfg"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=131" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=t8mVmTVf"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=t8mVmTVf" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=aMoGD6af"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=52" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.javascriptkata.com/2008/01/28/how-to-have-jquery-and-prototypejs-in-the-same-project/feed/</wfw:commentRss>
		<feedburner:origLink>http://www.javascriptkata.com/2008/01/28/how-to-have-jquery-and-prototypejs-in-the-same-project/</feedburner:origLink></item>
		<item>
		<title>Flot : a new plotting plugin for jQuery</title>
		<link>http://feedproxy.google.com/~r/JavascriptKata/~3/bzu84fRGxUs/</link>
		<comments>http://www.javascriptkata.com/2008/01/21/flot-a-new-plotting-plugin-for-jquery/#comments</comments>
		<pubDate>Mon, 21 Jan 2008 13:18:01 +0000</pubDate>
		<dc:creator>Dan</dc:creator>
		
		<category><![CDATA[Echo chamber]]></category>

		<category><![CDATA[jquery]]></category>

		<category><![CDATA[plotting]]></category>

		<guid isPermaLink="false">http://www.javascriptkata.com/2008/01/21/flot-a-new-plotting-plugin-for-jquery/</guid>
		<description><![CDATA[As you probably know, I&#8217;m a big fan of jQuery because it is more integrated with CSS than scriptaculous. Someone have made a new plotting plugin for jQuery called Flot and this is awesome. The examples are really looking good.
]]></description>
			<content:encoded><![CDATA[<p>As you probably know, I&#8217;m a big fan of <a href="http://jquery.com" target="_blank">jQuery</a> because it is more integrated with CSS than scriptaculous. Someone have made a new plotting plugin for jQuery called <a href="http://code.google.com/p/flot/" target="_blank">Flot</a> and this is awesome. The <a href="http://people.iola.dk/olau/flot/examples/" target="_blank">examples</a> are really looking good.</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~f/JavascriptKata?a=r8fvY5XA"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=r8fvY5XA" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=cLl4GId7"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=cLl4GId7" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=WghhuFvV"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=131" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=yF5Z4s9E"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=yF5Z4s9E" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=G7Rdx36R"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=52" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.javascriptkata.com/2008/01/21/flot-a-new-plotting-plugin-for-jquery/feed/</wfw:commentRss>
		<feedburner:origLink>http://www.javascriptkata.com/2008/01/21/flot-a-new-plotting-plugin-for-jquery/</feedburner:origLink></item>
		<item>
		<title>Intuitive Date Input Selection : a calendar with a special twist</title>
		<link>http://feedproxy.google.com/~r/JavascriptKata/~3/l8Sub1shIcc/</link>
		<comments>http://www.javascriptkata.com/2008/01/15/intuitive-date-input-selection-a-calendar-with-a-special-twist/#comments</comments>
		<pubDate>Wed, 16 Jan 2008 04:48:50 +0000</pubDate>
		<dc:creator>Dan</dc:creator>
		
		<category><![CDATA[Echo chamber]]></category>

		<category><![CDATA[date picker]]></category>

		<guid isPermaLink="false">http://www.javascriptkata.com/2008/01/15/intuitive-date-input-selection-a-calendar-with-a-special-twist/</guid>
		<description><![CDATA[If you&#8217;re a javascripter, chances are that you coded an infamous javascript calendar in your life. I saw somewhere that at the moment of his death, an normal javascripter will have coded an average of 7.4 javascript calendar. If we estimate that there is 2.3 million javascripters in the world, it means that there will [...]]]></description>
			<content:encoded><![CDATA[<p>If you&#8217;re a javascripter, chances are that you coded an infamous javascript calendar in your life. I saw somewhere that <strong>at the moment of his death, an normal javascripter will have coded an average of 7.4 javascript calendar</strong>. If we estimate that there is 2.3 million javascripters in the world, it means that there will be about 1<strong>7 020 000 javascript calendar</strong> when the first generation of javascripter will be extinct. I don&#8217;t remember where I was those numbers but I guess they are accurate&#8230;</p>
<p>Today I will present 13.51% of all the calendars that Nathaniel Brown will have done in his life : <a href="http://datetime.toolbocks.com/" target="_blank">DateTime Toolbocks</a>. But this one has a little twist. Apart being an ugly looking calendar that shows up when you click on an ugly looking icon, it has an <strong>intuitive date input selection</strong>. It means that it parses natural language and transform it into a datetime value. You want to select a date to be <strong>last week</strong>? You simply write <strong>last week</strong> and the date will be <strong>last week</strong>.</p>
<p><img src="http://www.javascriptkata.com/wp-content/uploads/2008/01/calendar.png" alt="Intuitive Date Input Selection" /></p>
<p>But there&#8217;s a lot more of possible (taken from the site)</p>
<ul id="examples">
<li>Today</li>
<li>tod</li>
<li>tomorrow</li>
<li>tom</li>
<li>yesterday</li>
<li>6</li>
<li>6th</li>
<li>6th October</li>
<li>3rd of Feb</li>
<li>10th Feb 2004</li>
<li>14th of Februrary</li>
<li>12 feb</li>
<li>1 ja</li>
<li>mon</li>
<li>Friday</li>
<li>next Friday</li>
<li>next fri</li>
<li>next m</li>
<li>last Monday</li>
<li>last mon</li>
<li>last m</li>
<li>2004-8-8 (ISO)</li>
<li>2004-04-04</li>
<li>1/24/2005 (US)</li>
<li>4/26</li>
<li>10-24-2005</li>
<li>Next Week</li>
<li>Last Year</li>
<li>Next Month</li>
<li>18.11.2004</li>
<li>2 years ago</li>
<li>ten days from now</li>
<li>11 years from today</li>
</ul>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~f/JavascriptKata?a=J38rl6MD"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=J38rl6MD" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=3t7fUBOo"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=3t7fUBOo" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=UDpG5WKr"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=131" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=9kIOXrbJ"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=9kIOXrbJ" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=Ok24kQFo"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=52" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.javascriptkata.com/2008/01/15/intuitive-date-input-selection-a-calendar-with-a-special-twist/feed/</wfw:commentRss>
		<feedburner:origLink>http://www.javascriptkata.com/2008/01/15/intuitive-date-input-selection-a-calendar-with-a-special-twist/</feedburner:origLink></item>
		<item>
		<title>Tips on bookmarklet</title>
		<link>http://feedproxy.google.com/~r/JavascriptKata/~3/Q6f1jXQogt8/</link>
		<comments>http://www.javascriptkata.com/2008/01/14/tips-on-bookmarklet/#comments</comments>
		<pubDate>Mon, 14 Jan 2008 12:01:48 +0000</pubDate>
		<dc:creator>Dan</dc:creator>
		
		<category><![CDATA[Echo chamber]]></category>

		<category><![CDATA[bookmarklet]]></category>

		<guid isPermaLink="false">http://www.javascriptkata.com/2008/01/14/tips-on-bookmarklet/</guid>
		<description><![CDATA[Gary Haran wrote stuff you should know about bookmarklet and answer the question that's on everybody's lips]]></description>
			<content:encoded><![CDATA[<p>Gary Haran wrote <a href="http://www.garyharan.com/index.php/2008/01/04/cross-browser-bookmarklets-stuff-you-should-know/" target="_blank">stuff you should know about bookmarklet</a> and answer the question that&#8217;s on everybody&#8217;s lips : <strong>what is the maximum number of characters that a bookmarklet can have?</strong> And the answer is&#8230; <strong>508</strong>!</p>
<p>I also wrote a complete article on <a href="http://www.javascriptkata.com/2007/04/19/how-to-do-a-bookmarklet-with-javascript/">how to write a bookmarklet</a>.</p>
<div class="feedflare">
<a href="http://feeds.feedburner.com/~f/JavascriptKata?a=FvO6zSug"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=FvO6zSug" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=qKcpEFNW"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=qKcpEFNW" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=OTNXg3GG"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=131" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=j3p5V5J2"><img src="http://feeds.feedburner.com/~f/JavascriptKata?i=j3p5V5J2" border="0"></img></a> <a href="http://feeds.feedburner.com/~f/JavascriptKata?a=OhKemW0P"><img src="http://feeds.feedburner.com/~f/JavascriptKata?d=52" border="0"></img></a>
</div>]]></content:encoded>
			<wfw:commentRss>http://www.javascriptkata.com/2008/01/14/tips-on-bookmarklet/feed/</wfw:commentRss>
		<feedburner:origLink>http://www.javascriptkata.com/2008/01/14/tips-on-bookmarklet/</feedburner:origLink></item>
	</channel>
</rss>
