dipityTripleView = function()
{
  this.init = function()
  {
    elems.container = document.getElementById('triple_container');
    elems.map_outer = document.getElementById('map_outer');
    elems.map = document.getElementById('map');
    elems.flow = document.getElementById('flow');
    elems.tags = document.getElementById('tags');

    regions.container = sz_util.getRegionWH(elems.container);

    var flow_height = parseInt(regions.container.height * 0.65);
    var map_width = parseInt(regions.container.width * 0.60);

    elems.flow.style.width  = [ regions.container.width, "px" ].join("");
    elems.flow.style.height = [ flow_height, "px" ].join("");

    elems.map_outer.style.height  = [ regions.container.height - flow_height, "px" ].join("");
    elems.map_outer.style.top     = [ flow_height, "px" ].join("");
    elems.map_outer.style.width   = [ map_width, "px" ].join("");

    var map_padding = 8;

    elems.map.style.left    = [ 0, "px" ].join("");
    elems.map.style.top     = [ map_padding, "px" ].join("");
    elems.map.style.height  = [ parseInt(elems.map_outer.style.height) - (map_padding), "px" ].join("");
    elems.map.style.width   = [ parseInt(elems.map_outer.style.width), "px" ].join("");

    elems.tags.style.height = [ regions.container.height - flow_height, "px" ].join("");
    elems.tags.style.left   = [ map_width, "px" ].join("");
    elems.tags.style.top    = [ flow_height, "px" ].join("");
    elems.tags.style.width  = [ regions.container.width - map_width, "px" ].join("");

    elems.tags.style.visibility = "visible";
    elems.map_outer.style.visibility = "visible";
    elems.flow.style.visibility = "visible";
  }

  var elems = {};
  var regions = {};

  var this_obj = this;
  this.init();
}

if (document.getElementById('map_outer') && document.getElementById('flow') && document.getElementById('tags')) {
  var triple_view = new dipityTripleView();
}