var b_version=navigator.appVersion;
var isSafari = b_version.search(/applewebkit/i) != -1;

var first_time = 1
var first_close = 0
var urlRegular;
var downhref = '';
var floatboxZoomMeasures = {
  boxExpandTo: 1,
  boxShortenTo: 1,
  bodyExpandTo: 1,
  bodyShortenTo: 1,
  leftExpandTo: 1,
  leftShortenTo: 1,
  rightExpandTo: 1,
  rightShortTo: 1
};
var langid = lang.replace('lang_', '');
var langGroup ={'en':'first', 'es': 'first', 'fr': 'first', 'de': 'first', 'it': 'second', 'zh': 'second', 'tw': 'second', 'ja': 'second',
'first': ['<a id="lang_en"  href="javascript:void(0);"  onclick="setLanguage(this);" >English </a><span>- </span><a id="lang_es" href="javascript:void(0);" onclick="setLanguage(this);" >Español </a><span>- </span><a id="lang_fr" href="javascript:void(0);" onclick="setLanguage(this);" >Français </a><span>- </span><a id="lang_de" href="javascript:void(0);" onclick="setLanguage(this);" >Deutsch </a>'
		  ,'second'],
'second': ['<a id="lang_it" href="javascript:void(0);" onclick="setLanguage(this);" >Italiano </a><span>- </span><a class="size11" id="lang_zh" onclick="setLanguage(this);" href="javascript:void(0)" >简体 </a><span>- </span><a class="size11" id="lang_tw" onclick="setLanguage(this);" href="javascript:void(0)" >繁体 </a><span>- </span><a class="size11" id="lang_ja" onclick="setLanguage(this);" href="javascript:void(0)" >日本語</a> '
,'first'],
'more': '<span>- </span><a id="langmore" href="javascript:void(0);" onmouseover="seemore(this);"> more </a>'
}
	var fistbar = langGroup[langid];
	var secondbar =  langGroup[langGroup[langid]][1];
var floatBoxExpanded = false;

if(BrowserDetect.browser === 'Explorer') {
  var IEquirks = true;
}
else {
  var IEquirks = false;
}

var selector = null;
function err_logging(f) {
    return function() {
        try {
            logDebug("this in err_logging:" + this);
            f.apply(this, arguments);
        } catch(err) {
            if(err.fileName && err.lineNumber)
                logError(err + ' on ' + err.fileName + ':' + err.lineNumber);
            else
                logError(repr(err) + ':' + err.message);
            throw(err);
        }
    };
}

function roundBox() {
  logDebug("round boxes");
  logDebug("padding-bottom:" + getElementDimensions('description'));
  logDebug("padding-bottom:" + getElementPosition('description'));
  /*
  if(IEquirks) {
      var rounded = ['left-box', 'central', 'right-sidebar'];
      map(function (obj) {
          setStyle(obj, {'border': 'none'});
          roundElement(obj, {border: '#e4e2d8'});
              }, rounded);
  }
  */
  if(IEquirks) {
    appendChildNodes('left-box',
        IMG({'class':'llt', src: '/images/corLeTo.gif'}),
        IMG({'class':'llb', src: '/images/corLeBo.gif'}),
        IMG({'class':'lrt', src: '/images/corRiTo.gif'}),
        IMG({'class':'lrb', src: '/images/corRiBo.gif'})
    );
    appendChildNodes('right-sidebar',
        IMG({'class':'llt', src: '/images/corLeTo.gif'}),
        IMG({'class':'llb', src: '/images/corLeBo.gif'}),
        IMG({'class':'lrt', src: '/images/corRiTo.gif'}),
        IMG({'class':'lrb', src: '/images/corRiBo.gif'})
    );
  }
  //roundElement('central', {corners: 'all'});
}

function buildLeftBox() {
  logDebug("building left box");
  appendChildNodes('left-box',
    H1({'class': 'caption'}, homepage.leftTitle),
    TABLE(null, TBODY({id: 'usage'})));

  for(var i = 0; i < usages.length; i ++) {
    var item = usages[i];
    var row = TR(null, 
      /*TD({'class': 'first'}, IMG({src:item.src})),*/
      TD({'class': 'first'}, 
        DIV({'class': 'pngfix'},
          IMG({'src': item.src}))),
      TD({'class': 'second'}, item.desc));
    appendChildNodes('usage', row);
  }
}

function buildCentralBox() {
  logDebug("building central box");
  appendChildNodes('central',
    H1({id: 'share-places'}, homepage.centerTitle),
    H1({id: 'description'}, homepage.description),
    DIV({id: 'get2'},
      H1({id: 'anyone'}, homepage.anyone),
      H1({id: 'free'}, homepage.free),
      DIV({'id': 'get2-btn'}, IMG({src: '/images/'+langid+'/publish/getschmap.gif'})))
  );
}

function buildRightBox1() {
  logDebug("building right sidebar");
  appendChildNodes('right-sidebar',
    H1({'class': 'caption'}, homepage.rightTitle),
    DIV({id: 'showcase'}));

  for(var i = 0; i < showcases.length; i ++) {
    var item = showcases[i];
    var row = DIV({'class': 'case-row'}, 
      DIV({'class': 'intro'}, 
        DIV({'class': 'name'}, item.name),
        DIV({'class': 'city'}, item.city)),
      DIV({'class': 'plet-img'},IMG({src:item.src})));
    appendChildNodes('showcase', row);
  }
}

