$("tbody td").click(function(element){
    if($(element.target).hasClass('selected')){
        $(element.target).removeClass('selected')
    }else{
        $(element.target).addClass('selected')
    }
});
function callbackdata(){
    var displayTopRow = document.getElementById("topTemplate");
    var leftTop ="";
    var rightTop ="";
    if(displayTopRow !=null){
         var topLen = displayTopRow.cells.length;
         var topRow = displayTopRow.cells;
         var temp ="";
         for(var i=0;i<topLen;i++){
                 if(topRow[i].className=="selected"){
                     temp+='●';
                 }else if(topRow[i].className=="verticalLine"){//verticalLine
                     temp+='#';
                 }else{
                    temp+='';
                 }
         }
         leftTop = temp.split("#")[0];
         rightTop = temp.split("#")[1];
    }
    
    
    var leftBottom = "";
    var rightBotton ="";
    var displayBottomRow = document.getElementById("bottomTemplate");
    if(displayBottomRow !=null){
         var buttonmLen = displayBottomRow.cells.length;
         var buttonmRow = displayBottomRow.cells;
         var temp ="";
         for(var i=0;i<buttonmLen;i++){
             if(buttonmRow[i].className=="selected"){
                 temp+='●';
             }
             else if(buttonmRow[i].className=="verticalLine"){
                 temp+='#';
             }
             else{
                 temp+='';
             }
         }
         leftBottom = temp.split("#")[0];
         rightBotton = temp.split("#")[1];
    }
    var hyMap = new Map();
    hyMap.set("leftTop",leftTop);
    hyMap.set("rightTop",rightTop);
    hyMap.set("leftBottom",leftBottom);
    hyMap.set("rightBotton",rightBotton);
    return hyMap;
 }