<?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>designerZen &#187; javascript</title>
	<atom:link href="http://www.designerzen.com/tag/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.designerzen.com</link>
	<description>design and creative works of zenon olenski</description>
	<lastBuildDate>Mon, 22 Mar 2010 11:58:17 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Day 011 : Flash!</title>
		<link>http://www.designerzen.com/2010/day-011-flash/</link>
		<comments>http://www.designerzen.com/2010/day-011-flash/#comments</comments>
		<pubDate>Mon, 01 Feb 2010 16:54:20 +0000</pubDate>
		<dc:creator>designerzen</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[actionscript]]></category>
		<category><![CDATA[designerzen]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[Multimedia]]></category>

		<guid isPermaLink="false">http://www.designerzen.com/?p=292</guid>
		<description><![CDATA[As I generally earn my keep these days playing with Flash, I thought it only fair to dedicate a large portion of the site to a flash applet that in some way integrates with the design of the site. Well, after thinking long and hard about what exactly the flash applet should do, I have [...]]]></description>
			<content:encoded><![CDATA[<p>As I generally earn my keep these days playing with Flash, I thought it only fair to dedicate a large portion of the site to a flash applet that in some way integrates with the design of the site. Well, after thinking long and hard about what exactly the flash applet should do, I have condensed it&#8217;s job down to three essential functions. <strong>Firstly</strong>, to play music and movies &#8211; this is a multimedia site after all &#8211; <strong>secondly</strong>, to suck in RSS feeds and display them visually one at a time, and <strong>thirdly</strong> to integrate with the html and AJAX so that it can display relevant animations depending on <em>where you are on</em> the site.<span id="more-292"></span><br />
The challenge is to make a visually interesting, well designed and seamless site, where pressing mp3s or flv links in the html allows them to play in the flash, as well as showing load animations for the bored user. As Flash animation is popular, there is going to have to be some animation (however subtle). </p>
<p>So far there is a dancing robot who has a TV for a belly, a shifty looking ninja and a pig with a jetpack. I&#8217;m just playing for now <img src='http://www.designerzen.com/blog/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
]]></content:encoded>
			<wfw:commentRss>http://www.designerzen.com/2010/day-011-flash/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>NomadRadio.fm</title>
		<link>http://www.designerzen.com/2009/nomadradiofm/</link>
		<comments>http://www.designerzen.com/2009/nomadradiofm/#comments</comments>
		<pubDate>Thu, 02 Apr 2009 14:27:56 +0000</pubDate>
		<dc:creator>designerzen</dc:creator>
				<category><![CDATA[Favourites]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Multimedia]]></category>
		<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[actionscript]]></category>
		<category><![CDATA[ajax]]></category>
		<category><![CDATA[as3]]></category>
		<category><![CDATA[cms]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[music]]></category>
		<category><![CDATA[php]]></category>
		<category><![CDATA[xhtml]]></category>

		<guid isPermaLink="false">http://www.designerzen.com/?p=223</guid>
		<description><![CDATA[Renegade Web Radio Bored of the charts? Looking for sounds to keep you occupied? Look no longer with music and mixes from around the world in one simple interface &#8211; combining a podcast, blog and mix aggregator &#8211; held together with AJAX magic check it out @ nomadradio.fm Features Cross Fading between tracks Prefetching of [...]]]></description>
			<content:encoded><![CDATA[<p><img class="right size-thumbnail wp-image-318" title="Nomad Screenshot" src="http://www.designerzen.com/blog/wp-content/uploads/2009/04/screenshot-150x150.jpg" alt="Nomad Radio dot FM" width="150" height="150" /></p>
<h3>Renegade Web Radio</h3>
<p>Bored of the charts? Looking for sounds to keep you occupied? Look no longer with music and mixes from around the world in one simple interface &#8211; combining a podcast, blog and mix aggregator &#8211; held together with AJAX magic</p>
<p><span id="more-223"></span><br />
check it out @ <a title="Nomad Radio" class="external_link" href="http://nomadradio.fm/">nomadradio.fm</a></p>
<h4>Features</h4>
<ul>
<li>Cross Fading between tracks</li>
<li>Prefetching of the next track so that there aren&#8217;t any gaps between songs</li>
<li>A fast visualiser that reacts onbeat as well as to the frequencies</li>
<li>Saved volume and a rotary dial <img src='http://www.designerzen.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </li>
<li>AJAX backend so that you can browse around without losing audio</li>
<li>Flash <-> Javascript bi-communication</li>
</ul>
<p>Get involved and send over your mixes!</p>
<div class="flashbox frame">
<a id="max" class="embedflash alignright" style="width: 300px; height: 360px;" href="http://www.nomadradio.fm/wp-content/themes/NomadRadio/MusicVacuum.swf?iptc=http://www.nomadradio.fm/?feed=podcast&#038;seamless=true&#038;autostart=false&#038;crossfade_duration=500&#038;crossfade_curve=0&#038;buffer_duration=1000">nomad radio player</a>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.designerzen.com/2009/nomadradiofm/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Day 007 : Technical Evolution</title>
		<link>http://www.designerzen.com/2009/day-007-technical-evolution/</link>
		<comments>http://www.designerzen.com/2009/day-007-technical-evolution/#comments</comments>
		<pubDate>Mon, 23 Mar 2009 11:49:55 +0000</pubDate>
		<dc:creator>designerzen</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[ajax]]></category>
		<category><![CDATA[designerzen]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://www.designerzen.com/?p=188</guid>
		<description><![CDATA[Unlike my previous site, I want this new theme to work dynamically, with only relevant information changing, rather than having to refresh the entire site on each click. I want this for a number of reasons, least of all to make a smoother interface for a simple site, but also so that the entire site [...]]]></description>
			<content:encoded><![CDATA[<p>Unlike my previous site,<strong> I want this new theme to work dynamically</strong>, with only relevant information changing, rather than having to refresh the entire site on each click. I want this for a number of reasons, least of all to make a <em>smoother interface</em> for a simple site, but also so that the <em>entire site can become aware of changes in realtime</em>. The large empty space above the navigation bar is for a large scaling flash applet that I am currently coding, and this will communicate with the javascript code in the html to act reactively to each page selection.<span id="more-188"></span>  </p>
<p>In this way, <em>the entire site remains pretty similar</em>, with only a few changes that happen on link clicking. To accomplish this, I am using the incredible jQuery Javascript library to make asynchronous calls to load pages into sections, and also to display and control the flash applet with a series of animation and data commands.</p>
<p>The most challenging aspects of designing for such sites lie in how using Javascript removes a lot of the controls that we take for granted &#8211; a good example here would be that using Javascript to load in a new page breaks the BACK button in your browser. Which, for most users, is completely unacceptable. Other problems such as <em>incorrect permalinks</em> for bookmarking and <em>placing history items in your list</em> are difficult to remedy, although with cunning use of hidden forms and some Javascript parsing functions for extrapolating Urls and creating permalinks, it is possible.</p>
<p><strong>The site now handles itself cross-browser</strong> and deals with all of these issues, as well as scrolling to anchored links and handling bookmarks.</p>
<p>If you find that this site is causing you problems, or that it is not working as I described, please leave a comment along with your machine details and browser specifications. Thanks!</p>
<p><strong>Tested on</strong> : <em>Firefox 2+ / IE 6+ / Safari 2+ / Opera 7+ / Konqueror 2+ / Chrome </em><br />
<strong>Machines</strong> : <em>Windows XP / Windows 2000 / Windows Vista / Mac OSX Leopard / Linux Kubuntu / Linux Fedora</em></p>
<p><em>Know Issues</em> : Konqueror disables the flash applets ability to comminicate with Javascript (See error message in flash) &#8211; this is completely outside of my control and seems to depend on how your system is configured. This won&#8217;t prevent you from enjoying the site, just won&#8217;t let you see alot of the animations!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.designerzen.com/2009/day-007-technical-evolution/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Designerzen.com</title>
		<link>http://www.designerzen.com/2008/designerzen-com/</link>
		<comments>http://www.designerzen.com/2008/designerzen-com/#comments</comments>
		<pubDate>Thu, 14 Feb 2008 15:00:15 +0000</pubDate>
		<dc:creator>designerzen</dc:creator>
				<category><![CDATA[Flash]]></category>
		<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[actionscript]]></category>
		<category><![CDATA[draw]]></category>
		<category><![CDATA[illustrator]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[me]]></category>
		<category><![CDATA[meta]]></category>
		<category><![CDATA[music]]></category>
		<category><![CDATA[photoshop]]></category>
		<category><![CDATA[sketching]]></category>

		<guid isPermaLink="false">http://www.designerzen.com/?p=501</guid>
		<description><![CDATA[Ever evolving portfolio Hi, my name is Zen. Ths is my website full of stuff! Read how the site was made by following the blog posts.]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.designerzen.com/blog/wp-content/uploads/2007/01/avatar.png" alt="" title="avatar" width="109" height="220" class="left size-full wp-image-498" /></p>
<h3>Ever evolving portfolio</h3>
<p>Hi, my name is Zen. Ths is my website full of stuff! Read how the site was made by following the <a href="http://www.designerzen.com/tag/designerzen/">blog posts</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.designerzen.com/2008/designerzen-com/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Mixtape.FM</title>
		<link>http://www.designerzen.com/2007/mixtape/</link>
		<comments>http://www.designerzen.com/2007/mixtape/#comments</comments>
		<pubDate>Sat, 25 Aug 2007 18:43:10 +0000</pubDate>
		<dc:creator>designerzen</dc:creator>
				<category><![CDATA[Favourites]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[Widgets]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[graphics]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[music]]></category>
		<category><![CDATA[php]]></category>
		<category><![CDATA[web-services]]></category>
		<category><![CDATA[web2.0]]></category>
		<category><![CDATA[xml]]></category>

		<guid isPermaLink="false">http://www.designerzen.com/blog/index.php/2007/introducing-a-new-way-to-enjoy-music/</guid>
		<description><![CDATA[introducing a new way to enjoy music! Mix your favourite music blogs with your social bookmarks, add streaming radio and folksonomy&#8230; integrate with new music web services plus the latest web trends and what do you get&#8230;? Social Music for the masses Mixtape Democratic Radio Ver 0.8 What is it? A fancy new website that [...]]]></description>
			<content:encoded><![CDATA[<p><img class="left" src="http://www.designerzen.com/blog/wp-content/uploads/2007/03/democracy.gif" alt="Social Radio for the masses" /></p>
<h3>introducing a new way to enjoy music!</h3>
<p>Mix your favourite music blogs with your social bookmarks, add streaming radio and folksonomy&#8230; integrate   with new music web services plus the latest web trends and what do you get&#8230;?<span id="more-6"></span></p>
<blockquote><p>Social Music for the masses</p></blockquote>
<p><a title="follow me..." href="http://www.designerzen.com/democracy/">Mixtape Democratic Radio Ver 0.8</a></p>
<h5>What is it?</h5>
<p>A fancy new website that collects your<strong> favourite music blogs</strong>, MP3s and <strong>net playlists</strong> into one universally accessible site. Read about music, discover new music, and <strong>listen to &amp; download the latest songs</strong> based on your web-based bookmarks and the <strong>social bookmarks of thousands</strong>.</p>
<h5>What does it do?</h5>
<p>The use of a social bookmarking service allows you to <em>bookmark practically any music service</em>. You can save simple <strong>RSS</strong> or <strong>ATOM feeds</strong> from your favourite music blog, your <strong>XSPF playlists</strong>, even <strong>M3U </strong>radiostreams! The volume of music services is growing by the day, so you can aggregate all your favourite music from sites such as<em> Imeem, IJig, The Hype Machine, BlogDigger </em>or any blog from the thousands collected on <em>el.bo.ws</em>.</p>
<p>Furthermore, if you use<strong> last.fm</strong> webservices &#8211; which I highly recommend &#8211; you can save your recently played songs, find out which songs you already have in your collection and get advice on music that you would like but just haven&#8217;t yet heard.</p>
<h5>How does it work?</h5>
<p>The channels are saved in your favourite online social bookmark collection. If you don&#8217;t have one, look no further than <a href="http://del.icio.us">Del.icio.us</a>&#8230;</p>
<p>Simply save the RSS feed from your favourite music blog using the tag <em>mp3blogfeed</em> and your music-blog will be <strong>automatically available to everybody in the world on the home page</strong> with the most recent at the top. If you prefer to only see your own bookmarks, simply enter your del.icio.us username in the settings box, or if you are using another service, the correct RSS URL.</p>
<p>Playlists are automatically saved onto your hard disk as shared flash-cookies along with such useful things as volume and the last page you visited &#8211; dive back in from where you started!</p>
<h5>What&#8217;s in store for the future&#8230;</h5>
<ul>
<li>Better integration &amp; support for M3U streaming audio files.</li>
<li>Actionscript 3 version with interactive music controls, pitch, cue, crossfading between songs.</li>
<li>Integrate last.fm radio stations for each user!</li>
</ul>
<h5 class="bluu">Technical details</h5>
<p class="geek">Written entirely from the ground up in <strong>actionscript 2</strong> &#8211; <em>no components, no templates</em>.</p>
<p>Uses <em>Shared Local Objects</em> to save xspf playlist, volume and recent browsing history.</p>
<p>Features <strong>javascript data api</strong> to allow bookmarking and the emailing of blog links.</p>
<p>Uses your existing social bookmarking services &#8211; <strong>imports RSS, XML &amp; OPML.</strong></p>
<p><strong>Intelligent caching of data</strong> and pre-empting of user desired information.</p>
<p>Features a scrolling data window with mousewheel input, inertia and variable speed scrolling.</p>
<p><a class="website" title="follow me..." href="http://www.designerzen.com/democracy/">Check it out, tell me what you think!</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.designerzen.com/2007/mixtape/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>saffrolla sounds</title>
		<link>http://www.designerzen.com/2007/saffrolla/</link>
		<comments>http://www.designerzen.com/2007/saffrolla/#comments</comments>
		<pubDate>Fri, 06 Jul 2007 17:29:41 +0000</pubDate>
		<dc:creator>designerzen</dc:creator>
				<category><![CDATA[Art]]></category>
		<category><![CDATA[Favourites]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Graphics]]></category>
		<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[graphics]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[illustrator]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[music]]></category>
		<category><![CDATA[php]]></category>
		<category><![CDATA[web-services]]></category>
		<category><![CDATA[web2.0]]></category>
		<category><![CDATA[xml]]></category>

		<guid isPermaLink="false">http://www.designerzen.com/2007/saffrolla/</guid>
		<description><![CDATA[Ajax Multimedia webshop! Dripping with high-tech features, this new music label offers free previews, podcasts and chances to buy digital songs or vinyl! This one stop site will cater for all your eclectic dance needs. Don&#8217;t forget about the secret button! This new music label that cut its teeth releasing party vinyl has gone digital [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://www.designerzen.com/blog/wp-content/uploads/2007/07/saffrolla.gif" class="right" alt="Saffrolla Sounds Homepage" /></p>
<h3>Ajax Multimedia webshop!</h3>
<p>Dripping with high-tech features, this new music label offers free previews, podcasts and chances to buy digital songs or vinyl! This one stop site will cater for all your eclectic dance needs. Don&#8217;t forget about the secret button!  <span id="more-82"></span></p>
<p>This new music label that cut its teeth releasing party vinyl has gone digital with a <strong>fresh new music website</strong> and<strong> shop</strong>!</p>
<p><strong>Play music whilst shopping for music</strong>, previewing any track live. That was the main objective&#8230; well that along with high quality music delivery using Web2.0 features such as podcasting and rss feeds.</p>
<p>With a stark graphic style by <strong>Vacant Design</strong> we needed some strong visual animations as cue points for actions. The Flash-based music player is autonomous and animated as it loads an artist&#8217;s playlist or swaps between songs. For those not of a nervous disposition, there is always the <em>secret hyper mode</em> (*top dial on the left) if you find it too tame.</p>
<p>Speaking of the music player, let me mention a few unique features:</p>
<ul>
<li>automatic saving of your volume preference for when you come visit us again</li>
<li>communicates with the artists&#8217; pages so that songs can be selected outside of the music player</li>
<li>wholly animated to reflect the party music is playing with regards to the volume</li>
<li>super secret party mode for fast processors</li>
</ul>
<p>If you would like to attend any events, join the mailing list and check out the news and live pages.</p>
<h2 class="bluu">Technical details</h2>
<p class="geek">  ⊗ ActionScript 2.0 Custom music player code with intelligent internal music database.</p>
<p>⊗	Flash mx compatible with ActionScript animated GUI.</p>
<p>⊗	Music Player loads XML, RSS and XSPF playlists from the netcast.</p>
<p>⊗	Javascript html music controls and feedback &#8211; communicating between flash and html.</p>
<p>⊗	On-the-fly xpsf and xml (atom or RSS) playlist creation with scraped coverart</p>
<p>⊗	Based on the Opensource CMS WordPress. Yes really!</p>
<p>⊗	SEO super optimised with analytical software to determine most important records.</p>
<p>⊗	All Artists and channels have relevant RSS and ATOM feeds.</p>
<p>⊗	AJAX page requests into dynamic html.</p>
<p>⊗	Down-gradeable to simple html shop.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.designerzen.com/2007/saffrolla/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