function buildRightBox() {
  logDebug("building right sidebar");
  appendChildNodes('right-sidebar',
    H1({'class': 'caption'}, homepage.rightTitle),
    TABLE({'cellspacing':'0'}, TBODY({id: 'showcase'})));

  for(var i = 0; i < showcases.length; i ++) {
    var item = showcases[i];
	var row = TR({'id':'showcase_'+i, 'class': 'case-row'}, 
				TD({'class': 'intro'}, 
				  DIV({'class': 'name'}, item.name),
				  DIV({'class': 'city'}, item.author)),
				TD({'class': 'plet-img'},IMG({src:item.src})),
				TD({'class': 'right-placeholder'}));
	
    appendChildNodes('showcase', row);
  }
}

////////////////////////////////////////////////////////////////////////////////
// The class for dynamical show of some layers that they are overlapping with 
// any place within whole picture called schmapplets_all.gif.
/*** These coords are relative to central-box within whole canvas ***/
function layersOverlap(){
    // Operations
    this.init;
    this.layers;
    this.createLayers;
    this.destroyLayers;
    this.hideLayers;
    this.showLayers;
    this.switchLayers;
    this.changeCoordsWithLayer;
    this.isCursorOnClipCoords;

    // Attributes
    this.clipCoords;
    this.clipImagesPath;
	this.curOverRect;
}

// Global instance for layers overlap
var g_layersOverlap = new layersOverlap;

// Added by Chen on 1/16/2007
// Defines hotspots for multiple clip areas

 if(b_version.search(/AppleWebKit/i)   !=   -1)
 {
layersOverlap.prototype.clipCoords = {
	/*** These coords are relative to central-box within whole canvas ***/
    CentralItems : 
    new Array('160,23,395,70',
              '160,70,395,117',
              '160,117,395,164',
              '160,164,395,211',
              '160,211,395,258',
              '160,258,395,303'),
    LeftIcons :
    new Array('122,113,142,134',
              '6,93,26,114',
              '10,178,30,199',
              '129,147,149,168',
              '99,102,119,123',
              '75,205,95,226'),
    RightPanel :
    new Array('410,23,535,303'),
    ScrollBar  :
    new Array('412,32,424,315'), // the bound is extended to 1px than native.
    WholePanel :
    new Array('0,0,548,319')
	/*** These coords are relative to left-box within whole canvas ***/
	//LeftBox :
	//new Array(),
	/*** These coords are relative to right-sidebar within whthin canvas ***/
	//RightSidebar :
	//new Array()
};
 }
 else
 {
	 layersOverlap.prototype.clipCoords = {
	/*** These coords are relative to central-box within whole canvas ***/
    CentralItems : 
    new Array('168,34,403,81',
              '168,81,403,128',
              '168,128,403,175',
              '168,175,403,222',
              '168,222,403,269',
              '168,269,403,314'),

    LeftIcons :
    new Array('130,124,150,145',
              '14,104,34,125',
              '18,189,38,210',
              '137,158,157,179',
              '107,113,127,134',
              '83,216,103,237'),
    RightPanel :
    new Array('418,25,543,314'),
    ScrollBar  :
    new Array('412,32,424,315'), // the bound is extended to 1px than native.
    WholePanel :
    new Array('0,0,548,319')

};
}

var centralItems = ['/images/2a_over.gif',
              '/images/2b_over.gif',
              '/images/2c_over.gif',
              '/images/2d_over.gif',
              '/images/2e_over.gif',
              '/images/2f_over.gif'];

var rightPanelItems = ['/images/3a_over.gif',
              '/images/3b_over.gif',
              '/images/3c_over.gif',
              '/images/3d_over.gif',
              '/images/3e_over.gif',
              '/images/3f_over.gif'];


layersOverlap.prototype.clipImagesPath = {
    CentralItems : centralItems,
    LeftIcons : new Array('/images/pin_over.png'),
    RightPanel : rightPanelItems
};

// Added by Chen on 1/16/2007
// Initializes clip areas for the whole image - 'schmapplets_all.gif'
layersOverlap.prototype.init = function (){
      connect(document.body, 'onmousemove', callSwitchLayers);
}
function callDestroyLayers(evt){
    var oCurShow = getElement('current-show');
    
    if (evt && oCurShow)
    {
        // Calculate offset distance of left/top of original image
        var oParent = oCurShow;
        var dx = 0;
        var dy = 0;
        while (oParent)
        {
            dx += oParent.offsetLeft;
            dy += oParent.offsetTop;
            
            oParent = oParent.offsetParent;
        }
		var st = document.body.scrollTop | document.documentElement.scrollTop;
		var sl = document.body.scrollLeft | document.documentElement.scrollLeft;
        var x = evt.mouse().client.x + sl - dx;
        var y = evt.mouse().client.y + st - dy;
        var arrCentralRects = g_layersOverlap.clipCoords.CentralItems;
        var arrRightRects = g_layersOverlap.clipCoords.RightPanel;
        var bDestroy = true;
        var rect1 = arrCentralRects[0].split(',');
        var rect2 = arrRightRects[0].split(',');
        var rect = new Array(rect1[0], rect1[1], rect2[2], rect2[3]);
        if (x >= parseInt(rect[0]) &&
            x <= parseInt(rect[2]) &&
            y >= parseInt(rect[1]) &&
            y <= parseInt(rect[3]))
        {
            logDebug('it\'s in the combining area of central panel and scroll-bar and right-panel!');
            bDestroy = false;
            //alert(x + ',' + y + '###' + rect);
        }
        
        if (bDestroy == false)
            return;
    }
    
    g_layersOverlap.destroyLayers();
	g_layersOverlap.curOverRect = '';
}

