var passCode='';
var schmapphone = {};
var tabBuild = {};
var schmap = {};
var tabs = ['basic', 'advanced', 'usage'];
schmap.maptypes = {'m': 'map', 's': 'satellite'}
schmap.codeFormat = 1;
var newhost = document.location.host.replace('.com', '.me');
schmap.badge = true;
schmap.badgeMapHeight = 104;
var badgeWidth = 112;
var badgeHeight = 132;
function createIconsPopup() {
    var popupWidth=261;
    var cellWidth=29;
    var numPerRow=popupWidth/cellWidth;
    var numOfIcons = icondata.length;
    var numOfRows = Math.floor(numOfIcons / numPerRow);
    if ((numOfIcons % numPerRow) != 0) {
        numOfRows += 1;
    }
    var cellHeight = 34;
    var popupHeight = cellHeight * numOfRows;
    
    // Loop over rows and columns to create the icons
    var numCreated = 0;
    for (var row=0; row < numOfRows && numCreated < numOfIcons; row++) {
        for (var col=0; col < numPerRow && numCreated < numOfIcons; col++) {
            var iconName = icondata[numCreated].bigiconpath;
            var iconPath = '/images/mapicons/' + iconName;
            var iconWidth = icondata[numCreated].bigiconwidth;
            var iconHeight = icondata[numCreated].bigiconheight;
            var imgId = icondata[numCreated].iconcode;
            var pngImage = PNG({id: imgId, src: iconPath, width: iconWidth, height: iconHeight});
            setStyle(pngImage, {'margin-left':'4px'});
            setStyle(pngImage, {'margin-top':'4px'});
            connect(pngImage,'onclick',handleIconSelection);
            appendChildNodes('IconsPopupDiv', pngImage);
            numCreated++;
        }
    }

}

function setSelectedIconIndex (iconCode) {

    var numOfIcons = icondata.length;
    var found = false;
    for (var i=0; i < numOfIcons && !found; i++) {
        if (icondata[i].iconcode == iconCode) {
            found = true;
            selectedIconIdx = i;
        }
    }
}

function selectIcon (iconCode, createMap,point,basePath) {
    var numOfIcons = icondata.length;
    var found = false;
	var iconFolder = basePath || '/images/mapicons/';
    for (var i=0; i < numOfIcons && !found; i++) {
        if (icondata[i].iconcode == iconCode) {
            found = true;
            selectedIconIdx = i;
            var idata = icondata[i];
            var src = iconFolder + idata.bigiconpath;
            var realIESrc = src;
            if(isIE6) {
                src = '/images/spacer.png';
            }
            var img = $('selected-icon');
	    if(!img) return false;
		img.src = '/images/spacer.png';
		callLater(0.05,function(){img.src = src;});
            if (isIE6) {
                var width = icondata[i].bigiconwidth;
                var height = icondata[i].bigiconheight;
                setElementDimensions(img, {h: height, w: width});
                var filter = new StringBuffer();
                filter.append("progid:DXImageTransform.Microsoft.").append("AlphaImageLoader(src='").append(realIESrc).append("',sizingMethod='scale')");
                img.style.filter = filter.toString();
            }
            
            if (createMap) {try{
                callLater(0.6, function(){
	                                      window.frames['placeposition'].locallocate.setup(schmapmeText.addrNotFound, 
	                                                                                       point, 
	                                                                                       true,
	                                                                                       realIESrc, 
	                                                                                       idata,
																						   schmapme.zoom,
																						   schmap.maptypes[schmapme.maptype]);
	                                  });
									  }catch(e){alert(e);}logDebug('ccc');
                if (idata.bigiconwidth < 33) {
                    $('selected-icon').style.left = (219 + 22 - idata.bigiconwidth) + 'px';
                   $('selected-icon').style.top  = (33 - idata.bigiconheight) + 'px';
                }
                else {
                    $('selected-icon').style.left = (222 + 22 - idata.bigiconwidth) + 'px';
                    $('selected-icon').style.top  = (36 - idata.bigiconheight) + 'px';    
                }
            } 
            else {
                updateVisibleIcon (realIESrc, idata);
            }
        }
    }
	 writeCode();
	 if(!createMap)	 selectIconcallback();
}

function selectIconcallback (){

}

function updateVisibleIcon (src, icondata) {
    if (icondata.bigiconwidth < 33) {
        $('selected-icon').style.left = (219 + 22 - icondata.bigiconwidth) + 'px';
        $('selected-icon').style.top  = (33 - icondata.bigiconheight) + 'px';
    }
    else {
        $('selected-icon').style.left = (222 + 22 - icondata.bigiconwidth) + 'px';
        $('selected-icon').style.top  = (36 - icondata.bigiconheight) + 'px';    
    }

    window.frames['placeposition'].locallocate.changeIcon 
                (src, icondata.bigiconwidth, icondata.bigiconheight, icondata.bigiconanchorx, icondata.bigiconanchory);            

}

