Hire Us For Your Next Project!

February 2nd, 2009  |  Published in Random

openWe wanted to drop in a quick line to let all of our readers know that we are accepting new projects now! We have had a wonderful time working on some very exciting projects and now that the new year is here, we are ready for more challenging projects. So if you are looking for quality work, done professionally, get in touch with us. Our team will help you with end-to-end solution. No matter what is your budget.Also keep checking our blog for some more articles.  


October 1st, 2008  |  Published in Random  |  2 Comments

Some inspirational words form Jawwad:

It begins with hope. Hope that you will be able to do what you want to do the way you want to do it. And in doing so change your little part of the world.Maybe make your point, take your stand and survive. On a good day possibly even make money.Where there is hope, in the first year, there are also doubts. Not just yours. Every soul you touch has his list of why nots.Why you would be better off without hope and your little stand. Why it would be best to conform, bow your head, ignore your itch and join others who before you made a date with destiny and skipped.But then, against hope you find your little shelter from the nay sayers. Family, without fail; sometimes an employee, sometimes a customer, sometimes both.And hope matures into belief.Over the years as you answer the why nots, grow, prosper and keep on taking bigger stands, belief converts to pride.Pride, that you finally did something that changed your little part of the world.But it always begins with hope.  

What’s up with Microsoft?

September 12th, 2008  |  Published in General

So the first ad was weird enough but then yesterday I saw the second ad of the series and I must say, it was confusing one. What do you guys think?

Google Chrome

September 3rd, 2008  |  Published in General  |  8 Comments

The buzz on the web is all about the new Google browser — Google Chrome. So naturally, as web developers we had to give it a try and see how fast it really is. And you know what? its lightenning fast. Not a surprise given that it is powered by WebKit!There are few other things that are very exciting about Google Chrome but then there are also few things that we didn’t like. Things we didn’t like:1. The name. I mean what the heck were they thinking!?2. The completely minimized theme. While it is great from my perspective, I think the general public would’ve liked it better if they could find it familiar to use. From UI prespective, it is very important to bring the familiarity factor in for the user. They should be able to look at it and identify it as a browser something that looks like IE but works better.  So have you given it a run yet? What do you think?  

How are you using ProtoChart?

August 15th, 2008  |  Published in General, ProtoChart  |  7 Comments

We have been overwhelmed by the amount of response we have recieved on ProtoChart in our inbox. It is a delight to see how other creative minds can take an idea further and push the limits.

While we are trying to fix the bugs and get new features added to ProtoChart ourselves,  one of the biggest advantage of open-source code is that people tend to contribute to it by adding new features themselves!

Well we wanted to know how are you currently using or planning to use ProtoChart in your project?

For starters I found an interesting post on how to use ProtoChart via Camping (see comment below) at http://greg.rubyfr.net/pub/?p=506 very interesting stuff.

ProtoFlow2 — sneakpeak

August 6th, 2008  |  Published in General, Javascript, ProtoFlow, Scriptaculous  |  12 Comments

Well we have a little surprise coming for you guys soon… check it out…

ProtoFlow2 Sneakpeak


ProtoChart - Tutorial: Creating a Bar Chart

August 1st, 2008  |  Published in Javascript, Projects, ProtoChart, Prototype, Tutorial  |  37 Comments

You can view the final result of this tutorial here.

After a lot of email requests and comments suggestions from last post, I am going to start a small tutorial outlining how to use ProtoChart. This first tutorial will cover the basics of ProtoChart and then we will also create a simple Bar Chart using ProtoChart.

Step 0: Download all the required libraries.

Step 1: Setting up your HTML

In order for ProtoChart to work you will need proper doctype. Then you need to insert the following in <head> tags.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"


Please note that you need to change PATH/TO to point at the correct JS files. Once you are done including the required JS files you will also need to create a DIV that will hold your chart. You will need to explicitly provide the width and height in the style attribute for the div. So lets create our DIV element:

<div id="barchart" style="width:500px;height:300px"></div>

Step 2: Creating ProtoChart Object

ProtoChart object takes three parameters:

  1. The element where you want to draw the chart
  2. Data series
  3. Chart Options

We have already create the DIV element where we will create our chart. So now lets look at the Data Series for ProtoChart
You can pass the data using three different methods:

1. Array Of Series:
[data1, data2, ….]

2. Array Of x-y Coordinates:
[ [x1, y1], [x2, y2], [x3, y3], …]