// Interface that the class defines three layers overlapping whole
// picture - shcmapplets_all.gif.
layersOverlap.prototype.layers = new function (){
    this.oIconLayer=null;
    this.oCentralItemLayer=null;
    this.oRightItemLayer=null;
    this.createLayer = function()
    {
        var oLayer = createDOM("div");
        //oLayer.style.id = "icon_layer";
        oLayer.style.position = "absolute";
        oLayer.style.display = "block";
        //oLayer.style.border = "1px solid #000"; // Enable the line for debug!
        oLayer.href = "javascript:void(0)";
        oLayer.style.background = "transparent";
        //if (BrowserDetect.browser == 'Windows')
        //    oLayer.style.cursor = "hand";
        //else
        //    oLayer.style.cursor = "-moz-grab";
        oLayer.style.zIndex = 999;
        appendChildNodes(document.body, oLayer);
        //connect(oLayer, "onmouseout", callDestroyLayers);
        return oLayer;
    }
    this.hideAllLayers = function()
    {
        if (this.oIconLayer != null)
            this.oIconLayer.style.display = 'none';
        if (this.oCentralItemLayer != null)
            this.oCentralItemLayer.style.display = 'none';
        if (this.oRightItemLayer != null)
            this.oRightItemLayer.style.display = 'none';
    }
    this.showAllLayers = function()
    {
        if (this.oIconLayer != null)
            this.oIconLayer.style.display = '';
        if (this.oCentralItemLayer != null)
            this.oCentralItemLayer.style.display = '';
        if (this.oRightItemLayer != null)
            this.oRightItemLayer.style.display = '';
    }
	this.isCreated = function()
	{
		return (this.oIconLayer && this.oCentralItemLayer && this.oRightItemLayer);
	}
    this.createAllLayers = function()
    {
        this.oIconLayer = this.createLayer();
        this.oCentralItemLayer = this.createLayer();
        this.oRightItemLayer = this.createLayer();
    }
    this.destroyAllLayers = function()
    {
        //alert("it's being destroyed!");
        if (this.oIconLayer != null)
        {
            removeElement(this.oIconLayer);
            this.oIconLayer = null;
        }
        if (this.oCentralItemLayer != null)
        {
            removeElement(this.oCentralItemLayer);
            this.oCentralItemLayer = null;
        }
        if (this.oRightItemLayer != null)
        {
            removeElement(this.oRightItemLayer);
            this.oRightItemLayer = null;
        }
    }
}

layersOverlap.prototype.createLayers = function(){
    //logDebug("It's creating transparent layers!");
    this.layers.createAllLayers();
}

// Added by Chen on 1/16/2007
// Destroy the transparent layer
layersOverlap.prototype.destroyLayers = function(){
    //logDebug("It's destroying transparent layers!");
    this.layers.destroyAllLayers();
}

layersOverlap.prototype.hideLayers = function(){
    this.layers.hideAllLayers();
}

layersOverlap.prototype.showLayers = function(){
    this.layers.showAllLayers();
}

