<?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>CodeDread Blog &#187; html5</title>
	<atom:link href="http://www.codedread.com/blog/archives/tag/html5/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.codedread.com/blog</link>
	<description></description>
	<lastBuildDate>Mon, 16 Aug 2010 03:18:31 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>kthoom!</title>
		<link>http://www.codedread.com/blog/archives/2010/04/12/kthoom/</link>
		<comments>http://www.codedread.com/blog/archives/2010/04/12/kthoom/#comments</comments>
		<pubDate>Mon, 12 Apr 2010 12:55:51 +0000</pubDate>
		<dc:creator>Jeff</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[RIA]]></category>
		<category><![CDATA[Software]]></category>
		<category><![CDATA[Technology]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[comics]]></category>
		<category><![CDATA[html5]]></category>

		<guid isPermaLink="false">http://www.codedread.com/blog/?p=832</guid>
		<description><![CDATA[[clipart]Sometimes I get an idea and I just have to see it through to a point where it will let my brain go.  At work Thursday we were all slobbering over Steve&#8217;s iPad and someone brought up how cool the Marvel app is.  I had to admit it was much nicer than any [...]]]></description>
			<content:encoded><![CDATA[<p><object type="image/svg+xml" width="100" height="100" style="float:right" data="http://codedread.com/clipart/kthoom.svgz">[clipart]</object>Sometimes I get an idea and I just have to see it through to a point where it will let my brain go.  At work Thursday we were all slobbering over <a href="http://nuthatch.com/blog/">Steve&#8217;s</a> iPad and someone brought up how cool the <a href="http://marvel.com/news/comicstories.11835.download_the_official_marvel_comics_ipad_app">Marvel app</a> is.  I had to admit it was much nicer than any piece of software I&#8217;d used for viewing comics before on my laptop.</p>
<p>In the meantime, I&#8217;ve been carefully watching WebKit creep <a href="https://bugs.webkit.org/show_bug.cgi?id=32624">closer</a> and <a href="https://bugs.webkit.org/show_bug.cgi?id=36567">closer</a> to implementing the <a href="http://www.w3.org/TR/FileAPI/">W3C File API</a> (Go Kinuko!).  Something I&#8217;ve been eagerly waiting for more browsers to do so you can open up local files in <a href="http://svg-edit.googlecode.com/">SVG-edit</a>.</p>
<p>And then it hit me. <span id="more-832"></span></p>
<p>Why not a comic book reader done directly in the browser?</p>
<p>In case you don&#8217;t know, <a href="http://en.wikipedia.org/wiki/Comic_Book_Archive_file">comic book archive files</a> are just ZIP or RAR files containing JPEG images.  Browsers can handle images.  Some browsers can now handle opening local files.  Even binary ones.  So theoretically you could write unzip/unrar in pure JavaScript, extract the JPEGs, turn them into data: URIs and shove them into an &#60;image&#62; element.  You can even do the unzipping in a separate thread using <a href="http://www.whatwg.org/specs/web-workers/current-work/">Web Workers</a>.</p>
<p>Theoretically.</p>
<p><a href="http://code.google.com/p/kthoom/">kthoom</a> was how far I was able to get in a weekend.</p>
<p>Some limitations:</p>
<ul>
<li><a href="http://code.google.com/p/kthoom/issues/detail?id=10">Unzipping is slow</a>.  None of the code has been optimized yet and I&#8217;m probably doing a lot of really stupid things.</li>
<li>Only supports CBZ files, <a href="http://code.google.com/p/kthoom/issues/detail?id=9">not CBR files</a> at the moment &#8211; I am accepting patches</li>
<li>Unzipping is <em>really</em> slow.  I need to <a href="http://code.google.com/p/kthoom/issues/detail?id=8">provide visual progress reporting</a> from the Web Worker thread, I know.</li>
<li>kthoom will crash Firefox 3.6 about half the time.  Firefox nightly (3.7) seems to handle it just fine.  I opened <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=558621">this bug</a>.</li>
<li>Did I mention that unzipping is slow?</li>
</ul>
<p>If I&#8217;m honest, this was really an exercise to see just how easy/hard it would be to do something like this in the browser &#8211; and to get some hands-on experience with Web Workers.  And hey, I&#8217;m not the <a href="http://jsxgraph.uni-bayreuth.de/wp/">first</a> or even <a href="http://github.com/tlrobinson/zipjs">second</a> person to think of doing unzip/deflate in JavaScript either.</p>
<p>It was my first experience writing JavaScript to handle binary files.  It was fun.  It took a weekend.  </p>
<p>Some essential tools:  Firebug, a hex editor, pen &#38; paper, a clear mind, patience.</p>
<p>Now swinging my attention back to stuff I should be working on&#8230;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.codedread.com/blog/archives/2010/04/12/kthoom/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>MIX 10k Code Challenge += SVG</title>
		<link>http://www.codedread.com/blog/archives/2010/01/14/mix-10k-code-challenge-svg/</link>
		<comments>http://www.codedread.com/blog/archives/2010/01/14/mix-10k-code-challenge-svg/#comments</comments>
		<pubDate>Thu, 14 Jan 2010 15:56:59 +0000</pubDate>
		<dc:creator>Jeff</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[Microsoft]]></category>
		<category><![CDATA[SVG]]></category>
		<category><![CDATA[Software]]></category>
		<category><![CDATA[Technology]]></category>
		<category><![CDATA[Tips]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[Games]]></category>
		<category><![CDATA[html5]]></category>

		<guid isPermaLink="false">http://blog.codedread.com/archives/2010/01/14/mix-10k-code-challenge-svg/</guid>
		<description><![CDATA[[clipart]I came across the MIX 10k Coding Challenge on the weekend, and on a whim I decided to submit one of my old SVG demos to the contest.  The 10k challenge&#8217;s tagline is &#8220;What could you create for the Web if you had only 10 kilobytes of code?&#8221;.  The rules didn&#8217;t explicitly say [...]]]></description>
			<content:encoded><![CDATA[<p><object type="image/svg+xml" width="100" height="100" style="float:right" data="http://codedread.com/clipart/villain.svgz">[clipart]</object>I came across the <a href="http://mix10k.visitmix.com/">MIX 10k Coding Challenge</a> on the weekend, and on a whim I decided to submit one of my old SVG demos to the contest.  The 10k challenge&#8217;s tagline is &#8220;What could you create for the Web if you had only 10 kilobytes of code?&#8221;.  The rules didn&#8217;t explicitly say I could use pure SVG, they mention SVG/Canvas in the context of HTML5 only, but I thought I&#8217;d give it a shot.  It&#8217;s in the spirit of the contest, after all.  At the very least it would encourage Microsoft to clarify the rules and at the very best it would be accepted and the rules updated to allow pure SVG applications.  Looks like it was my lucky day.<span id="more-551"></span></p>
<p>I decided to go with my <a href="http://codedread.com/solitaire.php">Solitaire</a> demo because it was the most complete, didn&#8217;t infringe on any copyrights (looking at you Tetris), and most visually recognizable.  It&#8217;s not the most innovative, but then again the point of this is not necessarily to win any prizes.  It&#8217;s really about increasing awareness.</p>
<p>Unfortunately, the SVG (26kb) and JavaScript (16kb + 21kb) totaled 63kb.  I did some cleanup of the SVG, minified the JS and then put the script inline with the SVG and then gzipped it.  The result was a .svgz file that was 9kb.  Perfect!</p>
<p>I then got an email from a friendly marketing/evangelism person at Microsoft who said that the engineers did not know how to open the svgz file to review the code to ensure it was under 10k.  Woops!  I explained to her that I thought it would be ok for the SVG to be gzipped, much as PNG/GIF files use compression and sent her the uncompressed SVG file for them to review.  After all, SVG is just an image format, right? <img src='http://www.codedread.com/blog/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<p>Was I following the rules?  Did Microsoft give me a fair shake?  <a href="http://mix10k.visitmix.com/Entry/Details/160">See for yourself</a>.  Who knows, maybe this is the first time a Microsoft admin had to figure out how to serve SVG on a Microsoft web server.</p>
<p>Out of curiosity, I later tried to see how far I was able to get down the Solitaire game: <a href="http://codedread.com/solitaire.svgz">5811 bytes</a>.  Not bad for a complete game that has scalable graphics.  I&#8217;d be curios to see the equivalent SWF file.</p>
<p>I don&#8217;t expect you to vote for my entry, but what I do expect you to do is now go out and submit .SVGZ entries to the MIX 10k challenge.  That one SVG entry is looking pretty lonely.  If I can get Solitaire down to 5811 bytes, surely you can do better?</p>
<p>Thanks a lot to Amy, the evangelist/marketing person who really was quite patient with me.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.codedread.com/blog/archives/2010/01/14/mix-10k-code-challenge-svg/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>HTML5 += Intertwingly</title>
		<link>http://www.codedread.com/blog/archives/2008/12/15/html5-intertwingly/</link>
		<comments>http://www.codedread.com/blog/archives/2008/12/15/html5-intertwingly/#comments</comments>
		<pubDate>Mon, 15 Dec 2008 16:07:27 +0000</pubDate>
		<dc:creator>Jeff</dc:creator>
				<category><![CDATA[Software]]></category>
		<category><![CDATA[Technology]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[html5]]></category>
		<category><![CDATA[sam ruby]]></category>
		<category><![CDATA[w3c]]></category>

		<guid isPermaLink="false">http://blog.codedread.com/archives/2008/12/15/html5-intertwingly/</guid>
		<description><![CDATA[Sam Ruby has just been appointed co-chair of the HTML5 Working Group.  In addition to being an early adopter of HTML5, Sam has been a loud proponent of distributed extensibility within HTML and a vocal critic of the entire HTML5 process in general.  I&#8217;m glad to see Sam is putting his money where [...]]]></description>
			<content:encoded><![CDATA[<p><object type="image/svg+xml" width="100" height="100" style="float:right" data="http://codedread.com/clipart/party.svgz"><span/></object><object type="image/svg+xml" width="100" height="100" style="float:right" data="http://codedread.com/clipart/html.svgz"><span/></object><a href="http://intertwingly.net/blog" title="Sam Ruby">Sam Ruby</a> has just been <a href="http://lists.w3.org/Archives/Public/public-html/2008Dec/0145.html">appointed co-chair</a> of the <a href="http://www.w3.org/html/wg/" title="HTML Working Group">HTML5 Working Group</a>.  In addition to being an early adopter of HTML5, Sam has been a loud proponent of <a href="http://www.intertwingly.net/blog/2007/08/02/HTML5-and-Distributed-Extensibility" title="Distributed extensibility proposal for HTML5">distributed extensibility</a> within HTML and a <a href="http://intertwingly.net/blog/2007/11/29/HTML5-needs-a-CarterPhone">vocal</a> <a href="http://intertwingly.net/blog/2008/11/20/Half-Full">critic</a> of the entire HTML5 process in general.  I&#8217;m glad to see Sam is putting his money where his mouth is.  It will be very interesting to see how this will affect the dynamics of the Working Group.</p>
<p>A warm congratulations to Sam and a heartfelt <em>Good Luck</em>!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.codedread.com/blog/archives/2008/12/15/html5-intertwingly/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
	</channel>
</rss>