function handleIconSelection(event) {
    var iconCode = event.src().id;
    selectIcon (iconCode);
}
function gotoschmapme(){
   window.open('http://' +newhost+'/' + userUrl  + "/", 'schmap', 'width=751,height=464,toolbar=no,menubar=no,location=0,resize=no');
}
function changeLinkTitle(){
      $('badgeTitle').innerHTML = this.value; 
	  $('badgelink').innerHTML = this.value; 
code_text_title = this.value;	  
	writeCode();
 }
function switchBadge(){
  if(this.id == 'badge'){
	schmap.badge = true;
	showElement('badgeblok');  
	showElement('customizelink');
	hideElement($('badgelink').parentNode);
	$('badgeTextLabel').innerHTML = badge_text;
	showElement('mapicon');
  }else {
	schmap.badge = false;
	hideElement('badgeblok');  
	showElement($('badgelink').parentNode);
	hideElement('customizelink');
	hideElement('mapicon');
	$('badgeTextLabel').innerHTML = link_text;
	}
	writeCode();
}

function buildBadgeMap() {

    if(  $('badgeTitle').clientHeight>= 18) {
        var gap = 3;
    } 
    else {
        var gap = 0;
    }
	logDebug('buildBadge',  $('badgeTitle').clientHeight, gap);
    schmap.badgeMapHeight  = 104 -$('badgeTitle').clientHeight + 18 +  gap;
    
    var lat = schmapme['lat'];
    var long = schmapme['long'];
    var latlng = window.frames['placeposition'].locallocate.getPoint();
    if (latlng != null) {
        lat = latlng.lat();
        long = latlng.lng();
    }
 
    var mapsrc = 'http://maps.google.com/staticmap?center=' 
                 + lat +','+  long + '&zoom='+schmapme.zoom+'&size=104x' + schmap.badgeMapHeight 
				 + '&maptype=' + schmap.maptypes[schmapme.maptype] +'&key='
                 + google_api_key; 
                 
    if(schmap.badgeMapHeight <= 0) {
        mapsrc = "/images/spacer.png";
    } 
    $('imgBadge').src =mapsrc;
 
    var idata = icondata[selectedIconIdx];
    var iconWidth = idata.bigiconwidth;
    var iconHeight = idata.bigiconheight;
    var anchorx = idata.bigiconanchorx;
    var anchory = idata.bigiconanchory;
    var mapHeight = badgeHeight - 4 - 24;  // 4=top border width, 24=bottom border width
    var leftOffset = Math.round(((badgeWidth / 2)) - ((anchorx / 100) * iconWidth));
    var topOffset = 24 +  Math.round((mapHeight / 2) + ((anchory / 100) * iconHeight));
    if(!isIE6) {
        topOffset -= 3;
    }
    else {
        topOffset += 3;
    }

    var mapicon =  PNG_html({src: '/images/mapicons/' + idata.bigiconpath, width: iconWidth, height: iconHeight});
    $('mapicon').innerHTML = mapicon;
    $('mapicon').style.top = '-' + topOffset + 'px';
    $('mapicon').style.left = leftOffset + 'px';

}

function changeCodeFormat() {
    schmap.codeFormat = this.value;
	writeCode();
}

function buildusage() {

    var iconCode = 'G000';
    if (schmapme['iconcode'] != null) {
        iconCode = schmapme['iconcode'];
    }
    selectIcon (icondata[selectedIconIdx].iconcode);
	$('badgeTitle').innerHTML = code_text_title;
        buildBadgeMap();
         if(tabBuild[tabs[2]]) return;
        $('badge').checked =true;
	$('badgeText').value = code_text_title;
	$('badgelink').innerHTML = code_text_title;
	connect('badge','onclick', switchBadge);
	connect('textLink', 'onclick', switchBadge);
	connect('badgeText', 'onkeyup', changeLinkTitle);
	connect('badgeText', 'onchange', changeLinkTitle);
        connect('emailSig', 'onclick', clickselect);
	connect('code', 'onclick', clickselect);
	//connect('customizelink', 'onclick', openBadgeCustWindow);
	connect('badgeblok', 'onclick', gotoschmapme);
	connect('badgelink', 'onclick', gotoschmapme);
	connect('codeformat', 'onchange', changeCodeFormat);
	$('codeformat').selectedIndex = 0;
	 writeCode();
	 $('emailSig').value =   newhost + '/' + userUrl + "\n" + promcode;
	
        tabBuild[tabs[2]] = true;
} 

