<?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/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Temperies Blog</title>
	<atom:link href="http://www.temperies.com/blog/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.temperies.com/blog</link>
	<description>Just another WordPress site</description>
	<lastBuildDate>Fri, 02 Mar 2012 19:51:48 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>(Español) Hello world! Selenium2 + .Net</title>
		<link>http://www.temperies.com/blog/2012/02/07/espanol-como-crear-un-proyecto-selenium/</link>
		<comments>http://www.temperies.com/blog/2012/02/07/espanol-como-crear-un-proyecto-selenium/#comments</comments>
		<pubDate>Tue, 07 Feb 2012 14:54:01 +0000</pubDate>
		<dc:creator>nvillarreal</dc:creator>
				<category><![CDATA[Quality Engineering]]></category>
		<category><![CDATA[Selenium]]></category>
		<category><![CDATA[webdriver]]></category>

		<guid isPermaLink="false">http://www.temperies.com/blog/?p=495</guid>
		<description><![CDATA[Sorry, this entry is only available in Español.]]></description>
			<content:encoded><![CDATA[<p>Sorry, this entry is only available in <a href="http://www.temperies.com/blog/es/feed/">Español</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.temperies.com/blog/2012/02/07/espanol-como-crear-un-proyecto-selenium/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Primeros Pasos en JMeter</title>
		<link>http://www.temperies.com/blog/2012/01/27/primeros-pasos-en-jmeter/</link>
		<comments>http://www.temperies.com/blog/2012/01/27/primeros-pasos-en-jmeter/#comments</comments>
		<pubDate>Fri, 27 Jan 2012 17:03:37 +0000</pubDate>
		<dc:creator>cbaquero</dc:creator>
				<category><![CDATA[Quality Engineering]]></category>
		<category><![CDATA[jmeter]]></category>
		<category><![CDATA[load test]]></category>
		<category><![CDATA[performance test]]></category>
		<category><![CDATA[pruebas de carga]]></category>
		<category><![CDATA[pruebas de performance]]></category>
		<category><![CDATA[test automation]]></category>
		<category><![CDATA[test tool]]></category>
		<category><![CDATA[testing]]></category>
		<category><![CDATA[testing automatizado]]></category>

		<guid isPermaLink="false">http://www.temperies.com/blog/?p=371</guid>
		<description><![CDATA[Sorry, this entry is only available in Español.]]></description>
			<content:encoded><![CDATA[<p>Sorry, this entry is only available in <a href="http://www.temperies.com/blog/es/feed/">Español</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.temperies.com/blog/2012/01/27/primeros-pasos-en-jmeter/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>NoSQL databases: What you should know about</title>
		<link>http://www.temperies.com/blog/2011/07/14/nosql-databases-what-you-should-know-about/</link>
		<comments>http://www.temperies.com/blog/2011/07/14/nosql-databases-what-you-should-know-about/#comments</comments>
		<pubDate>Thu, 14 Jul 2011 20:48:49 +0000</pubDate>
		<dc:creator>Nicolás Tourne</dc:creator>
				<category><![CDATA[Database]]></category>
		<category><![CDATA[cassandra]]></category>
		<category><![CDATA[database]]></category>
		<category><![CDATA[nosql]]></category>
		<category><![CDATA[RDBMS]]></category>
		<category><![CDATA[sql]]></category>

		<guid isPermaLink="false">http://www.temperies.com/blog/?p=227</guid>
		<description><![CDATA[Relational database model has been co-existing with us for around a quarter of a century -so much time, right?-, but a new class of database has emerged in the enterprise. I’m talking about NoSQL.
NoSQL, also known as “non-relational” or “cloud”, is a broad class of database management system with significant differences from a classic relational database management system (RDBMS). The stored data not require fixed table schemas. It usually avoids join operations and typically scale horizontally.]]></description>
			<content:encoded><![CDATA[<p>Relational database model has been co-existing with us for around a quarter of a century -<em>so much time, right?</em>-, but a new class of database has emerged in the enterprise. I’m talking about NoSQL.</p>
<p><a href="http://www.temperies.com/blog/wp-content/uploads/2011/07/just-say-nosql.png"><img class="aligncenter size-full wp-image-252" title="Just say NoSQL" src="http://www.temperies.com/blog/wp-content/uploads/2011/07/just-say-nosql.png" alt="" width="423" height="223" /><br />
</a></p>
<p><strong>What is NoSQL?</strong></p>
<p>NoSQL, also known as “non-relational” or “cloud”, is a broad class of database management system with significant differences from a classic relational database management system (RDBMS). The stored data not require fixed table schemas. It usually avoids join operations and typically scale horizontally.</p>
<p><strong>Architecture with NoSQL</strong></p>
<div id="_mcePaste">NoSQL database is characterized by a move away from the complexity of SQL based servers. The logic of validation, access control, mapping querieable indexed data, correlating related data, conflic resolution, maintaining integrity constraints and triggered procedures is moved out of the database layer. This enables NoSQL databases engines to focus on exceptional performance and scalability.</div>
<div id="_mcePaste">A key concept of NoSQL systems is to have DBs focus on the task of high-performance scalable data storage, and provide low-level access to data management layer.</div>
<div><a href="http://www.temperies.com/blog/wp-content/uploads/2011/07/Data-Management-Architecture.png"><img class="aligncenter size-full wp-image-251" title="Data Management Architecture" src="http://www.temperies.com/blog/wp-content/uploads/2011/07/Data-Management-Architecture.png" alt="" width="539" height="358" /></a></div>
<p><strong>Pros &amp; Cons</strong></p>
<div>Pros</div>
<div>
<div>
<ul>
<li><em>Improve performance</em> – Performance metrics have shown significant improvements vs relational access. For example, this performance metric compares MySQL vs Cassandra:<br />
Facebook Search<br />
MySQL &gt; 50 GB Data<br />
- Writes Average: ~300 ms<br />
- Reads Average: ~350 ms<br />
Rewritten with Cassandra &gt; 50 GB Data<br />
- Writes Average: 0.12 ms<br />
- Reads Average: 15 ms</li>
<li><em>Scaling</em> &#8211; NoSQL databases are designed to expand transparently and they’re usually designed with low-cost commodity hardware in mind.</li>
<li><em>Big data handling</em> – Over the last decade, the volumes of data has been increased massively. NoSQL systems can handle big data in the same way as the biggest RDBMS.</li>
<li><em>Less DBA time</em> – NoSQL databases are generally designed to requiere less management: automatic repair, data distribution and simpler data models.</li>
<li><em>Reduce costs</em> – RDBMS uses expensive proprietary servers and storage systems, while NoSQL databases user clusters of cheap commodity servers. So, the cost per gigabyte or transaction/second for NoSQL can be many time less.</li>
<li><em>Flexible data models</em> – NoSQL key-value stores and document databases allow the application to store virtually any structure it wants in a data element.</li>
</ul>
</div>
<div>Cons</div>
<div>
<ul>
<li><em>Maturity</em> – RDBMS systems are stable and richly functional. But most NoSQL alternatives are in pre-production versions with many key features yet to be implemented.</li>
<li><em>Support</em> – Most NoSQL systems are open source projects. There’re a couple of small companies offering support for each NoSQL database.</li>
<li><em>Analytics &amp; BI</em> – NoSQL databases do not offer facilities for ad-hoc query and analysis. Commonly used business intelligence tools do not provide connectivity to NoSQL systems.</li>
<li><em>Administration</em> – Although the design goal of NoSQL system is to provide a zero-admin solution, it’s true that requires a lot of skill to install and a lot of effort to maintain.</li>
<li><em>Expertise</em> – As NoSQL systems is a new paradigm, all developers are in a learning mode.</li>
</ul>
</div>
</div>
<div>
<div>
<br/><br />
<strong>Use a RDBMS or a NoSQL Database?</strong></p>
<div id="_mcePaste">Depends mainly on what you’re trying to achieve. It’s certainly mature enough to use. But few applications really need to scale that massively. For most, a traditional RDBMS is sufficient. However, with internet usage becoming more ubiquitous all the time, it’s quite likely that applications that do will become more common (though probably not dominant).</div>
</div>
</div>
<div>
<br/><br />
<strong>NoSQL Implementations</strong></p>
<div id="_mcePaste">There are currently more than 122 NoSQL databases. They can be categorized by their manner of implementation:</div>
<div>
<ul>
<li>Wide column store / column families &#8211; Cassandra, Hadoop, Hypertable, Cloudata, Cloudera, Amazon SimpleDB, SciDB</li>
<li>Document store &#8211; MongoDB, CouchDB, Terrastore, ThruDB, OrientDB, RavenDB, Citrusleaf, SisoDB</li>
<li>Key Value / Tuple store &#8211; Azure Table Storage, MEMBASE, Riak, Redis, Chordless, GenieDB, Scalaris, BerkeleyDB, MemcacheDB.</li>
<li>Eventually consistent Key Value store &#8211; Amazon Dynamo, Voldemort, Dynomite, KAI</li>
<li>Graph databases &#8211; Neo4J, Infinite Graph, Sones, InfoGrid, HyperGraphDB, Trinity, etc</li>
</ul>
</div>
<div>And others, and others…</div>
</div>
<div>
<br/><br />
<strong>Early Adopters of NoSQL</strong></p>
<div>Social media corporations as the primary traiblazers of NoSQL implementations. The list includes:</div>
</div>
<div>
<div>
<ul>
<li>Facebook</li>
<li>Twitter</li>
<li>MySpace</li>
<li>Google (Hadoop, Google App Engine)</li>
<li>Amazon (Dynamo)</li>
</ul>
</div>
<p><br/><br />
<strong> Books &amp; Papers Recomended</strong></p>
<ul>
<li>Professional NoSQL (Wiley/Wrox. 2011)</li>
<li>NoSQL Database Technology (CouchBase. 2011)</li>
<li>NoSQL Handbook (Mathias Meyer)</li>
<li>No Relation: The Mixed Blessings of Non-Relational Databases (Ian Thomas Varley. 2009)</li>
<li>Cassandra: The definitive guide (Even Hewitt. 2010)</li>
<li>CouchDB: The Definitive Guide: Time to Relax (J. Chris Anderson, Jan Lehnardt, Noah Slater. 2010)</li>
<li>Hadoop in Action (Chuck Lam. 2010)</li>
<li>HBase: The Definitive Guide (Lars George. 2011)</li>
<li>MongoDB in Action (Kyle Banker. 2010)</li>
<li>Beginning SimpleDB (Kevin Marshall, Tyler Freeling. 2009)</li>
</ul>
</div>
<div>
<br/><br />
<strong>Conclusions</strong></p>
<p>NoSQL databases solve problems which born with the global digital data growth, where the DBAs have been dealing with the well-known RDBMS.<br />
Outside of scalability, it really seems that NoSQL databases do not have a killer feature.<br />
Although, I think this is a new opportunity to become a professional on this paradigm.</p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.temperies.com/blog/2011/07/14/nosql-databases-what-you-should-know-about/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>The right way to use Javascript.</title>
		<link>http://www.temperies.com/blog/2011/07/08/the-right-way-to-use-javascript/</link>
		<comments>http://www.temperies.com/blog/2011/07/08/the-right-way-to-use-javascript/#comments</comments>
		<pubDate>Fri, 08 Jul 2011 19:58:22 +0000</pubDate>
		<dc:creator>Santiago Fuse</dc:creator>
				<category><![CDATA[Javascript development]]></category>
		<category><![CDATA[closures]]></category>
		<category><![CDATA[development]]></category>
		<category><![CDATA[front end]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[module pattern]]></category>

		<guid isPermaLink="false">http://www.temperies.com/blog/?p=88</guid>
		<description><![CDATA[The Javascript closure and the Module Pattern application. There can be different and several ideas about which is the best way to use Javascript in our pages towards encapsulate behaviors and actions of the elements in the DOM, and sure there are diferent points of view about this. I think and believe  as several people [...]]]></description>
			<content:encoded><![CDATA[<h1>The Javascript closure and the Module Pattern application.</h1>
<p>There can be different and several ideas about which is the best way to use Javascript in our pages towards encapsulate behaviors and actions of the elements in the DOM, and sure there are diferent points of view about this. I think and believe  as several people know that <strong>Module Pattern </strong>may be is the best way or <span class="short_text" lang="en"><span class="hps" title="Haz clic para obtener otras posibles traducciones">at least the clearest </span></span>. I usually make one file for each page within a Module Pattern named as the page.</p>
<p>Summarizing, the main idea of these examples is shows a way or &#8220;right&#8221; way to use Javascript and no matter which library or framework ( Jquery, Mootools, YUI, etc ) are you using. It is using closures in Javascript and the Module pattern to encapsulate the behaviors and functionalities of a given page.</p>
<h2><strong>The Javascript Closure.</strong></h2>
<p>I&#8217;m not going to suppose you have  knowledge in Javascript Closures,  in fact I&#8217;m going to define them and show you some simple examples of this powerful tool, or better, behavior.</p>
<p>See the following definition (variable scope).</p>
<p><strong><span style="color: #339966;">A closure are the local variables for a   function &#8211; kept alive after the    function has returned</span></strong>.</p>
<p>It is  simple to understand, the local variables still are in the variables stack and can be access after the function returns, the good way to understand always is by examples, please see the following examples.</p>
<pre><code>var a = function(param){
    var internalParameter = param;
    return function(){
        alert(internalParameter);
    } ;
}
var b = a(9);
b(); // Shows 9.
</code></pre>
<p>As you can see in the previous example (you should see the number 9), the returned  function still has access to the variable  <strong>internalParameter</strong> when the function &#8220;a&#8221;  has returned and the alert will be 9 as we would expect , this is one of the basic examples of the use of closures and this is the beginning of understanding and using the Module Pattern, in fact <strong>Module Pattern is one of the bigest example of closure</strong> in javascript.</p>
<p>By the way before we continue with the pattern I will show you some other examples of closure.</p>
<pre><code>function add(x) {
  var temp = 10;
  return function addToReturn(y) {
      alert( x + y + (temp++));
  };
}
var a = add(10);
a(10);
a(10);
a(10);
</code></pre>
<p>The previous example will give us 3 alerts,  will be 30, 31 and 32 and the variable temp is our closure in this case.</p>
<pre><code>function addButtons(numOfButtons) {
    var i, button;
    for(j = 0; j &lt; numOfButtons; j++) {
        button = document.createElement("button");
        button.innerHTML = "Button " + i;
        button.onclick = function() {
            alert('You just clicked Button, buttons count ' + numOfButtons );
        };

        document.body.appendChild(button);
    }
}
addButtons(6);
</code></pre>
<p>The previous code will add 6 buttons in the document and each button will have an event, when you click will show you just the number 6.</p>
<h2><strong>The Module Pattern.</strong></h2>
<p>Now, whe&#8217;re going to define and make some examples (I&#8217; ll try to be clear) about Module Pattern, the most clear definition I have found is &#8220;<strong><span style="color: #339966;">The Module Pattern means you define a variable as an anonymous function that gets immediately called with (). You define private functions and variables and return your public variables and functions as properties and methods of an anonymous object</span></strong>&#8220;.</p>
<p>To summarize the definition in a more clear way, this pattern  allows us to scope variables and  methods with both private and public  visibility, bellow I&#8217;m going to create an example to figure out the pattern, please see the following example being  &#8220;page&#8221; the name of the page  (would be great if you use the name of the page as the name of the module pattern , is a good custom).</p>
<pre><code>/* page.html */
&lt;html&gt;&lt;head&gt;&lt;title&gt;My page&lt;/title&gt;&lt;/head&gt;&lt;/html&gt;

/* page.js */
var page = function() {

    var helloWorld = function() {
        alert('Hola mundo');
    }

   /* Public interface object */
   var oPublic = {
       init: function() {
           helloWorld();
        }

   };
   return oPublic;
}();

$(document).ready(function(){
  page.init();
});
</code></pre>
<p>If you take a look at the previous code, the variable page has parentheses at the end of  its declaration, it means the function is &#8220;<strong>auto executed</strong>&#8221; and the object with the public interface is returned.<br />
In this case for example, when the page has been  loaded the method init() is executed, the variable page  is the object returned by the first function and if you remember the definition of closures in javascript the method init() still has access to the function hellowWorld which was declared into the first function, it is really clear and powerful whether we want to handle or add events, add delegations, add elements etc when the page is loaded,  all the functionality and functions will be into the closure and looks like as &#8220;private&#8221; that will be called for public functions or methods in the public interface (oPublic).</p>
<p>Please to clarify take a look at the following example.</p>
<pre><code>var myObject = function(){
    var privateVar = 1;
    function privateFunction(){
        alert('Hi, Im a private function called by the public function ');
    };

    function publicFunction(){
        privateFunction;
    }

    return {
        publicFunction:publicFunction,
        publicVar:publicVar,
    }
}();
</code></pre>
<p>Other more real example (I dont want you to understand all the example, is only to see a little example  in real use)</p>
<pre><code>var pageComments = function() {

    var createReplyArea = function(elContainer, nCommentId) {
        var sHtml = 'textArea and buttons to add or cancel the new reply';
        $(elContainer).html(sHtml);
    };

    var textAreaCountdown  = function(elTextArea, elRemainingChars) {
         var sTextContent = $(elTextArea).val(),
         nCharsCount = sTextContent.length,
         nRemainingChars = 512 - nCharsCount;

        if(nCharsCount &gt; nMaxCharacters) {
            $(elTextArea).val(sTextContent.substring(0, nMaxCharacters));
            $(elRemainingChars).text(0);
        } else {
            $(elRemainingChars).text(nRemainingChars);
        }
    }; 

    /* Public interface object */
    var oPublic = {
        var init: function() {
            $('comment-container').delegate('a.reply', 'click', function(event) {
                event.preventDefault();
                event.stopPropagation();
                var elTarget = event.currentTarget,
                elContainer = $(elTarget).parent().find('div.comment-reply-wrapper'),
                nCommentId = $(elTarget).parent().find('input').val();
                if(!$(elContainer).children().length) {
                    createReplyArea(elContainer, nCommentId);
                }
           });

           $('div.comment-widget').delegate('textarea', 'keyup keypress change paste select', function(event) {
               var elTarget = event.currentTarget,
               elRemainingChars = $(elTarget).parent().siblings().find('span.remaining-characters');
               textAreaCountdown(elTarget, elRemainingChars);
               event.stopPropagation();
           })
       }
   };
   return oPublic;
}();

$(document).ready(function(){
    pageComments.init();
});
</code></pre>
<p>When the page has been loaded the public init function is called and  adds the  handle of the click  event to add the new reply area on each  &#8220;a.reply&#8221;, also each text area has handled the key events to count and limit   characters that we enter, you could see a clear example of closure and module pattern  because the function returns the public object with the init() function  and the <strong>createReplyArea</strong> and <strong>textAreaCountdown </strong>function  are not public but, the element of the DOM still have access to these  functions by the events after the function has returned.</p>
<p>However  there are different ways to do the module pattern, for example different ways to write the object to return, for example see the following declaration.</p>
<pre><code>var f = function() {
    var obj = {};
    obj.methodOne = function(){ alert(privateVar); }
    return obj;
}();
</code></pre>
<p>And the last example to close the idea, you have a page named liks.html with one DIV (class=&#8221;link-container&#8221;) within links (class=link)  and you want to handle for each link  the &#8220;click&#8221; event.</p>
<pre><code>/* page.js */
var linksPage = function() {

    var handleLink = function(target) {
        alert(target);
    }

   /* Public interface object */
   var oPublic = {
       init: function() {
           $('link-container').delegate('a.link', 'click', function(event) {
               event.preventDefault();
               event.stopPropagation();
               handleLink(event.currentTarget);
           }
           /* May you want to do the same with mootools
              $('link-container').addEvent('click:relay(a.link)',
                  function(event, clicked){
                  });
           */
       }
   };
   return oPublic;
}();

$(document).ready(function(){
  linksPage.init();
});

</code></pre>
<p>This code will handle the click event in all links (class=&#8221;link&#8221;) into the page, and when you click whichever link will show you an alert with the link-object.</p>
<p>This is all for this moment, see you in the next tutorial.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.temperies.com/blog/2011/07/08/the-right-way-to-use-javascript/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Using HTML5 Now</title>
		<link>http://www.temperies.com/blog/2011/05/16/using-html5-now/</link>
		<comments>http://www.temperies.com/blog/2011/05/16/using-html5-now/#comments</comments>
		<pubDate>Mon, 16 May 2011 15:07:37 +0000</pubDate>
		<dc:creator>Juan Gaya</dc:creator>
				<category><![CDATA[HTML/CSS]]></category>
		<category><![CDATA[audio]]></category>
		<category><![CDATA[Boilerplate]]></category>
		<category><![CDATA[Canvas]]></category>
		<category><![CDATA[forms]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Initializr]]></category>
		<category><![CDATA[Modernizr]]></category>
		<category><![CDATA[video]]></category>
		<category><![CDATA[webforms]]></category>

		<guid isPermaLink="false">http://www.temperies.com/blog/?p=64</guid>
		<description><![CDATA[Introduction There has been a lot a discussion lately about using or not HTML5 right now or to wait for greater adoption of  it, we are not going to have that discussion here, I&#8217;m taking side and say that it should be used right now and not wait for complete adoption and have some of [...]]]></description>
			<content:encoded><![CDATA[<p><strong>Introduction</strong></p>
<p>There has been a lot a discussion lately about using or not HTML5 right now or to wait for greater adoption of  it, we are not going to have that discussion here, I&#8217;m taking side and say that it should be used right now and not wait for complete adoption and have some of the benefits of HMTL5 today and be prepared for tomorrow.</p>
<p>So you have decided to update or create your site to HTML5 like all the cool kids are doing, great. What now? This article will focus on all the necessary steps in order to make your site in HTML5 but still compatible with the older browsers, and to take advantage of all the features you want even if they are not implemented in all the majors browsers yet.</p>
<p>If you want the short version and can’t wait or don’t want to know the all thing you should go to <a href="http://initializr.com/">Initializr</a> that have everything pack up and ready to go, another option is <a href="http://html5boilerplate.com/">Boilerplate</a> that have all you’re going to need to set up your project.</p>
<p>Now if you want to know how to do it on your own, or want to understand how some of it work keep reading.</p>
<p>As you probably now HTML5 is not just html markup, it also encloses under the name all the new JS API and the latest version of CSS, CSS3. So you will have to check for all the availability of all of these things and to provide fallbacks for all of them.</p>
<p>Chapter 1 – The Markup</p>
<p>Let’s start with the markup of the page and move are way up, shall we. First let’s look exactly what are the <a href="http://www.w3.org/TR/html5-diff/#new-elements">new tags</a> that we have available, there are quite a few and several seems very useful for any site, you are probably wanting to use them now, right? Now let’s look at the reality of the <a href="http://en.wikipedia.org/wiki/Comparison_of_layout_engines_%28HTML5%29#Elements">adoption in browsers</a>, go I’ll wait.</p>
<p>Ready? Ok, so bad news right, we have a problem in our hands, adoption is not complete yet, and we have to deal with the old browsers as well. If you try the simplest approach, just write the markup to see what happens, you will get two different types of results:</p>
<ul>
<li>In      all browsers but IE the nodes will get inserted in the correct order in      the DOM with no default styling, but it will let you give it any style you      want.</li>
<li>In      all versions of IE prior to 9 the behavior towards unknown DOM elements      was add them as an empty node, and all its children were added as siblings      of the unknown element, as a second problem IE won’t let you add styling      to the element.</li>
</ul>
<p>Luckily there is a workaround for this problem up to IE6, if you create the unknown element with JavaScript, IE will start to let you use it and give it style.</p>
<pre><code>&lt;html&gt;
    &lt;head&gt;
        &lt;style&gt;
            article { display: block}
        &lt;/style&gt;
        &lt;script&gt;document.createElement("article");&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;article&gt;
            &lt;h1&gt;IE Unknown Element workaround example&lt;/h1&gt;
            &lt;p&gt;Some dummy text &lt;/p&gt;
        &lt;/article&gt;
    &lt;/body&gt;
&lt;/html&gt;</code></pre>
<p>Just creating the element once per page is enough to use it, and you don’t have to insert it into the DOM. To make it easier for the rest of us there is a written solution by Remy Sharp called <a href="http://code.google.com/p/html5shiv/">html5shiv</a> just adds this to your web page:</p>
<pre><code>&lt;!--[if lt IE 9]&gt;
    &lt;script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"&gt;
    &lt;/script&gt;
&lt;![endif]--&gt;</code></pre>
<p>Add that file in each page at the top not at the bottom because it should be run before the DOM is ready, or the tags in your HTML won’t get recognized in time. And with that the first (of many) problem is solved.</p>
<p><strong>Canvas</strong></p>
<p>Now let’s try to use some of the more multimedia specific tags and its APIs, let’s begin with the canvas element.  First we need to know if canvas is supported in the browser, currently the only browser that doesn’t have canvas support is IE prior to version 9, to solve that you can use a JavaScript library called <a href="http://code.google.com/p/explorercanvas/">explorer canvas</a> that lets you use canvas in IE with he majority of the functionality of it.</p>
<p>With this we have the canvas up and running, but if we want to detect if a particular API is present in the browser we should try it first, to do that we create a canvas in the DOM and if it is supported the getContext() method will exist, let’s see it in code:</p>
<pre><code>function useCanvas(){
    return !!document.createElement(‘canvas’).getContext(‘2d’);
}</code></pre>
<p>Then we try for the desired API in this case FillText:</p>
<pre><code>function supports_canvas_text() {
    if (!useCanvas()) { return false; }
    var myCanvas = document.createElement('canvas');
    var context =myCanvas.getContext('2d');
    return typeof context.fillText == 'function';
}</code></pre>
<p>We can use that function to use that functionality and in case that is not there have a fallback but making such a function for every API we want to test is cumbersome fortunately there a great library that we can use for this and for much more called <a href="http://www.modernizr.com/">modernizr</a> that is a feature detection script that let you check for the availability of native implementations for next-generation web technologies. Using it instead of the previous function:</p>
<pre><code>if (Modernizr.canvastext) {
    // its supported normal code
} else {
    // fallback code
}</code></pre>
<p>We can use Modernizr to check for all of the new features in the browsers that can render or utilize them, and still have easy <em>and reliable</em> means of creating fallbacks (that you should decide and do) for the browsers that cannot.</p>
<p><strong>Audio</strong></p>
<p>The use of the tag audio is pretty straightforward you just have to name the source file and that’s it if you want to use the default controls of each browser.</p>
<pre><code>&lt;audio controls=""&gt;
    &lt;source src="test.mp3"&gt;
    &lt;source src="test.ogg"&gt;
&lt;/audio&gt; </code></pre>
<p>Now for the fallback plan you can use flash or quick time, adding the embedded object inside the audio tag and that’s it for the most basic set up. Other way to go is using modernizr to check for audio support and add the flash player through JavaScript.</p>
<pre><code>if (!Modernizr.audio) {
   // add fallback flash to the DOM
}</code></pre>
<p><a href="http://www.html5rocks.com/tutorials/audio/quick/">For a most comprehensive example visit HTML5Rocks</a> or if you want a simple player to build on top of, check <a href="http://www.jezra.net/code_examples/html5_audio/">this one</a>.</p>
<p><strong>Video</strong></p>
<p>The use of the video tag is very similar to the audio tag, the main problem with it is the lack of a codec standard across all browsers because of that you have to make several versions of the video with different codecs, webM, ogg and X264 are the most used and with those 3 you are pretty much covered, just as the audio tag the fallback is flash. Now what you are expecting, the example code:</p>
<pre><code>&lt;video width="854" height="480"&gt;
  &lt;source src="video.mp4"&gt;
  &lt;source src="video.webm"&gt;
  &lt;source src="video.ogg"&gt;
  &lt;object data="player.swf" width="854" height="504"&gt;
        &lt;param value="true"&gt;
        &lt;param value="always"&gt;
        &lt;param value="file=video.mp4"&gt;
        &lt;!--[if IE]&gt;&lt;param value="player.swf"&gt;&lt;![endif]--&gt;
        &lt;img src="video.jpg" width="854" height="480" alt="Video"&gt;
        &lt;p&gt;Your browser can’t play HTML5 video. &lt;a href="video.webm"&gt;Download it&lt;/a&gt; instead.&lt;/p&gt;
    &lt;/object&gt;
&lt;/video&gt;</code></pre>
<p>For a full demo of this and a more helpful description you should look at <a href="http://camendesign.com/code/video_for_everybody">http://camendesign.com/code/video_for_everybody</a>. If you don’t want to get into the specifics and wants a pre created solution you should check <a href="http://praegnanz.de/html5video/">http://praegnanz.de/html5video/</a> there is a great comparison between some of the more popular solution out there.</p>
<p><strong>Forms</strong></p>
<p>One of the aspects that have been greatly improved in HTML5 are the forms, including <a href="http://www.w3schools.com/html5/html5_form_input_types.asp">new input types</a> , <a href="http://www.w3schools.com/html5/html5_form_elements.asp">new form elements</a> and some <a href="http://www.w3schools.com/html5/html5_form_attributes.asp">new form and input attributes</a>.  As with the previous elements that we have seen the main problem is <a href="http://www.standardista.com/html5/html5-web-forms">adoption and the older browsers</a>.</p>
<p>The good news here is that if use the new input type as mail or url the browsers that do not have them yet will treat them as text inputs so the page will not break, but we have to keep doing the validation with JavaScript as always, so you can change your input types in your current page and the final user will not see the difference, but your page will be ready for the future. To see if the input type is supported by the browser so you won’t load unnecessary JavaScript you can use modernizr. The same can be said about the input attributes if you use them and the browser don’t have support for it, the browser will ignore it and that’s it .</p>
<p>Example of detection with Modenizr:</p>
<pre><code>&lt;!-- In your HTML: --&gt;
&lt;input&gt;
// In your JavaScript:
if (!Modernizr.inputtypes.date){
    // if no native support, use a datepicker script
    createDatepicker(document.getElementById('birthday'));
}

//For input attributes

// if placeholder isn't supported:
if (!Modernizr.input.placeholder){
    // use a input hint script
    setInputHint(document.getElementById('username'),'Enter Username');
}</code></pre>
<p>Finally I highly recommend that you read <a href="http://diveintohtml5.org/forms.html">http://diveintohtml5.org/forms.html</a> for a more complete documentation about this, and the entire <a href="http://diveintohtml5.org/">book</a> if you are interested in learning more about HTML5.</p>
<p>We’ll continue with this in chapter 2 to see what we can use of CSS3 and how. See you then.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.temperies.com/blog/2011/05/16/using-html5-now/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Interacting with the Wiimote &#8211; WiiSim Tennis</title>
		<link>http://www.temperies.com/blog/2011/03/04/interacting-with-the-wiimote-wiisim-tennis/</link>
		<comments>http://www.temperies.com/blog/2011/03/04/interacting-with-the-wiimote-wiisim-tennis/#comments</comments>
		<pubDate>Fri, 04 Mar 2011 13:49:12 +0000</pubDate>
		<dc:creator>Fabricio Lettieri</dc:creator>
				<category><![CDATA[Uncategorized]]></category>

		<guid isPermaLink="false">http://www.temperies.com/blog/?p=32</guid>
		<description><![CDATA[The Temperies IT’s TechLab area allows its members to explore new mass use technologies available in the market to provide new products and services with a bonus of innovation. The Wiimote is a non conventional device that features a range of new applications providing the user a new experience of interacting with the computer. This [...]]]></description>
			<content:encoded><![CDATA[<p>The Temperies IT’s TechLab area allows its members to explore new mass use technologies available in the market to provide new products and services with a bonus of innovation.<br />
The Wiimote is a non conventional device that features a range of new applications providing the user a new experience of interacting with the computer.</p>
<p>This work was done by Andrés Gariglio y Fabricio Lettieri (Temperies IT developer) in conjunction with engineers Cristian García Bauza and Juan Pablo D&#8217;Amato from PLADEMA institute (UNICEN Tandil), these latter two are members of our TechLab.</p>
<p><strong>Introduction</strong></p>
<p>Human interaction with computer systems is no longer an impractical and unprofitable experience and is opened to new ways of communication. The current non conventional devices, such as the figures and gestures recognizer device called Kindle for the Xbox and multi touch devices, provide a new user experience. The same evolution of the practicality of the human kind forces to create new interaction devices.</p>
<p>The device issued here is the control of the Nintendo Wii console: the Wiimote.</p>
<p style="text-align: center;"><img class="aligncenter" style="border: 0pt none;" src="http://www.temperies.com/blog/wp-content/uploads/2011/07/wiimote_3views.jpg" border="0" alt="wiimote 3 views" width="243" height="207" /></p>
<p>It’s a wireless device that communicates via Bluetooth to any receiver that captures this signal. While Nintendo has not released its specification, there is an online community that is dedicated to hacking the device for home-brew. Thanks to this conjunct effort there are many APIs for communication and use of the wiimote in many programming languages.</p>
<p><strong>Features</strong></p>
<p>The Wiimote is capable of detecting movement by acceleration in three dimensions using accelerometer technology.</p>
<p style="text-align: center;"><img class="aligncenter" style="border: 0pt none;" src="http://www.temperies.com/blog/wp-content/uploads/2011/07/wiimote_axis.gif" border="0" alt="wiimote 3 axis" width="519" height="500" /></p>
<p>It has an infrared camera that records the movement of up to four infrared sensors.</p>
<p style="text-align: center;"><img class="size-full wp-image-186 aligncenter" title="wiimote_IR" src="http://www.temperies.com/blog/wp-content/uploads/2011/07/wiimote_IR.png" alt="" width="63" height="52" /></p>
<p>This technology makes the Wiimote one of the most sophisticated input devices compatible with PCs available today at a suggested retail price of u$s 40.</p>
<p><strong>Our Application </strong></p>
<p><em>WiiSim Tennis</em> born as a tennis simulation and training game using the Wiimote as the input of gesture recognition.</p>
<p>The application consists of two main components<br />
- Profile Editor.<br />
- Training tennis game.<br />
Check out this homemade video for a contest conducted named Wiideojuegos:<a href="http://www.youtube.com/watch?v=SPMjjjUbd4s"> http://www.youtube.com/watch?v=SPMjjjUbd4s</a><br />
To view all other videos of the contest visit the following link: <a href="http://www.youtube.com/user/WiideojuegosUPM#p/a/u/2/Ku_onwqGKt0">http://www.youtube.com/user/WiideojuegosUPM#p/a/u/2/Ku_onwqGKt0</a></p>
<p>Captures of our application:</p>
<p style="text-align: center;"><img class="aligncenter" style="border: 0pt none;" src="http://www.temperies.com/blog/wp-content/uploads/2011/07/cap_profile_editor_SMALL.png" border="0" alt="Profile Editor" width="503" height="299" /><span style="clear: both;">Profile Editor.</span></p>
<p style="text-align: center;"><img class="aligncenter" style="border: 0pt none;" src="http://www.temperies.com/blog/wp-content/uploads/2011/07/cap_tennis_game_SMALL.png" border="0" alt="Trainning tennis game" /><span style="clear: both;">Trainning tennis game.</span></p>
<p>The application’s development plan consists of the following tasks:</p>
<p>1. Study and selection of an API to capture data from the wiimote using bluetooth connection.<br />
2. Analysis of different approaches to obtaining and processing data.<br />
3. Design and development of PC-communication library Wiimote.<br />
4. Analysis of proper sampling strategies taking account time variations.<br />
5. Development of a tool for creating, gesture recognition and comparison, extraction of statistics, and history according to a user profile.<br />
6. Interactive 3D rendering.<br />
7. Game menu, screens, and multimedia content.</p>
<p>The development environment was Codegear Delphi 2007.<br />
We used the following components for the system modules:</p>
<p>• Rendering engine: Impromptu graphics engine, developed in PLADEMA Institute, 2004-2010. Impromptu presents a higher level abstraction of OpenGL which allows creating neat and tidy applications.<br />
• Physical behavior: Newton Game Dynamics through a communication layer, the latter developed in PLADEMA Institute, 2009.<br />
• Communication Wiimote: Component TJvHidDeviceController from the JEDI components package.</p>
<p><strong>Dynamic Time Warping (DTW)</strong></p>
<p>For comparison of gestures the DTW algorithm was implemented because of its simplicity and excellent performance. This method measures similarities between two data streams, which can vary in length and speed, adding the distances between them in each time interval. The calculation of distance is no point to point but the point of least distance, which provides elasticity (warping) of the comparison.</p>
<p>Following figure shows two data sets being compared. The arrows indicate the desired alignment points.</p>
<p style="text-align: center;"><a href="http://fabri1983.fileave.com/dtw_2_curves.png"><img class="aligncenter" style="border: 0pt none;" src="http://www.temperies.com/blog/wp-content/uploads/2011/07/dtw_2_curves.jpg" border="0" alt="Elastic comparison" /></a><span style="clear: both;">Elastic comparison between two data sets.</span></p>
]]></content:encoded>
			<wfw:commentRss>http://www.temperies.com/blog/2011/03/04/interacting-with-the-wiimote-wiisim-tennis/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>New Oracle Lucene Domain Index release based on Lucene 3.0.2</title>
		<link>http://www.temperies.com/blog/2011/02/16/new-oracle-lucene-domain-index-release-based-on-lucene-3-0-2/</link>
		<comments>http://www.temperies.com/blog/2011/02/16/new-oracle-lucene-domain-index-release-based-on-lucene-3-0-2/#comments</comments>
		<pubDate>Wed, 16 Feb 2011 19:44:53 +0000</pubDate>
		<dc:creator>Marcelo Ochoa</dc:creator>
				<category><![CDATA[Java]]></category>
		<category><![CDATA[Oracle]]></category>
		<category><![CDATA[Solr/Lucene]]></category>
		<category><![CDATA[Lucene Domain Index]]></category>

		<guid isPermaLink="false">http://www.temperies.com/blog/?p=11</guid>
		<description><![CDATA[Just a few words to announce a new release of Oracle Lucene Domain Index, this zip is valid for 10g and 11g database version (10g using back-ported classes from 1.5 to 1.4) This release is compiled using Lucene 3.0.2 version and incorporates a set of new features added, here the list: Added a long awaited functionality, a [...]]]></description>
			<content:encoded><![CDATA[<p>Just a few words to announce a <a href="http://sourceforge.net/projects/dbprism/files/odi/3.0.2.1.0/">new release</a> of <a href="http://docs.google.com/View?docid=ddgw7sjp_569gf8c7cd8">Oracle Lucene Domain Index</a>, this zip is valid for 10g and 11g database version (10g using back-ported classes from 1.5 to 1.4)<br />
This release is compiled using <a href="http://lucene.apache.org/java/3_0_2/">Lucene 3.0.2</a> version and incorporates a set of new features added, here the list:</p>
<ul>
<li>Added a long awaited functionality, a parallel/shared/slave  search process used during a start-fetch-close and CountHits function</li>
<li>Added lfreqterms ancillary operator returning the freq terms array of rows visited</li>
<li>Added lsimilarity ancillary operator returning a computed Levenshtein distance of the row visited</li>
<li>Added a ldidyoumean pipeline table function using <em>DidYouMean.indexDictionary</em> storage</li>
<li>Added test using <a href="http://sqlunit.sourceforge.net/">SQLUnit</a></li>
</ul>
<p>The bigger addition is the <strong><em>Parallel-Shared-Slave</em></strong> search process, this architectural change was in my to-do list for a long time and finally I added in this release <img src='http://www.temperies.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /><br />
The idea behind this is to have a new Oracle process started by the <em>DBMS_SCHEDULER</em> sub-system during the database startup process and stopped immediately before shutdown.<br />
Now this process is responsible for implementing the <em>ODCI</em> methods <em>start-fetch-close/count-hit</em> on behalf of the client process (process associated to an specific user  session) which connect to the shared-slave process by using <em>RMI</em>.<br />
With this new architecture we have two principal benefits:</p>
<ul>
<li>Reduce memory consumption</li>
<li>Increase Lucene Cache Hits</li>
</ul>
<p>Less memory consumption because the internal <em>OJVM</em> implementation is attached to a client session, so the Java space used by <em>Lucene</em> structures is isolated and independent from another concurrent session, now all <em>Lucene</em> memory structures used during index scan process are created in a shared process and then not replicated.<br />
Also if one session submits a <em>Lucene</em> search, this search is  cached for subsequent queries, all subsequent queries coming from the  same client session or any other which are associated to the same index  and with the same Query string implies a hit.<br />
I&#8217;ll explain more in detail this new architecture in another post also  showing how many parallel process can work together when using Parallel  Indexing and Searching.<br />
On the other hand next week I&#8217;ll be at the <a href="http://www.oracle.com/us/openworld/index.htm">Oracle OpenWorld 2010</a> in <strong>SFO</strong> presenting the session:</p>
<p><strong>Schedule</strong>: Tuesday: 09:30AM<br />
<strong>Session ID</strong>: S315660<br />
<strong>Title</strong>: Database Applications Lifecycle Management<br />
<strong>Event</strong>: JavaOne and Oracle Develop<br />
<strong>Stream(s)</strong>: ORACLE DEVELOP<br />
<strong>Track(s)</strong>: Database Development<br />
<strong>Abstract</strong>: Complex applications, such as Java running inside the  database, require an application lifecycle management to develop and  delivery good code. This session will cover some best practices, tools,  and experience managing and delivering code for running inside the  database, including tools for debugging, automatic test, packaging,  deployment, and release management. Some of the tools presented will  include Apache Maven, JUnit, log4j, Oracle JDeveloper, and others  integrated into the Oracle Java Virtual Machine (JVM) development  environment.</p>
<div>See you there or at any of <a href="http://www.oracle.com/us/openworld/062332.html">networking planned events</a> <img src='http://www.temperies.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </div>
]]></content:encoded>
			<wfw:commentRss>http://www.temperies.com/blog/2011/02/16/new-oracle-lucene-domain-index-release-based-on-lucene-3-0-2/feed/</wfw:commentRss>
		<slash:comments>13</slash:comments>
		</item>
		<item>
		<title>Dealing with JDK1.5 libraries on Oracle 10g</title>
		<link>http://www.temperies.com/blog/2010/06/08/dealing-jdk15-oracle10g/</link>
		<comments>http://www.temperies.com/blog/2010/06/08/dealing-jdk15-oracle10g/#comments</comments>
		<pubDate>Tue, 08 Jun 2010 19:24:11 +0000</pubDate>
		<dc:creator>Marcelo Ochoa</dc:creator>
				<category><![CDATA[Java]]></category>
		<category><![CDATA[Oracle]]></category>
		<category><![CDATA[jdk1.4]]></category>
		<category><![CDATA[jdk1.5]]></category>
		<category><![CDATA[Lucene Domain Index]]></category>
		<category><![CDATA[ncomp]]></category>
		<category><![CDATA[retro-translator]]></category>

		<guid isPermaLink="false">http://www.temperies.com/blog/?p=6</guid>
		<description><![CDATA[Modern libraries are compiled with JDK 1.5 and the question is How to deal with these libraries on an Oracle 10g OJVM. Some examples are Lucene 3.x branch or Hadoop. The solution that I tested is using a Java Retro Translator and some complementary libraries. I have tested this solution in Lucene Domain Index 3.x [...]]]></description>
			<content:encoded><![CDATA[<p>Modern libraries are compiled with JDK 1.5 and the question is How to deal with these libraries on an <a href="http://download.oracle.com/docs/cd/B19306_01/java.102/b14187/toc.htm">Oracle 10g OJVM</a>.<br />
Some examples are <a href="http://lucene.apache.org/java/3_0_1/">Lucene 3.x</a> branch or <a href="http://hadoop.apache.org/">Hadoop</a>. The solution that I tested is using a <a href="http://retrotranslator.sourceforge.net/">Java Retro Translator</a> and some complementary libraries.<br />
I have tested this solution in <a href="http://docs.google.com/View?docid=ddgw7sjp_54fgj9kg">Lucene Domain Index</a> <a href="http://dbprism.cvs.sourceforge.net/viewvc/dbprism/odi/">3.x</a> branch with success.<br />
As you can see on the CVS there is <a href="http://dbprism.cvs.sourceforge.net/viewvc/dbprism/odi/db/build.xml?revision=1.5&amp;view=markup">build.xml</a> file which performs all the retro translator steps. Here an step by step explanation of the process:</p>
<ol>
<li>Load all required libraries provided by Retro translator project  which implements features not available on JDK 1.4/1.3 runtime, this is  done on the target <strong><em>load-retrotranslator-sys-code.</em></strong> This  target loads many libraries on SYS schema due are immutable, or with  low probability of change. It will change if we upgrade a  retro-translator version. All libraries are then compiled to assembler  using NCOMP utility, target <strong><em>ncomp-runtime-retrotranslator-sys-code</em></strong>.</li>
<li>Then we can convert libraries compiled with JDK1.5, in this <em>build.xml</em> file the Lucene and Lucene Domain Index implementation, to a JDK1.4 target runtime. This is done on the targets <strong><em>backport-code-lucene</em></strong> and <strong><em>backport-code-odi</em></strong>,  on first target We converts all Lucene libraries excluding JUnit and  Test code, these libraries require as a dependency JUnit and  retro-translator jars. Second target converts Lucene Domain Index jar  depending on Lucene core and Oracle&#8217;s libs. The back-port operation  generates a file named <em>lucene-odi-all-${version}.jar</em> with Lucene and Lucene Domain Index code ready to run on JDK1.4 runtime.</li>
<li>Once We have the code back-ported to a JDK1.4 runtime We can upload and NCOMP into Oracle 10g, this is done on targets <strong><em>load-lucene-odi-backported-code and <strong><em>ncomp-lucene-all.</em></strong></em></strong></li>
</ol>
<p>And that&#8217;s all!!, the code works fine on my Oracle 10.2 database &#8211; Linux <img src='http://www.temperies.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> , finally users of 11g and 10g databases can deploy <a href="http://sourceforge.net/projects/dbprism/files/odi/3.0.1.1.0/lucene-odi-bin-3.0.1.1.0.zip/download">Lucene Domain Index</a> implementation using one distribution file.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.temperies.com/blog/2010/06/08/dealing-jdk15-oracle10g/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

