<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	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:sy="http://purl.org/rss/1.0/modules/syndication/"
	>

<channel>
	<title>echolibre blog &#187; json</title>
	<atom:link href="http://blog.echolibre.com/category/json/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.echolibre.com</link>
	<description></description>
	<pubDate>Tue, 25 May 2010 13:52:16 +0000</pubDate>
	<generator>http://wordpress.org/?v=2.7</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>CouchDB, the project, the crowd</title>
		<link>http://blog.echolibre.com/2009/09/couchdb-the-project-the-crowd/</link>
		<comments>http://blog.echolibre.com/2009/09/couchdb-the-project-the-crowd/#comments</comments>
		<pubDate>Mon, 07 Sep 2009 10:04:25 +0000</pubDate>
		<dc:creator>David</dc:creator>
		
		<category><![CDATA[couchdb]]></category>

		<category><![CDATA[echolibre]]></category>

		<category><![CDATA[industry]]></category>

		<category><![CDATA[innovation]]></category>

		<category><![CDATA[json]]></category>

		<category><![CDATA[databases]]></category>

		<category><![CDATA[technology]]></category>

		<guid isPermaLink="false">http://blog.echolibre.com/?p=559</guid>
		<description><![CDATA[There are many decisions involved when using new technologies and new products. Many people will often go for open source software because it&#8217;s free and you can modify the code. To me being &#8220;an open source&#8221; project involves a whole lot more than simply having an opened code base that you can modify and use [...]]]></description>
			<content:encoded><![CDATA[<p><img class="size-full wp-image-570 alignright" title="couchdb-logo" src="http://blog.echolibre.com/wp-content/uploads/2009/09/couchdb-logo.png" alt="couchdb-logo" width="125" height="101" align="right" />There are many decisions involved when using new technologies and new products. Many people will often go for open source software because it&#8217;s free and you can modify the code. To me being &#8220;an open source&#8221; project involves a whole lot more than simply having an opened code base that you can modify and use for free, but it also involves a large amount of factors as such as technical documentation, user examples, tools for a software, the community based around a project and the likes of actual response time from developers.</p>
<p>This article is a major Kudos to the <a title="CouchDB" href="http://couchdb.apache.org/">CouchDB</a> developers. In particular I would like to thank <a title="Jan Lenhardt " href="http://jan.prima.de/">Jan Lehnardt</a>, <a title="Paul J. Davis" href="http://www.davispj.com/">Paul J. Davis</a> and <a title="Robert Newton" href="http://github.com/rnewson">Robert Newson</a> from the CouchDB fame. Let me explain why&#8230;</p>
<p><span id="more-559"></span></p>
<p>For all the skeptics (As I was and still am with some concepts) I have to admit that jumping both feet into CouchDB is scary, especially coming from an <a title="RDBMS Wikipedia" href="http://en.wikipedia.org/wiki/Relational_database_management_system">RDBMS</a>-core background. I think in joins, I see relations, I&#8217;m a normalized database person. Coming with the idea that de-normalization can actually be ok if it&#8217;s done correctly was hell for me.</p>
<p>So the first things we did when using Couch was creating databases, until then, in my head, using &#8220;many&#8221; databases was always a big no-no simply because it was making management of connections and everything hectic. However, with CouchDB it&#8217;s a bit different and that&#8217;s a concept that Jan helped me understand and it can indeed be correctly done if planned thoroughly.</p>
<p>After finding myself in many dead-ends after starting CouchDB, the previously mentioned helpers were always there even for the simplest, most ridiculous questions I could have answered myself by re-reading my questions.</p>
<p>Imagine the following scenario where you have a list of documents that have two fields. &#8220;<strong>time</strong>&#8221; and &#8220;<strong>type</strong>&#8220;. the &#8220;<strong>type</strong>&#8221; field can be either &#8220;<strong>love</strong>&#8221; or &#8220;<strong>hate</strong>&#8221; and and &#8220;<strong>time</strong>&#8221; field is a <strong>unix timestamp (php -r &#8216;echo time() . PHP_EOL;&#8217;)</strong>.</p>
<p>We need to create <a title="CouchDB views" href="http://wiki.apache.org/couchdb/Using_Views">views</a> in order to retrieve the data. The first scenario involves counting the amount of types. So how many documents with type &#8220;<strong>love</strong>&#8221; and how many documents (entries) with the field type with value &#8220;<strong>hate</strong>&#8220;.</p>
<p>You will mostly likely have to do a reduce function as well as your view. So using <a title="Futon, getting started couchdb" href="http://wiki.apache.org/couchdb/Getting_started_with_Futon">futon</a> you can create your simple view that&#8217;ll look like such:</p>
<p>View:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span>doc<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
    <span style="color: #000066; font-weight: bold;">if</span><span style="color: #009900;">&#40;</span>doc.<span style="color: #660066;">type</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
        emit<span style="color: #009900;">&#40;</span>doc.<span style="color: #660066;">type</span><span style="color: #339933;">,</span> <span style="color: #CC0000;">1</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
    <span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p>and your reduce function to look somewhat like:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span>key<span style="color: #339933;">,</span> values<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
    <span style="color: #000066; font-weight: bold;">return</span> sum<span style="color: #009900;">&#40;</span>values<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p>Now Save this as design document &#8220;<strong>example</strong>&#8221; and view name &#8220;<strong>countdocbytype</strong>&#8220;. (See image below)</p>
<p><img class="alignnone size-full wp-image-590" title="couch-view-key1" src="http://blog.echolibre.com/wp-content/uploads/2009/09/couch-view-key1.png" alt="couch-view-key1" width="580" height="94" /></p>
<p>This is all very nice but what does that give you the ability of doing? Remember that &#8220;<strong>WHERE type = &#8216;get&#8217;</strong>&#8221; in SQL? Well now that you saved that view you can effectively search on the key you are returning in your <a title="CouchDB introduction to views" href="http://wiki.apache.org/couchdb/Introduction_to_CouchDB_views">emit()</a> function. In this case you are returning the <strong>doc.type</strong> thus &#8220;<strong>hate</strong>&#8221; or &#8220;<strong>love</strong>&#8221; which means that if you want to get a count of type &#8220;hate&#8221; you will invoke your view as such:</p>
<blockquote><p><em>http://localhost:5984/databasename/_design/example/_view/countdocbytype?group=true&amp;key=&#8221;hate&#8221;</em></p></blockquote>
<p>Remember that this is all JSON lovin&#8217; so the key you are passing has to be JSON encoded (So <em>key=&#8221;<strong>hate</strong>&#8220;</em> instead of key=hate). This view (Query for SQL people) will return a count of entries/documents with the field &#8220;<strong>type</strong>&#8221; that has the value &#8220;<strong>hate</strong>&#8221;</p>
<p>For the second example let&#8217;s introduce a new field in our documents, let&#8217;s name the field &#8220;<strong>phone</strong>&#8221; and it&#8217;ll be &#8220;<strong>iphone</strong>&#8221; and &#8220;<strong>android</strong>&#8220;. Update your documents and put as many &#8220;<strong>iphone</strong>&#8221; and &#8220;<strong>androids</strong>&#8221; as you want. The next example is going to be finding how many people hate iphones (This implies searching for a count of field &#8220;<strong>phone</strong>&#8221; with value &#8220;<strong>iphone</strong>&#8221; and field &#8220;<strong>type</strong>&#8221; with value &#8220;<strong>hate</strong>&#8220;).</p>
<p>Documents updated? Good.</p>
<p>Now let&#8217;s make our view:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span>doc<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
    <span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>doc.<span style="color: #660066;">phone</span> <span style="color: #339933;">&amp;&amp;</span> doc.<span style="color: #660066;">type</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
        <span style="color: #003366; font-weight: bold;">var</span> keys <span style="color: #339933;">=</span> <span style="color: #009900;">&#91;</span>doc.<span style="color: #660066;">phone</span><span style="color: #339933;">,</span> doc.<span style="color: #660066;">type</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span>
        emit<span style="color: #009900;">&#40;</span>keys<span style="color: #339933;">,</span> <span style="color: #CC0000;">1</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
    <span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p>and the reduce to return a sum of the values:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span>key<span style="color: #339933;">,</span> values<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
    <span style="color: #000066; font-weight: bold;">return</span> sum<span style="color: #009900;">&#40;</span>values<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p>In Futon it would look somewhat like:</p>
<p><img class="alignnone size-full wp-image-564" title="couch-view-keys-1" src="http://blog.echolibre.com/wp-content/uploads/2009/09/couch-view-keys-1.png" alt="couch-view-keys-1" width="580" height="97" /></p>
<p>With the results looking like:</p>
<p><img class="alignnone size-full wp-image-565" title="couch-view-keys-result" src="http://blog.echolibre.com/wp-content/uploads/2009/09/couch-view-keys-result.png" alt="couch-view-keys-result" width="578" height="60" /></p>
<p>So now again save it as design &#8220;<strong>example</strong>&#8221; and view name &#8220;<strong>countdocbyphoneandtype</strong>&#8221; and now you can invoke the following URL.</p>
<blockquote><p><em>http://localhost:5984/databasename/_design/example/_view/countdocbyphoneandtype?group=true&amp;key=["iphone", "hate"]</em></p></blockquote>
<p>As you can see, we are passing an array in the &#8220;<strong>key</strong>&#8221; field with the values &#8220;<strong>iphone</strong>&#8221; and &#8220;<strong>hate</strong>&#8220;. This retrieves all the &#8220;<strong>phone</strong>&#8221; fields with value &#8220;<strong>iphone</strong>&#8221; and then from that resultset all the field &#8220;<strong>type</strong>&#8221; with value &#8220;<strong>hate</strong>&#8220;. It gives us the following type of output:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #009900;">&#123;</span>
    <span style="color: #0000ff;">&quot;rows&quot;</span><span style="color: #339933;">:</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#123;</span>
        <span style="color: #0000ff;">&quot;key&quot;</span><span style="color: #339933;">:</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">&quot;iphone&quot;</span><span style="color: #339933;">,</span><span style="color: #0000ff;">&quot;hate&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span>
        <span style="color: #0000ff;">&quot;value&quot;</span><span style="color: #339933;">:</span><span style="color: #cc66cc;">2</span>
    <span style="color: #009900;">&#125;</span><span style="color: #009900;">&#93;</span>
<span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p>You now have a query that searches for &#8220;two&#8221; fields in your document.</p>
<p>I strongly suggest to read the wiki and anything related to views if you are remotely interested in using CouchDB as they are going to be your main source of nightmares and happiness. The latter example, was nicely explained to me on the IRC channel even though it was plain black and white on the wiki&#8230; Apparently I just couldn&#8217;t see it clearly enough. There are loads of little things with the views that require user experience instead of wiki reading and the people on the IRC channel have used CouchDB, they&#8217;ll get you by <img src='http://blog.echolibre.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p>Moving on, on top of many exciting upcoming features (as such as continuous replication, bulk inserts, etc.) the project has online documentation, online books for people to read for free (Even though I strongly recommend buying the book), a vibrant IRC channel with the nicest helpers from extensive users to software developers/creators to book authors.</p>
<p>When in need of direction, if you really can&#8217;t find it online or don&#8217;t understand how it&#8217;s explained, you can hop on the IRC channel and get your well formulated questions answered at all times. With a thorough patch review process and code quality insurance,in my opinion, it makes CouchDB a very solid open source project that should be respected and should serve as example for any new software that wants to make it into the open source world.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.echolibre.com/2009/09/couchdb-the-project-the-crowd/feed/</wfw:commentRss>
		</item>
		<item>
		<title>jQuery JSON Autocomplete</title>
		<link>http://blog.echolibre.com/2009/06/jquery-json-autocomplete/</link>
		<comments>http://blog.echolibre.com/2009/06/jquery-json-autocomplete/#comments</comments>
		<pubDate>Sat, 13 Jun 2009 12:14:40 +0000</pubDate>
		<dc:creator>David</dc:creator>
		
		<category><![CDATA[Open Source]]></category>

		<category><![CDATA[echolibre]]></category>

		<category><![CDATA[industry]]></category>

		<category><![CDATA[jquery]]></category>

		<category><![CDATA[json]]></category>

		<category><![CDATA[autocomplete]]></category>

		<category><![CDATA[javascript]]></category>

		<category><![CDATA[technology]]></category>

		<guid isPermaLink="false">http://blog.echolibre.com/?p=444</guid>
		<description><![CDATA[A number of people have asked me over the past few days how should one go about using jQuery Autocomplete but instead of using newline delimiters, with a URL that returns JSON data.
At first, I first had a hack that involved handling the &#8220;keyup&#8221; event myself then sending a request to a JSON URL, and [...]]]></description>
			<content:encoded><![CDATA[<p>A number of people have asked me over the past few days how should one go about using <a title="jQuery Autocomplete plugin" href="http://www.pengoworks.com/workshop/jquery/autocomplete.htm">jQuery Autocomplete</a> but instead of using newline delimiters, with a URL that returns <a title="Javascript Object Notation" href="http://www.json.org">JSON</a> data.</p>
<p>At first, I first had a hack that involved handling the &#8220;<a title="jquery keyup event." href="http://docs.jquery.com/Events/keyup">keyup</a>&#8221; event myself then sending a request to a JSON URL, and then involve the &#8220;autocompleteArray&#8221; method from Autocomplete. It was a mess considering that the autocomplete method is already sending the value of your defined input to the server as a GET parameter. I was repeating the behavior of the function in order to receive a simple JSON array. I was unhappy, and felt it to be a very annoying solution because I wanted to take advantage of the internal caching system of jQuery Autocomplete.</p>
<p>So I decided to give a look at the code and came up with a much cleaner solution. I directly added a JSON option to the Autocomplete. So for anyone interested you can find the patch here: <a title="jQuery Autocomplete JSON Patch" href="http://labs.echolibre.com/jquery/autocomplete/jquery.autocomplete-json.diff">jQuery Autocomplete JSON patch</a>.</p>
<p><span id="more-444"></span></p>
<p>The first step thing you&#8217;ll need is to patch Autocomplete using the patch command (Google patch) and then include the jQuery and Autocomplete JavaScript sources into your code.</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
</pre></td><td class="code"><pre class="html" style="font-family:monospace;">&lt;script type=&quot;text/javascript&quot; src=&quot;jquery.js&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;jquery.autocomplete.js&quot;&gt;&lt;/script&gt;
&lt;style type=&quot;text/css&quot;&gt;
    @import &quot;jquery.autocomplete.css&quot;;
&lt;/style&gt;</pre></td></tr></table></div>

<p>Once you are done, you need to setup your input field on which the autocomplete calls and function is going to be executed from.</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
</pre></td><td class="code"><pre class="html" style="font-family:monospace;">&lt;input type=&quot;text&quot; size=&quot;25&quot; id=&quot;input&quot; /&gt;</pre></td></tr></table></div>

<p>And of course you need to make the event hook to make sure your autocomplete is done but in the hook you need to make sure the new option &#8220;<span style="text-decoration: underline;">json</span>&#8221; is set to <span style="text-decoration: underline;">true</span>. This is how you proceed:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">$<span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
    $<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'#input'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">autocomplete</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'url.php'</span><span style="color: #339933;">,</span> <span style="color: #009900;">&#123;</span>json<span style="color: #339933;">:</span> <span style="color: #003366; font-weight: bold;">true</span><span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>

<p>The complete version should look somewhat like:</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
</pre></td><td class="code"><pre class="html" style="font-family:monospace;">&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&gt;
 &lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&gt;
  &lt;head&gt;
   &lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=UTF-8&quot; /&gt;
   &lt;style type=&quot;text/css&quot;&gt;
       @import &quot;jquery.autocomplete.css&quot;;
   &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
   &lt;label for=&quot;input&quot;&gt;Input any text&lt;/label&gt;
   &lt;input type=&quot;text&quot; id=&quot;input&quot; /&gt;
  &lt;/body&gt;
  &lt;script type=&quot;text/javascript&quot; src=&quot;jquery.js&quot;&gt;&lt;/script&gt;
  &lt;script type=&quot;text/javascript&quot; src=&quot;jquery.autocomplete.js&quot;&gt;&lt;/script&gt;
  &lt;script type=&quot;text/javascript&quot;&gt;
      $(function() {
          $('#input').autocomplete('url.php', {json: true});
      });
  &lt;/script&gt;
&lt;/html&gt;</pre></td></tr></table></div>

<p>You can even <a title="jQuery Autocomplete JSON example" href="http://labs.echolibre.com/jquery/autocomplete/">try it now if you want</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.echolibre.com/2009/06/jquery-json-autocomplete/feed/</wfw:commentRss>
		</item>
	</channel>
</rss>