function writeCode(){
    url = userUrl;
     buildBadgeMap();
	var text = $('badgeText').value
	var textscript = text.match(/^.*[\u4e00-\u9fa5]+.*$/g);
	if(textscript == null){
	textscript = 'western';
	var fontfamiliy = 'serif';
	}else {
	textscript = 'hanzi';
	var fontfamiliy = 'sung';
	}
	var alink2 = 'href="'+ "'http://" + newhost +"/" + url + '" target="_blank"';
	if(schmap.codeFormat == 1){
		    var pngprefix = ".png?";
		    var pngpostfix = "";
		    var alink= 'href="#schmapme"  onclick="window.open'
	                       + "( 'http://" + newhost +"/" + url 
	                      + "\/', 'schmap', 'width=751, height=464, toolbar=no, menubar=no, location=0, resize=no');";
			var scriptlink = '<script src="http://www.schmap.me/s/mobile.sjs?m='
                    		 + text + '&u=' + url +'"></script>';
			  
			}else{ 
				var pngprefix = "&";
				var pngpostfix = ".png";
				var alink = 'href="'+ "http://" + newhost +"/" + url + '" target="_blank"';  
				var scriptlink = '';
			}
        if(schmap.badge){
	   var codetocopy = '<a ' + alink
                      + '"><img border="0" src="http://' + newhost +'/' 
                      + url + '/badge'+pngprefix+'color=white&background-color='
                      + 'Olive'+'&width='
                      +  '120' + '&height=' + '140'  
                      + '&border-color=Olive'
                      + '&map-border-color=Olive' 
                      + '&icon=' +  icondata[selectedIconIdx].iconcode.toLowerCase()
                      + '&maptype='+ schmap.maptypes[schmapme.maptype]  
                      + '&zoom=' + schmapme.zoom
                      + '&font-script=' + textscript
                      //+ '&font-family=sans2'
                      + '&font-size=9'
                      + '&font-style=u' 
                      + '&padding=2'
                      +'&border-width=1&map-border-width=1&padding-bottom=24&text=' 
                      + text + '&text-decoration=underline'+ pngpostfix
                      +'"  /></a>' + scriptlink;  
  
	}else {
        var codetocopy =  '<a ' + alink
        + '">' + text + '</a>'  + scriptlink
	}
    $('code').value = codetocopy;
 
}

function openBadgeCustWindow() {
    var iconCode = icondata[selectedIconIdx].iconcode;
    var zoom = 15;
    var mapType = 'roadmap';
    var lat = schmapme['lat'];
    var long = schmapme['long'];
    var latlng = window.frames['placeposition'].locallocate.getPoint();
    if (latlng != null) {
        lat = latlng.lat();
        long = latlng.lng();
    }
    var url = 'http://' + document.location.host  + '/present/index_badge.html?url=' + userUrl + '&lat=' + lat + '&long=' + long + '&icon=' + iconCode + '&zoom=' + zoom + '&maptype=' + mapType;
    window.open(url, 'badge_popup', 'width=810, height=780, toolbar=no, menubar=no, location=0,scrollbars=yes');
}
function PNG(attrs) {
    var src = attrs.src;
    if(isIE6)
        attrs.src = '/images/spacer.png';
    img = MochiKit.DOM.IMG(attrs);
    var filter = new StringBuffer();
    if(isIE6) {
        setElementDimensions(img, {h: attrs.height, w: attrs.width});
        filter.append("progid:DXImageTransform.Microsoft.").append("AlphaImageLoader(src='").append(src).append("',sizingMethod='scale')");
        img.style.filter = filter.toString();
    }
    return img;
}

function PNG_html(attrs) {
    var img = new StringBuffer();
    var src = attrs.src;
    if(isIE6)
        attrs.src = '/common/spacer.png';
    img.append('<img ');
    if(attrs.id)
        img.append('id="').append(attrs.id).append('" ');
    if(attrs.thisClass)
        img.append('class="').append(attrs.thisClass).append('" ');
    img.append('src="').append(attrs.src);
    img.append('" width="').append(attrs.width).append('" height="').append(attrs.height).append('"/>');
    if(isIE6) {
        var img = new StringBuffer();
        img.append('<IMG ');
        if(attrs.id)
            img.append('id="').append(attrs.id).append('" ');
        img.append(' style="').append("FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='");
        img.append(src).append("',sizingMethod='scale'); WIDTH: ").append(attrs.width);
        img.append("px; HEIGHT: ").append(attrs.height).append("px");
        if(attrs.thisClass)
            img.append('" class="').append(attrs.thisClass);
        img.append('" src="/images/spacer.png">');
    }
    return img.toString();
}


function StringBuffer() { 
    this.buffer = []; 
}

StringBuffer.prototype.append = function(str) {
    this.buffer.push(str);
    return this;
}

StringBuffer.prototype.toString = function() {
    return this.buffer.join("");
}

StringBuffer.prototype.getLength = function() {
    return this.buffer.length;
}
