April 28, 2008

Adding Spry widgets to blogger

In my previous article I introduced you to Adobe's Spry framework for Ajax and explained its pros and cons. In this article, we will implement Spry into a blog and see how beautifully it works. Our aim will be to add an accordion in the right column. We will display a panel of badges, and widgets like Blog Rush and Feedjit in this accordion.

Spry provides widgets that are independent to one another and this makes it very easy to implement it restrictive environment. Another plus point is that your implementation of accordion is going to be very small. And the implementation is very simple. Once you have the downloaded Spry framework, you need unzip it and get hold of just two files located at \widgets\accordion. You need SpryAccordion.css and SpryAccordion.js files to build your project. If you want to make come changes, you can modify the CSS file. The file contains all the necessary style classes required for the accordion widget.

Once your custom modifications are done. Its time we move it on to the web! To host these two files, I will be using Google Pages. Many of you will be wondering why I am using Google pages and not other services that are specifically used to host files on web. The reason is, majority of these hosting services are bocked at corporate gateways and offices. I am not willing to mess up by blog when professionals access my blog. So, I will be using Google Pages. Coding a Spry widget is very simple. The accordion we are building will be represented as DIV tags. We will have a main DIV tag denoting the widget and each accordion panel will be represented as separate DIVs inside the main one. Each panel is further divided into panel heading and content. Both these parts are also denoted using DIV. So our widget code will look like this on completion:
<div class="Accordion" id="sampleAccordion" tabindex="0">
<div class="AccordionPanel">
<div class="AccordionPanelTab">Panel Heading</div>
<div class="AccordionPanelContent">
All the blog badges, images, will go in here.
I can have multiple para tags and other tag here.
<div class="AccordionPanel">
<div class="AccordionPanelTab">Panel Heading next</div>
<div class="AccordionPanelContent">
Content for Panel 2 goes here!
<div class="AccordionPanel">
<div class="AccordionPanelTab">Final</div>
<div class="AccordionPanelContent">
Content for the last accordion panel goes here!

Spry framework will not render the above code as accordion. We need to initialize the widget using Java Script. The initialization is also simple and straight forward as creating a object in Java using constructors. Have a look at how we initialize the widget:
<script language="JavaScript" type="text/javascript">
var sampleAccordion = new Spry.Widget.Accordion("sampleAccordion");
You can add this code into blogger template or use a HTML page element to hold the widget. Last modification to the blog is to add the CSS and widget JS files to the blogger template. This can be as simple as:
<link href="http://araotest.googlepages.com/SpryAccordion.css" rel="stylesheet" type="text/css" media="all" />
<script src="http://araotest.googlepages.com/SpryAccordion.js" type="text/javascript"></script>

You can see the demo on my testing blog where I build templates and test different functionalities. I am sure you will be confident enough to implement any other Spry widgets on a blog or site. Watchout for some interesting widgets to appear on my blog soon.

April 26, 2008

Spry framework : A less cared framework?

I wonder how many Ajax developers know about Adobe Spry? I too feel, I have ignored it for long. Everything apart, lots of question arises about a Ajax framework from Adobe. The reason? Adobe is one of the tough competitor to Ajax. With its Flex and AIR technology to build RIA, they are still ahead in RIA technology. Still in prerelease, Spry offers a way to incorporate XML, JSON or HTML data into pages using HTML, CSS, and a minimal amount of JavaScript. Lets have a look at this framework and unearth its pros and cons.

Spry claims to be "Ajax for Everyone". It provides a set of easy to implement set of widgets, effects and data handlers. The main advantage is each component in the framework can be used independently of one another. So, developers need only to include what they need! Other frameworks have lots of files and folder structure to implement widgets like accordion, tabbed panels etc. The major disadvantage of these hierarchical and dependency oriented frameworks are:
  • The framework becomes big and complex.
  • To implement a single feature, you require to host the entire framework.
  • Implementing a small feature might have a big learning curve.
  • Difficult to deploy the framework in a restrictive environment.

Spry framework is the solution to all these plus other advantages. It makes implementing features to the existing web pages very easy. The widgets created into the HTML tags and the framework do not create its own tags. This increases debugging capabilities and readability of the displayed HTML. Dojo toolkit also uses the same methodology to embed widgets. But Spry takes things further to reduce the amount of Java script involved. Advantages does not end here. Each widget is coded independent and developers need to include only the widget files he is going to use. Developer has to use the appropriate CSS and JS files. All he has to do is copy these files to his existing web site folder structure, link them from the page and all the code.

Another advantage with Spry is its ability to work in restrictive environment. Let me explain a restrictive environment. Lets assume I need a accordion in my blog which is hosted on blogger. I am going to host my external java script files in google pages and not any file sharing service available on web; the reason - many corporates blocks these sites and if I host my external files, I am guaranteed of getting my blog messed up for some users. And adding accordion can be made possible by keeping Spry files in google pages and using it in my blog. I will soon demonstrate this feature on my blog.

