Javascript Coolness
August 8th, 2009I’m really excited about how option.js and caseclass.js are coming along. I just committed a bunch of additions, with case classes now supporting simple extractors and options now iterable.
I’m really excited about how option.js and caseclass.js are coming along. I just committed a bunch of additions, with case classes now supporting simple extractors and options now iterable.
I’m really liking Scala and its premiere web framework, Lift, so if you’re interested in building web apps in a language that mixes functional and object-oriented paradigms well and does cool concurrency stuff, check them out.
As I’ve been really getting into Javascript this year, I’ve been seeing a lot of parallels between Scala’s functional features and the surprising amount of functional things you can do in Javascript as I learn Scala. My hope is to eventually supplement to the many excellent Scala tutorials for programmers coming from Java or Ruby with one geared towards Javascript programmers.
In the mean time, I’ve made porting Scala’s case classes to Javascript the first test of my ability to draw connections between the two languages. I’ve just started and you can follow the progress of caseclass.js on GitHub.
This morning I whipped up a quick script to crossfade between two divs using Prototype and Scriptaculous. I’m using in a project to replace a div with another loaded via AJAX. Check out crossfade.js on GitHub.
I’m one of the organizers of the Mobile Widget Camp on May 2. The free event is taking place at Pakhuis de Zwijger, Amsterdam. Daniel Appelquist (Vodafone Betavine), Peter-Paul Koch (Quirksmode), and Elliot Kember (Carsonified) are among the speakers in the morning, so you’re guaranteed to get a great introduction to Vodafone/Opera widgets. Beside these speakers there will be hands-on workshops and time to code your own mobile widgets. Anyone with basic HTML, CSS and Javascript knowledge can make a mobile widget, so make sure to come and help will be available from experts to help you coding. Read more about Mobile Widget Camp on the website.
Over the past few months I’ve become both more comfortable with Javascript and more impressed with what is possible with the language (more on that, with an example, in a few weeks). Doing lots of work with web application frameworks, I’ve become convinced that writing a framework entirely in Javascript would be both possible and useful. After meeting James Darling at UKGovWeb09 and checking out his Coup De website, I started considering the idea more seriously. I had a free day last Sunday and got coding. The result is jsFrame.
jsFrame is a web framework built entirely upon Javascript, HTML and CSS. It makes heavy use of Prototype.js and unlike some Javascript systems (such as coup-de) it uses the Model-View-Controller pattern and only loads Views as requested. This means that complicated applications are quite simple to develop, though it also means that simple pages take longer to load than they would with a normal website. I am particularly proud of the simply routing system, which is able to handle pretty URLs with a simple .htaccess file and my Javascript code. For more information, check out the demo site.
Non Javascript hackers can take several things away from this: the browser is becoming more and more the basis for rich web applications, and without Flash; network connections can still be a performance bottleneck despite faster connections, particularly on mobile browsers; reasonably advanced web projects can be executed in a short period of time. Oh, and I’m pretty handy with Javascript and web frameworks, and you might want to hire me!
Here is a nice little Javascript function to load some Javascript libraries:
function includeLibs()
{
var libs = [{object: 'Prototype', src: 'http://www.mobypicture.com/slideshow/prototype.js'}, {object: 'Lightbox', src: 'http://www.mobypicture.com/slideshow/lightbox.js'}];
for (var k = 0; k < libs.length; k++)
{
try
{
var obj = eval(libs[k].object);
}
catch (err)
{
var obj = false;
}
if (obj == false)
{
var newjs=document.createElement('script');
newjs.type='text/javascript';
newjs.src=libs[k].src;
document.getElementsByTagName('head')[0].appendChild(newjs);
}
}
}
This is particularly useful if you’re writing a widget that requires external libraries but the user might already have them loaded, such as Prototype.