layersOverlap.prototype.changeCoordsWithLayer = function (dx, dy, i){
    // If the transparent layer has already exist that should firstly destroy it.
    this.destroyLayers();

    // Create three overlapping layers
    this.createLayers();

   // this.hideLayers();

    // Now, we should safely get these created layers.
    var oIconLayer = this.layers.oIconLayer;
    var oCentralItemLayer = this.layers.oCentralItemLayer;
    var oRightItemLayer = this.layers.oRightItemLayer;

    // Change coordinates with each layer
    var arrItemCoords = this.clipCoords.CentralItems;
    var arrIconCoords = this.clipCoords.LeftIcons;

    var oImg1 = IMG({border:0, src: this.clipImagesPath.LeftIcons[0]});
    //alert(this.clipImagesPath.LeftIcons[0]);
    appendChildNodes(oIconLayer, oImg1);
    var rect1 = arrIconCoords[i].split(',');
    oIconLayer.style.left = dx + parseInt(rect1[0]) + 'px';
    oIconLayer.style.top = dy + parseInt(rect1[1]) + 'px';
    addElementClass(oIconLayer, 'pin-over');
    // Extends the bounds for preventing mouse over the area again,
    // this sutuation only is happended on mouse out the layer.
    oIconLayer.style.width = oImg1.offsetWidth + 'px';
    oIconLayer.style.height = oImg1.offsetHeight + 'px';
	if(IEquirks) {
 		oImg1.style.display = 'none';
	}

    var rect2 = arrItemCoords[i].split(',');
    var oImg2 = IMG({border:0, src:this.clipImagesPath.CentralItems[i], 
				height: rect2[3] - rect2[1], width: rect2[2] - rect2[0]});
    appendChildNodes(oCentralItemLayer, oImg2);
    //alert(dx + parseInt(rect2[0]));
    if(isSafari) {
       dx +=8;
       dy += 11;
    }
    oCentralItemLayer.style.left = dx + parseInt(rect2[0])  + 'px';
    oCentralItemLayer.style.top = dy + parseInt(rect2[1]) +'px';
    // Extends the bounds for preventing mouse over the area again,
    // this sutuation only is happended on mouse out the layer.
    //oCentralItemLayer.style.width = oImg2.offsetWidth + 'px';
    oCentralItemLayer.style.width = rect2[2] - rect2[0] + 'px';
    oCentralItemLayer.style.height = oImg2.offsetHeight  + 'px';

    var rect3 = this.clipCoords.RightPanel[0].split(',');
    var oImg3 = IMG({border:0, src:this.clipImagesPath.RightPanel[i], 
                    height: rect3[3] - rect3[1], width: rect3[2] - rect3[0]});
    appendChildNodes(oRightItemLayer, oImg3);
    oRightItemLayer.style.left = dx + parseInt(rect3[0]) + 'px';
    oRightItemLayer.style.top = dy + parseInt(rect3[1]) + 'px';
    // Extends the bounds for preventing mouse over the area again,
    // this sutuation only is happended on mouse out the layer.
    oRightItemLayer.style.width = oImg3.offsetWidth + 'px';
    oRightItemLayer.style.height = oImg3.offsetHeight + 'px';
}

function callSwitchLayers(evt){
    if (!evt) return;

	// Calculate offset distance of left/top of original image
	var oParent = getElement('current-show');
	var dx = 0;
	var dy = 0;
	while (oParent)
	{
		dx += oParent.offsetLeft;
		dy += oParent.offsetTop;
		
		oParent = oParent.offsetParent;
	}
	var x = evt.mouse().client.x - dx;
	var y = evt.mouse().client.y - dy;
	var st = document.body.scrollTop | document.documentElement.scrollTop;
	var sl = document.body.scrollLeft | document.documentElement.scrollLeft;
	var x = evt.mouse().client.x + sl - dx;
	var y = evt.mouse().client.y + st - dy;

	var rect;
    var arrIconRects = g_layersOverlap.clipCoords.LeftIcons;
    for (var i = 0; i < arrIconRects.length; ++i)
    {
        rect = arrIconRects[i].split(',');
        if (x >= parseInt(rect[0]) &&
            x <= parseInt(rect[2]) &&
            y >= parseInt(rect[1]) &&
            y <= parseInt(rect[3]))
        {
			g_layersOverlap.switchLayers(rect.toString());
			g_layersOverlap.curOverRect = rect.toString();
			return;
        }
    }

    var arrCentralRects = g_layersOverlap.clipCoords.CentralItems;
    for (i = 0; i < arrCentralRects.length; ++i)
    {
        rect = arrCentralRects[i].split(',');
        if (x >= parseInt(rect[0]) &&
            x <= parseInt(rect[2]) &&
            y >= parseInt(rect[1]) &&
            y <= parseInt(rect[3]))
        {
			//alert('it\'s on Central item!');
			g_layersOverlap.switchLayers(rect.toString());
			g_layersOverlap.curOverRect = rect.toString();
			return;
        }
    }

	callDestroyLayers(evt);
}

// Added by Chen on 1/16/2007
// Dynamically switch transparent layers overlapping with 'schmapplets_all.gif'
layersOverlap.prototype.switchLayers = function(sCoords){
    logDebug("Creating transparent layer for overlapping 'schmapplets_all.gif'");
    var oCurShow = getElement('current-show');
    //alert(oCurShow.style.display);
    if (!oCurShow || g_showingFloatbox)
    {
        return;
    }

	if (this.curOverRect == sCoords)
		return;

    // Calculate offset distance of left/top of original image
    var oParent = oCurShow;
    var dx = 0;
    var dy = 0;
    while (oParent) {
        dx += oParent.offsetLeft;
        dy += oParent.offsetTop;
        oParent = oParent.offsetParent;
    }
    // Add images into these layers and locate them. 
    var arrItemCoords = this.clipCoords.CentralItems;
    var arrIconCoords = this.clipCoords.LeftIcons;
    var bFound = false;
    for (var i = 0; i < arrItemCoords.length; ++i)
    {
        if (sCoords == arrItemCoords[i])
        {
            this.changeCoordsWithLayer(dx, dy, i);

            bFound = true;
            //alert(dx + parseInt(rect3[0]));
            break;
        }
    }
    if (bFound == false)
    {
        for (i = 0; i < arrIconCoords.length; ++i)
        {
            if (sCoords == arrIconCoords[i])
            {
                this.changeCoordsWithLayer(dx, dy, i);

                bFound = true;
                //alert(oCentralItemLayer.style.left);
                break;
            }
        }
    }

    
//    appendChildNodes(document.body, 
//      IMG({src: sImagePath, border: 0,
//             usemap: '#central-map'})

    // Finally, we put the layer into this document
    //appendChildNodes(document.body, oLayer);
}

