Web Service in Restful way

Principles of REST Web Service Design

1. Identify all possible conceptual entities that we want to expose as web services. Everything is a consider the resource that will make available as services.

2. Each resource should has its own URI and identify the resources by a noun not a verb

Incorrect: http://www.parts-depot.com/parts/getPart?id=00345

Correct: http://www.parts-depot.com/parts/00345

3. Categorize the resources so that the client can receive a representation of of resource or they can modify it. At the initial state, make those resources accessible using an HTTP GET, Then using HTTP POST, PUT, and/or DELETE for modification states.

4. Resource that is accessible through HTTP GET should just return a representation of the resource. The invocation of the resource should not result in modifying the resource.

5. No resource should be placed in isolation, but hyperlinks (href), so the user can drill down to detail information or at least to the related information.

6. Don't put all resources in a single show room. Provide hyperlinks to obtain more details resources.

7. Specify the format of response data using a specific schema (DTD, W3C Schema, RelaxNG, or Schematron). For those services that require a POST or PUT to it, also provide a schema to specify the format of the response.

8. Describe how your services are to be invoked using either a WSDL document, or simply an HTML document.

What make pair programming doom

When start talking about pair programming, it's so obvious that there must be two people working together. wow it sounds such a wasteful to spend on work that can be done with only one man work. I would say 'yes' and 'no'. it's all about how you implement it. Kent Beck has a good explanation and guide line about XP. I'm here not to repeat him, but just to give some feed back of what I have read and sharing some experience that my team has implemented for this last 5 months.

What made our team success

1. Our work survives and goes smoothly width rhythm of switching keyboard, writing test, make the test pass and refactor the code. one person become a driver start writing a test, then other person become an observer and thinking ahead of making the test pass. after the driver finished hist test, he pass the keyboard to other person to make the test pass and he becomes the observer. the next person just has to make the test pass, no matter how the ugly the code is. Once the wrote the code that makes the test passes, Then he passes the keyboard to other to make the code clean.
2. Break the big task into smaller task that can be done within a day if possible and keep the rhythm to complete those tasks.
3. Survive with rules defined by team. Rules is one of the most important thing to make pair programming effectively executed. eg. the team member must update the code every morning, every time he wants to added new feature or event before start fixing bugs. the member must not leave code uncommitted over night. That looks simple, but it needs times, effort and practice to be part of your work.
   

I think i won't go to much into detail, Kent Beck is still the best person that you can refer to regarding all aspect of pair programming.

Cool javascript pie chart generator with SVG

