function colorizeRowsAndCols(row, column, td_classname, head_classname)
{
document.getElementById("td_row_"+row).className = head_classname;
document.getElementById("td_column_"+column).className = head_classname;
for(i = 1; i < row; i++)
  {
  document.getElementById("td_"+i+"_"+column).className = td_classname;
  }
for(j = 1; j < column; j++)
  {
  document.getElementById("td_"+row+"_"+j).className = td_classname;
  }
}

function colorize(td_id)
{
document.getElementById(td_id).className = "td_selected";
var row = document.getElementById(td_id).getAttribute('row');
var column = document.getElementById(td_id).getAttribute('column');
colorizeRowsAndCols(row, column, 'td_lightened', 'td_head_lightened');
showDetails(td_id, "div_1")
}

function uncolorize(td_id)
{
document.getElementById(td_id).className = "td_normal";
var row = document.getElementById(td_id).getAttribute('row');
var column = document.getElementById(td_id).getAttribute('column');
colorizeRowsAndCols(row, column, 'td_normal', 'td_head');
hideDetails();
}

function showDetails(td_id, div_id)
{
var row = document.getElementById(td_id).getAttribute('row');
var column = document.getElementById(td_id).getAttribute('column');

document.getElementById("td_luk_size").innerHTML = document.getElementById("td_column_"+column).innerHTML + "ìì x " + document.getElementById("td_row_"+row).innerHTML + "ìì";
document.getElementById("td_luk_price").innerHTML =  document.getElementById("td_"+row+ "_"+column).innerHTML + "ð";
}

function hideDetails()
{
document.getElementById("td_luk_size").innerHTML = "";
document.getElementById("td_luk_price").innerHTML =  "";
}