////////////////////////////////////////////////////////////////////////////////

function buildShowWindow() {
  logDebug("building Show window");
  appendChildNodes('float-body',
    DIV({id: 'show'},
      DIV({id: 'current-show'},
        IMG({src: '/images/wholephoto.gif', 'onload': 'g_layersOverlap.init()'})),
      DIV({id:'map-area'})
    ));

    //g_layersOverlap.init(); // Fired by Chen on 1/17/2007
}

function buildFloatBoxShadows() {
  logDebug("build shandows for float box");
  appendChildNodes('float-box',
    DIV({'class': 'top-shadow'},
      DIV({'class': 'top-left'}),
      DIV({'class': 'top-center'}),
      DIV({'class': 'top-right'})),
    DIV({'id': 'left-shadow'}),
    DIV({'id': 'right-shadow'}),
    DIV({'class': 'bottom-shadow'},
      DIV({'class': 'bottom-left'}),
      DIV({'class': 'bottom-center'}),
      DIV({'class': 'bottom-right'})),
    DIV({'id': 'float-body'})
    );
}

function buildDownloadBox() {
     if(langid ==='es' || langid === "fr" || langid === "it"){
	         var guideOrder =  H1({id: 'guide-info'}, 
	            SPAN({id:'which'},homepage.guide_info),  
	            SPAN({id: 'guide-label'}, homepage.Guide),	
				SPAN({id: 'curcity'}, ""),
	            SPAN({id: "mbSize"}, ""));
          } else {
	             var guideOrder =  H1({id: 'guide-info'}, 
	            SPAN({id:'which'},homepage.guide_info),  
	            SPAN({id: 'curcity'}, ""),
	            SPAN({id: 'guide-label'}, homepage.Guide),
	            SPAN({id: "mbSize"}, ""));	  
		  
	}

  logDebug("building download box");
  appendChildNodes('float-body',
    DIV({id: 'schmap2'},
      DIV({id: 'close-box'},
        IMG({id: 'close-btn', src: '/images/close.gif'})),
      DIV({id: 's2-content'},
        DIV({id: 's2-desc'},
          H1({id: 's2-title'},
            homepage.PopWindowTitle),
          DIV({'id': 's2-declare'}, homepage.s2_declare),
          DIV({id: 'requires'},
            DIV({id: 'sys-req'}, 
              H1(null, homepage.SystemRequire),
              LI({'class': 'req-item'}, 
                homepage.req_item[0]),
              LI({'class': 'req-item'}, 
                homepage.req_item[1]),
              LI({'class': 'req-item'}, 
                homepage.req_item[2]),
              LI({'class': 'req-item'}, 
                homepage.req_item[3])),
            IMG({id: 's2-logo',
                 src: '/images/'+langid+'/publish/angle.gif'})
          )),
        DIV({id: 'download'},
          DIV({id: 'choose'},
            DIV({id: 'runs'},
              H1({'class': 'item-title'}, 
                homepage.runs),
              DIV({id: 'os-list'}, 
                INPUT({type: 'radio', 
                       'class': 'os',
                       value: 'Windows',
                       id:'win',
                       name: 'os',
                       checked: 'true'}),
                SPAN(null, homepage.winOS)),
              DIV(null,
                INPUT({type: 'radio',
                       'class': 'os',
                       value: 'Mac',
                       id:'mac',
                       name: 'os'}),
                SPAN(null, homepage.macOs))),
            DIV({id: 'locations'},
              H1({'class': 'item-title'},
                  homepage.itemTitle),
              SELECT({id: 'picker-country'}),
              SELECT({id: 'picker-city'}))),
          guideOrder,
          DIV({'id': 'download-btn','style':'cursor:pointer;'},
               IMG({src: '/images/'+langid+'/publish/download.gif'})))
      ))
  )
}

function buildBottomBox() {

  logDebug("building bottom box");
  appendChildNodes('canvas',
    DIV({id: 'bottom-box'},
	        DIV({'class':'quotes'},
		    IMG({src: '/images/' +langid + '/publish/quotes.gif', 'height': '64', 'width': '729'})),
            A({'href':'/','class':'thisLink'}, footerObj.home),
	        SPAN({},' | '),
            A({'href':'/about','class':'thisLink'}, footerObj.about),
	        SPAN({},' | '),
            A({'href': '/inthenews','class':'thisLink'}, footerObj.nr),
	        SPAN({},' | '),
            A({'href': '/privacy','class':'thisLink'}, footerObj.privacy),
	        SPAN({},' | '),
            A({'href': '/termsofuse','class':'thisLink'}, footerObj.terms),
	        SPAN({},' | '),
            A({'href': '/contact','class':'thisLink'}, footerObj.contact)
        ));
  var lastSpan = SPAN({});
  lastSpan.innerHTML = footerObj.copyright;
  $('bottom-box').appendChild(lastSpan);
}
function seemore(){
	document.getElementById('mutilanguemenu').innerHTML =langGroup[secondbar][0];
	}