So why is Spry not so popular? The main reason for this could be Adobe's RIA technology using Flex and AIR. You will also notice that they have not given much UI effects to the widgets in the Spry framework. So, Flex technology itself is shadowing Spry. But Spry can be very helpful when developers need only certain functionality in their web page or application. So if you are an web developer looking to add some features to your pages, have a look at Spry framework!

April 12, 2008

Introducing Java Kernel...

Sun recently released Java SE 6 Update 10 Beta, and this release has some interesting updates to Java SE 6! With the stiff competition on the web application and RIA arena, all players are "in" to provide the best of their platform at the earliest. With this release, Sun is all set to provide some major improvements on Java Applets which has been ignored for quite long.

So, what's so great with this release? The new beta focuses on three major improvements:
  • Enhanced Java deployment
  • Improved performance and look & feel
  • Next-Generation Java Plug-In

Java, for quite long has been one of the most preferred programming language even though the size of JRE has been a issue. Once a Java application is up and running, the sailing is smooth. New JRE has been stable, fast and more reliable. But, the bottle neck was getting the application up and running. Some of the major challenges faced presently are:
  • Difficult to detect JREs, especially from a web browser
  • Difficult to automatically install new JREs
  • Large download size of JREs
  • Poor cold start performance
  • Little overlap between applets and Web Start programs
And the new beta release is aimed in solving these challenges sooner than later.

Java Kernel
The JRE provides many different APIs: Swing, AWT, ImageIO, SQL, CORBA, RMI, XML and much more. The new distribution is aimed at getting Java software up and running faster. So we have,Java Kernel which divides JRE libraries into small bundles. The kernel will include only the most commonly needed JRE components. Additional components are downloaded as needed, and the JRE will download remaining components in the background and then reassemble itself.

Java Delopyment Toolkit
Client using Java have different variety or flavor of JRE installed. Also, there JREs run on different operating systems. Detecting the JRE version is one of the major challenge and deployment toolkit will help in a consistent Java content to all these clients. The deployment toolkit will provide a powerful JavaScripts library that will help in automatically installing Java Platform for Java Plug-in applets and Java Web Start applications.

New Look and Feel
With this new release comes a new cross-platform Swing look & feel called Nimbus. It provides a polished look to applications which choose to use it. And because Nimbus is drawn entirely using Java 2D vector graphics, rather than static bitmaps, it's tiny (only 56KB!) and can be rendered at arbitrary resolutions.

This release includes improvements to patch downloading and installation. The new download engine can resume interrupted downloads automatically. It also uses a new patching algorithm which will significantly reduce the size of future updates.

Well that's all about the new release. If you want to try out these features, I suggest you quick get the early access download and have a look!

April 08, 2008

Google launches App Engine!

Google's introduces its new avatar: Google App Engine. It lets you to build your web application on Google's infrastructure. The web applications are built using
Python, BigTable and GFS. Even though the launch is just a preview release, Google promises to make web application development more simple and fun!

The App engine, once fully launched will be all set to transform the web application. Even though they are targeting existing solutions like Amozon's S3 and Zoho, the developer community is going to have lots of platforms at their disposal. With App engine, there will be no server maintenance. All you have to do is built the application and deploy it. The rest is in Google's hand. With this Google has started a new sub domain : appspot.com , just like blogspot.com. Developers will also be able to control access to the application they create. And important part is, all these are free with a storage capacity of 500 MB. I am sure Google will have a commercial part of this engine.

The application environment consist of Python runtime, Datastore API, Users API, Mail API and URL Fetch API. For now the App engine will support only Python but other runtimes are being considered. The environment includes the following features:
  • Creating of dynamic web pages.
  • Data storage with queries,sorting and transactions.
  • Automatic scaling and load balancing.
  • APIs for authenticating users and sending email using Google Accounts.
  • A SDK to develop applications on your computer.

You can download the SDK (available for all platforms) or browse through the application gallery.

April 07, 2008

Techno Paper gets its 2008 look!

Let me present you the new look of Techno Paper. The new blogger theme is built on Blueprint CSS framework, and I will call this template BluePrint. Its built on 0.7 version of the framework and I would like to thank all people behind the framework. I started learning the CSS framework by building this blogger template. And I have come up with some better features compared to my previous theme.

When starting out to build a new template, I had few things in mind. Make the template simple (less graphics and images) , provide new sections to the blog and retain existing functionalities of old template like Social Bookmarking, Peek-a-Boo, etc.And I have achieved the same with this new template. I have added two new sections to the template and they are: "Featured Article" and "From the Archive". You will see these sections on top of the article. I hope these sections become useful to readers. I am sure rest of the features will be familiar to you and needs no explanation. Let me know your suggestions about this template.


April 06, 2008

db4o : Introduction to Object Oriented Database

All computer graduates must be familiar with a paper named DBMS (where we cramp about RDBMS, relational model etc). I am sure majority of you must have come across the book “Database System Concepts” authored by Silberschartz, Korth and Sudarshan. The book has one or two chapters on Object Oriented Database which most of use just skim through or doesn’t even bother to read. Even though the book only introduces the basic concepts… it was dumped deep in memory until I found db4o.