You might found this very interesting and useful to be able to generate a SVG piechart. I have done all the heavy calculation to make this pieces of code, so you just need to provide only few value, then will be able get the piechart display on the screen. For the other kinds of statistical graph I will post it once I have free time to complete it. Now let enjoy my SVG Piechat in javascript.
var drawPieChart = function(/*Value of slices*/val, /*Optional object*/ o){

/**
* Store a polyline object
* (object)
*/
var pieChart;

/**
* Store a string of points required by polyline object
* (string)
*/
var pointStr;

/**
* Contains the namespace for SVG-related utilities
* (Object)
*/
var SVG = {
ns: "http://www.w3.org/2000/svg",
xlinks: "http://www.w3.org/1999/xlink"
};

/**
* Create default object if not being passed
* (object)
*/
var o = o ? o : {};

/**
* Create a SVG dom object
* (object)
*/
var svg = document.createElementNS(SVG.ns, "svg:svg");

//Set default value if (options {o}) not being passed
var xOrigin = o.xOrigin ? o.xOrigin : 0;
var yOrigin = o.yOrigin ? o.yOrigin : 0;
var xCoordinateSize = o.xCoordinateSize;
var yCoordinateSize = o.yCoordinateSize;
var strokeColor = o.strokeColor ? o.strokeColor : "black";
var strokeOpacity = o.strokeOpacity ? o.fillOpacity : 0.7;
var strokeSize = o.strokeSize ? o.strokeSize : 2;
var strokeLinecap = o.strokeLinecap ? o.strokeLinecap : "round";
var strokeJoincap = o.strokeJoincap ? o.strokeJoincap : "round";
var radius = o.radius ? o.radius : 150;

// Set the size the canvas in pixels
svg.setAttribute( "width", xCoordinateSize + "px" );
svg.setAttribute( "height", yCoordinateSize + "px" );
svg.style.position = "absolute";

// Set the coordinates used by drawings in the canvas
svg.setAttribute( "viewBox", xOrigin + " " + yOrigin + " " + xCoordinateSize + " " + yCoordinateSize );

// Define the XLink namespace that SVG uses
svg.setAttributeNS( "http://www.w3.org/2000/xmlns/", "xmlns:xlink", SVG.xlinks );

var onePixel = xCoordinateSize / yCoordinateSize;

//The total value of slices
var total = 0;

//Figure out the value in degree of each slice value
for(var i = 0; i < val.length; i++){
total += val[i].value;
}

for(var i = 0; i < val.length; i++){
val[i].percentage = ( val[i].value * 100 ) / total;
val[i].value = ( val[i].value * 360 ) / total;

}

/** Create Shadow **/
var pieShadow = document.createElementNS( SVG.ns, "circle" );
pieShadow.setAttribute("cx","655");
pieShadow.setAttribute("cy","205");
pieShadow.setAttribute("r",radius);
pieShadow.setAttribute("fill","black");
pieShadow.setAttribute("fill-opacity","0.4");
pieShadow.setAttribute("filter","url(#dropshadow)");
svg.appendChild(pieShadow);

/** Creating pie chart **/

//Creating the first slice
var pieChart = document.createElementNS( SVG.ns, "path" );
var startX, startY, endX, endY;

//The point the the pieChart will draw from the center point
startX = Math.cos(0) * radius;
startY = Math.sin(0) * radius;

//The end point the pieChart will end its drawing before close
endX = startX - Math.cos( (val[0].value) * 0.017453293) * radius;
endY = (Math.sin( (val[0].value) * 0.017453293) * radius) - startY;

//Build a string of value to be used by path
var pieValue;
pieValue = (val[0].value > 180)? "M650,200" + "l"+ startX + ","+ -startY + "a"+radius+","+radius+" 0 1,0 " + -endX + "," + -endY + "z" : "M650,200" + "l"+ startX + ","+ -startY + "a"+radius+","+radius+" 0 0,0 " + -endX + "," + -endY + "z";

//Draw piechart and set its attributes
pieChart.setAttribute( "d", pieValue);
pieChart.setAttribute( "stroke-width", strokeSize * onePixel);
pieChart.setAttribute( "stroke", strokeColor );
pieChart.setAttribute( "fill", val[0].color );
pieChart.setAttribute( "stroke-linecap", strokeLinecap );
pieChart.setAttribute( "stroke-linejoin", strokeJoincap );

//Append polyline dom object to view box
svg.appendChild(pieChart);

//The point the the pieText will be placed
var textX = Math.cos( (val[0].value/2 ) * 0.017453293 ) * radius;
var textY = Math.sin( (val[0].value/2 ) * 0.017453293 ) * radius;

//Create svg text dom
var pieText = document.createElementNS( SVG.ns, "text" );
pieText.setAttribute("x",650 + textX/2 );
pieText.setAttribute("y",200 - textY/2 );
pieText.setAttribute("font-family","verdana, arial, sans-serif");
pieText.setAttribute("font-size","14");
pieText.appendChild(document.createTextNode(val[0].percentage.toFixed(2) + "%"));
svg.appendChild(pieText);

//Accumlate the agles
var angles = val[0].value;

/** Creating the rest of piechat slice **/
for(var i = 1; i < val.length; i++){

//Create pieChart dom
var pieChart = document.createElementNS( SVG.ns, "path" );

//The point the the pieChart will draw from the center point
startX = Math.cos( angles * 0.017453293 ) * radius;
startY = Math.sin( angles * 0.017453293 ) * radius;

//The point the the pieText will be placed
textX = Math.cos( (val[i].value/2 + angles) * 0.017453293 ) * radius;
textY = Math.sin( (val[i].value/2 + angles) * 0.017453293 ) * radius;

//Accumulate the angles
angles += val[i].value;

//The end point the pieChart will end its drawing before close
endX = startX - Math.cos( angles * 0.017453293) * radius;
endY = (Math.sin( angles * 0.017453293) * radius) - startY;
pieValue = (val[i].value > 180)? "M650,200" + "l"+ startX + ","+ -startY + "a"+radius+","+radius+" 0 1,0 " + -endX + "," + -endY + "z" : "M650,200" + "l"+ startX + ","+ -startY + "a"+radius+","+radius+" 0 0,0 " + -endX + "," + -endY + "z";

//Draw piechart and set its attributes
pieChart.setAttribute( "d", pieValue);
pieChart.setAttribute( "stroke-width", strokeSize * onePixel);
pieChart.setAttribute( "stroke", strokeColor );
pieChart.setAttribute( "fill", val[i].color );
pieChart.setAttribute( "stroke-linecap", strokeLinecap );
pieChart.setAttribute( "stroke-linejoin", strokeJoincap );

//Append pieChart dom object to view box
svg.appendChild(pieChart);

/** Create piechart text **/

var pieText = document.createElementNS( SVG.ns, "text" );
pieText.setAttribute("x",650 + textX/2 );
pieText.setAttribute("y",200 - textY/2 );
pieText.setAttribute("font-family","verdana, arial, sans-serif");
pieText.setAttribute("font-size","14");
pieText.appendChild(document.createTextNode(val[i].percentage.toFixed(2) + "%"));

//Append pieText dom object to view box
svg.appendChild(pieText);
}

return svg;
}