function langsbarback(event){
	if(event.layerY){
	   var x = event.layerX;
	   var y = event.layerY;
	}else {
	var x =  event.offsetX;
	var y = event.offsetY;
	} 
	if(y > 20 || x <0 || x > 250){
	document.getElementById('mutilanguemenu').innerHTML =langGroup[fistbar][0]+ langGroup['more'];
	document.getElementById(lang).style.color = "white";
	}
}
function buildLayout() {
    if(BrowserDetect.OS == 'Mac') {
        addElementClass( document.body, 'mac');  
   }
  logDebug("building Layout");
  appendChildNodes(document.body,
    DIV({id: 'main', 'class': 'mutiLang'+langid},
    DIV({id: 'canvas'},
      DIV({id: 'left-box', 'class': 'round'}),
      DIV({id: 'central'},IMG({id:'topImg','src':'/images/topImg.gif'})),
      DIV({id: 'float-box'}),
      DIV({id: 'right-sidebar'}))));
  $('central').innerHTML = '<div class="header" style="background-image:url(/images/'+langid+'/header.gif);"><div class="logo"><a href="/">\
  <img border="0" src="/images/new_homepage/emptylogo.gif"></a></div>\
  <object id="header" style="float:right;" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" \
  codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0"\
  width="490" height="112"><param name="movie" value="/flash/header.swf?id=publish&lang='+ langid + '"> \
  <param name="quality" value="high">	<param name="wmode" value="transparent">\
  <embed name="header" src="/flash/header.swf?id=publish&lang='+ langid + '" quality="high" wmode="transparent" \
  pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" \
  width="490" height="112"></embed></object> \
  <div id="mutilanguemenu" onmouseout="langsbarback(event);" >\
</div></div>';
    $('mutilanguemenu').innerHTML = langGroup[fistbar][0]+ langGroup['more'];

	if(lang){
	document.getElementById(lang).style.color = "white";
	}else {
	document.getElementById('lang_en').style.color = "white";
	}
}

function setLanguage(e){
	var id = e.id.replace('lang_', '');
	if(id === "tw") id = "zh-tw";
	setCookie('language', id, 36500);
	 window.location.reload();
}

function getIntValue(obj, attr) {
  return parseInt(getStyle(obj, attr));
}

function getHandler(fid) {
  var measures = floatboxZoomMeasures;
  if(fid == 1) {
    // the scale percentage is 1 / the percentage to scale 
    // the float box to
    measures.boxShortenTo = 1 / 
      measures.boxExpandTo;
    measures.bodyShortenTo = 1 / 
      measures.bodyExpandTo;
    measures.leftShortenTo = 1 / 
      measures.leftExpandTo;
    measures.rightShortenTo = 1 / 
      measures.rightExpandTo;
    return function() {
      Scale('float-box', 
        measures.boxShortenTo * 100, 
        {duration: 1.0, 
         scaleContent: false, 
         scaleX: false, 
         queue: 'parallel',
         afterFinish: function() {
           logDebug("update show");
           appear('show', 
             {from: 0,
              to: 1.0});
           floatBoxExpanded = false;
           g_showingFloatbox = false;
      }});
      Scale('float-body', 
        measures.bodyShortenTo * 100, 
        {duration: 1.0, 
         scaleContent: false, 
         scaleX: false, 
         queue: 'parallel'});
      Scale('left-shadow', 
        measures.leftShortenTo * 100, 
        {duration: 1.0, 
         scaleContent: false, 
         scaleX: false, 
         queue: 'parallel'});
      Scale('right-shadow', 
        measures.rightShortenTo * 100, 
        {duration: 1.0, 
         scaleContent: false, 
         scaleX: false, 
         queue: 'parallel'});
    }
  }
  else if(fid == 2) {
    var floatBoxTop = parseInt($('central').clientHeight) - 
              getIntValue('float-box', 'top');
    measures.boxExpandTo = (
        floatBoxTop + 18 + 2) / getIntValue('float-box', 'height');
    measures.bodyExpandTo = (
        floatBoxTop + 2 - 1)/ getIntValue('float-body', 'height');
    if(!IEquirks) {
    measures.leftExpandTo = (
        floatBoxTop - 17)/ getIntValue('left-shadow', 'height');
    measures.rightExpandTo = (
        floatBoxTop - 17)/ getIntValue('right-shadow', 'height');
    } else {
    measures.leftExpandTo = (
        floatBoxTop - 18)/ getIntValue('left-shadow', 'height');
    measures.rightExpandTo = (
        floatBoxTop - 18)/ getIntValue('right-shadow', 'height');
    }

    return function() {
      Scale('float-box', 
        measures.boxExpandTo * 100,
        {duration: 1.0, 
         scaleContent: false, 
         scaleX: false, 
         queue: 'parallel',
         afterFinish: function() {
           logDebug("update schmap2");
           appear('schmap2', 
             {from: 0,
              to: 1.0});
           floatBoxExpanded = true;
      }});
      Scale('float-body',
        measures.bodyExpandTo * 100,
        {duration: 1.0, 
         scaleContent: false, 
         scaleX: false, 
         queue: 'parallel'}
      );
      Scale('left-shadow',
        measures.leftExpandTo * 100,
        {duration: 1.0, 
         scaleContent: false, 
         scaleX: false, 
         queue: 'parallel'}
      );
      Scale('right-shadow',
        measures.rightExpandTo * 100,
        {duration: 1.0, 
         scaleContent: false, 
         scaleX: false, 
         queue: 'parallel',
         afterFinish: function() {
         }}
      );
    }
    //selector.rebind('picker-country', 'picker-city');
      //selector.syncSelects();
  }
}

