function pinSection(container)
{
	this.container     = container;
  this.text          = "";
  this.imageUrl      = "";
  this.showButton    = false;
  this.area          = null;
  this.onclick       = null;
  
  this.create           = __pinsection_create;
}

function __pinsection_create()
{
  try {
    // create table
    var table = document.createElement("table");
    this.container.appendChild(table);
    table.style.width = "100%";
    table.style.height = "100%";
    table.cellPadding = 0;
    table.cellSpacing = 0;
    table.border = 0;
    table.unselectable = "on";

    // create top row
    var tr = table.insertRow(-1);
    tr.unselectable = "on";
    var td = tr.insertCell(-1);
    td.unselectable = "on";
    var image = document.createElement("img");
    td.appendChild(image);
    image.border = 0;
    image.src = this.imageUrl + "left-top.png";
    td = tr.insertCell(-1);
    td.unselectable = "on";
    td.style.backgroundImage = "url(" + this.imageUrl + "middle-top.png)";
    td.style.backgroundRepeat = "repeat-x";
    td = tr.insertCell(-1);
    td.unselectable = "on";
    image = document.createElement("img");
    td.appendChild(image);
    image.border = 0;
    image.src = this.imageUrl + "right-top.png";

    // create middle row
    tr = table.insertRow(-1);
    tr.unselectable = "on";
    td = tr.insertCell(-1);
    td.unselectable = "on";
    td.style.backgroundImage = "url(" + this.imageUrl + "left-middle.png)";
    td.style.backgroundRepeat = "repeat-y";
    td = tr.insertCell(-1);
    td.unselectable = "on";
    td.style.width = "100%";
    var h = this.container.offsetHeight;
    td.style.height = h - 18;//"46px";
    td.style.backgroundImage = "url(" + this.imageUrl + "middle-middle.png)";
    td.style.backgroundRepeat = "repeat-x";
    // create area
    var div = document.createElement("div");
    //div.style.backgroundColor = "blue";
    div.unselectable = "on";
    td.appendChild(div);
    this.area = div;
    div.style.width = "100%";
    div.style.height = "100%";
    td = tr.insertCell(-1);
    td.unselectable = "on";
    td.style.backgroundImage = "url(" + this.imageUrl + "right-middle.png)";
    td.style.backgroundRepeat = "repeat-y";

    // create bottom row
    tr = table.insertRow(-1);
    tr.unselectable = "on";
    td = tr.insertCell(-1);
    td.unselectable = "on";
    image = document.createElement("img");
    td.appendChild(image);
    image.border = 0;
    image.src = this.imageUrl + "left-bottom.png";
    td = tr.insertCell(-1);
    td.unselectable = "on";
    td.style.backgroundImage = "url(" + this.imageUrl + "middle-bottom.png)";
    td.style.backgroundRepeat = "repeat-x";
    
    table = document.createElement("table");
    td.appendChild(table);
    td.unselectable = "on";
    table.style.width = "100%";
    table.style.height = "100%";
    table.cellPadding = 0;
    table.cellSpacing = 0;
    table.border = 0;
    table.unselectable = "on";
    tr1 = table.insertRow(-1);
    tr1.unselectable = "on";
    td = tr1.insertCell(-1);
    td.unselectable = "on";
    // text cell
    td.style.width = "10056";
    td.style.textAlign = "center";
    td.style.fontFamily = "arial";
    td.style.fontSize = "8pt";
    td.style.color = "#3E6AAA";
    td.innerHTML = this.text;
    // image cell
    td = tr1.insertCell(-1);
    td.unselectable = "on";
    if(this.showButton) {
      image = document.createElement("img");
      td.appendChild(image);
      image.border = 0;
      image.src = this.imageUrl + "section-button.png";
    }

    td = tr.insertCell(-1);
    td.unselectable = "on";
    image = document.createElement("img");
    td.appendChild(image);
    image.border = 0;
    image.src = this.imageUrl + "right-bottom.png";
  } catch(e) {}  
}