3. Array Of Objects:
Each object is represented like this:

     data: [ [1,2], [3,4], [5,6] ],label: "My First Dataset",
     lines: {show: true, fill: true},
     points: {show: true}

The object representation of the data is highly recommended to use. Since it gives you the ability to define a “label” for the data series which is used in creating the legend chart. The data can be either an array of x-y coordinates or simply and array of data points.

Now lets create the actual chart.

Since we are creating a Bar Chart we will need two data series. Lets call them data1 and data2. The chart we are making is a representation of a the feed stats provided by an awesome service called AideRSS. We have used their API to collect information regarding Ajaxian and Ajax Blog — more specifically we got the data that tell us some stats about the feed such as total number of posts (labelled “All”), total number of good posts (labelled “Good”), average posts per month (labelled “Avg Month”), total number of great posts (labelled “Great”) and finally total number of best posts (labelled “Best”).

So here is the JS that will do the magic:

var graph = new Proto.Chart(
 		data: [[1, 996], [2, 1162], [3, 102], [4, 491], [5, 75]],
 		label: "Ajaxian"
 		data: [[1, 307], [2, 2184], [3, 436], [4, 304], [5, 152]],
 		label: "Ajax"
 	xaxis: {
 		min: 0,
 		max: 6,
 		ticks: [
 			[0, ""],
 			[1, "Good"],
 			[2, "All"] ,
 			[3, "Avg Month"],
 			[4, "Great"],
 			[5, "Best"],
 			[6, " "]
 	legend: {
		show: true
 	points: {
 		show: true
 	bars: {
 		show: true

Lets look at what we did in the code above:

1. First we pass the element where we want to render the chart. The magically $ function comes in action

2. We create our data series using Objects notation. This gives us the ability to provide a “label” for our legend

3. We pass in our options for the chart.  Here we do a bit of a magic to make our chart look great. First is we define our x-axis to have a minimum value of 0 and a maximum value of 6. This create an extra cushion for the bar charts to render properly (since we have more than 1 data series). Next we also define our own labels for the ticks. This makes our graph look even nicer. Since now users have better labels along the axis. You can do similar stuff for the y-axis. Just check out our documentation for further details.

Now one last note before we end this tutorial. You SHOULD always create your chart after your DOM has finished loading. You can use prototype to detect that you via

Event.observe(window, ‘load’, function(){});

This is how your chart should look like:

Bar Chart - Tutorial

Hope you liked this tutorial. If you have any questions please feel free to post your question here and if you find any bugs please use our Google Code site to submit them.

ProtoChart - Download, Examples & Docs Now Available!

July 30th, 2008  |  Published in General, Javascript, ProtoChart, Prototype  |  16 Comments

We want to thank those of you who waited impatiently for the release. We are now ready to release the code, documentation (better than nothing) and examples to show you how  you can use ProtoChart to create beautiful charts in your next project!

What should you know?

You can go to http://www.deensoft.com/lab/protochart/ to view a complete overview about the library.

For all the bugs and feature submission please use our Issue list located at Google Projects.

We hope you like this library and as always we will work to get the bugs fixed and features added to the  library as we go along. Your comments and suggestions are welcome via our blog.

ProtoChart: Prototype + Canvas = Pretty Charts

July 28th, 2008  |  Published in Javascript, Projects, ProtoChart, Prototype  |  43 Comments

Update: Code and more information can be found here.

We finally have a bit stable version of our new charting library. ProtoChart aims to provide a nice library to draw:

  • Line Chart
  • Bar Chart
  • Pie Chart
  • Curve Chart
  • Mix Chart
  • Area Chart

General set of features:

  • Multiple data series on same graph
  • Legend support
  • Customizable grid, grid border, background
  • Customizable axis-tick values (both x and y)

We are excited to release the code as open source. The motivation is very much drawn from other great charting libraries such as PlotKit, Flot and Flotr. These are some excellent libraries with a lot of neat features. We hope to grow ProtoChart to the same level as them.

For now you can check out our quick demo which should let you play with generic features.

So what’s next?  We will continue to improve on this library as we go and we welcome your reviews, views and opinions. We will shortly release the source code and documentation soon.

Test drive ProtoUI

May 27th, 2008  |  Published in General, Javascript, ProtoUI, Prototype, Scriptaculous, UI  |  3 Comments

Well we have been recieving a lot of emails since our last post regarding the UI library. We decided to provide an early access to some of the tests for the library and documentation around it. There is a lot of work still to be done and we hope to steer the project according to the feedback we recieve.

You can check out demos and docs here.

Feel free to post your comments/suggestion here.