function SDWidget()
{
  this.init = false;
  this.popup = null;
  this.overlay = null;
  
  this.showMap = function()
  {
    if (!this.init)
    {
      this.popup = document.createElement('div');
      this.popup.id = 'sd_widget_popup';
      this.popup.style.width = '620px';
      this.popup.style.marginLeft = '-310px';
      var scroll_top = document.body.scrollTop;
      this.popup.style.top = (scroll_top + 64.5) + 'px';
      
      var popupPanel = document.createElement('div');
      popupPanel.id = 'sd_widget_panel';
      popupPanel.style.height = '540px';
      popupPanel.style.left = '0px';
      popupPanel.style.top = '0px';
      popupPanel.style.width = '100%';
      this.popup.appendChild(popupPanel);
      
      var popupClose = document.createElement('div');
      popupClose.id = 'sd_widget_close';
      popupClose.className = 'sd_widget_link';
      var closeButton = document.createElement('a');
      closeButton.innerHTML = '[x]';
      closeButton.title = 'Close';
      closeButton.href = 'javascript:void(0)';
      var self = this;
      closeButton.onclick = function() {
        self.close();
        return false;
      };
      popupClose.appendChild(closeButton);
      this.popup.appendChild(popupClose);
      
      var popupForm = document.createElement('form');
      popupForm.id = 'sd_widget_form';
      
      var popupTitle = document.createElement('div');
      popupTitle.id = 'sd_widget_title';
      popupTitle.innerHTML = 'Map';
      
      popupForm.appendChild(popupTitle);
      
      var mapContent = document.createElement('div');
      mapContent.id = 'sd_widget_map';
      mapContent.style.height = '450px';
      mapContent.style.width = '600px';
      mapContent.style.position = 'relative';
      mapContent.style.backgroundColor = '#E5E3DF';
      
      var popupContent = document.createElement('div');
      popupContent.id = 'sd_widget_content';
      popupContent.style.height = '450px';
      
      popupContent.appendChild(mapContent);
      popupForm.appendChild(popupContent);
      
      var popupControls = document.createElement('div');
      popupControls.id = 'sd_widget_controls';
      var button = document.createElement('input');
      button.type = 'button';
      button.value = 'Close';
      button.style.cursor = 'pointer';
      var self = this;
      button.onclick = function() {
        self.close();
        return false;
      };
      popupControls.appendChild(button);
      popupForm.appendChild(popupControls);
      
      this.popup.appendChild(popupForm);
      document.body.appendChild(this.popup);
      
      var map = new SDMapSG('sd_widget_map');
      map.setCenter(369889.4429, 144248.6723);
      map.setLevel(5);
      map.setSize(600, 450);
      map.draw();
      
      this.overlay = document.createElement('div');
      this.overlay.id = 'sd_widget_overlay';
      page_size = getPageSize();
      this.overlay.style.width = page_size[0] + 'px';
      this.overlay.style.height = page_size[1] + 'px';
      document.body.appendChild(this.overlay);
      this.overlay.style.display = 'block';
      
      this.init = true;
    }
    else
    {
      this.overlay.style.display = 'block';
      this.popup.style.display = 'block';
    }
  };
  
  this.close = function()
  {
    this.popup.style.display = 'none';
    this.overlay.style.display = 'none';
  };
}
var sd_widget = new SDWidget();

function getPageSize()
{
  if (window.innerHeight && window.scrollMaxY) {
    y = window.innerHeight + window.scrollMaxY;
    x = window.innerWidth + window.scrollMaxX;
  } else if (document.body.scrollHeight > document.body.offsetHeight) {
    y = document.body.scrollHeight;
    x = document.body.scrollWidth;
  } else {
    y = document.body.offsetHeight;
    x = document.body.offsetWidth;
  }
  pageSize = new Array(x, y);
  return pageSize;
}