var expandFloatbox = err_logging(function () {
  logDebug("expanding");
  fade('show', {duration: 1.0,
                from: 1.0, to: 0,
                afterFinish: getHandler(2)});
    }
  )

var g_showingFloatbox = false;
function get2BtnClick() {
  g_showingFloatbox = true;
  if(first_time) {
    callDestroyLayers();
    expandFloatbox();
    first_time = 0;
    first_close = 1;
  }
}

function closeBtnClick() {
  if(floatBoxExpanded) {
    if(first_close) {
      first_time = 1;
      fade('schmap2', {duration: 1.0,
                       from: 1.0, to: 0,
                       afterFinish: getHandler(1)});
      first_close = 0;
    }
  }
}

var g_lastOverlappedItem = null;
function leftItemsMover(evt) {
  // Restoring the last source node's state
  if (g_lastOverlappedItem != null)
      setStyle(g_lastOverlappedItem, {'background-color': 'transparent'});
  setStyle(this, {'background-color': '#f6f6ea'});

  var index = parseInt(this.id.charAt(this.id.length-1));
  var item = showcases[index];
  var oCentralPanel = getElement('current-show');
  try {
    replaceChildNodes(oCentralPanel, 
	                  IMG({src: item.sPathOfCentralMap}));
  } catch (e){
      // alert(e);
  }
}


function leftItemsMout(evt) {
  // Remember the source node at last time
  if (g_lastOverlappedItem != this){
    g_lastOverlappedItem = this;
  }

  // For preventing flashing(IE)
  var target = evt.relatedTarget();
  oParent = target;
  while (oParent)
  {
      if (oParent.id != undefined &&
          oParent.id.match(/showcase_\d{1}/g))
      {
        return;
      }

      oParent = oParent.parentNode;
  }

  // Restoring the last source node's state
  if (g_lastOverlappedItem != null)
      setStyle(g_lastOverlappedItem, {'background-color': 'transparent'});

  // Restore to native map
  var oCentralPanel = getElement('current-show');
  replaceChildNodes(oCentralPanel, 
					IMG({src: '/images/wholephoto.gif'}));
}

function onRightSidebarClick(evt)
{
	var oRow = this;
	var index = parseInt(oRow.id.charAt(oRow.id.length-1));
	var item = showcases[index];
	window.location.href = item.href;
}



function eventsInit() {
  logDebug("events register and initialize");
  connect('get2-btn', 'onmouseup', get2BtnClick);
  connect('close-btn', 'onclick', closeBtnClick);
  var systems = getElementsByTagAndClassName(null, 'os');

  leftRows = $('usage').childNodes;
  for(var i = 0; i < leftRows.length; i ++) {
    var row = leftRows[i];
    connect(row, 'onmouseover', leftItemsMover);
    connect(row, 'onmouseout', leftItemsMout);
  }
  
  rightRows = $('showcase').childNodes;
  for(var i = 0; i < rightRows.length; i ++) {
    var row = rightRows[i];
    connect(row, 'onmouseover', leftItemsMover);
    connect(row, 'onmouseout', leftItemsMout);
	connect(row, 'onclick', onRightSidebarClick);
  }
}


function guideInit() {
  // the location detection to download the guide
  selector = new GuideSelector('picker-country','picker-city');
    if(BrowserDetect.OS == 'Mac') {
        document.getElementById('mac').checked = true ;
		document.getElementById('win').checked = false ;
       changeMac();
    } else if(BrowserDetect.OS == 'Windows'){
		document.getElementById('win').checked = true ;
		document.getElementById('mac').checked = false ;
       changeWin();
    }
   connect('download-btn', 'onclick', getGuide);
  connect('mac','onclick',changeMac);
  connect('win','onclick',changeWin);
}
function GuideSelector(country_sel, city_sel) {
    this.country_select = $(country_sel);
    this.city_select = $(city_sel);
    this.preselect_by_name = null;
    this.preselect = 2001;
    this.by_id = {};
    this.by_country = {};
	for(var i = 0; i < winData.length; i++){
	    var countryName = winData[i][0];
		this.country_select.options[i] =
            new Option(countryName, countryName);
	}
	connect(this.country_select, 'onchange', this, 'syncSelects');
    connect(this.city_select, 'onchange', onChangeCityName);
	this.country_select.selectedIndex = defualtIndex;

	this.syncSelects();
}