function init( ) {

var sliceValue = [
{value: 3000,color:"red" },
{value: 1000,color:"pink" },
{value: 500,color:"blue" },
{value: 500,color:"white" },
{value: 500,color:"yellow" },
{value: 500,color:"black" },
{value: 500,color:"silver" }

] };

The memoization

The memoization is a very efficiency way when you want some heavy computation to be done only once at first time. Let check the ajax creating an XhrObject example createXhrObject: function() { // Factory method.
var methods = [
function() { return new XMLHttpRequest(); },
function() { return new ActiveXObject('Msxml2.XMLHTTP'); },
function() { return new ActiveXObject('Microsoft.XMLHTTP'); }
];
for(var i = 0, len = methods.length; i <>
try {
methods[i]();
}
catch(e) {
continue;
}
// If we reach this point, method[i] worked.
this.createXhrObject = methods[i]; // Memoize the method.
return methods[i];
}
The object creation will be heavily checking the computability of each browser. But it will done only at the first time, the function createXhrObject will replace itself with the creation method once found the browser compatibility.

How to implement the Least Knowledge Principle

We should only invoke methods that belongs to:
1. The object itself
2. The object that is parameterised to the method
3. The object that a method created or instantiated
4. Any component of object

The Least Knowledge Principle

The principle of least knowledge guides us to reduce the interaction between object to just only few close friend the class itself. Don't try to be a close friend to all other class in the system. When you designing a system which composes of many classes and sub classes, you gotta be careful that one class should only interacts with those close immediately close friend and try to make least coupling as much as you can. For one system that all class are tightly coupling ( one class has interactions to many classes) will increase the complexity of the system and boost up the cost of maintanance.

SOLID will make you a solid programmer

The below article is referenced from http://mmiika.wordpress.com/oo-design-principles/

S.O.L.I.D. Class Design Principles

Collected by Robert C. Martin for his book “Applying Principles and Patterns”,

Single Responsibility Principle (SRP)

A class should have only one reason to change. For example, if a change to the business rules causes a class to change, then a change to the database schema, GUI, report format, or any other segment of the system should not force that class to change.

• http://davidhayden.com/blog/dave/archive/2005/05/29/1066.aspx
• http://c2.com/cgi/wiki?SingleResponsibilityPrinciple
• Head First Design patterns page 185, 336, 339, 367
• http://msdn.microsoft.com/en-us/magazine/cc546578.aspx

Open/Closed Principle (OCP)

Software entities (classes, modules, functions, etc.) should be open for extension, but closed for modification.

• http://davidhayden.com/blog/dave/archive/2005/06/04/1096.aspx
• http://en.wikipedia.org/wiki/Open/closed_principle
• Head First Design patterns page 86-87, 407
• http://c2.com/cgi/wiki?OpenClosedPrinciple

Liskov substitution principle (LSP)

Subtypes must be substitutable for their base types. If class A inherits from class B, then wherever you can use A you should be able to use B. E.g. remember that square is not necessarily a rectangle! When extending: Preconditions cannot be straightened, Postconditions cannot be loosened, visible Invariants cannot be changed (?). Invariants: users depend on this both before and after sending a message. Use a proper set-based inheritance relationship. Not following set semantics is very risky. Subsumption Rule: A reference to a subtype can be used in any context where a reference to a super type is expected. This principle extremely limits what SHOULD be done with the pure extension (inheritance) mechanism. Do not follow at your own risk.

• http://davidhayden.com/blog/dave/archive/2005/06/10/1226.aspx
• Agile Principles and Patterns page ?
• http://c2.com/cgi/wiki?LiskovSubstitutionPrinciple
• http://en.wikipedia.org/wiki/Liskov_substitution_principle
• http://javaboutique.internet.com/tutorials/JavaOO/

Interface Segregation Principle (ISP)

The dependency of one class to another one should depend on the smallest possible interface.

• http://davidhayden.com/blog/dave/archive/2005/06/15/1482.aspx
• http://c2.com/cgi/wiki?InterfaceSegregationPrinciple
• http://www.google.com/search?q=interface+segration+principle
• http://doodleproject.sourceforge.net/articles/2001/interfaceSegregationPrinciple.html

Dependency Inversion Principle (DIP)

Depend upon abstractions (interfaces), not upon concrete classes.

• http://davidhayden.com/blog/dave/archive/2005/06/10/1261.aspx
• http://en.wikipedia.org/wiki/Dependency_inversion_principle
• Head First Design patterns page 139-143
• http://c2.com/cgi/wiki?DependencyInversionPrinciple