<?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>underdog-blog &#187; javascript</title>
	<atom:link href="http://blog.underdog-projects.net/tag/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.underdog-projects.net</link>
	<description>Just another WordPress weblog</description>
	<lastBuildDate>Fri, 26 Feb 2010 20:03:39 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>URL encode / decode in JavaScript</title>
		<link>http://blog.underdog-projects.net/2010/02/url-encode-decode-in-javascript-2/</link>
		<comments>http://blog.underdog-projects.net/2010/02/url-encode-decode-in-javascript-2/#comments</comments>
		<pubDate>Fri, 26 Feb 2010 19:57:13 +0000</pubDate>
		<dc:creator>jens</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[urldecode]]></category>
		<category><![CDATA[urlencode]]></category>

		<guid isPermaLink="false">http://blog.underdog-projects.net/?p=535</guid>
		<description><![CDATA[Decoding and Encoding URLs in JavaScript should be a pretty easy thing to do especially since all browsers still have the functionality built-in. Interestingly no browser allows the JavaScript runtime to use this feature. So I had to write it for myself. The code I came up with is far from perfect but it worked [...]]]></description>
			<content:encoded><![CDATA[<p>Decoding and Encoding URLs in JavaScript should be a pretty easy thing to do especially since all browsers still have the functionality built-in. Interestingly no browser allows the JavaScript runtime to use this feature. So I had to write it for myself.<br />
The code I came up with is far from perfect but it worked for me. To decode an URL use url_decode(url) and to reverse it just call the utf16to8 function. The rest does your browser for you.</p>
<pre class="prettyprint javascript">
function url_decode(str){
var hex = /^[0-9a-fA-F]{2}/;
var out='';
var arr = str.split('%');
if(arr.length&lt;2) return str;
for(var i=0;i&lt;arr.length;i++)
{
  /*look for hex values */
  if(hex.exec(arr[i])) {
    out += String.fromCharCode(parseInt(arr[i].substring(0,2),16))+arr[i].substring(2,arr[i].length);
  } else { if(i==0) out+=arr[i]; else out+='%'+arr[i];
  }
}
return utf8to16(out);
}

function utf16to8(str) {
    var out, i, len, c;

    out = "";
    len = str.length;
    for(i = 0; i &lt; len; i++) {
	c = str.charCodeAt(i);
	if ((c &gt;= 0x0001) &#038;&#038; (c &lt;= 0x007F)) {
	    out += str.charAt(i);
	} else if (c &gt; 0x07FF) {
	    out += String.fromCharCode(0xE0 | ((c &gt;&gt; 12) &#038; 0x0F));
	    out += String.fromCharCode(0x80 | ((c &gt;&gt;  6) &#038; 0x3F));
	    out += String.fromCharCode(0x80 | ((c &gt;&gt;  0) &#038; 0x3F));
	} else {
	    out += String.fromCharCode(0xC0 | ((c &gt;&gt;  6) &#038; 0x1F));
	    out += String.fromCharCode(0x80 | ((c &gt;&gt;  0) &#038; 0x3F));
	}
    }
    return out;
}

function utf8to16(str) {
    var out, i, len, c;
    var char2, char3;

    out = "";
    len = str.length;
    i = 0;
    while(i &lt; len) {
	c = str.charCodeAt(i++);
	switch(c &gt;&gt; 4)
	{
	  case 0: case 1: case 2: case 3: case 4: case 5: case 6: case 7:
	    // 0xxxxxxx
	    out += str.charAt(i-1);
	    break;
	  case 12: case 13:
	    // 110x xxxx   10xx xxxx
	    char2 = str.charCodeAt(i++);
	    out += String.fromCharCode(((c &#038; 0x1F) &lt;&lt; 6) | (char2 &#038; 0x3F));
	    break;
	  case 14:
	    // 1110 xxxx  10xx xxxx  10xx xxxx
	    char2 = str.charCodeAt(i++);
	    char3 = str.charCodeAt(i++);
	    out += String.fromCharCode(((c &#038; 0x0F) &lt;&lt; 12) |
					   ((char2 &#038; 0x3F) &lt;&lt; 6) |
					   ((char3 &#038; 0x3F) &lt;&lt; 0));
	    break;
	}
    }
    return out;
}
</pre>
]]></content:encoded>
			<wfw:commentRss>http://blog.underdog-projects.net/2010/02/url-encode-decode-in-javascript-2/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>tracking virtual links with google analytics</title>
		<link>http://blog.underdog-projects.net/2010/01/tracking-virtual-links-with-google-analytics/</link>
		<comments>http://blog.underdog-projects.net/2010/01/tracking-virtual-links-with-google-analytics/#comments</comments>
		<pubDate>Mon, 04 Jan 2010 17:57:00 +0000</pubDate>
		<dc:creator>jens</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[cloudtheweb.com]]></category>
		<category><![CDATA[google analytics]]></category>
		<category><![CDATA[javascript]]></category>

		<guid isPermaLink="false">http://blog.underdog-projects.net/?p=521</guid>
		<description><![CDATA[Tracking dynamic sites is sometimes a bit tricky. Typically tracking systems are specialized in tracking page views. More sophisticated system have there own way of tracking custom event (like shown here). Unfortunately I needed to track clicks on a HTML canvas. To make these clicks visible to a tracking system, I wanted to transform each [...]]]></description>
			<content:encoded><![CDATA[<p>Tracking dynamic sites is sometimes a bit tricky. Typically tracking systems are specialized in tracking page views. More sophisticated system have there own way of tracking custom event (<a href="http://code.google.com/apis/analytics/docs/tracking/eventTrackerOverview.html">like shown here</a>).<br />
Unfortunately I needed to track clicks on a HTML canvas. To make these clicks visible to a tracking system, I wanted to transform each click to virtual URL. That way I could use Google analytics not only for tracking but also for popularity statistics of certain content.<br />
The script for doing so is actually pretty simple.</p>
<pre class='prettyprint'>
function trace(url){
var tracker = _gat._getTracker("UA-XXXXXXX-X");
tracker._trackPageview(url);
}
</pre>
<p>Now every time I need to track something I call this function with a custom build URL.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.underdog-projects.net/2010/01/tracking-virtual-links-with-google-analytics/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>cloud-the-web &#8211; my new web project</title>
		<link>http://blog.underdog-projects.net/2009/08/cloud-the-web-my-new-web-project/</link>
		<comments>http://blog.underdog-projects.net/2009/08/cloud-the-web-my-new-web-project/#comments</comments>
		<pubDate>Sat, 08 Aug 2009 10:28:01 +0000</pubDate>
		<dc:creator>jens</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[canvas]]></category>
		<category><![CDATA[cloudtheweb.com]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[javascript]]></category>

		<guid isPermaLink="false">http://blog.underdog-projects.net/?p=379</guid>
		<description><![CDATA[A little time ago I started experimenting with some of the new HTML 5 features. Some seam pretty impressive although some a rather unnecessary in my opinion. But one thing got me really hooked &#8211; the HTML canvas. The possibilities of this control are only limited by the performance of javascript and the missing 3d [...]]]></description>
			<content:encoded><![CDATA[<p>A little time ago I started experimenting with some of the new HTML 5 features. Some seam pretty impressive although some a rather unnecessary in my opinion. But one thing got me really hooked &#8211; the HTML canvas.<br />
The possibilities of this control are only limited by the performance of javascript and the missing 3d feature (hopefully this comes pretty soon). With that technology I finally got some way to implement something I wanted to try for some time now. So here is the basic idea what it is all about.</p>
<p>A lot of people out there use services like delicious where you tag you favorite sites and make this available to other users. Now I started to grab that data and began to build a massive tag cloud. After some time the site collected hundreds of thousands of links with their corresponding tags. So now you can start on the site and search for tags which interests you. These search tags will then be correlated against the cloud database and you get the most active links for your tags. So here is an example.<br />
Let&#8217;s say you are interested in a tomcat tutorial.<br />
tags:</p>
<blockquote><p> tutorial, tomcat</p></blockquote>
<p>results: </p>
<blockquote><p>howtoforge.com<br />
howtogeek.com<br />
java.sun.com</p></blockquote>
<p>Of course those results will be a link to the concrete tutorial (not just the entry page).<br />
So far to the official part. For me this is more of a fun project. I prefer to start with some random tag and then wander around. It&#8217;s more like browsing, cause you start at points that you don&#8217;t already know. You have the chance to break out of your existing network of most used sites and see something new.</p>
<p>So have fun with it.<br />
<strong><br />
<a href="http://www.cloudtheweb.com">www.cloudtheweb.com</a><br />
</strong><br />
PS: For the implementation part &#8211; if you have any questions, just ask. I&#8217;m planning to explain some details about how it works on some later posts.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.underdog-projects.net/2009/08/cloud-the-web-my-new-web-project/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>installing GLUEscript on debian squeeze 64bit</title>
		<link>http://blog.underdog-projects.net/2009/07/installing-gluescript-on-debian-squeeze-64bit/</link>
		<comments>http://blog.underdog-projects.net/2009/07/installing-gluescript-on-debian-squeeze-64bit/#comments</comments>
		<pubDate>Wed, 15 Jul 2009 14:06:15 +0000</pubDate>
		<dc:creator>jens</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[64-bit]]></category>
		<category><![CDATA[debian]]></category>
		<category><![CDATA[GLUEscript]]></category>
		<category><![CDATA[javascript]]></category>

		<guid isPermaLink="false">http://blog.underdog-projects.net/?p=381</guid>
		<description><![CDATA[The GLUEscript runtime is still in an pretty early development stage. Basically they use the Firefox spidermonkey javascript engine and build some useful libraries on top of that (like curl,mysql, filesystem support). They also provide a little help in form of a little text file, but with this, it still took me half a day [...]]]></description>
			<content:encoded><![CDATA[<p>The <a href="https://sourceforge.net/projects/gluescript/">GLUEscript</a> runtime is still in an pretty early development stage. Basically they use the Firefox spidermonkey javascript engine and build some useful libraries on top of that (like curl,mysql, filesystem support).<br />
They also provide a little help in form of a little text file, but with this, it still took me half a day for my first installation. Most issues I got were based on version mismatches, because debian and also ubuntu use older versions of the required libraries.</p>
<p>First download the GLUEscript source from sourceforge.<br />
A second tool you will need to get this running is <a href="http://premake.sourceforge.net/">premake</a>. This is also a sourceforge project (you can use the binary version of it right away).<br />
After downloading, I copied the premake binary into the glue/src folder.</p>
<p>So now we can start with fetching the dependencies which debian can fulfill.</p>
<pre class='prettyprint lang-shell'>
sudo apt-get install libnspr4-0d libnspr4-0d-dbg libnspr4-dev libcurl4-openssl-dev libwxgtk2.8-dev libssl-dev libiodbc2-dev libmysql++-dev
</pre>
<p>In addition to that I needed a library called <a href="http://pocoproject.org/">poco</a> version 1.3.5 (all repositories I found just provided versions up to 1.3.3 -> those don&#8217;t work). So get the source from <a href="http://pocoproject.org/download/">http://pocoproject.org/download/</a> (the complete version). Compiling that should make no trouble cause all the dependencies are already installed.</p>
<pre class='prettyprint lang-shell'>
/tmp$ cd poco-1.3.5-all/
/tmp/poco-1.3.5-all$ ./configure
Configured for Linux
/tmp/poco-1.3.5-all$ make
/tmp/poco-1.3.5-all$ sudo make install
</pre>
<p>Now let&#8217;s get back to configuring GLUEscript. All configuration is done via lua script which will than be consumed by premake. The config file I needed to edit was the premake.lua file:</p>
<blockquote><pre>
-- Check NSPR
if ( string.len(nspr_dir) == 0 ) then
  print("Using the NSPR library which is part of GLUEscript")
  dopackage("nspr") -- build our own NSPR
  nspr_dir = "../nspr/include"
  nspr_lib = "nspr"
  nspr_lib_dir = project.libdir
else
  print("You are using your own NSPR library: ")
  nspr_dir = "/usr/include/nspr"
  print("nspr include: " .. nspr_dir)
  print("nspr lib: " .. nspr_lib_dir .. "/" .. nspr_lib)
end
</pre>
</blockquote>
<p>I copied the whole paragraph to just make it easier to find the position. Important is the added row in the else part.</p>
<blockquote><p>  nspr_dir = &#8220;/usr/include/nspr&#8221;</p></blockquote>
<p>This is needed because debian has a different file structure for header files than the script expects it.</p>
<p>After that we are done with configuring. To actually start the build process you have to run premake first.</p>
<pre class='prettyprint lang-shell'>
./premake gnu
make
</pre>
<p>The output will be generated to the following directory:</p>
<blockquote><p>glue/bin/Debug</p></blockquote>
<p>So far the makefile does not a an installation part. So if you want to install this you have to do it by yourself.</p>
<p>PS: This only works for the 0.0.1 version. So far I didn&#8217;t get any more recent svn version running.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.underdog-projects.net/2009/07/installing-gluescript-on-debian-squeeze-64bit/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
