Detect IE in Javascript

Below function will return up to IE 10

function IE(v) {
  return RegExp('msie' + (!isNaN(v)?('\\s'+v):''), 'i').test(navigator.userAgent);
}


and for IE 11 follow the below method

if(navigator.userAgent.indexOf("rv:11")>0 && navigator.userAgent.indexOf("Trident")>0)
{
alert("IE 11")
}

Box2d JavaScript Basic Sample

Want to look for Objective C ?? Click Here :) Have fun

I have seen a lot of sample but didn't found the basic code of Box2d in Javascript. So i think i should put this in blog to help others.

This display is here


and code is
<script>
function init() {
var completeScaleRatio = 30;
var canvasWd = document.getElementById("canvas").width;
var canvasHt = document.getElementById("canvas").height;
         var   b2Vec2 = Box2D.Common.Math.b2Vec2
            ,  b2AABB = Box2D.Collision.b2AABB
          , b2BodyDef = Box2D.Dynamics.b2BodyDef
          , b2Body = Box2D.Dynamics.b2Body
          , b2FixtureDef = Box2D.Dynamics.b2FixtureDef
          , b2Fixture = Box2D.Dynamics.b2Fixture
          , b2World = Box2D.Dynamics.b2World
          , b2MassData = Box2D.Collision.Shapes.b2MassData
          , b2PolygonShape = Box2D.Collision.Shapes.b2PolygonShape
          , b2CircleShape = Box2D.Collision.Shapes.b2CircleShape
          , b2DebugDraw = Box2D.Dynamics.b2DebugDraw
            ,  b2MouseJointDef =  Box2D.Dynamics.Joints.b2MouseJointDef
            ;
         
         var world = new b2World(
               new b2Vec2(0, 10)
            ,  true
         );
 
 var fixDef = new b2FixtureDef;
         fixDef.density = 1.0;
         fixDef.friction = 0.5;
         fixDef.restitution = .2;
         
         var bodyDef = new b2BodyDef;
         
         //create ground
         bodyDef.type = b2Body.b2_staticBody;
 fixDef.shape = new b2PolygonShape;
 //Bottom
 bodyDef.position.Set(10, canvasHt / completeScaleRatio-.1);
 fixDef.shape.SetAsBox(20, .1);
 world.CreateBody(bodyDef).CreateFixture(fixDef);
 //Top
 bodyDef.position.Set(10, .1);
 world.CreateBody(bodyDef).CreateFixture(fixDef);
 //Left
 bodyDef.position.Set(.1, 0);
 fixDef.shape.SetAsBox(.1, 14);
 world.CreateBody(bodyDef).CreateFixture(fixDef);
 //Right
 bodyDef.position.Set(canvasWd/completeScaleRatio-.1, 0);
 world.CreateBody(bodyDef).CreateFixture(fixDef);
 
 //Create Bodies
 bodyDef.type = b2Body.b2_dynamicBody;
 var carShape = new b2PolygonShape();
 var vertix = new Array(new b2Vec2(0, 0), new b2Vec2(.5, -2), new b2Vec2(1, 3), new b2Vec2(.7, 3), new b2Vec2(0, 1));
 carShape.SetAsArray(vertix);
 fixDef.shape = carShape
 bodyDef.position.Set(5, canvasHt / completeScaleRatio/2);
 world.CreateBody(bodyDef).CreateFixture(fixDef);
 
 var debugDraw = new b2DebugDraw();
debugDraw.SetSprite(document.getElementById("canvas").getContext("2d"));
debugDraw.SetDrawScale(completeScaleRatio);
debugDraw.SetFillAlpha(1);
debugDraw.SetLineThickness(1.0);
debugDraw.SetFlags(b2DebugDraw.e_shapeBit | b2DebugDraw.e_jointBit);
world.SetDebugDraw(debugDraw);

window.setInterval(update, 1000 / 60);
function update() {
   world.Step(1/60 , 10, 10);//Gravity Animation is caused by this.
            world.DrawDebugData(); // If removed then no bas Area will be shown
            world.ClearForces();
}
</script>

JavaScript Bound Rectangle Area while Rotation in Canvas

function checkTransformPoints(carCenterX, carCenterY, carWidth, carHeight,angle)
{
var w1 = carWidth*Math.cos((Math.PI / 180) * angle);
var w2 = carHeight*Math.cos((Math.PI / 180) * (90-angle));

var h1 = carHeight*Math.sin((Math.PI / 180) * (90-angle));
var h2 = carWidth*Math.sin((Math.PI / 180) * angle);

var maxWidth = w1 + w2;
var maxHeight= h1 + h2;
var minX = carCenterX - maxWidth/2;
var minY = carCenterY -maxHeight/2;

var maxX = carCenterX + maxWidth/2;
var maxY = carCenterY +maxHeight/2;

var extremeLeftX = minX + w2;
var extremeLeftY = minY;

var extremeRightX = maxX;
var extremeRightY = minY+h2;

var extremeBottomLeftX = minX;
var extremeBottomLeftY = maxY-h2;

var extremeBottomRightX = minX+w1;
var extremeBottomRightY = maxY;

 this.topLeftX = function () { return extremeLeftX; } this.topLeftY = function () { return extremeLeftY; } this.topRightX = function () { return extremeRightX; } this.topRightY = function () { return extremeRightY; } this.bottomLeftX = function () { return extremeBottomLeftX; } this.bottomLeftY = function () { return extremeBottomLeftY; } this.bottomRightX = function () { return extremeBottomRightX; } this.bottomRightY = function () { return extremeBottomRightY; }
ctxDrift.save();
ctxDrift.beginPath();
ctxDrift.rect(extremeLeftX, extremeLeftY, 10, 10);
ctxDrift.rect(extremeRightX, extremeRightY, 10, 10);
ctxDrift.rect(extremeBottomLeftX, extremeBottomLeftY, 10, 10);
ctxDrift.rect(extremeBottomRightX, extremeBottomRightY, 10, 10);
ctxDrift.fillStyle = 'white';
ctxDrift.globalAlpha = 1;
ctxDrift.closePath();
ctxDrift.stroke();
ctxDrift.fill();
ctxDrift.restore();
}