var date= new Date();
var today=date.getDate();
var M =date.getMonth();
var Y= date.getFullYear();
var totalDaysinMonth= 32- new Date(Y,M,32).getDate();

var firstDay=new Date(Y,M,1).getDay(); //day of the week

function create(){

var bodytble=document.getElementById("cont");
var cnt2=1;
var tble =document.createElement("table");
var tbod=document.createElement("tbody");
var data;
var tile=new Array(7);
var darray=new Array("S","M","T","W","T","F","S");
var flag=0; 
var rowHeaders;
weeks= (totalDaysinMonth+firstDay) / 7;
var HeaderRow=document.createElement("tr"); //must create a new one in order to work... and might as 

for(var  j=0;j<7;j++){ 
   rowHeaders=document.createElement("th");  
   rowHeaders.appendChild(document.createTextNode(darray[j])); 
   HeaderRow.appendChild(rowHeaders);
}

tbod.appendChild(HeaderRow);

for(var cnt=0;cnt<=weeks;cnt++){
var row=document.createElement("tr"); //must create a new one in order to work... and might as 
                                      //well do it here since it will be blown away due to scope
 for(var i=0;i<7;i++){
   if (flag==0 && i>=firstDay){
    flag=1;
    i=firstDay;
   }
   if(flag==1 && cnt2 <=totalDaysinMonth){
        tile[i]=document.createElement("td");
        if(today==cnt2){
          //we can highlight current date
          tile[i].className="today";
         }
         data=document.createTextNode(""+cnt2);
         tile[i].appendChild(data);
         row.appendChild(tile[i]); 
         cnt2++;
  }
  else{
       tile[i]=document.createElement("td");
       data=document.createTextNode(" ");
       tile[i].appendChild(data);
       row.appendChild(tile[i]); 
   }

 }//end for i

  tbod.appendChild(row);
 }//endfor
  tble.appendChild(tbod);
  bodytble.appendChild(tble);
}


function dragit(nameofEl,event){

var x =parseInt(nameofEl.style.left);
var y =parseInt(nameofEl.style.top);
//difference between pint and mouse-click

var deltaX= event.clientX-x;
var deltaY= event.clientY-y;

//remain active while mouse button is held and removed when mouse button removed
if(document.addEventListener){
	document.addEventListener("mousemove", moveHandler, true);
	document.addEventListener("mouseup" ,   upHandler, true);
}
else if (document.attachEvent){ //ID 5+ event Model
	document.attachEvent("onmousemove",moveHandler);
	document.attachEvent("onmouseup",upHandler);
}
else{ //IE 4
	var oldmovehandler =document.onmousemove;
	var olduphandler = document.onmouseup;
	document.onmousemove=moveHandler;
	document.onmouseup=upHandler;
}
//its been handled, don't let others view it
if(event.preventDefault) event.stopPropagation();//DOM 2
	else event.returnValue=true;                    //IE

//prevent default action
if(event.preventDefault) event.preventDefault();   //DOM 2
else event.returnValue=false;

//================================================
function moveHandler(e){
  if(!e) e=window.event; //IE event model

//move element to current mouse position adjusting to the offset of the initial mouse click
nameofEl.style.left=(e.clientX- deltaX) + "px";
nameofEl.style.top=(e.clientY- deltaY) + "px";

if(e.stopPropagation) e.stopPropagation(); //DOM 2
else e.cancelBubble =true;

}

//==============================catch mouse up======

function upHandler(e){

if(!e) e.window.event; //IE
//Unregister the capturing of event handlers
if(document.removeEventListener){ //DOM
	document.removeEventListener("mousemove", moveHandler, true);
	document.removeEventListener("mouseup" ,   upHandler, true);
}
else if(document.detachEvent){ //IE 5+
    document.detachEvent("onmouseup",upHandler);
    document.detachEvent("onmousemove",moveHandler);
}
else{ //IE 4
    document.onmouseup=olduphandler;
    document.onmousemove=oldmovehandler;
}

if(e.stopPropagation)e.stopPropagation();//DOM 2
else e.cancelBubble =true;


} 
}