GuideSelector.prototype.syncSelects = function() {	
    var index = this.country_select.selectedIndex;    
    var country = this.country_select.options[index].value;
	this.countryname=country;
    var selected = null;
    var lowest_id = 99999;
    var lowest_index = 0;
    this.city_select.options.length = 0;
	var cityList = winData[index][2];
	var macList = macData[index][2];
    for(var c = 0; c < cityList.length; c++) {
        var guide = cityList[c];
		var macguide = macList[c];
        var option = new Option(guide[0], guide[1]);
		option.sizemb = guide[2];
		option.macsizemb = macguide[2];
		option.downlink = macguide[1];
        this.city_select.options[this.city_select.options.length] = option;
  
    }
	this.city_select.selectedIndex = winData[index][1];
    callLater(0.2, onChangeCityName);
	
}
function actionsOnFootLinks() {
    var link = "";
    var winname = "";
    var footerpopup = function() {
        if(this.id == 'faq') {
            link = '/howto';
            winname = 'faq';
        }
        else if(this.id == 'feedback') {
            link = '/feedback.shtml';
            winname = 'feedback';
        }
        else if(this.id == 'privacy') {
            link = '/privacy.shtml';
            winname = 'privacy';
        }
        else if(this.id == 'termsofuse') {
            link = '/termsofuse.shtml';
            winname = 'termsofuse';
        }

        window.open(link, winname,
                               'menubar=no,location=no,resizable=no,' +
                               'scrollbars=yes,status=no,width=675,height=680,' +
                               'dependent=yes');
    }
    connect('faq', 'onclick', footerpopup);
    connect('feedback', 'onclick', footerpopup);
    connect('privacy', 'onclick', footerpopup);
    connect('termsofuse', 'onclick', footerpopup);
}

var preloaders = [];

function preLoadImages() {
    var preloader = function (img) {
        var src = img;
        if(img.sPathOfCentralMap) {
            src = img.sPathOfCentralMap;
        }
        logDebug("cached image path:" + src);
        var pic = IMG({'src': src, 'class': 'preloader'});
        appendChildNodes(document.body, pic);
    }
    map(preloader, centralItems);
    map(preloader, rightPanelItems);
    map(preloader, showcases);
}

function initial() {
  eventsInit();
  guideInit();
  //actionsOnFootLinks();
}

function setUp() {
	  // if(!(document.domain=='www.schmap.com')&!(document.domain=='dev.schmap.com'))// check domain 
  // {
	  // document.body.innerHTML="";
	 // return;
	  // }
  logDebug("setup page");
  buildLayout();
  buildLeftBox();
  buildCentralBox();
  buildRightBox();
  buildFloatBoxShadows();
  buildShowWindow();
  buildDownloadBox();
  buildBottomBox();
  initial();
  fixPNG();
  logDebug("clientHeight:" + $('central').clientHeight);
  if(IEquirks) {
    roundBox();
  }
  preLoadImages();
}

function fixPNG() {
  if(IEquirks) {
    var divs = getElementsByTagAndClassName('DIV', 'pngfix');
    for(var i = 0; i < divs.length; i ++) {
      var idiv = divs[i];
      if(idiv.id == 'download-btn') {
        continue;
      }
      var img = idiv.firstChild;
        setElementDimensions(idiv, 
          {h: img.height, w: img.width});
        setStyle(idiv, {'filter': 
            "progid:DXImageTransform." + 
            "Microsoft.AlphaImageLoader(src='" + img.src +
            "',sizingMethod='image')"});
        idiv.innerHTML = "";
    }
  }
}

function getGuide() {
    window.location.href =  "http://www.schmap.com/" + downhref;
}

function onChangeCityName() {	
    var oCityName = document.getElementById("curcity");
    oCityName.innerHTML = selector.city_select.options[selector.city_select.selectedIndex].text;
    if(document.getElementById('mac').checked == true) {
            changeMac();
        } else if(document.getElementById('win').checked == true) {
            changeWin();
        }
}

function changeMac() {
     if(document.getElementById('mac').checked == true) {
         document.getElementById('win').checked = false ;
       $('which').innerHTML = homepage.whichMac ;
       if(typeof(selector.city_select.selectedIndex) == 'undefined'){
          var  sizemb = '3';
      } else {
        var sizemb = selector.city_select.options[selector.city_select.selectedIndex].macsizemb;
       }

       urlRegular = selector.city_select.options[selector.city_select.selectedIndex].downlink;
       downhref = urlRegular;
      $('mbSize').innerHTML = '  ('+ sizemb+ 'MB)' ;
     }
    }

function changeWin() {
   if(document.getElementById('win').checked == true) {
       document.getElementById('mac').checked = false ;
       $('which').innerHTML = homepage.guide_info ;
       if(typeof(selector.city_select.selectedIndex) == 'undefined'){
           var  sizemb = '3';
      } else {
        var sizemb = selector.city_select.options[selector.city_select.selectedIndex].sizemb;
       }
       $('mbSize').innerHTML = '&nbsp;('+sizemb+'MB)' ;
       urlRegular = selector.city_select.options[selector.city_select.selectedIndex].value + '/schmap_setup.exe';
       downhref = urlRegular;
    }
}
addLoadEvent(setUp);