Ruby And Your Browser
Jul 21, 2009 In Development By Leon GersingMoving Ruby from the server to the client opens up a whole new world of possibilities for web developers. In this article, Leon demonstrates a powerful technique enabled by Gestalt: using IronRuby to call a REST-based web service. The rest is up to your imagination.
One of the key complaints that I hear from developers that do not use the web as their primary development platform, is that age old fear surrounding JavaScript. No amount of praise for one of my favorite, yet most reviled languages of the web platform, JavaScript, will redeem that language in the eyes of developers who do not prefer it and in the immortal words of fictional character Stuart Smalley: "That's ok."
For those looking for an alternative, perhaps an alternative that provides an object oriented experience more to their liking, Gestalt is now opening the door to those very alternatives to sneak in. At launch they are Python and Ruby in their Iron forms. So now, when we think of client scripting we don't have to think in terms of have to use but rather in terms of choose to use.
The choice we're currently in love with at EdgeCase is Ruby. I, personally, am quite enamored with it's simplicity, power and beauty. For me, when I look at a project through the pink hue of my ruby colored classes, everything seems possible, everything looks harmonious... everything is draped in beauty. There are times when I miss those glasses when dealing with the client. In fact, there are JavaScript libraries like PrototypeJS that take the best parts of Ruby and graft them directly into JavaScript. As great as those solutions are they are still not Ruby in the browser. Now, Gestalt, provides a way to use those glasses when the concept of client scripting solutions are brought to the table. Which, in my case, is an increasing percentage of the time.
To help illustrate some of the things that I've missed out on I'll provide a simple hello world Ajax sample. Nothing fancy, nothing that you'd write home about, but hopefully a small grain of inspiration to whet your palate; give you something to ponder for your next project.
So, what I really want is to download the content of REST service and print that to an element on my web page. With Gestalt I not only have full access to the DOM via the DLR but I have access to display Silverlight controls on the page dynamically as well. So, let's make this even more fun by dynamically adding Silverlight elements to a base canvas as well. That's a lot for hello world so let's get started!
Open a new html page. Make sure you include the declarations for xhtml 1.0 transitional and your references to the gestalt requisites.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Tweets for the Tweet</title> <script src="jquery.js" type="text/javascript"></script> <script src="gestalt.js" type="text/javascript"></script> </head>
Now we're going to need some elements on the page to help trigger our client and server events.
<xml id="world" class="xaml" Width="800" Height="600"
style="display:none;">
<StackPanel x:Name="palate" Width="800" Height="600">
<StackPanel Orientation="Horizontal">
<Button x:Name="add_time" Content="What time is it,
client?"></Button>
<Button x:Name="add_remote_time" Content="What time is it,
server?"></Button>
</StackPanel>
</StackPanel>
</xml>
In this simple unit of code we're using XAML to describe a couple of buttons. Now, let's write some ruby to control them. We'll set one button to show us updates from the client side and the other to make an asynchronous call back to the server. I'd call it ajax but... well, it's more like arubx or something else odd. I'll let the marketers of the world pick a Roman or Greek god to name this one as well :)
Let's start by establishing some event handlers for our buttons. Since we're dealing with Silverlight controls, the events follow the methodName(object:sender, EventArgs:args) method signature. Let's create a few methods to handle the button clicks in Ruby.
<script class="*" language="ruby">
include System
include System::Net
def adding_time_from_client(s,e)
add_time DateTime.now.to_s
end
def adding_time_from_server(s,e)
client = WebClient.new
client.DownloadStringCompleted{|s,e| add_time(e.Result)}
uri = Uri.new "http://localhost/gestalt/server_time.ashx"
client.DownloadStringAsync uri
end
def add_time(t)
clock = TextBlock.new
clock.Text = t
me.palate.children.add clock
end
<script>
The methods are remarkably simple. The client method is using the globally accessible Gestalt member "me" to create a new TextBlock (via the helper method "add_time") set it's Text property and add it to the StackPanel we declared in XAML above.
The server version is a little more complex but not much more. It's using the WebClient class in the System.Net namespace to send an asynchronous message to the server. We use a block to handle the response and make the same call to "add_time" to add the time text block to the XAML StackPanel.
The last thing that we need to do is wire up out buttons to their respective handlers.
me.add_time.Click{|s,e| adding_time_from_client(s,e)}
me.add_remote_time.Click{|s,e| adding_time_from_server(s,e)}
In IronRuby 0.6 the syntax for mapping delegate methods is not with the += operator but with a block. That may change as IronRuby matures.
There's nothing wrong with JavaScript for your client and Ajax needs, of course not. Instead there are options that one has in front of them that allow developers to make choices that can make them the most productive. Sometimes a language choice can be the most powerful and important choice in a project's success. With Gestalt and Ruby you have just that, more choice, to create the next great application.
Follow the Conversation
2 Comments so far. You should leave one, too.
am i wrong in thinking that I also have to download / install silverlight to get this working?
@matthew – That is correct. The Ruby in-browser functionality actually depends only on DLR, which is open source and open standard. However, no browsers include native support for DLR yet. Firefox’s “IronMonkey” project has attempted to add DLR support to Firefox, but hasn’t shipped yet. So the easiest way to get DLR in the browser is to “hijack” Silverlight, and use SL as the deployment vector for DLR.