/*!
 * Joao Kho Map JavaScript Library v0.1.2
 * http://www.street-directory.com.au/jsmap/
 *
 * Copyright 2010, Joao Kho
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://js.street-directory.com.au
 * 
 * Copyright Partly by 
 * 1. dom-drag.js - 09.25.2001 - www.youngpup.net
 *    Script featured on Dynamic Drive (http://www.dynamicdrive.com) 12.08.2005
 * 2. PPK SimpleEvent
 * 3. Advanced DOM Scripting for camelize & uncamilize function
 * 4. Raphael Vector Library
 * 5. JSON library (http://www.JSON.org/json2.js)
 * 6. Latitude/longitude spherical geodesy formulae & scripts (c) Chris Veness 2002-2010
 * 
 * Date: Mon Feb 08 09:45:00 2010 +0700
 * Update: Wed May 26 08:25:04 2010 +0700
 * Update: Mon Jun 28 15:21:38 2010 +0700
 * Update: Tue Jan 25 14:27:32 2011 +0700
 * 
 * Deploy method: Use YUICompressor to produce jmap-min.js
 * 				  Use Dean Edward Packer Base62 to Pack to produce jmap-delploy.js
 */
 
(function() {

var joaokho = {};

/** Namespace object **/
if (!window.joaokho) joaokho = window.joaokho = {};

/* main maps Object */
if (!joaokho.maps) var maps = joaokho.maps = {};

/* util helpers function */
if (!joaokho.util) var util = joaokho.util = {};

/* util latitude/longitude spherical geodesy formula adjust for Australia Coordinate System */
if (!joaokho.geo) var geo = joaokho.geo = {};

util.$ = function() {
    var elements = new Array();    
    // Find all the elements supplied as arguments
    for (var i = 0; i < arguments.length; i++) {
        var element = arguments[i];       
        // If the argument is a string assume it's an id
        if (typeof element == 'string') {
            element = document.getElementById(element);
        }        
        // If only one argument was supplied, return the element immediately
        if (arguments.length == 1) {
            return element;
        }        
        // Otherwise add it to the array
        elements.push(element);
    }    
    // Return the array of multiple requested elements
    return elements;
}

util.ce = function(el) {
    return document.createElement(el);
}

util.ct = function(txt) {
    return document.createTextNode(txt);
}

util.id = function(id) {
    return document.getElementById(id);
}

util.tag = function(name,el) {
    return (el || document).getElementsByTagName(name);
}

util.ac = function(p,c) {
    p.appendChild(c);
}

util.rgb = function(r,g,b) {
    var decColor = r + 256 * g + 65536 * b;
    return deccolor.toString(16);
}

util.unrgb = function(c) {
    var r, g, b;
    parseInt(c, 10);
}

util.dec2hex = function(d) { return d.toString(16); }
util.hex2dec = function(h) { return parseInt(h,16); }

util.purge = function(d) {
    var a = d.attributes, i, l, n;
    if (a) {
        l = a.length;
        for (i = 0; i < l; i += 1) {
            n = a[i].name;
            if (typeof d[n] === 'function') {
                d[n] = null;
            }
        }
    }
    a = d.childNodes;
    if (a) {
        l = a.length;
        for (i = 0; i < l; i += 1) {
            util.purge(d.childNodes[i]);
        }
    }
}
// Copyright: Dustin Diaz
util.getElementsByClassName = function(node,classname) {
    if (node.getElementsByClassName) { // use native implementation if available
        return node.getElementsByClassName(classname);
    } else {
        return (function getElementsByClass(searchClass,node) {
            if ( node == null )
            node = document;
            var classElements = [],
                els = node.getElementsByTagName("*"),
                elsLen = els.length,
                pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)"), i, j;

            for (i = 0, j = 0; i < elsLen; i++) {
                if ( pattern.test(els[i].className) ) {
                    classElements[j] = els[i];
                    j++;
                }
            }
            return classElements;
        })(classname, node);
    }
}


/* dom helpers function  * 
 * for simplified code   */
joaokho.dom = {	
    ce : function(elem) { return document.createElement(elem); },
    ct : function(text) { return document.createTextNode(text); },
    id : function(id) { return document.getElementById(id); },
    tag: function(name,elem) { return(elem || document).getElementsByTagName(name); },
    ac : function(parent,child) { parent.appendChild(child); },
    p  : function(elem,value) {  if (value) { elem.style.position = value; } },  
    pa : function(elem) { elem.style.position = "absolute"; },
    pr : function(elem) { elem.style.position = "relative"; },
    o  : function(elem,value) { if (value) { elem.style.overflow = value; } }, 
    oh : function(elem) { elem.style.overflow = "hidden"; },
    l  : function(elem,value) { if (value) { elem.style.left = value; } },
    t  : function(elem,value) { if (value) { elem.style.top = value; } },
    w  : function(elem,value) { if (value) { elem.style.width = value; } },
    h  : function(elem,value) { if (value) { elem.style.height = value; } },
    b  : function(elem,value) { if (value) { elem.style.border = value; } },
    s  : function(elem,value) { elem.src = value; },
    /** Warning when using for IE some attribute is not available **/   
    sa : function(elem,attr,value) { elem.setAttribute(attr, value); },    
    camelize: // function copy from Advanced DOM Scripting
         function(s) {
            return s.replace(/-(\w)/g, function (strMatch, p1){
                return p1.toUpperCase();
            });
         },
    uncamelize: // function copy from Advanced DOM Scripting
        function (s, sep) {
            sep = sep || '-';
            return s.replace(/([a-z])([A-Z])/g, function (strMatch, p1, p2){
                return p1 + sep + p2.toLowerCase();
            });
        },
    sss: function(element, styles) {
             for (var styleName in styles) {
                if (styleName in element.style) {
					try {
						element.style[styleName] = styles[styleName];                 					
					} catch(e) { 
						if (e == "unsupport")  ; // do nothing
				    }
                 }  
             }
         },       
    ppp: function(element, property) {
            for (var propName in property) {
                if (propName in element) {
                    if (propName == "style") continue;
                    element[propName] = property[propName];
                }
            }        
         },
	empty : function(node) {
				var cell = null;
				if (typeof node == "string") 
					cell = document.getElementById(node);
				else
					cell = node;
				if ( cell.hasChildNodes() ) {
					while ( cell.childNodes.length >= 1 ) {
						cell.removeChild( cell.firstChild );       
					} 
				}
			},
	getMousePos : function (e) {
		var posx = 0;
		var posy = 0;
		if (!e) var e = window.event;
		if (e.pageX || e.pageY) 	{
			posx = e.pageX;
			posy = e.pageY;
		}
		else if (e.clientX || e.clientY) 	{
			posx = e.clientX + document.body.scrollLeft
				+ document.documentElement.scrollLeft;
			posy = e.clientY + document.body.scrollTop
				+ document.documentElement.scrollTop;
		}
		// posx and posy contain the mouse position relative to the document
		// Do something with this informationmyControl1
		return {x:posx,y:posy};
	},
	captureMouseMove: function(e) {
		var posx = 0;
		var posy = 0;
		if (!e) var e = window.event;
		if (e.pageX || e.pageY) {
			posx = e.pageX;
			posy = e.pageY;
		} else if (e.clientX || e.clientY) {
			posx = e.clientX + document.body.scrollLeft - document.body.clientLeft;
			posy = e.clientY + document.body.scrollTop - document.body.clientTop;
		}		
		return {x:posx, y:posy};
	},
	getPosition: function(e) {
		var left = 0;
		var top  = 0;
		
		while (e.offsetParent) {
			left += e.offsetLeft;
			top  += e.offsetTop;
			e     = e.offsetParent;
		}
		
		left += e.offsetLeft;
		top  += e.offsetTop;
		
		return {x:left, y:top};
	}
}
dom = joaokho.dom;

joaokho.geo = {
    // function untuk dapatin diameter SYSCOORD Australia pada level Latitude tertentu  
    getCoordSysDistance: function(lat) {
        function toRad(n) {
            return n * Math.PI / 180;
        }

        // Use horizontal for calculation width
        var lat1 = lat;
        var lat2 = lat;
        var lon1 = 106.720409792149; // australia lon1 boundary 
        var lon2 = 161.742073361529; // australia lon2 boundary
        var R = 6371; // Radius of the earth in km    
        var dLat = toRad(lat2-lat1);  // Javascript functions in radians
        var dLon = toRad(lon2-lon1);
        var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
            Math.cos(toRad(lat1)) * Math.cos(toRad(lat2)) * 
            Math.sin(dLon/2) * Math.sin(dLon/2); 
        var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); 
        var d = R * c; // Distance in km
        //console.log(d);
        return d;
    }
}
geo = joaokho.geo;


/* JSONP Mas Bayu */
JSONP = (function() {
  var me = this;
  var _queue = [],
    _current = null,
    _nextRequest = function() {
      _current = null;
      if(_queue.length) {
        _current = _queue.shift();
        //toText(_current.url + '?' + _current.params);
        _current.script.src = _current.url + '?' + _current.params;
        document.getElementsByTagName('head')[0].appendChild(_current.script);
      }
    };

  var ua = navigator.userAgent.toLowerCase(),
    check = function(r){
      return r.test(ua);
    },
    isOpera = check(/opera/),
    isIE = !isOpera && check(/msie/),
    isIE7 = isIE && check(/msie 7/),
    isIE8 = isIE && check(/msie 8/);

  me.urlEncode = function(o, pre) {
    //toText(o);
      var buf = [], key, e = encodeURIComponent;
      for(key in o) {
        each(o[key] || key, function(val, i) {
          buf.push("&", e(key), "=", val != key ? e(val) : "");
        });
      }
      if(!pre) {
        buf.shift();
        pre = "";
      }
      //toText(pre); toText(buf);
      return pre + buf.join('');
    },
  me.each = function(array, fn, scope){
      if(isEmpty(array, true)) return;
      if (typeof array.length == "undefined" || typeof array == "string"){
        array = [array];
      }
      for(var i = 0, len = array.length; i < len; i++){
        if(fn.call(scope || array[i], array[i], i, array) === false){ return i; };
      }
    },
  me.isEmpty = function(v, allowBlank){
      return v === null || v === undefined || ((isArray(v) && !v.length)) || (!allowBlank ? v === '' : false);
    },
  me.isArray = function(v){
      return Object.prototype.toString.apply(v) === '[object Array]';
    },
  me.decode = function(json, safe){
      var fn = function(){
        return eval("(" + json + ')');
      };
      if(safe){
        try{
          return fn();
        }catch(e){
          return null;
        }
      }else{
        return fn();
      }
    };

  return {
    request: function(url, o) {
      if(!url) {
        return;
      }
      var me = this;

      var script = document.createElement('script');
      script.type = 'text/javascript';

      if(!o) {
        script.src = url;
        document.getElementsByTagName('head')[0].appendChild(script);
        return;
      }

      o.params = o.params || {};
      if(o.callbackKey) {
        o.params[o.callbackKey] = 'JSONP.callback';
      }
      var params = urlEncode(o.params);

      if(o.isRawJSON) {
        if(isIE) {
          //Ext.fly(script).on('readystatechange', function() {
          script.onreadystatechange = function() {
            if(script.readyState == 'complete') {
              var data = script.innerHTML;
              if(data.length) {
                me.callback(decode(data));
              }
            }
          }; //});
        }
        else {
          //Ext.fly(script).on('load', function() {
          script.onload = function() {
            var data = script.innerHTML;
            if(data.length) {
              me.callback(decode(data));
            }
          }; //});
        }
      }

      _queue.push({
        url: url,
        script: script,
        callback: o.callback || function(){},
        scope: o.scope || window,
        params: params || null
      });

      if(!_current) {
        _nextRequest();
      }
    },

    callback: function(json) {
      _current.callback.apply(_current.scope, [json]);
      //Ext.fly(_current.script).removeAllListeners();
      document.getElementsByTagName('head')[0].removeChild(_current.script);
      _nextRequest();
    }
  };
})();

/** CONSTANTA **/
J_MAP_VERSION = "0.1.2";

// For Control Anchor Position 
J_ANCHOR_CENTER = 0;
J_ANCHOR_TOPLEFT = 1;
J_ANCHOR_TOPRIGHT = 2;
J_ANCHOR_BOTTOMLEFT = 3;
J_ANCHOR_BOTTOMRIGHT = 4;
    
// For MapType
J_TRANS_MAP      = 1;
J_PSMA_MAP       = 2;
J_AUSWAY_MAP     = 4;
J_STREETVIEW_MAP = 8;
J_SATELLITE_MAP  = 16;

J_HYBRID_PSMA_MAP = 10;
J_HYBRID_AUSWAY_MAP = 12;


J_DEFAULT_MAP_TYPES = [J_PSMA_MAP, J_AUSWAY_MAP, J_HYBRID_AUSWAY_MAP];

// Global CONSTANTA for LAYER
J_WINERIES_LAYER = 1;
J_PROPERTYRENT_LAYER = 2;
J_PROPERTYSALE_LAYER = 4;
J_PANORAMA_LAYER = 8;
J_PHOTO_LAYER = 16;
J_STREETVIEW_LAYER = 32;
J_SHOPVIEW_LAYER = 64;
J_ACCOMMODATION_LAYER = 128;

J_ONLINE_STATE = true;

// Magic Decode String
var J_MAGIC_STR = ["JohkyZ2479","InT1m4PS7d"];

// Host & Map url
J_DEFAULT_HOST = "https://js.street-directory.com.au/"; //"http://210.50.2.214/";  //"http://116.240.201.18/"; //"http://192.168.0.88/"; 

if (J_ONLINE_STATE) {
	J_DEFAULT_HOST = "https://js.street-directory.com.au/";
	J_ROOTMAP_URL = "http://116.240.201.18/map/"; 
	//J_STATIC_IMG_URL = J_DEFAULT_HOST + "~joaokho/static_images/";
        J_STATIC_IMG_URL = J_DEFAULT_HOST + "static_images/"
	J_TRANSPARENT_URL = J_STATIC_IMG_URL;
	J_GENTILE_URL = J_DEFAULT_HOST + "~joaokho/genlayertile/";
	//J_WSGI_URL = J_DEFAULT_HOST + "wsgi/";
    J_WSGI_URL = "https://m0.street-directory.com.au/wsgi/";
	
} else {
	J_DEFAULT_HOST = "http://210.50.2.220/";
	J_ROOTMAP_URL = "http://210.50.2.220/map/"; 
	J_STATIC_IMG_URL = "http://210.50.2.220/jsmap/static_images/";
	J_TRANSPARENT_URL = J_STATIC_IMG_URL;
	J_GENTILE_URL = "http://210.50.2.220/genlayertile/";
	J_WSGI_URL = "http://210.50.2.220/wsgi/";    
}

J_PSMA_URL = J_ROOTMAP_URL + "r_psma_au/";
J_SV_URL = J_ROOTMAP_URL + "r_streetview_au/";
J_AUSWAY_URL = J_ROOTMAP_URL + "r_ausway_au/";
J_SATELLITE_URL = J_ROOTMAP_URL + "r_satellite_au/";

J_TILE_IMG_URL = [];
J_TILE_IMG_URL[J_TRANS_MAP] = J_TRANSPARENT_URL;
J_TILE_IMG_URL[J_PSMA_MAP] = J_PSMA_URL;
J_TILE_IMG_URL[J_AUSWAY_MAP] = J_AUSWAY_URL;
J_TILE_IMG_URL[J_STREETVIEW_MAP] = J_SV_URL;
J_TILE_IMG_URL[J_SATELLITE_MAP] = J_SATELLITE_URL;

// Default common use image
J_TRANS_IMG = J_STATIC_IMG_URL + "transparent.png";
J_WATER_IMG = J_STATIC_IMG_URL + "sea.png";
J_NONE_IMG = J_STATIC_IMG_URL + "none.png";
J_SIGN_IMG = [J_STATIC_IMG_URL + "pointer1.png",
              J_STATIC_IMG_URL + "pointer2.png",
              J_STATIC_IMG_URL + "pointer3.png",
              J_STATIC_IMG_URL + "pointer4.png",
              J_STATIC_IMG_URL + "pointer5.png",
              J_STATIC_IMG_URL + "pointer6.png",
              J_STATIC_IMG_URL + "point.gif"];
              
// For Default Control CenterSign
J_CROSS_SIGN = 1;
J_CIRCLE_SIGN= 2;
              
// image for mouse pointer (cursor)
J_OPENHAND_CUR = J_STATIC_IMG_URL + "openhand.cur";
J_CLOSEHAND_CUR = J_STATIC_IMG_URL + "closedhand.cur";

J_DEFAULT_ICON = 0;
J_NUMBER_ICON  = 10;
J_LETTER_ICON  = 21;

J_DEFAULT_ICON_IMAGE = [J_STATIC_IMG_URL + "icon/red.png", J_STATIC_IMG_URL + "icon/green.png", J_STATIC_IMG_URL + "icon/blue.png"]; // black, yellow, orange, pink, ltblue
J_LETTER_ICON_IMAGE = [J_STATIC_IMG_URL + "icon/icon48_003.png"];
J_NUMBER_ICON_IMAGE = [J_STATIC_IMG_URL + "icon/icon0.png"];
J_SHADOW_IMAGE = [J_STATIC_IMG_URL + "icon/shadow.png"];
J_DRAGCROSS_IMAGE = J_STATIC_IMG_URL + "icon/drag_cross_67_16.png";

J_INFOWINDOW_IMAGE = J_STATIC_IMG_URL + "infowin.png";
J_TAIL_IMAGE = J_STATIC_IMG_URL + "infowin_tail.png";
J_COPYRIGHT_IMG = J_STATIC_IMG_URL + "logo.gif";


maps.Version = function() {
    return J_MAP_VERSION;
}

/** Base Types **/
maps.LonLat = function (lon, lat) { 
    this.lon = lon || 0.0;
    this.lat = lat || 0.0;
    this.toString = function() { return ("lon=" + this.lon + ",lat=" + this.lat); }
    this.toShortStr = function(delim) { if (!delim) delim = ','; return (this.lon + delim + this.lat); }
    this.equals = function(ll) { if (this.lon == ll.lon && this.lat == ll.lat) return true; else return false; }
    this.ll = function(lon,lat) { this.lon = lon; this.lat = lat; }
}
JLonLat = maps.LonLat;

maps.Point = function (x, y) {
    this.x = x || 0;
    this.y = y || 0;
    this.toString = function() { return ("x=" + this.x + ",y=" + this.y); }
    this.toShortStr = function(delim) { if (!delim) delim = ','; return (this.x + delim + this.y); }
    this.equals = function(pt) { if (this.x == pt.x && this.y == pt.y) return true; else return false; }
    this.xy = function(x,y) { this.x = x; this.y = y; }
}
JPoint = maps.Point;

maps.Size = function (w, h) {
    this.w = w;
    this.h = h;
    this.toString = function() { return ("w=" + this.w + ",h=" + this.h); }
    this.equals = function(sz) { if (this.w == sz.w && this.h == sz.h) return true; else return false; }
    this.sz = function(w,h) { this.w = w; this.h = h; }
}
JSize = maps.Size;

maps.LonLatBounds = function(tl, br) {
    this.tl = tl;
    this.br = br;
    this.top = function() { return this.tl.lat; }
    this.left = function () { return this.tl.lon; }
    this.bottom = function() { return this.br.lat; }
    this.right = function() { return this.br.lon; }
    this.toString = function() { return ("(" + this.tl.toShortStr() + "),(" + this.br.toShortStr() + ")"); }
    this.getCenter = function() { 
        var cx = (this.tl.lon + this.br.lon) / 2;
        var cy = (this.tl.lat + this.br.lat) / 2;
        return new maps.LonLat(cx, cy);
    }
}
JLonLatBounds = maps.LonLatBounds;

// Function for creating HTML DIV Container
maps.Container = function(parent,id,style) {
    var elem = dom.ce("div");
    if(id) elem.id = id || null;
    if (typeof style != "undefined") {
        dom.sss(elem, style);
    }  
    //if (typeof parent != "undefined") dom.ac(parent,elem);
    if (parent) dom.ac(parent,elem);
    return elem;
}
JContainer = maps.Container;

// Function for creating HTML IMG 
maps.Image = function(parent,id,style,property) {
    var img = dom.ce("img");
    img.id = id;
    dom.sss(img, style);
    dom.ppp(img, property);
    dom.ac(parent,img);    
    return img;
}
JImage = maps.Image;

// Function for insert inline CSS on HTML Header
maps.Css = function(styledata, media) {
    var elem = document.createElement("style");
    dom.sa(elem,"type","text/css");
    if (media) dom.sa(elem,"media",media);
    if (elem.styleSheet) elem.styleSheet.cssText = styledata;
    else elem.appendChild(dom.ct(styledata));
    return elem;
}
JCss = maps.Css;

// Function for creating simple 3D Button
maps.Button3D = function(parent,id,txt,styles,event) {  
    styles.backgroundColor = styles.backgroundColor || "#DCDCDC";
    var iColor = util.hex2dec(styles.backgroundColor.substr(1,7));
    var bgHoverColor = "#" + util.dec2hex(iColor + (-64) + (-64 * 256) + (-64 * 65536));
    styles.color = styles.color || "black";
    styles.padding = styles.padding || "1px 4px";
    styles.textDecoration = styles.textDecoration || "none";
    styles.borderWidth = styles.borderWidth || "1px";
    styles.borderColor = styles.borderColor || "#DCDCDC";
    styles.borderStyle = styles.borderStyle || "outset"; // none,hidden,dotted,dashed,solid,double,groove,ridge,inset,outset,inherit
    styles.fontWeight = styles.fontWeight || "bold";
    styles.fontFamily = styles.fontFamily || "Arial, Verdana, Helvetica, san-serif";
    styles.fontSize = styles.fontSize || "10px";
    styles.width = styles.width || (id.length * 8).toString() + "px" || "50px";
    styles.height = styles.height || "12px";
    //styles.left = styles.left || "0px";
    //styles.top = styles.top || "0px";
    styles.textAlign = styles.textAlign || "center";
    //styles.verticalAlign = styles.verticalAlign || "middle";
    styles.position = styles.position || "absolute";
    styles.cursor = "pointer";
    
    var btn = dom.ce("div");
    btn.id = id;
    dom.sss(btn,styles);
    btn.unselectable = "on"; // special tag for IE to unselectable text
    var txt = dom.ct(txt || id);
    dom.ac(btn,txt);
    dom.ac(parent,btn);
    btn.parent = parent;
    
    btn.onmouseover = function() { this.style.backgroundColor = bgHoverColor; this.style.borderStyle = "inset"; this.style.padding = "1px 3px 2px 5px"; }
    btn.onmouseout = function () { this.style.backgroundColor = styles.backgroundColor; this.style.borderStyle = styles.borderStyle; this.style.padding = styles.padding; }
    btn.onclick = event || null;
    
    return btn; 
}    
JButton3D = maps.Button3D;

maps.ControlPosition = function(anchor, offset) {
	this.anchor = anchor || J_ANCHOR_TOPLEFT;
	this.offset = offset || new maps.Size(0,0);		
	this.getLeftRight = function() {
		switch(this.anchor) {
			case 1:	return '"left":"' + offset.w + 'px"'; break;
			case 2: return '"right":"' + offset.w + 'px"'; break;
			case 3: return '"left":"' + offset.w + 'px"'; break;
			case 4: return '"right":"' + offset.w + 'px"'; break;
		}
	}
	this.getTopDown = function() {
		switch(this.anchor) {
			case 1: return '"top":"' + offset.h + 'px"'; break;
			case 2: return '"top":"' + offset.h + 'px"'; break;
			case 3: return '"bottom":"' + offset.h + 'px"'; break;
			case 4: return '"bottom":"' + offset.h + 'px"'; break;			
		}
	}
	this.anchorPosition = function() {
		var anchor_str = '"position":"absolute",'  + this.getLeftRight() + ',' + this.getTopDown();
		return anchor_str;				
	}
}
JControlPosition = maps.ControlPosition;

// MAP CONTROL CLASS INTERFACE - all Control should have default of property & method
maps.Control = function(a,b) {
	// param a is printable, param b is selectable 
	this.name = "control";
	this.position = null;
	this.initialize = function(map) {}
	this.remove = function() {}
	this.printable = function() {}
	this.selectable = function() {}
	this.getDefaultPosition = function() { return position; }
}
JControl = maps.Control;

maps.CenterSignControl = function(val) { // val could contain default constant number or url to image
	this.map_ = null;
	this.div_ = null;
	this.imgUrl = null;	
	
	var imgUrlRegex = /^(http:\/\/|https:\/\/|www|[0-9]).*\/[a-zA-Z0-9-_\.]+\.(jpg|gif|png)$/; 
	if (typeof val == "undefined") this.imgUrl = J_SIGN_IMG[0];
    else if (typeof val == "number") this.imgUrl = J_SIGN_IMG[val] || J_SIGN_IMG[0];
    else if (imgUrlRegex.test(url) != true) {
		this.imgUrl = maps.StaticImage.imgSign[0];
	} else {
		this.imgUrl = val;
	}
	
	// get image size (w, h)    
    var oImg = new Image();
    oImg.src = this.imgUrl;
    this.imgWidth = oImg.width;
    this.imgHeight = oImg.height;
    if (this.imgWidth == 0) this.imgWidth = 23;
    if (this.imgHeight == 0) this.imgHeight = 23;
}
var F = function() {};
F.prototype = maps.Control.prototype;
maps.CenterSignControl.prototype = new F();
maps.CenterSignControl.constructor = maps.CenterSignControl;
maps.CenterSignControl.prototype.name = "CenterSignControl";
maps.CenterSignControl.prototype.initialize = function(map) {
	this.map_ = map;	
	var pt = map.getCenterPos();
	var w = this.imgWidth;
	var h = this.imgHeight;
	var d = dom.ce("div");
	d.id = this.name;
	d.style.position = "absolute";
	d.style.left = (pt.x - Math.round(w/2)) + "px";
	d.style.top = (pt.y - Math.round(h/2)) + "px";
	d.style.width = w + "px";
	d.style.height = h + "px";
	var imgSign = dom.ce("img");
	imgSign.style.left = "0px";
	imgSign.style.top = "0px";
	imgSign.src = this.imgUrl;
	dom.ac(map.getContainer(), d);
	dom.ac(d, imgSign);		
	this.div_ = d;
}
maps.CenterSignControl.prototype.remove = function() {	
	var d = this.div_;
	var childs = d.childNodes;
	for (var i=0; i < childs.length; i++)
		d.removeChild(childs[i]);			
	var p = d.parentNode;
	p.removeChild(d);	
	this.div_ = null;
	this.map_ = null;
}
JCenterSignControl = maps.CenterSignControl;

// Creates a standard map type control for selecting and switching between supported map types via buttons.
maps.MapTypeControl = function() { 
	this.map_ = null;
	this.div_ = null;
	this.position = new maps.ControlPosition(J_ANCHOR_TOPRIGHT, new maps.Size(5,5));	
}
var F = function() {};
F.prototype = maps.Control.prototype;
maps.MapTypeControl.prototype = new F();
maps.MapTypeControl.constructor = maps.MapTypeControl;
maps.MapTypeControl.prototype.name = "MapTypeControl";
maps.MapTypeControl.prototype.initialize = function(map,pos) {
	this.map_ = map;
	var ctrl_pos = pos || this.position;
		
	//var pt = ctrl_pos.getPosition();
	//var sz = ctrl_pos.offset;	
	var p = map.getContainer();	
	
	// get total space use for single button
	var btn_w = 60; // button width
	var btn_space = 10; // button spacing, because button border size is 4px each left right, so total 8px
	var tot_btn_w = btn_w + btn_space; // total button width is 70
	
	// get total ui define maptype
	var ui = map.getDefaultUI();		
    var len = 0;
    for (var n in ui.maptypes) 
		if (ui.maptypes[n]) len += 1;    
	
	// sum total width for button of mapType 	
	var w = len * tot_btn_w; 
	var h = 18; // create 18 height button
	
	var w_str = '"width":"' + w + 'px"'; // total MapTypeControl width  
	var h_str = '"height":"18px"';	
	var styles_str = '{' + ctrl_pos.anchorPosition() + ',' + w_str + ',' + h_str + '}';	
	var pos_obj = JSON.parse(styles_str);
		
	var d = new maps.Container(p,"MapTypeControl",pos_obj);
	
    var i=1;
    if (ui.maptypes.streetview) {
	    var btnHybridStreetview = new maps.Button3D(d,"Hybrid SV",null,{MozUserSelect:"none", width:"60px", position:"absolute", right:((len-i)*tot_btn_w)+"px", opacity:"0.9",filter:"alpha(opacity=90)"});
		i += 1;
		btnHybridStreetview.onclick = function() {
			var cnt = map.getTileContainer().items.length-1;				
			for (var i=cnt;i>=0;i--)
				map.removeOverlay(map.getTileContainer().items[i]);
			map.addOverlay(new maps.TileMap(J_STREETVIEW_MAP));
			map.addOverlay(new maps.TileMap(J_AUSWAY_MAP));			
		}		
	}	
	if (ui.maptypes.psma) {
		var btnNormal = new maps.Button3D(d,"Map",null,{MozUserSelect:"none", width:"60px", position:"absolute", right:((len-i)*tot_btn_w)+"px", opacity:"0.9",filter:"alpha(opacity=90)"});
		i += 1;
		btnNormal.onclick = function() {						
			var cnt = map.getTileContainer().items.length-1;				
			for (var i=cnt;i>=0;i--)
				map.removeOverlay(map.getTileContainer().items[i]);										
			map.addOverlay(new maps.TileMap(J_PSMA_MAP));
		}		
	}
	if (ui.maptypes.ausway) {
		var btnHybridAusway = new maps.Button3D(d,"Hybrid Aus",null,{MozUserSelect:"none", width:"60px", position:"absolute", right:((len-i)*tot_btn_w)+"px",opacity:"0.9",filter:"alpha(opacity=90)"});
		i += 1;
		btnHybridAusway.onclick = function() {		
			var cnt = map.getTileContainer().items.length-1;				
			for (var i=cnt;i>=0;i--)
				map.removeOverlay(map.getTileContainer().items[i]);				
			map.addOverlay(new maps.TileMap(J_AUSWAY_MAP));
		}
	}
	if (ui.maptypes.satellite) {
	    var btnSatellite = new maps.Button3D(d,"Satellite",null,{MozUserSelect:"none", width:"60px", right:((len-i)*tot_btn_w)+"px", top:"0px", opacity:"0.9",filter:"alpha(opacity=90)"});
		i += 1;
		btnSatellite.onclick = function() {
			map.clearOverlays();
			map.addOverlay(new maps.TileMap(J_SATELLITE_MAP));
		}		
	}	
	
	this.div_ = d;
}
maps.MapTypeControl.prototype.remove = function() {
	var d = this.div_;	
	var c = d.childNodes;
	for (var i=0; i < c.length; i++) {
		c[i].onclick = null;
		d.removeChild(c[i]);
	}
					
	var p = d.parentNode;
	p.removeChild(d);	
	this.div_ = null;
	this.map_ = null;
	delete this.div_;
	delete this.map_;
}
JMapTypeControl = maps.MapTypeControl;

maps.MapLayerControl = function() { 
	this.map_ = null;
	this.div_ = null;
    this.listbox_ = null;
    this.position = new maps.ControlPosition(J_ANCHOR_TOPRIGHT, new maps.Size(5,5));
}
var F = function() {};
F.prototype = maps.Control.prototype;
maps.MapLayerControl.prototype = new F();
maps.MapLayerControl.constructor = maps.MapLayerControl;
maps.MapLayerControl.prototype.name = "MapLayerControl";
maps.MapLayerControl.prototype.initialize = function(map,pos) {
	this.map_ = map;
	var ctrl_pos = pos || this.position;

    var w_str = '"width":"70px"'; // total button+space
	var h_str = '"height":"18px"';	
	var styles_str = '{' + ctrl_pos.anchorPosition() + ',' + w_str + ',' + h_str + '}';	
	var pos_obj = JSON.parse(styles_str);
    
	var p = map.getContainer();
	var d = new maps.Container(p,"MapLayerControl",pos_obj);	
	var menu = new maps.Button3D(d,"Layers...",null,{MozUserSelect:"none",width:"60px",height:"12px",opacity:"0.9",filter:"alpha(opacity=90)"});
	var listbox = new maps.Container(d,"ListBox",{fontSize:"11px",fontFamily:"Arial,Georgia,San Seriff",position:"absolute",width:"120px",left:"0px",top:"15px",backgroundColor:"white",border:"1px solid #ABABAB",visibility:"hidden",opacity:"0.9",filter:"alpha(opacity=90)"});
	
	menu.onmouseover = function() {
        // if childElementCount is 0 then no need to visible;
        var len = listbox.childNodes.length;        
        if (len) listbox.style.visibility = "visible";
	}
	menu.onmouseout = function() {		
		listbox.style.visibility = "hidden";
	}
	listbox.onmouseover = function() {
		listbox.style.visibility = "visible";
	}
	listbox.onmouseout = function() {
		listbox.style.visibility = "hidden";
	}
    this.listbox_ = listbox;
	this.div_ = d;	
}
maps.MapLayerControl.prototype.addLayer = function(obj,fn) {
    var listbox = this.listbox_;
    var checkbox = dom.ce("input");
    checkbox.type = "checkbox";
    checkbox.name = obj.name;
    checkbox.value = obj.value;
    checkbox.className = "MapLayer";
    var desc = dom.ct(obj.description);
    var br = dom.ce("br");
    dom.ac(listbox, checkbox);
    dom.ac(listbox, desc);
    dom.ac(listbox, br);

    checkbox.onclick = fn;    
}
maps.MapLayerControl.prototype.removeLayer = function(name) {        
    var el = document.getElementsByName(name);
    var len = el.length;
    for (var i=len-1; i >=0; i--) {      
        if (el[i].onclick) el[i].onclick = null;
        var p = el[i].parentNode;
        p.removeChild(el[i].nextSibling);
        p.removeChild(el[i].nextSibling);
        p.removeChild(el[i]);
    }
}
maps.MapLayerControl.prototype.remove = function() {
	var d = this.div_;	
	var c = d.childNodes;
    var len_c = c.length;    
	for (var i=len_c-1; i >= 0; i--) {        
        if (c[i].onmouseover) c[i].onmouseover = null;
        if (c[i].onmouseout) c[i].onmouseout = null;
        var b = c[i].childNodes;
        var len_b = b.length;
        if (len_b == 0) continue;
        for (var j=len_b-1; j >= 0; j--) {
            if (b[j].onclick) b[j].onclick = null;                        
            c[i].removeChild(b[j]);
        }            
		d.removeChild(c[i]);
	}
					
	var p = d.parentNode;
	p.removeChild(d);	
	this.div_ = null;
	this.map_ = null;
}
JMapLayerControl = maps.MapLayerControl;

maps.StreetViewControl = function() {
	this.map_ = null;
	this.div_ = null;
    this.position = new maps.ControlPosition(J_ANCHOR_TOPRIGHT, new maps.Size(5,5));
}
var F = function() {};
F.prototype = maps.Control.prototype;
maps.StreetViewControl.prototype = new F();
maps.StreetViewControl.constructor = maps.StreetViewControl;
maps.StreetViewControl.prototype.name = "StreetViewControl";
maps.StreetViewControl.prototype.initialize = function(map,pos) {
    this.map_ = map;
    var ctrl_pos = pos || this.position;

    var w_str = '"width":"70px"'; // total button+space
	var h_str = '"height":"18px"';	
	var styles_str = '{' + ctrl_pos.anchorPosition() + ',' + w_str + ',' + h_str + '}';	
	var pos_obj = JSON.parse(styles_str);
    
    var p = map.getContainer();
    var d = new maps.Container(p,'StreetViewControl',pos_obj);

    var toggle = map.getDefaultUI().maptypes.streetview;
    var bgColor = "#DCDCDC";
    var iColor = util.hex2dec(bgColor.substr(1,7));
    var bgHoverColor = "#" + util.dec2hex(iColor + (-64) + (-64 * 256) + (-64 * 65536));    
    var btnSV = new maps.Button3D(d,"Street View",null,{MozUserSelect:"none", width:"60px", position:"absolute", right:"0px", opacity:"0.9",filter:"alpha(opacity=90)"});
    if (toggle) {
        btnSV.style.backgroundColor = bgHoverColor;
        btnSV.style.borderStyle = "inset";
        btnSV.style.padding = "1px 3px 2px 5px";
    }
        
    btnSV.onmouseover = null;
    btnSV.onmouseout = null;
    
    var tc = map.getTileContainer();
    
    btnSV.onclick = function() {
        toggle = !toggle;        
        if (toggle) {
            // Button Down Effect
            btnSV.style.backgroundColor = bgHoverColor;
            btnSV.style.borderStyle = "inset";
            btnSV.style.padding = "1px 3px 2px 5px";

            // Update defaultUI
            var ui = map.getDefaultUI();
            ui.maptypes.streetview = true;

            var arrMapType = [];
            // store current show map to temporary MapType array 
            for (var i in tc.items) 
                arrMapType[i] = tc.items[i].maptype;
            // remove current show map
            for (var i=tc.items.length;i>=1;i--) 				
                map.removeOverlay(tc.items[i-1]);
            // add SV TileMap first
            map.addOverlay(new maps.TileMap(J_STREETVIEW_MAP));
            // redraw again current show map
            for (var i=0; i < arrMapType.length; i++) 	
                map.addOverlay(new maps.TileMap(arrMapType[i]));
        } else {
            // Button Up Effect
            btnSV.style.backgroundColor = bgColor;
            btnSV.style.borderStyle = "outset";
            btnSV.style.padding = "1px 4px";

            // Update defaultUI
            var ui = map.getDefaultUI();
            ui.maptypes.streetview = false;
        
            var cnt = tc.items.length-1;
            for (var i=cnt;i>=0;i--)
                if (tc.items[i].maptype == J_STREETVIEW_MAP)
                    map.removeOverlay(tc.items[i]);
            
        }    
    }
    
    this.div_ = d;
}
maps.StreetViewControl.prototype.remove = function() {
    var d = this.div_;	
	var c = d.childNodes;
	for (var i=0; i < c.length; i++) {
		c[i].onclick = null;
		d.removeChild(c[i]);
	}
					
	var p = d.parentNode;
	p.removeChild(d);	
	this.div_ = null;
	this.map_ = null;
}
JStreetViewControl = maps.StreetViewControl;

/**
maps.MapTypeControlStyle = function() {
    this.DEFAULT = null;
    this.DROPDOWN_MENU = null;
    this.HORIZONTAL_BAR = null;
}
maps.MapTypeControlOptions = function() {
    this.mapTypeIds = [];
    //this.position = ControlPosition;
    this.style = new maps.MapTypeControlStyle;
}
maps.NavigationControlOptions = functionJ_ANCHOR_TOPLEFT = 1;
J_ANCHOR_TOP = 2;
J_ANCHOR_TOPRIGHT = 3;

J_ANCHOR_LEFT = 4;
J_ANCHOR_CENTER = 5;
J_ANCHOR_RIGHT = 6;

J_ANCHOR_BOTTOMLEFT = 7;
J_ANCHOR_BOTTOM = 8;
J_ANCHOR_BOTTOMRIGHT = 9;() {}
maps.ScaleControlOptions = function() {}
**/

maps.SmallMapControl = function() {
	this.map_ = null;
	this.div_ = null;
	this.position = new maps.ControlPosition(J_ANCHOR_TOPLEFT, new maps.Size(5,5));	
}
var F = function() {};
F.prototype = maps.Control.prototype;
maps.SmallMapControl.prototype = new F();
maps.SmallMapControl.constructor = maps.SmallMapControl;
maps.SmallMapControl.prototype.name = "SmallMapControl";
maps.SmallMapControl.prototype.initialize = function(map,pos) {
	this.map_ = map;
	var p = map.getContainer();
	var ctrl_pos = pos || this.position;
	
	var w_str = '"width":"40px"';   // Control Width 
	var h_str = '"height":"100px"';	// Control Height
	var bgImg = '"backgroundImage":"url(' + J_STATIC_IMG_URL + 'smallmapcontrol.png)"';	
	
	var styles_str = '{' + ctrl_pos.anchorPosition() + ',' + w_str + ',' + h_str + ',' + bgImg + '}';	
	var style_obj = JSON.parse(styles_str);
	
	var d = new maps.Container(p, "SmallMapControl", style_obj);			
		
	//var img = new maps.Image(d,"smallmapctrl",{MozUserSelect:"none",top:"0px",left:"0px"},{src:J_STATIC_IMG_URL + "smallmapcontrol.png"});
	var d_up = new maps.Container(d, "up", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"18px",height:"18px",top:"0px",left:"11px",cursor:"pointer"});
	var d_down = new maps.Container(d, "down", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"18px",height:"18px",top:"40px",left:"11px",cursor:"pointer"});
	var d_left = new maps.Container(d, "left", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"18px",height:"18px",top:"20px",left:"0px",cursor:"pointer"});
	var d_right = new maps.Container(d, "right", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"18px",height:"18px",top:"20px",left:"22px",cursor:"pointer"});
	var d_zoomin = new maps.Container(d, "zoomin", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"18px",height:"18px",top:"63px",left:"11px",cursor:"pointer"});
	var d_zoomout = new maps.Container(d, "zoomout", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"18px",height:"18px",top:"82px",left:"11px",cursor:"pointer"});
	
	d_up.onclick = function() { map.panBy(new maps.Point(0, map.getMapSize().h / 2)); };
	d_down.onclick = function() { map.panBy(new maps.Point(0,-map.getMapSize().h / 2)); };
	d_left.onclick = function() { map.panBy(new maps.Point(map.getMapSize().w / 2,0)); };
	d_right.onclick = function() { map.panBy(new maps.Point(-map.getMapSize().w / 2,0)); };
	d_zoomin.onclick = function() { map.zoomIn(); }
	d_zoomout.onclick = function() { map.zoomOut(); }
	
	d_up.ondblclick = d_up.onclick;
	d_down.ondblclick = d_down.onclick;
	d_left.ondblclick = d_left.onclick;
	d_right.ondblclick = d_right.onclick;
	d_zoomin.ondblclick = d_zoomin.onclick;
	d_zoomout.ondblclick = d_zoomout.onclick;
	
	this.div_ = d;
}
maps.SmallMapControl.prototype.remove = function() {
	var d = this.div_;	
	var c = d.childNodes;
	for (var i=0; i < c.length; i++) {
		c[i].dblclick = null;
		c[i].onclick = null;		
		d.removeChild(c[i]);
	}
					
	var p = d.parentNode;
	p.removeChild(d);	
	this.div_ = null;
	this.map_ = null;
	delete this.div_;
	delete this.map_;
}
JSmallMapControl = maps.SmallMapControl;

maps.LargeMapControl = function() {	
	this.map_ = null;
	this.div_ = null;
	this.position = new maps.ControlPosition(J_ANCHOR_TOPLEFT, new maps.Size(5,5));	
}
var F = function() {}
F.prototype = maps.Control.prototype;
maps.LargeMapControl.prototype = new F();
maps.LargeMapControl.constructor = maps.LargeMapControl;
maps.LargeMapControl.prototype.name = "LargeMapControl";
maps.LargeMapControl.prototype.initialize = function(map,pos) {
	this.map_ = map;
	var p = map.getContainer();
	var ctrl_pos = pos || this.position;
	
	// for ie6 
	// filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png', sizingMethod='scale');"
	//var bgImgIE6 = '"filter":"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + J_STATIC_IMG_URL + ''largemapcontrol.png', sizingMethod='scale');"';    
	
	var w_str = '"width":"76px"';   // Control Width 
	var h_str = '"height":"315px"';	// Control Height
	var bgImg = '"backgroundImage":"url(' + J_STATIC_IMG_URL + 'largemapcontrol.png)"';    
	
	var styles_str = '{' + ctrl_pos.anchorPosition() + ',' + w_str + ',' + h_str + ',' + bgImg + '}';	
	var style_obj = JSON.parse(styles_str);
	
	var d = new maps.Container(p, "LargeMapControl", style_obj);
	//d.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + J_STATIC_IMG_URL + "largemapcontrol.png', sizingMethod='scale');";
    //d.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src='"+J_TRANS_IMG+"';width:76px;height:315px;overflow:hidden;top:0px;left:0px;"
		
	var d_up = new maps.Container(d, "up", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"23px",height:"23px",top:"3px",left:"26px",cursor:"pointer"});
	var d_down = new maps.Container(d, "down", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"23px",height:"23px",top:"52px",left:"26px",cursor:"pointer"});
	var d_left = new maps.Container(d, "left", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"23px",height:"23px",top:"28px",left:"4px",cursor:"pointer"});
	var d_right = new maps.Container(d, "right", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"23px",height:"23px",top:"28px",left:"50px",cursor:"pointer"});
	var d_hand = new maps.Container(d, "hand", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"20px",height:"20px",top:"28px",left:"28px",cursor:"pointer"});
	
	var d_zoomin = new maps.Container(d, "zoomin", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"23px",height:"23px",top:"88px",left:"26px",cursor:"pointer"});
	var d_fishbone = new maps.Container(d, "fishbone", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"19px",height:"173px",top:"113px",left:"28px",cursor:"pointer"});
	var d_zoomout = new maps.Container(d, "zoomout", {position:"absolute",filter:"alpha(opacity=0.9999)",opacity:0.1,backgroundColor:"white",width:"23px",height:"23px",top:"288px",left:"26px",cursor:"pointer"});
	
	var top_y = 113;     						// top_slider 
	var bottom_y = 278;	 						// not used :D, bottom_slider
	var minY = 117;                             // top fishbone position from d (LargeMapControl DIV)
	var maxY = 282;                           	// not used :D, bottom fishbone positon from d (LargeMapControl DIV)                  
	var min_zoom = map.minZoom;                 // bottom zoom level 
	var max_zoom = map.maxZoom;                 // top zoom level  
	var tot_zoom = (max_zoom - min_zoom) + 1;   // total zoom level 
	var fishbone_distance = 11;                 // distance between nearest horizontal fishbone ,ex first fishbone and second fishbone
	var cur_level = map.getLevel();	
	var slider_y = top_y + ((max_zoom - cur_level) * fishbone_distance);	
	var d_slider = new maps.Container(d, "slider", {position:"absolute",left:"28px",top:slider_y+"px",width:"19px",height:"8px",cursor:"pointer",
		backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
		backgroundPosition:"-28px -316px"});	
	Drag.init(d_slider, null, 28, 28, 113, 278);
	
	var zoom_level = 0;	
	
	d_slider.onDragStart = function(x,y,e) {
		//console.log('start_y: ' + y);
	}
	d_slider.onDrag = function(x,y,e) {
		//console.log('drag y: ' + y);
	}
	d_slider.onDragEnd = function(x,y,e) {
		y -= top_y;
		var n = Math.round(y / fishbone_distance);		
		zoom_level = (tot_zoom-n);		
		var loc_y = (n * fishbone_distance) + top_y;		
		d_slider.style.top = loc_y + "px";
		map.setZoom(zoom_level);
	}
	
	d_fishbone.onclick = function(e) {		                
		var pos = dom.getMousePos(e);				// get mouse position from document
		var clicky = pos.y - p.offsetTop;           // mouse click y position minus map canvas container offsetTop		
		
		// trying minus others parent on top of map canvas container
		var op = p.offsetParent;                      
		while (op) {
			clicky = clicky - op.offsetTop;
			op = op.offsetParent;
		}
		// then minus this control offset from map canvas
		var clicky = clicky - d.offsetTop;
		
		var level = tot_zoom -  Math.round((clicky - minY) / fishbone_distance);			
		d_slider.style.top = ((max_zoom - level) * fishbone_distance)+ top_y + "px";		
		map.setZoom(level);	
	}

	var d_mouseover = new maps.Container(d, "mouseover_div", {left:"0px",top:"0px",display:"none"});
	
	if ((ctrl_pos.anchor == J_ANCHOR_TOPLEFT) || (ctrl_pos.anchor == J_ANCHOR_BOTTOMLEFT)) {
        //var tbar = new maps.Container(d,"box",{position:"absolute",overflow:"float",left:"54px",top:"122px",width:"48px",height:"165px",backgroundColor:"tranparent"});
        //var l1 = new maps.Container(tbar, "l1", {position:"absolute",left:"0px",top:"0px",width:"48px",height:"11px",cursor:"pointer",
		//	backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",backgroundPosition:"0px -390px"});		
        
		var d_green_infobar_street = new maps.Container(d_mouseover, "dris", {position:"absolute",left:"54px",top:"122px",width:"48px",height:"11px",cursor:"pointer",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -357px",zIndex:1});
		var d_green_infobar_city = new maps.Container(d_mouseover, "dric", {position:"absolute",left:"54px",top:"188px",width:"48px",height:"11px",cursor:"pointer",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -335px",zIndex:1});
		var d_green_infobar_state = new maps.Container(d_mouseover, "dril", {position:"absolute",left:"54px",top:"254px",width:"48px",height:"11px",cursor:"pointer",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -346px",zIndex:1});
		var d_green_infobar_nation = new maps.Container(d_mouseover, "drin", {position:"absolute",left:"54px",top:"276px",width:"48px",height:"11px",cursor:"pointer",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -324px",zIndex:1});	
		var lvl15_ausway = new maps.Container(d, "ausway level 15", {position:"absolute",left:"54px",top:"122px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});		
		var lvl14_ausway = new maps.Container(d, "ausway level 14", {position:"absolute",left:"54px",top:"133px",width:"48px",height:"11px",cursor:"pointer",display:"none",
            backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",            
            backgroundPosition:"0px -390px"});	
		var lvl13_ausway = new maps.Container(d, "ausway level 13", {position:"absolute",left:"54px",top:"144px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});
		var lvl12_ausway = new maps.Container(d, "ausway level 12", {position:"absolute",left:"54px",top:"155px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});	
		var lvl11_ausway = new maps.Container(d, "ausway level 11", {position:"absolute",left:"54px",top:"166px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});	
		var lvl10_ausway = new maps.Container(d, "ausway level 10", {position:"absolute",left:"54px",top:"177px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});	
		var lvl9_ausway = new maps.Container(d, "ausway level 9", {position:"absolute",left:"54px",top:"188px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});	
		var lvl8_ausway = new maps.Container(d, "ausway level 8", {position:"absolute",left:"54px",top:"199px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});	
		var lvl7_ausway = new maps.Container(d, "ausway level 7", {position:"absolute",left:"54px",top:"210px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});	
		var lvl6_ausway = new maps.Container(d, "ausway level 6", {position:"absolute",left:"54px",top:"221px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});        
        var lvl5_ausway = new maps.Container(d, "ausway level 5", {position:"absolute",left:"54px",top:"232px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});	
		var lvl4_ausway = new maps.Container(d, "ausway level 4", {position:"absolute",left:"54px",top:"243px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});	
		var lvl3_ausway = new maps.Container(d, "ausway level 3", {position:"absolute",left:"54px",top:"254px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"0px -390px"});	
	}
	
	if ((ctrl_pos.anchor == J_ANCHOR_TOPRIGHT) || (ctrl_pos.anchor == J_ANCHOR_BOTTOMRIGHT)) {
		var d_green_infobar_street = new maps.Container(d_mouseover, "dris", {position:"absolute",left:"-28px",top:"122px",width:"48px",height:"11px",cursor:"pointer",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -357px",zIndex:1});
		var d_green_infobar_city = new maps.Container(d_mouseover, "dric", {position:"absolute",left:"-28px",top:"188px",width:"48px",height:"11px",cursor:"pointer",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -335px",zIndex:1});
		var d_green_infobar_state = new maps.Container(d_mouseover, "dril", {position:"absolute",left:"-28px",top:"254px",width:"48px",height:"11px",cursor:"pointer",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -346px",zIndex:1});
		var d_green_infobar_nation = new maps.Container(d_mouseover, "drin", {position:"absolute",left:"-28px",top:"276px",width:"48px",height:"11px",cursor:"pointer",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -324px",zIndex:1});	
		var lvl15_ausway = new maps.Container(d, "ausway level 15", {position:"absolute",left:"-28px",top:"122px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});		
		var lvl14_ausway = new maps.Container(d, "ausway level 14", {position:"absolute",left:"-28px",top:"133px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});	
		var lvl13_ausway = new maps.Container(d, "ausway level 13", {position:"absolute",left:"-28px",top:"144px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});
		var lvl12_ausway = new maps.Container(d, "ausway level 12", {position:"absolute",left:"-28px",top:"155px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});
		var lvl11_ausway = new maps.Container(d, "ausway level 11", {position:"absolute",left:"-28px",top:"166px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});	
		var lvl10_ausway = new maps.Container(d, "ausway level 10", {position:"absolute",left:"-28px",top:"177px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});	
		var lvl9_ausway = new maps.Container(d, "ausway level 9", {position:"absolute",left:"-28px",top:"188px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});	
		var lvl8_ausway = new maps.Container(d, "ausway level 8", {position:"absolute",left:"-28px",top:"199px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});	
		var lvl7_ausway = new maps.Container(d, "ausway level 7", {position:"absolute",left:"-28px",top:"210px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});	
		var lvl6_ausway = new maps.Container(d, "ausway level 6", {position:"absolute",left:"-28px",top:"221px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});	
		var lvl5_ausway = new maps.Container(d, "ausway level 5", {position:"absolute",left:"-28px",top:"232px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});	
		var lvl4_ausway = new maps.Container(d, "ausway level 4", {position:"absolute",left:"-28px",top:"243px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});		
		var lvl3_ausway = new maps.Container(d, "ausway level 3", {position:"absolute",left:"-28px",top:"254px",width:"48px",height:"11px",cursor:"pointer",display:"none",
			backgroundImage:"url(" + J_STATIC_IMG_URL + "largemapcontrol.png)",
			backgroundPosition:"49px -390px"});	
	}	
			
	d_fishbone.onmouseover = function() {
		d_mouseover.style.display = "block";		
	}
	d_fishbone.onmouseout = function() {
		d_mouseover.style.display = "none";		
	}	
	d_slider.onmouseover = d_fishbone.onmouseover;
	d_slider.onmouseout = d_fishbone.onmouseout
	
	
	d_up.onclick = function() { map.panBy(new maps.Point(0, map.getMapSize().h / 2)); };
	d_down.onclick = function() { map.panBy(new maps.Point(0,-map.getMapSize().h / 2)); };
	d_left.onclick = function() { map.panBy(new maps.Point(map.getMapSize().w / 2,0)); };
	d_right.onclick = function() { map.panBy(new maps.Point(-map.getMapSize().w / 2,0)); };
	d_zoomin.onclick = function() { map.zoomIn() }
	d_zoomout.onclick = function() { map.zoomOut() }
	
	d_up.ondblclick = d_up.onclick;
	d_down.ondblclick = d_down.onclick;
	d_left.ondblclick = d_left.onclick;
	d_right.ondblclick = d_right.onclick;
	d_zoomin.ondblclick = d_zoomin.onclick;
	d_zoomout.ondblclick = d_zoomout.onclick;

	var toggle = true;
    var tc = map.getTileContainer();
    var len = tc.items.length;    
    if ((len==1) && (tc.items[0].maptype == J_PSMA_MAP)) {
        toggle = !toggle;
        toggle_normal();
    }
    if ((len==2) && (tc.items[1].maptype == J_PSMA_MAP)) {
        toggle = !toggle;
        toggle_normal();        
    }
	
	function toggle_ausway() {
        for (var i=map.getTileContainer().items.length;i>=1;i--) 				
            map.removeOverlay(map.getTileContainer().items[i-1]);
        
        var ui = map.getDefaultUI();
        if (ui.maptypes.streetview)  map.addOverlay(new maps.TileMap(J_STREETVIEW_MAP));
        map.addOverlay(new maps.TileMap(J_AUSWAY_MAP));

        if ((ctrl_pos.anchor == J_ANCHOR_TOPLEFT) || (ctrl_pos.anchor == J_ANCHOR_BOTTOMLEFT))  {		
			lvl3_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl3_ausway.style.backgroundPosition = "0px -390px";
			
			lvl4_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl4_ausway.style.backgroundPosition = "0px -390px";
			
			lvl5_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl5_ausway.style.backgroundPosition = "0px -390px";
			
			lvl6_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl6_ausway.style.backgroundPosition = "0px -390px";
			
			lvl7_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl7_ausway.style.backgroundPosition = "0px -390px";
			
			lvl8_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl8_ausway.style.backgroundPosition = "0px -390px";
			
			lvl9_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl9_ausway.style.backgroundPosition = "0px -390px";
			
			lvl10_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl10_ausway.style.backgroundPosition = "0px -390px";
			
			lvl11_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl11_ausway.style.backgroundPosition = "0px -390px";
			
			lvl12_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl12_ausway.style.backgroundPosition = "0px -390px";		
			
			lvl13_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl13_ausway.style.backgroundPosition = "0px -390px";
			
			lvl14_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl14_ausway.style.backgroundPosition = "0px -390px";
			
			lvl15_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl15_ausway.style.backgroundPosition = "0px -390px";
		} else {
			lvl3_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl3_ausway.style.backgroundPosition = "49px -390px";		
			
			lvl4_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl4_ausway.style.backgroundPosition = "49px -390px";		
			
			lvl5_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl5_ausway.style.backgroundPosition = "49px -390px";		
			
			lvl6_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl6_ausway.style.backgroundPosition = "49px -390px";		
			
			lvl7_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl7_ausway.style.backgroundPosition = "49px -390px";		
			
			lvl8_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl8_ausway.style.backgroundPosition = "49px -390px";		
			
			lvl9_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl9_ausway.style.backgroundPosition = "49px -390px";		
			
			lvl10_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl10_ausway.style.backgroundPosition = "49px -390px";		
			
			lvl11_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl11_ausway.style.backgroundPosition = "49px -390px";		
			
			lvl12_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl12_ausway.style.backgroundPosition = "49px -390px";		
			
			lvl13_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl13_ausway.style.backgroundPosition = "49px -390px";
			
			lvl14_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl14_ausway.style.backgroundPosition = "49px -390px";
			
			lvl15_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl15_ausway.style.backgroundPosition = "49px -390px";
		}
	}
	
	function toggle_normal() {
        for (var i=map.getTileContainer().items.length;i>=1;i--) 				
            map.removeOverlay(map.getTileContainer().items[i-1]);
            
        // add SV TileMap first
        var ui = map.getDefaultUI();
        if (ui.maptypes.streetview)  map.addOverlay(new maps.TileMap(J_STREETVIEW_MAP));
        map.addOverlay(new maps.TileMap(J_PSMA_MAP));

        if ((ctrl_pos.anchor == J_ANCHOR_TOPLEFT) || (ctrl_pos.anchor == J_ANCHOR_BOTTOMLEFT))  {
			lvl3_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl3_ausway.style.backgroundPosition = "0px -379px";
			
			lvl4_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl4_ausway.style.backgroundPosition = "0px -379px";
			
			lvl5_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl5_ausway.style.backgroundPosition = "0px -379px";
			
			lvl6_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl6_ausway.style.backgroundPosition = "0px -379px";

			lvl7_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl7_ausway.style.backgroundPosition = "0px -379px";
			
			lvl8_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl8_ausway.style.backgroundPosition = "0px -379px";
			
			lvl9_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl9_ausway.style.backgroundPosition = "0px -379px";
			
			lvl10_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl10_ausway.style.backgroundPosition = "0px -379px";
			
			lvl11_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl11_ausway.style.backgroundPosition = "0px -379px";
			
			lvl12_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl12_ausway.style.backgroundPosition = "0px -379px";
			
			lvl13_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl13_ausway.style.backgroundPosition = "0px -379px";
			
			lvl14_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl14_ausway.style.backgroundPosition = "0px -379px";
			
			lvl15_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl15_ausway.style.backgroundPosition = "0px -379px";
		} else {
			lvl3_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl3_ausway.style.backgroundPosition = "49px -379px";
			
			lvl4_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl4_ausway.style.backgroundPosition = "49px -379px";
			
			lvl5_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl5_ausway.style.backgroundPosition = "49px -379px";
			
			lvl6_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl6_ausway.style.backgroundPosition = "49px -379px";
			
			lvl7_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl7_ausway.style.backgroundPosition = "49px -379px";
			
			lvl8_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl8_ausway.style.backgroundPosition = "49px -379px";
			
			lvl9_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl9_ausway.style.backgroundPosition = "49px -379px";
			
			lvl10_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl10_ausway.style.backgroundPosition = "49px -379px";
			
			lvl11_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl11_ausway.style.backgroundPosition = "49px -379px";
			
			lvl12_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl12_ausway.style.backgroundPosition = "49px -379px";
			
			lvl13_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl13_ausway.style.backgroundPosition = "49px -379px";
			
			lvl14_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl14_ausway.style.backgroundPosition = "49px -379px";		
			
			lvl15_ausway.style.backgroundImage = "url(" + J_STATIC_IMG_URL + "largemapcontrol.png)";
			lvl15_ausway.style.backgroundPosition = "49px -379px";			
		}
	}
	
	lvl3_ausway.onclick = function() {
		map.setZoom(3);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 3)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl4_ausway.onclick = function() {
		map.setZoom(4);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 4)) + "px";
		toggle = !toggle;        
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl5_ausway.onclick = function() {
		map.setZoom(5);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 5)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl6_ausway.onclick = function() {
		map.setZoom(6);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 6)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl7_ausway.onclick = function() {
		map.setZoom(7);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 7)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl8_ausway.onclick = function() {
		map.setZoom(8);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 8)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl9_ausway.onclick = function() {
		map.setZoom(9);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 9)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl10_ausway.onclick = function() {
		map.setZoom(10);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 10)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl11_ausway.onclick = function() {
		map.setZoom(11);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 11)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl12_ausway.onclick = function() {
		map.setZoom(12);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 12)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl13_ausway.onclick = function() {
		map.setZoom(13);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 13)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl14_ausway.onclick = function() {
		map.setZoom(14);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 14)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	lvl15_ausway.onclick = function() {
		map.setZoom(15);
		d_slider.style.top = top_y + (fishbone_distance * (max_zoom - 15)) + "px";
		toggle = !toggle;
		if (toggle) toggle_ausway(); else toggle_normal();
	}
	
	// global event function for LargeMapControl
	// define as global function for reference on remove event
	lmc_event = function () {	  
		var mr = map.getMapRef();	  
		if (mr.lvl_3_4) {
			lvl3_ausway.style.display = "block";
			lvl4_ausway.style.display = "block";
		} else {
			lvl3_ausway.style.display = "none";
			lvl4_ausway.style.display = "none";
		}
		if (mr.lvl_5) {
			lvl5_ausway.style.display = "block";			
		} else {
			lvl5_ausway.style.display = "none";			
		}
		if (mr.lvl_6) {		
			lvl6_ausway.style.display = "block";
		} else {		
			lvl6_ausway.style.display = "none";	
		}
		if (mr.lvl_7) {
			lvl7_ausway.style.display = "block";
		} else {
			lvl7_ausway.style.display = "none";
		}
		if (mr.lvl_8) {
			lvl8_ausway.style.display = "block";
		} else {
			lvl8_ausway.style.display = "none";	
		}
		if (mr.lvl_9) {
			lvl9_ausway.style.display = "block";		
		} else {
			lvl9_ausway.style.display = "none";		
		}
		if (mr.lvl_10) {			
			lvl10_ausway.style.display = "block";
		} else {			
			lvl10_ausway.style.display = "none";	
		}
		if (mr.lvl_11) {
			lvl11_ausway.style.display = "block";
		} else {
			lvl11_ausway.style.display = "none";
		}
		if (mr.lvl_12_13) {
			lvl12_ausway.style.display = "block";
			lvl13_ausway.style.display = "block";
		} else {
			lvl12_ausway.style.display = "none";
			lvl13_ausway.style.display = "none";
		}
		if (mr.lvl_14) {
			lvl14_ausway.style.display = "block";
		} else {
			lvl14_ausway.style.display = "none";	
		}			
		if (mr.lvl_15) {
			lvl15_ausway.style.display = "block";
		} else {
			lvl15_ausway.style.display = "none";	
		}	  
    }
    
    // keep update slidebar zoom level display when people zoom using other function    
    map.EventEx.addListener(map,'zoomend', function(e, args) {
		var oldlevel = args[0];
		var newlevel = args[1];		
		slider_y = top_y + ((max_zoom - newlevel) * fishbone_distance);
		d_slider.style.top = slider_y + "px";
	});
	 
	
	// Register lmc function on onMapRef event
	map.EventEx.addListener(map.getMapRef(),'onMapRef', lmc_event);	
	lmc_event();
	this.div_ = d;
}
maps.LargeMapControl.prototype.remove = function() {
	var d = this.div_;	
	var c = d.childNodes;
	for (var i=0; i < c.length; i++) {
		c[i].dblclick = null;
		c[i].onclick = null;	
		c[i].onmouseover = null;
		c[i].onmouseout = null;
		c[i].onDragStart = null;
		c[i].onDrag = null;
		c[i].onDragEnd = null; 	
		d.removeChild(c[i]);
	}
					
	var p = d.parentNode;
	p.removeChild(d);	
	
	this.map_.EventEx.removeListener(this.map_.getMapRef(), 'onMapRef', lmc_event);
	
	this.div_ = null;
	this.map_ = null;
	delete this.div_;
	delete this.map_;	
}
JLargeMapControl = maps.LargeMapControl;

maps.CopyrightControl = function() {
	this.map_ = null;
	this.divLogo_ = null;
	this.divText_ = null;
	this.position = new maps.ControlPosition(J_ANCHOR_BOTTOMLEFT, new maps.Size(2,2));
}
var F = function() {};
F.prototype = maps.Control.prototype;
maps.CopyrightControl.prototype = new F();
maps.CopyrightControl.constructor = maps.CopyrightControl;
maps.CopyrightControl.prototype.name = "CopyrightControl";
maps.CopyrightControl.prototype.initialize = function(map,pos) {
	this.map_ = map;	
	var p = map.getContainer();
	var ctrl_pos = pos || this.position;

	var styles_str = '{' + ctrl_pos.anchorPosition() + ',"width":"30px","height":"30px"' + '}';
	var style_obj = JSON.parse(styles_str);
	
	var d1 = new maps.Container(p, "Logo", style_obj);
	var lnk = dom.ce('A');
	lnk.href = "http://www.street-directory.com.au/";
	lnk.target = "_blank";
	dom.ac(d1,lnk);
		
	var d2 = new maps.Container(p, "Powered", {position:"absolute",left:"32px",bottom:"2px",fontSize:"11px",fontFamily:"Arial,Georgia,San Seriff",cursor:"default"});	
	var img = new maps.Image(lnk,"Logo",{border:"0",width:"30px",height:"30px",cursor:"pointer",MozUserSelect:"none"},{src:J_COPYRIGHT_IMG});	
	var span1 = dom.ce('SPAN');		
	var txt1 = dom.ct(" " + String.fromCharCode(169) + "2010 Streetdirectory.com.au");	
	dom.ac(d2,span1);	
	dom.ac(span1,txt1);	
	this.divLogo_ = d1;
	this.divText_ = d2;
}
maps.CopyrightControl.prototype.remove = function(map,pos) {
	var d1 = this.divLogo_;
	var d2 = this.divText_;
	var p = d1.parentNode;
	p.removeChild(d1);
	var p = d2.parentNode;
	p.removeChild(d2);
	this.divLogo_ = null;
	this.divText_ = null;
	this.map_ = null;
}
JCopyrightControl = maps.CopyrightControl;

maps.MapReferenceControl = function() {	
	this.map_ = null;
	this.div_ = null;
	this.position = new maps.ControlPosition(J_ANCHOR_BOTTOMRIGHT, new maps.Size(0,0));
}
var F = function() {};
F.prototype = maps.Control.prototype;
maps.MapReferenceControl.prototype = new F();
maps.MapReferenceControl.constructor = maps.MapReferenceControl;
maps.MapReferenceControl.prototype.name = "MapReferenceControl";
maps.MapReferenceControl.prototype.initialize = function(map,pos) {
	this.map_ = map;	
	var p = map.getContainer();
	var ctrl_pos = pos || this.position;
	var mapRef = map.getMapRef();
    // Prevent 404 file not found on first time loading, because MapJS initialize is slow then WSGI request
    if (mapRef.icon == undefined) mapRef.icon = "transparent.png";
    // Prevent undefined show on Grid becuase Map Object not yet get Center LongLat
    if (mapRef.grid == undefined) mapRef.grid = "";
	var lblScale =  map.getScaleLabel();
    var level = map.getLevel();
	var styles_str = '{' + ctrl_pos.anchorPosition() + ',"backgroundColor":"rgb(224,224,224)","borderTop":"1px solid rgb(255,255,255)","borderLeft":"1px solid rgb(255,255,255)","opacity":"0.8","filter":"alpha(opacity=80)","width":"210px","height":"24px","cursor":"default"' + '}';
	var style_obj = JSON.parse(styles_str);
	
	var d = new maps.Container(p, "MapReferenceControl", style_obj);
	var mr = new maps.Container(d, "MapReference", {position:"absolute",padding:"0px",margin:"0px",bottom:"2px",right:"2px",width:"125px",height:"21px",font:"800 10px verdana",whiteSpace:"nowrap",textAlign:"center",top:"1px"});
	mr.title = mapRef.tip;
	var mr_img = new maps.Image(mr, "MapReference Image", {position:"absolute",top:"2px",left:"0px",width:"auto",height:"auto"},{src:J_STATIC_IMG_URL+mapRef.icon});
	var mr_num = new maps.Container(mr, "MapReference Number", {position:"absolute",right:"0px",width:"62px",height:"21px",whiteSpace:"normal",verticalAlign:"center",fontSize:"8px",color:"red",fontWeight:"bold"});

    if (mapRef.grid.length < 10) { mr_num.style.top = "20%"; mr_num.style.fontSize = "10px"; }
    else if (mapRef.grid.length > 25) { mr.style.top = "1px"; mr_num.style.fontSize = "7px"; }
    else { mr_num.style.top = "1px"; mr_num.style.fontSize = "8px"; }

    var mr_txt = dom.ct(mapRef.grid);
	dom.ac(mr_num,mr_txt);
	
	var scale_img = new maps.Image(d, "Scale Image", {position:"absolute",bottom:"3px",left:"5px",border:"0px none"}, {src:J_STATIC_IMG_URL+"dimholder.gif"});
	var ms = new maps.Container(d, "Map Scale", {position:"absolute",padding:"0px",margin:"0px",left:"9px",top:"4px",width:"63px",height:"13px",color:"black",font:"900 10px verdana",whiteSpace:"nowrap",textAlign:"center"});
	ms.title = "Map Scale";
	var ms_txt = dom.ct(lblScale)
	dom.ac(ms, ms_txt);
		
	// Register function on zoomed means level change	
	map.EventEx.addListener(map,'zoomend', function(e, args) {
		level = map.getLevel();
		lblScale = map.getScaleLabel();
		ms.innerHTML = lblScale;
	});
	 	
	// Register lmc function on onMapRef event
	map.EventEx.addListener(map.getMapRef(),'onMapRef', function() {
		mapRef = map.getMapRef();		
		var grid = "";
        if (mapRef.grid != "") grid = mapRef.grid;	
        /**
        Old code, that only update MapRef when in melway level coverage
        switch (level) {
			case  1: grid = ""; break;
			case  2: grid = ""; break;
			case  3: if (mapRef.lvl_3_4) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case  4: if (mapRef.lvl_3_4) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case  5: if (mapRef.lvl_5) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case  6: if (mapRef.lvl_6) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case  7: if (mapRef.lvl_7) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case  8: if (mapRef.lvl_8) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case  9: if (mapRef.lvl_9) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case 10: if (mapRef.lvl_10) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case 11: if (mapRef.lvl_11) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case 12: if (mapRef.lvl_12_13) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case 13: if (mapRef.lvl_12_13) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case 14: if (mapRef.lvl_14) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case 15: if (mapRef.lvl_15) { grid = mapRef.grid; break; } else { grid = ""; break; }
			case 16: grid = ""; break;
		}
        **/ 
		
		if (grid != "") {
			mr.title = mapRef.tip;			
			mr_img.src = J_STATIC_IMG_URL + mapRef.icon;
            if (mapRef.grid.length < 10) { mr_num.style.top = "20%"; mr_num.style.fontSize = "10px"; }
            else if (mapRef.grid.length > 25) { mr.style.top = "1px"; mr_num.style.fontSize = "7px"; }
            else { mr_num.style.top = "1px"; mr_num.style.fontSize = "8px"; }
			mr_num.innerHTML = mapRef.grid;		
		} else {
			mr.title = "PSMA Map";
			mr_img.src = J_STATIC_IMG_URL + "psma-limited.gif";
			mr_num.innerHTML = "";
		}		
	});		
	
    this.div_ = d;	
}
maps.MapReferenceControl.prototype.remove = function(map,pos) {
}
JMapReferenceControl = maps.MapReferenceControl;

maps.MagnifyingControl = function() {
	this.map_ = null;
	this.div_ = null;
    this.zoom_= 0;    
}
var F = function() {};
F.prototype = maps.Control.prototype;
maps.MagnifyingControl.prototype = new F();
maps.MagnifyingControl.constructor = maps.MagnifyingControl;
maps.MagnifyingControl.prototype.name = "CopyrightControl";
maps.MagnifyingControl.prototype.initialize = function(map) {
    this.map_ = map;
    var p = map.getContainer();

    //, width:"39px",height:"26px",,, visibility:"hidden",border:"medium none"
    var magnify = new maps.Container(p, "magnifying", {position:"absolute",left:"300px", top:"300px", width:"130px", height:"100px", visibility:"hidden", border:"medium none",  MozUserSelect:"none", zIndex:0});
    var tl_corner = new maps.Container(magnify, 'tl_corner', {position:"absolute", left:"0px",top:"0px", width:"6px", height:"4px", lineHeight:"1px",fontSize:"1px",borderWidth:"2px 0px 0px 2px",borderStyle:"solid none none solid",borderColor:"#FF0000 transparent transparent #FF0000"});
    var tr_corner = new maps.Container(magnify, 'tr_corner', {position:"absolute", right:"0px",top:"0px", width:"6px", height:"4px", lineHeight:"1px",fontSize:"1px",borderWidth:"2px 2px 0px 0px",borderStyle:"solid solid none none",borderColor:"#FF0000 #FF0000 transparent transparent"});    
    var bl_corner = new maps.Container(magnify, 'bl_corner', {position:"absolute", left:"0px",bottom:"0px", width:"6px", height:"4px", lineHeight:"1px",fontSize:"1px",borderWidth:"0px 0px 2px 2px",borderStyle:"none none solid solid",borderColor:"transparent transparent #FF0000 #FF0000"});
    var br_corner = new maps.Container(magnify, 'br_corner', {position:"absolute", right:"0px",bottom:"0px", width:"6px", height:"4px", lineHeight:"1px",fontSize:"1px",borderWidth:"0px 2px 2px 0px",borderStyle:"none solid solid none",borderColor:"transparent #FF0000 #FF0000 transparent"});
    this.div_ = magnify;
}
maps.MagnifyingControl.prototype.animate = function(pt,n) {
    var magnify = this.div_;    
    var corner = magnify.childNodes;
    var tl = corner[0];
    var tr = corner[1];
    var bl = corner[2];
    var br = corner[3];
    var handle = null;    
    
    magnify.style.visibility = "visible";
    
    function swap(o1, o2) {
        var tmpBorderWidth = o1.style.borderWidth;
        var tmpBorderStyle = o1.style.borderStyle;
        var tmpBorderColor = o1.style.borderColor;
        
        o1.style.borderWidth = o2.style.borderWidth;
        o1.style.borderStyle = o2.style.borderStyle;
        o1.style.borderColor = o2.style.borderColor;
        o2.style.borderWidth = tmpBorderWidth;
        o2.style.borderStyle = tmpBorderStyle;
        o2.style.borderColor = tmpBorderColor;
    }

    if (n == 1) { // zoom out
        // setting magnify    
        magnify.style.width   = "130px";
        magnify.style.height  = "100px";
        magnify.style.top     = pt.y - Math.round(100 / 2) + "px";
        magnify.style.left    = pt.x - Math.round(130 / 2) + "px";        
        // setting corner
        if (n != this.zoom_) {
            swap(tl,br);
            swap(tr,bl);
            this.zoom_ = n;
        }        
        
    }

    if (n == 0) { // zoom in
        // setting magnify
        magnify.style.width   = "50px";
        magnify.style.height  = "20px";
        magnify.style.top     = pt.y - Math.round(20 / 2) + "px";
        magnify.style.left    = pt.x - Math.round(50 / 2) + "px";
        // setting corner
        if (n != this.zoom_) {
            swap(tl,br);
            swap(tr,bl);
            this.zoom_ = n;
        }
    }
    
    function anim() {
        if (n == 1) { // zoom out
            magnify.style.top = parseInt(magnify.style.top) + 5 + "px";
            magnify.style.left = parseInt(magnify.style.left) + 5 + "px";
            magnify.style.width = parseInt(magnify.style.width) - 10 + "px";
            magnify.style.height= parseInt(magnify.style.height) - 10 + "px";
            if (parseInt(magnify.style.width) <= 50) {
                clearInterval(handle);
                magnify.style.visibility = "hidden";
            }
        }
        if (n == 0) { // zoom in
            magnify.style.top = parseInt(magnify.style.top) - 5 + "px";
            magnify.style.left = parseInt(magnify.style.left) - 5 + "px";
            magnify.style.width = parseInt(magnify.style.width) + 10 + "px";
            magnify.style.height= parseInt(magnify.style.height) + 10 + "px";
            if (parseInt(magnify.style.width) >= 130) {
                clearInterval(handle);
                magnify.style.visibility = "hidden";
            }
        }
    }    
    handle = setInterval(anim, 50);
}
maps.MagnifyingControl.prototype.remove = function() {}
JMagnifyingControl = maps.MagnifyingControl;


// Global CONSTANTA Internal Variable, only could access via local JS
var J_TILE_SIZE_DEF = [0,200,200,200,200,200,200,200,200,200,200,200,200,200,200,300,400];
var J_MAP_WIDTH_DEF = [0,525,1050,2115,4230,8460,16925,33850,67700,135405,270810,541620,1083239,2166478,4334014,8668028,15720475];
var J_SCALE_LABEL_DEF = ['0', '614.4 KM', '307.2 KM', '153.6 KM', '76.8 KM', '38.4 KM', '19.2 KM', '9.6 KM', '4.8 KM', '2.4 KM', '1.2 KM', '600M', '300M', '150M', '75M', '37.5M', '18.75M'];
var J_PRECALC_SCALE_DEF = [0,9.541696233,19.083392466,38.439404824,76.878809647,153.757619295,307.606111887,615.212223773,1230.424447547,2460.939768391,4921.879536783,9843.759073565,19687.499972471,39374.999944942,78769.228679626,157538.457359252,285714.280163225];
var J_MIN_ZOOM_DEF = 1;
var J_MAX_ZOOM_DEF = 14;
var J_COORD_SYS_DEF = new maps.LonLatBounds(new maps.LonLat(106.720409792149,-8.75833753905317), new maps.LonLat(161.742073361529,-44.7196259244811)); // Boundary Entire Australia


function getTileImg(type,col,row,lvl) {
    // versi Javascript direct url to filename
    /*
	if (type == J_TRANS_MAP) return J_TRANS_IMG;
	var c = encodeNum(col);
	var r = encodeNum(row);
	var l = encodeNum(lvl);	
	return J_TILE_IMG_URL[type] + l + "/" + r + "/" + c + ".png";
    */

    // Modified WSGI Services for sdtile to use multi subdomain for online
    if (J_ONLINE_STATE) {
        if (((col+row)%2) == 0) 
            J_MULTI_SUBDOMAIN_WSGI_URL = 'http://m0.street-directory.com.au/wsgi/';
        else 
            J_MULTI_SUBDOMAIN_WSGI_URL = 'http://m1.street-directory.com.au/wsgi/';
    } else {
        J_MULTI_SUBDOMAIN_WSGI_URL = J_WSGI_URL;
    }
    
    
    // versi WSGI
    if ((row <= 0) || (col <= 0)) return J_WATER_IMG;
    if (type == J_TRANS_MAP)
      return J_TRANS_IMG;
    else if (type == J_PSMA_MAP)
      return J_MULTI_SUBDOMAIN_WSGI_URL + "sdtile/gettile?l="+lvl+"&r="+row+"&c="+col+"&t=psma&s=Intimap";
    else if (type == J_AUSWAY_MAP)
      return J_MULTI_SUBDOMAIN_WSGI_URL + "sdtile/gettile?l="+lvl+"&r="+row+"&c="+col+"&t=ausway&s=Intimap";
    else if (type == J_STREETVIEW_MAP)
      return J_MULTI_SUBDOMAIN_WSGI_URL + "sdtile/gettile?l="+lvl+"&r="+row+"&c="+col+"&t=sv&s=Intimap";
    else if (type == J_SATELLITE_MAP)
      return J_MULTI_SUBDOMAIN_WSGI_URL + "sdtile/gettile?l="+lvl+"&r="+row+"&c="+col+"&t=sat&s=Intimap";
    
    
    //versi PHP
    /*    
    if (type == J_TRANS_MAP)
      return J_TRANS_IMG;
    else if (type == J_PSMA_MAP)
      return "http://192.168.0.15/map/map_tile.php?level="+lvl+"&row="+row+"&col="+col+"&type=psma";
    else if (type == J_AUSWAY_MAP)
      return "http://192.168.0.15/map/map_tile.php?level="+lvl+"&row="+row+"&col="+col;
    else if (type == J_STREETVIEW_MAP)
      return "http://192.168.0.15/map/map_tile.php?level="+lvl+"&row="+row+"&col="+col+"&type=sv";
    else if (type == J_SATELLITE_MAP)
      return "http://192.168.0.15/map/map_tile.php?level="+lvl+"&row="+row+"&col="+col+"&type=sat";
    */
}
    
function encodeNum(iNum, encodeStr) {
	var magicStr = null;
	if (!encodeStr) 
		magicStr = J_MAGIC_STR[1];
	else if (encodeStr==0)
		magicStr = J_MAGIC_STR[0];
	else if (encodeStr==1)
		magicStr = J_MAGIC_STR[1];
	var sNum = iNum.toString();
	var res = "";
	for (var i=0; i<sNum.length ; i++)
	  res += magicStr.charAt(sNum.charAt(i)*1);
	return res;
}
    
function createTileImg(p,c,r,l,t,s,src) {
	var imgCnt = p.imgs.length == 0 ? 0 : p.imgs.length;
	p.imgs[imgCnt] = new maps.Image(p,c+'_'+r,{left:l+"px",top:t+"px",width:s+"px",height:s+"px",position:"absolute",border:"0px none",padding:"0px",margin:"0px",MozUserSelect:"none"});
	p.imgs[imgCnt].src = src;
	p.imgs[imgCnt].col_num = c;
	p.imgs[imgCnt].row_num = r;	
	return p.imgs[imgCnt];
}

function createOnWaitAndErrorEvt(tileImg, c, r, level) {
	tileImg.onerror = function() { this.src = J_TRANS_IMG; }	
}

function createOnErrorEvt(tileImg, maptype, c, r, level) {
	switch(maptype) {
		case J_TRANS_MAP:
		case J_STREETVIEW_MAP:
		case J_SATELLITE_MAP: 
			tileImg.onerror = function() { this.src = J_TRANS_IMG; } 
			break;
		case J_PSMA_MAP: 
			tileImg.onerror = function() { this.src = J_WATER_IMG; }
			break;
		case J_AUSWAY_MAP:
			var psma_tile_img = getTileImg(J_PSMA_MAP, c, r, level);
			tileImg.onerror = function() { 
				this.src = psma_tile_img; 
				this.onerror = function() { this.src = J_WATER_IMG; }
			}
			break;
		default:
			tileImg.onerror = function() { this.src = J_TRANS_IMG; }
			break;
	}
}
	
maps.MapOptions = {
	size : new maps.Size(400,300),
	mapTypes : J_DEFAULT_MAP_TYPES,
	draggableCursor : J_OPENHAND_CUR,
	draggingCursor : J_CLOSEHAND_CUR,
	sdBarOptions : null, // for reserve , not defined yet
	backgroundColor : "#E5E3DF" // rgb(229, 227, 223)
}
JMapOptions = maps.MapOptions;

// Inheritance utility function: extend, extend2, extendCopy, deepCopy
function extend(Child, Parent) {
	var F = function() {};
	F.prototype = Parent.prototype;
	Child.prototype = new F();
	Child.prototype.constructor = Child;
	Child.uber = Parent.prototype;	
}

function extend2(Child, Parent) {
	var p = Parent.prototype;
	var c = Child.prototype;
	for (var i in p) {
		c[i] = p[i];
	}
	c.uber = p;
}

function extendCopy(p) {
	var c = {};
	for (var i in p) {
		c[i] = p[i];
	}
	c.uber = p;
	return c;
}

function deepCopy(p, c) {
	var c = c || {};
	for (var i in p) {
		if (typeof p[i] === 'object') {
			c[i] = (p[i].constructor === Array) ? [] : {};
			deepCopy(p[i], c[i]);
		} else {
			c[i] = p[i];
		}
	}
	return c;
}

maps.Overlay = function() {
	//this.div_ = null; // root div overlay
	this.name = "overlay";
	this.initialize = function(map) {}
	this.remove = function() {
		this.parent.removeChild(this);		
	}
	this.copy = function() {}
	this.redraw = function(force) {}
	this.hide = function() {}
	this.show = function() {}
}
JOverlay = maps.Overlay;

maps.Layer = function(id,description) {
   this.id = id || null;
   this.id_ = null;   
   this.description = description || null;
   this.map_ = null;
   this.div_ = new maps.Container(null, this.description, {position:'absolute', left:'0px', top:'0px', zIndex:0});
}
var F = function() {};
F.prototype = maps.Overlay.prototype;
maps.Layer.prototype = new F();
maps.Layer.constructor = maps.Layer;
maps.Layer.prototype.name = 'Layer';
maps.Layer.prototype.initialize = function(map) {
	this.map_ = map;	
	this.id_ = map.getLayerCounter();
	
	var layerTileContainer = this.div_;	
	var mapSize = map.getMapSize();
	var tileSize = map.getTileSize();
	var level = map.getLevel();	
	var buffer = 2;
	var centerPt = map.getCenterPt();
	var bounds = map.getBounds();
	var boundstr = bounds.tl.toShortStr(' ') + ' ' + bounds.br.toShortStr(' ');
	var sessionid = 'xyz123';
	
	var layer = '';	
	if ((this.id & 1) == 1) layer = 'wineries'; 
	if ((this.id & 2) == 2) if (layer.length == 0) layer = 'propertyrent'; else layer += ' propertyrent'; 
	if ((this.id & 4) == 4) if (layer.length == 0) layer = 'propertysale'; else layer += ' propertysale';
	if ((this.id & 8) == 8) if (layer.length == 0) layer = 'panorama'; else layer += ' panorama';
	if ((this.id & 16) == 16) if (layer.length == 0) layer = 'photo'; else layer += ' photo';
	if ((this.id & 32) == 32) if (layer.length == 0) layer = 'streetview'; else layer += ' streetview';
	if ((this.id & 64) == 64) if (layer.length == 0) layer = 'shopview'; else layer += ' shopview';
	if ((this.id & 128) == 128) if (layer.length == 0) layer = 'accommodation'; else layer += ' accommodation';	
	
	
	if (!this.description) this.description = layer;	
	layerTileContainer.id = this.description;	
	
	// prepare JSON to request generate layer tile
	JSONP.request( J_WSGI_URL + 'sdmap/gentilemap', {
		  callbackKey: 'jsoncallback',
		  params: { sessionid: sessionid, layer: layer, bounds: boundstr, level: level },
		  callback: function(obj) { draw(); }
	});
	
	function draw() {
		var x = parseInt(map.getTileContainer().style.left);
		var y = parseInt(map.getTileContainer().style.top);
			
		var tileRows = Math.ceil(mapSize.h / tileSize) + buffer;
		var tileCols = Math.ceil(mapSize.w / tileSize) + buffer;
		var tileSquares = (tileRows > tileCols) ? tileRows : tileCols;
		
		var r = Math.ceil(centerPt.y / tileSize);
		var c = Math.ceil(centerPt.x / tileSize);
		var r_offset = Math.round(centerPt.y % tileSize);
		var c_offset = Math.round(centerPt.x % tileSize);
		
		var j = 0;
		var sign = 1;
		var coord = "x";
		var iTop = 0;
		var iLeft = 0;	
		
		var viewPortCtr= new maps.Point(Math.round(mapSize.w / 2), Math.round(mapSize.h/2));
		iTop = viewPortCtr.y - r_offset;
		iLeft = viewPortCtr.x - c_offset;
		
		iTop -= y;
		iLeft -= x;
		
		var layerContainer = map.getLayerContainer();
		dom.ac(layerContainer, layerTileContainer);		
		layerTileContainer.imgs = [];
		
		var tilename = J_GENTILE_URL + sessionid + '/c' + c + 'r' + r + '.png?' + Math.random(1000000) * 1000000;	
		var tileImg = createTileImg(layerTileContainer,c,r,iLeft,iTop,tileSize,tilename);	
		createOnErrorEvt(tileImg, 0, c, r, level);

		while (j < tileSquares) {
			j += 1;           
			for (var k=1; k<=j; k++) {        
				if (j == tileSquares && j==k) break;      
				if (sign == 1) {
					c += 1; 
					iLeft += tileSize;					
					var tilename = J_GENTILE_URL + sessionid + '/c' + c + 'r' + r + '.png?' + Math.random(1000000) * 1000000;
					tileImg = createTileImg(layerTileContainer,c,r,iLeft,iTop,tileSize,tilename);
					createOnErrorEvt(tileImg, 0, c, r, level);
				} else { 
					c -= 1; 
					iLeft -= tileSize;					
					var tilename = J_GENTILE_URL + sessionid + '/c' + c + 'r' + r + '.png?' + Math.random(1000000) * 1000000;
					tileImg = createTileImg(layerTileContainer,c,r,iLeft,iTop,tileSize,tilename);
					createOnErrorEvt(tileImg, 0, c, r, level);
				}
			}                      
			if (j == tileSquares) break;                             
			for (var k=1; k<=j; k++) {
				if (sign == 1) { 
					r += 1; 
					iTop += tileSize;					
					var tilename = J_GENTILE_URL + sessionid + '/c' + c + 'r' + r + '.png?' + Math.random(1000000) * 1000000;
					tileImg = createTileImg(layerTileContainer,c,r,iLeft,iTop,tileSize,tilename);
					createOnErrorEvt(tileImg, 0, c, r, level);
				} else { 
					r -= 1; 
					iTop -= tileSize; 					
					var tilename = J_GENTILE_URL + sessionid + '/c' + c + 'r' + r + '.png?' + Math.random(1000000) * 1000000;
					tileImg = createTileImg(layerTileContainer,c,r,iLeft,iTop,tileSize,tilename);
					createOnErrorEvt(tileImg, 0, c, r, level);
				}                    
			}
			sign = sign * -1;
		}       		
	}		
}
maps.Layer.prototype.redraw = function() {	
	var map = this.map_;
	var layerTileContainer = this.div_;
	var mapSize = map.getMapSize();
	var tileSize = map.getTileSize();
	var buffer = 2;
	var level = map.getLevel();	
	var centerPt = map.getCenterPt();
	var bounds = map.getBounds();
	var boundstr = bounds.tl.toShortStr(' ') + ' ' + bounds.br.toShortStr(' ');
	var sessionid = 'xyz123';
	
	var layer = '';	
	if ((this.id & 1) == 1) layer = 'wineries'; 
	if ((this.id & 2) == 2) if (layer.length == 0) layer = 'propertyrent'; else layer += ' propertyrent'; 
	if ((this.id & 4) == 4) if (layer.length == 0) layer = 'propertysale'; else layer += ' propertysale';
	if ((this.id & 8) == 8) if (layer.length == 0) layer = 'panorama'; else layer += ' panorama';
	if ((this.id & 16) == 16) if (layer.length == 0) layer = 'photo'; else layer += ' photo';
	if ((this.id & 32) == 32) if (layer.length == 0) layer = 'streetview'; else layer += ' streetview';
	if ((this.id & 64) == 64) if (layer.length == 0) layer = 'shopview'; else layer += ' shopview';
	if ((this.id & 128) == 128) if (layer.length == 0) layer = 'accommodation'; else layer += ' accommodation';	
	
	if (!this.description) this.description = layer;	
	layerTileContainer.id = this.description;
	
	// prepare JSON to request generate layer tile
	JSONP.request( J_WSGI_URL + 'sdmap/gentilemap', {
		  callbackKey: 'jsoncallback',
		  params: { sessionid: sessionid, layer: layer, bounds: boundstr, level: level },
		  callback: function(obj) { draw(); }
	});
	
	function draw() {
		var x = parseInt(map.getTileContainer().style.left);
		var y = parseInt(map.getTileContainer().style.top);
			
		var tileRows = Math.ceil(mapSize.h / tileSize) + buffer;
		var tileCols = Math.ceil(mapSize.w / tileSize) + buffer;
		var tileSquares = (tileRows > tileCols) ? tileRows : tileCols;
		
		var r = Math.ceil(centerPt.y / tileSize);
		var c = Math.ceil(centerPt.x / tileSize);
		var r_offset = Math.round(centerPt.y % tileSize);
		var c_offset = Math.round(centerPt.x % tileSize);
		
		var j = 0;
		var sign = 1;
		var coord = "x";
		var iTop = 0;
		var iLeft = 0;	
		
		var viewPortCtr= new maps.Point(Math.round(mapSize.w / 2), Math.round(mapSize.h/2));
		iTop = viewPortCtr.y - r_offset;
		iLeft = viewPortCtr.x - c_offset;
		
		iTop -= y;
		iLeft -= x;
				
		// clear imgs before renew
		for (var i in layerTileContainer.imgs) {
			layerTileContainer.imgs[i].onerror = null;
			layerTileContainer.removeChild(layerTileContainer.imgs[i]);			
		}
		
		layerTileContainer.imgs = [];
		
		var tilename = J_GENTILE_URL + sessionid + '/c' + c + 'r' + r + '.png?' + Math.random(1000000) * 1000000;	
		var tileImg = createTileImg(layerTileContainer,c,r,iLeft,iTop,tileSize,tilename);	
		createOnErrorEvt(tileImg, 0, c, r, level);

		while (j < tileSquares) {
			j += 1;           
			for (var k=1; k<=j; k++) {        
				if (j == tileSquares && j==k) break;      
				if (sign == 1) {
					c += 1; 
					iLeft += tileSize;					
					var tilename = J_GENTILE_URL + sessionid + '/c' + c + 'r' + r + '.png?' + Math.random(1000000) * 1000000;
					tileImg = createTileImg(layerTileContainer,c,r,iLeft,iTop,tileSize,tilename);
					createOnErrorEvt(tileImg, 0, c, r, level);
				} else { 
					c -= 1; 
					iLeft -= tileSize;					
					var tilename = J_GENTILE_URL + sessionid + '/c' + c + 'r' + r + '.png?' + Math.random(1000000) * 1000000;	
					tileImg = createTileImg(layerTileContainer,c,r,iLeft,iTop,tileSize,tilename);
					createOnErrorEvt(tileImg, 0, c, r, level);
				}
			}                      
			if (j == tileSquares) break;                             
			for (var k=1; k<=j; k++) {
				if (sign == 1) { 
					r += 1; 
					iTop += tileSize;					
					var tilename = J_GENTILE_URL + sessionid + '/c' + c + 'r' + r + '.png?' + Math.random(1000000) * 1000000;
					tileImg = createTileImg(layerTileContainer,c,r,iLeft,iTop,tileSize,tilename);
					createOnErrorEvt(tileImg, 0, c, r, level);
				} else { 
					r -= 1; 
					iTop -= tileSize; 					
					var tilename = J_GENTILE_URL + sessionid + '/c' + c + 'r' + r + '.png?' + Math.random(1000000) * 1000000;
					tileImg = createTileImg(layerTileContainer,c,r,iLeft,iTop,tileSize,tilename);
					createOnErrorEvt(tileImg, 0, c, r, level);
				}                    
			}
			sign = sign * -1;
		} 
	}
}
maps.Layer.prototype.remove = function() {
	window.stop;			
	var td = this.div_;		
	for (var i in td.imgs) {
		td.imgs[i].onerror = null;
		td.removeChild(td.imgs[i]);
		td.imgs[i] = null;
	}
	td.imgs = null;		
	var p = td.parentNode;
	try {
		if (p) p.removeChild(td);
	} catch (err) {
	}
}
JLayer = maps.Layer;

	
maps.TileMap = function(maptype,opts) {
    this.maptype = maptype;
	this.opts = opts;
	this.div_ = null;
	this.map_ = null;
    this.imgs_ = null;
    this.tileRows = null;
    this.tileCols = null;
}
var F = function() {};
F.prototype = maps.Overlay.prototype;
maps.TileMap.prototype = new F();
maps.TileMap.constructor = maps.TileMap;
maps.TileMap.prototype.name = "TileMap";
maps.TileMap.prototype.initialize = function(map) {
	// event fire for tileMap initialize
	map.EventEx.fireEvent(null,this,'TileMapInitialize');
		
	this.map_ = map;
	var mapSize = map.getMapSize();
	var tileSize = map.getTileSize();
	var level = map.getLevel();
	var buffer = map.getTileBuffer();
	var centerPt = map.getCenterPt();
    //console.log('centerPt:' + centerPt);
		
	var x = parseInt(map.getTileContainer().style.left);
	var y = parseInt(map.getTileContainer().style.top);        
  
	this.tileRows = Math.ceil(mapSize.h / tileSize) + buffer;
	this.tileCols = Math.ceil(mapSize.w / tileSize) + buffer;
    //console.log('total col,row:' + this.tileCols + ',' + this.tileRows);
	var tileSquares = (this.tileRows > this.tileCols) ? this.tileRows : this.tileCols;
	
	var r = Math.ceil(centerPt.y / tileSize);
	var c = Math.ceil(centerPt.x / tileSize);
	var r_offset = Math.round(centerPt.y % tileSize);
	var c_offset = Math.round(centerPt.x % tileSize);
    //console.log('offset col,row:' + c_offset + ',' + r_offset);

    // Fix buggy on  new Tile Draw Method using lowest tileCols and tileRows.
    // Becase We using fixed minRow, minCol, maxRow, maxCol to calculate using mod tileRows and tileCols (see below code)
    // will produce problem when point is exactly reside between tile Row/Col combine line
    // the below row / col offset detection will fix to correct image tile position.
    if (r_offset == 0) {
        r += 1;
    }
    if (c_offset == 0) {        
        c += 1;
    }
      
	
	var viewPortCtr= new maps.Point(Math.round(mapSize.w / 2), Math.round(mapSize.h/2));
	var iTop = viewPortCtr.y - r_offset;
	var iLeft = viewPortCtr.x - c_offset;	
	iTop -= y;
	iLeft -= x;
	
	var notFoundImg = "";
	var baseTileDiv = dom.ce("div");	
	var baseTileDiv = new maps.Container(null,"",{position:"absolute",left:"0px",top:"0px",zIndex:0});
	map.getTileContainer().insertBefore(baseTileDiv, map.getTileContainer().firstChild);
		
	switch (this.maptype) {
		case J_TRANS_MAP : baseTileDiv.id = "TransTileDiv"; map.getDefaultUI().maptypes.psma = true; notFoundImg = J_TRANS_IMG; break;
		case J_PSMA_MAP  : baseTileDiv.id = "PsmaTileDiv";  map.getDefaultUI().maptypes.ausway = true; notFoundImg = J_WATER_IMG; break;
		case J_AUSWAY_MAP: baseTileDiv.id = "AuswayTileHybrid", map.getDefaultUI().maptypes.ausway = true; notFoundImg = J_TRANS_IMG; break;
		case J_STREETVIEW_MAP: baseTileDiv.id = "StreetviewTileMap"; notFoundImg = J_TRANS_IMG; break;
		case J_SATELLITE_MAP : baseTileDiv.id = "SatelliteTileMap";  map.getDefaultUI().maptypes.satellite = true; notFoundImg = J_TRANS_IMG; break;
	}
	
	this.imgs_ = baseTileDiv.imgs = [];	
	
	var tileImg = createTileImg(baseTileDiv,c,r,iLeft,iTop,tileSize,getTileImg(this.maptype,c,r,level));	
	//createOnErrorEvt(tileImg, this.maptype, c, r, level);

    if ((this.tileRows % 2) == 0) {
        this.minRow = r - Math.ceil(this.tileRows/2) + 1;
        this.maxRow = r + Math.ceil(this.tileRows/2);
    } else {
        this.minRow = r - Math.ceil(this.tileRows/2) + 1;
        this.maxRow = r + Math.ceil(this.tileRows/2) - 1;
    }
    if ((this.tileCols % 2) == 0) {
        this.minCol = c - Math.ceil(this.tileCols/2) + 1;
        this.maxCol = c + Math.ceil(this.tileCols/2);
    } else {
        this.minCol = c - Math.ceil(this.tileCols/2) + 1;
        this.maxCol = c + Math.ceil(this.tileCols/2) - 1;
    }
    
	this.lessCol = 0;
	this.lessRow = 0;

    for (var i=1; i<=tileSquares; i++) {
        for (var col=1; col<=i; col++) {
            var xx = (i%2==0) ? -1 : 1;
            c += xx;
            iLeft += (tileSize * xx);
            if (((c>=this.minCol) && (c<=this.maxCol)) && ((r>=this.minRow) && (r<=this.maxRow)))
                tileImg = createTileImg(baseTileDiv,c,r,iLeft,iTop,tileSize,getTileImg(this.maptype,c,r,level));
        }
        for (var row=1; row<=i; row++) {
            var yy = (i%2==0) ? -1 : 1;
            iTop += (tileSize * yy);
            r += yy;
            if (((c>=this.minCol) && (c<=this.maxCol)) && ((r>=this.minRow) && (r<=this.maxRow)))
                tileImg = createTileImg(baseTileDiv,c,r,iLeft,iTop,tileSize,getTileImg(this.maptype,c,r,level));
        }
    }
	this.div_ = baseTileDiv;
}
maps.TileMap.prototype.remove = function() {
	window.stop;

    // remove to defaultUI
    switch(this.maptype) {
        case J_PSMA_MAP : this.map_.getDefaultUI().maptypes.psma = false; break;
        case J_AUSWAY_MAP : this.map_.getDefaultUI().maptypes.ausway = false; break;
        case J_STREETVIEW_MAP : this.map_.getDefaultUI().maptypes.ausway = false; break;
        case J_SATELLITE_MAP : this.map_.getDefaultUI().maptypes.satellite = false; break;
    }
    
	var td = this.div_;
	for (var i in td.imgs) {
		//delete td.tileImgs.img[i].row_num; // IE 7 will error
		//delete td.tileImgs.img[i].col_num; // IE 7 will error
		td.imgs[i].onerror = null;
		td.removeChild(td.imgs[i]);
		td.imgs[i] = null;
	}
	td.imgs = null;
	//delete td.imgs; // IE 7 will error
	var p = td.parentNode;
	p.removeChild(td);	
	
	// event fire for tileMap initialize
	this.map_.EventEx.fireEvent(null,this,'TileMapRemove');

	this.div_ = null;
	//delete this.div_;
	this.map_ = null;
	//delete this.map_;  	
}
maps.TileMap.prototype.copy = function() {};
maps.TileMap.prototype.redraw = function(force) {
	if (!force) return;
	var s = new maps.Point(this.map_.getDragDistance().x, this.map_.getDragDistance().y);
	
	var tileSize = this.map_.getTileSize();
	var level = this.map_.getLevel();
	var aImg = this.div_.imgs;    	
    
	s.x = s.x + this.lessCol;
	s.y = s.y + this.lessRow;
	while ((s.x >= tileSize) || (s.x <= -tileSize)) {
		var sign = (s.x > 0)? "+" : "-";
		if (sign == "+") {
			for (var i=0; i < aImg.length; i++) {
				if (this.maxCol == aImg[i].col_num) {
					aImg[i].src = J_TRANS_IMG;
					aImg[i].col_num = this.minCol - 1;
					aImg[i].style.left = (parseInt(aImg[i].style.left) - (this.tileCols * tileSize)) + "px";
					//createOnErrorEvt(aImg[i], this.maptype, aImg[i].col_num, aImg[i].row_num, level);
					aImg[i].src = getTileImg(this.maptype,aImg[i].col_num,aImg[i].row_num,level);					
					aImg[i].id = aImg[i].col_num + '_' + aImg[i].row_num;
				}     
			}   
			this.maxCol -= 1;
			this.minCol -= 1;
			s.x -= tileSize;                      
		}
		if (sign == '-') {
			for (var i=0; i < aImg.length; i++) {
				if (this.minCol == aImg[i].col_num) {
					aImg[i].src = J_TRANS_IMG;                 
					aImg[i].col_num = this.maxCol + 1;
					aImg[i].style.left = (parseInt(aImg[i].style.left) + (this.tileCols * tileSize)) + "px";
					//createOnErrorEvt(aImg[i], this.maptype, aImg[i].col_num, aImg[i].row_num, level);
					aImg[i].src = getTileImg(this.maptype,aImg[i].col_num,aImg[i].row_num,level);					
					aImg[i].id = aImg[i].col_num + '_' + aImg[i].row_num;
				} 
				
			}   
			this.maxCol += 1;
			this.minCol += 1;
			s.x += tileSize;     
		}
	}    
	
	while ((s.y >= tileSize) || (s.y <= -tileSize)) {
		var sign = (s.y > 0)? "+" : "-";
		if (sign == "+") {
			for (var i=0; i < aImg.length; i++) {
				if (this.maxRow == aImg[i].row_num) {
					aImg[i].src = J_TRANS_IMG;
					aImg[i].row_num = this.minRow - 1;
					aImg[i].style.top = (parseInt(aImg[i].style.top) - (this.tileRows * tileSize)) + "px";
					//createOnErrorEvt(aImg[i], this.maptype, aImg[i].col_num, aImg[i].row_num, level);
					aImg[i].src = getTileImg(this.maptype,aImg[i].col_num,aImg[i].row_num,level);					
					aImg[i].id = aImg[i].col_num + '_' + aImg[i].row_num;
				}     
			}   
			this.maxRow -= 1;
			this.minRow -= 1;
			s.y -= tileSize;                      
		}
		if (sign == '-') {
			for (var i=0; i < aImg.length; i++) {
				if (this.minRow == aImg[i].row_num) {
					aImg[i].src = J_TRANS_IMG;            
					aImg[i].row_num = this.maxRow + 1;
					aImg[i].style.top = (parseInt(aImg[i].style.top) + (this.tileRows * tileSize)) + "px";
					//createOnErrorEvt(aImg[i], this.maptype, aImg[i].col_num, aImg[i].row_num, level);
					aImg[i].src = getTileImg(this.maptype,aImg[i].col_num,aImg[i].row_num,level);
					aImg[i].id = aImg[i].col_num + '_' + aImg[i].row_num;
				} 
				
			}   
			this.maxRow += 1;
			this.minRow += 1;
			s.y += tileSize;     
		}
	}            
	this.lessCol = s.x;
	this.lessRow = s.y; 
	
	//console.log('minRow:' + this.minRow + ', maxRow:' + this.maxRow + ', minCol:' + this.minCol + ', maxCol:' + this.maxCol);
}
maps.TileMap.prototype.hide = function() { this.div_.style.visibility = "hidden"; }
maps.TileMap.prototype.show = function() { this.div_.style.visibility = "visible"; }
maps.TileMap.prototype.getImageArray = function() { return this.imgs_;  }
JTileMap = maps.TileMap;

maps.Map = function(map_canvas, opt) {	
	var me = this; // reference of current Map Object
	this.div_ = map_canvas;
	this.name = "Map";
	
	// protected properties
	var canvas = null;        // hold main map container on canvas variable
	var mapTypes = [];        // hold array of mapTypes 
	var defaultUI = { 		  // hold current activated / default UI
		controls : {
			centersigncontrol:true,
			smallmapcontrol:true,
			scalecontrol:false
		}, 
		keyboard : false,
		maptypes : {
			normal       : false,
			ausway       : true,
			streetview   : false,
			satellite    : false
		},
		zoom : {
			doubleclick : true,
			scrollwheel : true,
			continueszoom : false
		},
		dragmap: true, // reserve for future use to replace draggable variable
		infowindow: true // hold infowindow is enable or disable -- default is enable or true
	}
	var curMapType = null;    // hold current active map type 
	var mapContainer = null;  // Root Div Container for Map
	var tileContainer = null; // Root Div Container for all TileMap / TileLayer	
	// viewPort is rectangle map view by user
    var viewPortSize = null;  // viewPort Size (Size)
    var viewPortTLPos = null; // viewPort TopLeft Position (Point)
    var viewPortBRPos = null; // viewPort BottomRight Position (Point)
    var viewPortCtrPos= null; // viewPort Center Position (Point)    
    // Overlay & Reserve Container 
    var olayLayer = null;     // First Reserve / Layer Overlay Container 
    var olayMarkerShadow = null;  // Second Reserve Overlay Container -> Overlay Marker Shadow
    var olayReserve3 = null;  // Third Reserve Overlay Container 
    var olayMarker = null;    // Marker Overlay Container 
    var olayInfoWindow = null;// InfoWindow Overlay Container    
    var olayReserve4 = null;  // Fourth Reserve Overlay Container
    var olayReserve5 = null;  // Fifth Reserve Overlay Container    
    var olayPolyline = null;  // SVG Polyline Overlay Container
    var olayPolygon  = null;  // SVG Polygon Overlay Container
    var olayVector = null;    // Vector Overlay Container
    // counter
    var markerCounter = 0;
    var vectorCounter = 0;
    var polylineCounter = 0;
    var polygonCounter = 0;
    var layerCounter = 0;
    // function return counter value;    
    this.getMarkerCounter = function() { return markerCounter; }
    this.getVectorCounter = function() { return vectorCounter; }
    this.getPolylineCounter = function() { return polylineCounter; }
    this.getPolygonCounter = function() { return polygonCounter; }
    this.getLayerCounter = function() { return layerCounter; }
    
    // drag map controlling
    var draggable = true;      // Map is draggable (Boolean) , default is draggable
    var _mouseDownEvent, _mouseMoveEvent, _mouseUpEvent = null; // internal use variable for disable/enable dragging Map
	
	// Very important variable that used / accessed through by many class	
	var JLevel = 12;	
	var JCenterLonLat = new maps.LonLat(0,0);
	var JCenterPt = new maps.Point(0,0);
	var JMousePt = new maps.Point(0,0);
	var JMouseLonLat = new maps.LonLat(0,0);
	var JMapSize = new maps.Size(0,0);
	var JBuffer = 4; // why +4 buffer because need 2 for top left and 2 for bottom right	
	// Very important return function that return very important variable value
	this.getTileSize = function() { return J_TILE_SIZE_DEF[JLevel]; }
	this.getLevel = function() { return JLevel; }
	this.getCenterPt = function() { return new maps.Point(JCenterPt.x, JCenterPt.y); }
	this.getMousePt = function() { return new maps.Point(JMousePt.x, JMousePt.y); }
	this.getMouseLonLat = function() { return new maps.LonLat(JMouseLonLat.lon, JMouseLonLat.lat); }
	this.getMapSize = function() { return new maps.Size(JMapSize.w, JMapSize.h); }
	this.getTileBuffer = function() { return JBuffer; }
    this.setTileBuffer = function(n) { JBuffer = n; }
    
	// Initialize Map Canvas
	canvas = map_canvas;        
    // Map Options Setting Up
    if (!opt) var opt = maps.MapOptions;
    if ((!canvas.style.width) || (!canvas.style.height)) {
		JMapSize.sz(opt.size.w, opt.size.h); 
		canvas.style.width = JMapSize.w + "px";
		canvas.style.height = JMapSize.h + "px"; 				
	} else {
		// Weird offsetHeight on IE7 .. need test offsetHeight first before scrollHeight to get correct value :-P
		JMapSize = new maps.Size(canvas.scrollWidth || canvas.offsetWidth, canvas.offsetHeight || canvas.scrollHeight );
	}
    if (!opt.draggableCursor) canvas.style.cursor = 'url(' + J_OPENHAND_CUR + '),default'; else canvas.style.cursor = 'url(' + opt.draggableCursor + '),default';    
    if (!canvas.style.backgroundColor) 
		if (!opt.backgroundColor) 
			canvas.style.backgroundColor = "#E5E3DF";
		else
			canvas.style.backgroundColor = opt.backgroundColor;
        
    var coordSys = new maps.LonLatBounds(
		new maps.LonLat(106.720409792149,-8.75833753905317), 
		new maps.LonLat(161.742073361529,-44.7196259244811));
    this.minZoom = J_MIN_ZOOM_DEF;
    this.maxZoom = J_MAX_ZOOM_DEF;
    var mapWidth = J_MAP_WIDTH_DEF;
    var scaleLabel = J_SCALE_LABEL_DEF;
    var preCalcScale = J_PRECALC_SCALE_DEF;
    
    // Internal/Private Use Function that no access by end user
    var getScale = function(lvl) {
        return mapWidth[lvl] / (coordSys.br.lon - coordSys.tl.lon);
    }
    var lonLatToPixel = function(ll) {    
        var x = Math.round((ll.lon - coordSys.left()) * preCalcScale[JLevel]);
        var y = Math.round((coordSys.top() - ll.lat) * preCalcScale[JLevel]);
        return new maps.Point(x,y);
    }
    var pixelToLonLat = function(pt) {
        var lon = (pt.x / preCalcScale[JLevel]) + coordSys.left();
        var lat = coordSys.top() - (pt.y / preCalcScale[JLevel]);
        return new maps.LonLat(lon,lat);
    }
    var getPixelLevel = function(pt, oldLevel, newLevel) {
        var scale = mapWidth[oldLevel] / mapWidth[newLevel];
        var x = pt.x / scale;
        var y = pt.y / scale;
        return new maps.Point(x,y);
    }
     
    // END USER ACCESSIBLE FUNCTIONS (joaokho.maps.Map class user API)                            
    
    // Configuration    
    this.enableDragging = function() {
		// check current draggable is already true then return;
		if (draggable) return;		
        tileContainer.onmousedown = _mouseDownEvent;
        tileContainer.onmousemove = _mouseMoveEvent;
        tileContainer.onmouseup = _mouseUpEvent;
        mouseDownEvent = null;
        mouseMoveEvent = null;
        mouseUpEvent = null;
        // set current draggable is true now
        draggable = true;
    }
    this.disableDragging = function() {
		// check current draggable is already false then return
		if (!draggable) return;		
        _mouseDownEvent = tileContainer.onmousedown;
        _mouseMoveEvent = tileContainer.onmousemove;
        _mouseUpEvent = tileContainer.onmouseup;
        tileContainer.onmousedown = null;
        tileContainer.onmousemove = null;
        tileContainer.onmouseup = null;
        // set current draggable is false now
        draggable = false;
    }        
    this.draggingEnabled = function() { return draggable; }
    this.enableInfoWindow = function() { defaultUI.infowindow = true;}
    this.disableInfoWindow = function() { defaultUI.infowindow = false; }
    this.infoWindowEnabled = function() { return defaultUI.infowindow; }
    this.enableDoubleClickZoom = function() { defaultUI.zoom.doubleclick = true; }
    this.disableDoubleClickZoom = function() { defaultUI.zoom.doubleclick = false; }
    this.doubleClickZoomEnabled = function() { return defaultUI.zoom.doubleclick; }
    this.enableContinuousZoom = function() { defaultUI.zoom.continueszoom = true; }
    this.disableContinuousZoom = function() { defaultUI.zoom.continueszoom = false; }
    this.continuousZoomEnabled = function() { return defaultUI.zoom.continueszoom; }
    //this.enableGoogleBar = function() {}
    //this.disableGoogleBar = function() {}
    this.enableScrollWheelZoom = function() { defaultUI.zoom.scrollwheel = true; }
    this.disableScrollWheelZoom = function() { defaultUI.zoom.scrollwheel = false; }
    this.scrollWheelZoomEnabled = function() { return defaultUI.zoom.scrollwheel; }    
    //this.enablePinchToZoom = function() {} // Enables pinching to zoom on an iPhone or iPod touch. Note: pinch to zoom is enabled by default.
    //this.disablePinchToZoom = function() {}  // Disables pinching to zoom on an iPhone or iPod touch. Note: pinch to zoom is enabled by default.
	//this.pinchToZoomEnabled = function() {} // Returns a Boolean indicating whether pinch to zoom is enabled.    
    this.getDefaultUI = function() { return defaultUI; }
    this.setUIToDefault = function() {
		defaultUI = {
			controls : {
				centersigncontrol:true,
				smallmapcontrol:true,
				scalecontrol:false
			}, 
			keyboard : false,
			maptypes : {
				psma         : false,
				ausway       : false,
				streetview   : false,
				satellite    : false
			},
			zoom : {
				doubleclick : false,
				scrollwheel : false,
				continueszoom : false
			},
			dragmap: true, 
			infowindow: true
		};		
	}
    this.setUI = function(ui) { defaultUI = ui; }
    
    // Controls
    this.addControl = function(control, position) { control.initialize(this, position); }
    this.removeControl = function(control) { control.remove(); }
    // Function that return the Container DIV
    this.getContainer = function() { return canvas; }    
    this.getTileContainer = function() { return tileContainer; }
    this.getLayerContainer = function() { return olayLayer; }
    this.getMapContainer = function() { return mapContainer; }
    this.getMarkerShadowContainer = function() { return olayMarkerShadow; }    
    this.getMarkerContainer = function() { return olayMarker; }
    this.getVectorContainer = function() { return olayVector; }
    this.getPolygonContainer = function() { return olayPolygon; }
    this.getPolylineContainer = function() { return olayPolyline; }    
    this.getInfoWindowContainer = function() { return olayInfoWindow; }
    
    // Map Types
    this.getMapTypes = function() {
		var maptypes = [];
		for (maptype in defaultUI.maptypes) {
			if (defaultUI.maptypes[maptype])
				maptypes.push(maptype);
		}
		return maptypes;
	}
    this.getCurrentMapType = function() {
        var mt = [];
        var tc = this.getTileContainer();
        var len = tc.items.length;
        for (var i=0; i<len; i++) {            
            mt.push(tc.items[i].maptype);
        }        
        return mt;
    }
    this.setMapType = function(maptype) {
		var cnt = this.getTileContainer().items.length-1;				
		for (var i=cnt;i>=0;i--) {
           this.removeOverlay(this.getTileContainer().items[i]);										
		}
		this.addOverlay(new maps.TileMap(maptype));	
	}
    this.addMapType = function(maptype) {}
    this.removeMapType = function(maptype) {}
    
    // Map State
    this.isLoaded = function() {}
    this.getCenter = function() { 
		JCenterLonLat = pixelToLonLat(JCenterPt); 
		return JCenterLonLat; 
	}
    this.getBounds = function() {  //return lonlat boundary
		var tlLL = this.fromContainerPixelToLonLat(new maps.Point(0,0));		
		var brLL = this.fromContainerPixelToLonLat(new maps.Point(JMapSize.w, JMapSize.h));
		return new maps.LonLatBounds(tlLL, brLL);
	}
    this.getBoundsZoomLevel = function(bounds) {
		var tlLL = bounds.tl;
		var brLL = bounds.br;
		var tlPt = lonLatToPixel(tlLL);
		var brPt = lonLatToPixel(brLL);
		
		for (var i=this.maxZoom; i>this.minZoom; i--) {
			var tmpTL = getPixelLevel(tlPt, JLevel, i);
			var tmpBR = getPixelLevel(brPt, JLevel, i);
			if (((tmpBR.x - tmpTL.x) < JMapSize.w) && ((tmpBR.y - tmpTL.y) < JMapSize.h)) 
				break;
		}
		return i;		
	}       
    this.getSize = function() { return JMapSize; }	
    this.getDragObject = function() {}
    this.getDragDistance = function() { return dragDistance; }
    this.getScaleLabel = function() { return scaleLabel[JLevel];}
    
    // Modify the Map Sate    
    this.setCenter = function(center, zoom, maptype) {				
		JCenterLonLat.ll(center.lon, center.lat);		
		if (typeof zoom != "undefined") { 
			JLevel = zoom; 
			// event fire for firsttime set zoom level
			this.EventEx.fireEvent(null,this,'zoomend', [null,zoom]);			
		}
		JCenterPt = lonLatToPixel(JCenterLonLat);
        var ui = this.getDefaultUI();
		if (typeof maptype != "undefined") {
			switch(maptype) {
				case J_PSMA_MAP: 
					this.addOverlay(new maps.TileMap(J_PSMA_MAP));
                    ui.maptypes.psma = true;
                    ui.maptypes.ausway = false;				
					break;
				case J_AUSWAY_MAP:
					this.addOverlay(new maps.TileMap(J_AUSWAY_MAP));
                    ui.maptypes.psma = false;
                    ui.maptypes.ausway = true;	
					break;
				case J_STREETVIEW_MAP:
					this.addOverlay(new maps.TileMap(J_STREETVIEW_MAP));
                    ui.maptypes.streetview = true;
					break;
				case J_SATELLITE_MAP:
					this.addOverlay(new maps.TileMap(J_SATELLITE_MAP));
                    ui.maptypes.satellite = true;				
					break;
				case J_HYBRID_AUSWAY_MAP:
					this.addOverlay(new maps.TileMap(J_STREETVIEW_MAP));
					this.addOverlay(new maps.TileMap(J_AUSWAY_MAP));
                    ui.maptypes.streetview = true;
                    ui.maptypes.ausway = true;
					break;
				case J_HYBRID_PSMA_MAP:
                    this.addOverlay(new maps.TileMap(J_STREETVIEW_MAP));					 
                    this.addOverlay(new maps.TileMap(J_PSMA_MAP));
                    ui.maptypes.streetview = true;
                    ui.maptypes.psma = true;					
					break;				
			}
		} else {						
			this.addOverlay(new maps.TileMap(J_AUSWAY_MAP));
            ui.maptypes.ausway = true;
			//this.addOverlay(new maps.TileMap(J_PSMA_MAP));					
		}		
		
		// Get First Time Map Loading / Setup Map mapRefence
		mapReference();
	}
    this.panTo = function(center) {         
        JCenterLonLat.ll(center.lon,center.lat); 
		JCenterPt = lonLatToPixel(JCenterLonLat);
		
		// define temporary MapType array
		var arrMapType = [];
		// store current show map to temporary MapType array
		for (var i in tileContainer.items) 
			arrMapType[i] = tileContainer.items[i].maptype;			
		// remove current show map		
		for (var i=tileContainer.items.length;i>=1;i--) 
			this.removeOverlay(tileContainer.items[i-1]);			
		// redraw again current show map from temporary MapType array with new JLevel and JCenterPt
		for (var i=0; i < arrMapType.length; i++) 
			this.addOverlay(new maps.TileMap(arrMapType[i]));	
		for (var i=0; i < olayMarker.items.length; i++) 
			olayMarker.items[i].obj.redraw(true);
        // reposition / resize Vector with redraw to current JLevel
		for (var i=0; i < olayVector.items.length; i++) 
			olayVector.items[i].obj.redraw(true);
		// reposition / resize Polygon with redraw Polygon to current JLevel
		for (var i=0; i < olayPolygon.items.length; i++) 
			olayPolygon.items[i].obj.redraw(true);
		// reposition / resize Polyline with redraw Polyline to current JLevel
		for (var i=0; i < olayPolyline.items.length; i++) 
			olayPolyline.items[i].obj.redraw(true);
		// redraw Layer if available
		for (var i=0; i < olayLayer.items.length; i++)
			olayLayer.items[i].obj.redraw();
		
		// adjust infoWindow maybe is on show need reposition
		this.infoWindow.adjust();

        // event fire for map moving 
		this.EventEx.fireEvent(null,this,'moveend');        
	}
    this.panBy = function(distance) {
		JCenterPt.x = JCenterPt.x - distance.x;
		JCenterPt.y = JCenterPt.y - distance.y;
		// Update current JCenterLonLat base on current JCenterPt Update
        JCenterLonLat = pixelToLonLat(JCenterPt); 
        // Update dragDistance variable because use on redraw procedure
        dragDistance.xy(distance.x,distance.y);
        tileContainer.style.left = parseInt(tileContainer.style.left) + distance.x + "px";
        tileContainer.style.top = parseInt(tileContainer.style.top) + distance.y + "px";        
        
        // Call redraw function for each TileMap that listed on tileContainer using inherited redraw function        
        for (var i in tileContainer.items)
			tileContainer.items[i].redraw(true);
			
		// reposition Marker with redraw Marker to current JLevel
		for (var i=0; i < olayMarker.items.length; i++) 
			olayMarker.items[i].obj.redraw(true);
        // reposition / resize Vector with redraw to current JLevel
		for (var i=0; i < olayVector.items.length; i++) 
			olayVector.items[i].obj.redraw(true);
		// reposition / resize Polygon with redraw Polygon to current JLevel
		for (var i=0; i < olayPolygon.items.length; i++) 
			olayPolygon.items[i].obj.redraw(true);
		// reposition / resize Polyline with redraw Polyline to current JLevel
		for (var i=0; i < olayPolyline.items.length; i++) 
			olayPolyline.items[i].obj.redraw(true);
		// redraw Layer if available
		for (var i=0; i < olayLayer.items.length; i++)
			olayLayer.items[i].obj.redraw();	
		
		// adjust infoWindow maybe is on show need reposition				
		this.infoWindow.adjust();

        // event fire for map moving 
		this.EventEx.fireEvent(null,this,'moveend');
	}
    this.panDirection = function(dx,dy) {}
    
    // variable response in milliseconds for zoom in, zoom out
    var zoomResponse = 300;
    this.getZoomResponse = function() { return zoomResponse; }
    this.setZoomResponse = function(ms) { if ((typeof ms == "number") &&  (ms <= 1000) && (ms >= 100) && (ms != zoomResponse)) zoomResponse = parseInt(ms); }
    // variable settimeout for zoom in, zoom out
    var zoomTimeoutCtrl = null;
    
    this.setZoom = function(level) {
		/* old code problem when panTo then setZoom (location wrong)
		var oldLevel = JLevel;
		var newPt = getPixelLevel(JCenterPt, oldLevel, level);
		JCenterPt.xy(newPt.x, newPt.y);
		JLevel = level;
		*/

        if (typeof level != "number" || level > 16 || level < 1) return false;
		var oldlevel = JLevel;
        JLevel = level;
		JCenterPt = lonLatToPixel(JCenterLonLat); 		
		
		// define temporary MapType array
		var arrMapType = [];
		// store current show map to temporary MapType array 
		for (var i in tileContainer.items) 
			arrMapType[i] = tileContainer.items[i].maptype;		
		// remove current show map
		for (var i=tileContainer.items.length;i>=1;i--) 				
		    this.removeOverlay(tileContainer.items[i-1]);
		// redraw again current show map from temporary MapType array with new JLevel and JCenterPt		
		for (var i=0; i < arrMapType.length; i++) 	
			this.addOverlay(new maps.TileMap(arrMapType[i]));
		// reposition Marker with redraw Marker to current JLevel
		for (var i=0; i < olayMarker.items.length; i++) 
			olayMarker.items[i].obj.redraw(true);
        // reposition / resize Vector with redraw to current JLevel
		for (var i=0; i < olayVector.items.length; i++) 
			olayVector.items[i].obj.redraw(true);
		// reposition / resize Polygon with redraw Polygon to current JLevel
		for (var i=0; i < olayPolygon.items.length; i++) 
			olayPolygon.items[i].obj.redraw(true);
		// reposition / resize Polyline with redraw Polyline to current JLevel
		for (var i=0; i < olayPolyline.items.length; i++) 
			olayPolyline.items[i].obj.redraw(true);
		// redraw Layer if available
		for (var i=0; i < olayLayer.items.length; i++)
			olayLayer.items[i].obj.redraw();
			
		// adjust infoWindow maybe is on show need reposition
		this.infoWindow.adjust();
		
		// event fire for firsttime set zoom level
		this.EventEx.fireEvent(null,this,'zoomend', [oldlevel, level]);
	}
    this.zoomIn = function(ll, doCenter, doContinuousZoom) {        
        // if already maxZoom then return - do nothing        
        if (JLevel == me.maxZoom) return false;

        var oldLevel = JLevel;
        var newLevel = JLevel + 1;
        
        // Always update current LonLatCenter because our zoom is calculate by pixel , so just run getCenter() to update
        me.getCenter();
        // if first param available do zoom by ll (first param) 
        if (ll) {
            if (doCenter) {
                JCenterLonLat.ll(ll.lon, ll.lat);
                JLevel += 1;
                JCenterPt = lonLatToPixel(JCenterLonLat);
            } else {                
                var pt = lonLatToPixel(ll);
                var ctr = lonLatToPixel(JCenterLonLat);
                var dist_x = pt.x - ctr.x;
                var dist_y = pt.y - ctr.y;            
                
                var scale = mapWidth[newLevel] / mapWidth[oldLevel];                
                var dx = Math.round(dist_x * scale);
                var dy = Math.round(dist_y * scale);
                
                JLevel += 1;
                var ctr2 = lonLatToPixel(JCenterLonLat);
                ctr2.x += (dx - dist_x);
                ctr2.y += (dy - dist_y);
                JCenterPt.xy(ctr2.x, ctr2.y);
            }
        } else {            
            JLevel += 1;
            JCenterPt = lonLatToPixel(JCenterLonLat);
        }
        
        // event fire for firsttime set zoom level
        me.EventEx.fireEvent(null,me,'zoomend', [oldLevel, oldLevel+1]);
            
        clearTimeout(zoomTimeoutCtrl);
        zoomTimeoutCtrl = setTimeout(zi, zoomResponse);

        function zi() {
            var arrMapType = [];
            // store current show map to temporary MapType array 
            for (var i in tileContainer.items) 
                arrMapType[i] = tileContainer.items[i].maptype;		
            // remove current show map
            for (var i=tileContainer.items.length;i>=1;i--) 				
                me.removeOverlay(tileContainer.items[i-1]);
            // redraw again current show map from temporary MapType array with new JLevel and JCenterPt		
            for (var i=0; i < arrMapType.length; i++) 	
                me.addOverlay(new maps.TileMap(arrMapType[i]));
            // reposition Marker with redraw Marker to current JLevel
            for (var i=0; i < olayMarker.items.length; i++) 
                olayMarker.items[i].obj.redraw(true);
            // reposition / resize Vector with redraw to current JLevel
            for (var i=0; i < olayVector.items.length; i++) 
                olayVector.items[i].obj.redraw(true);
            // reposition / resize Polygon with redraw Polygon to current JLevel
            for (var i=0; i < olayPolygon.items.length; i++) 
                olayPolygon.items[i].obj.redraw(true);
            // reposition / resize Polyline with redraw Polyline to current JLevel
            for (var i=0; i < olayPolyline.items.length; i++) 
                olayPolyline.items[i].obj.redraw(true);
            // redraw Layer if available
            for (var i=0; i < olayLayer.items.length; i++)
                olayLayer.items[i].obj.redraw();
                
            // adjust infoWindow maybe is on show need reposition
            me.infoWindow.adjust();                        
            return true;
        }
            
	}    
    this.zoomOut = function(ll, doContinuousZoom) {        
        if (JLevel == me.minZoom) return false;
        me.getCenter();
        var oldLevel = JLevel;
        var newLevel = JLevel - 1;
        
        // new code
        if (ll) {
            var pt = lonLatToPixel(ll);
            var ctr = lonLatToPixel(JCenterLonLat);
            var dist_x = pt.x - ctr.x;
            var dist_y = pt.y - ctr.y;            

            var scale = mapWidth[newLevel] / mapWidth[oldLevel];                
            var dx = Math.round(dist_x * scale);
            var dy = Math.round(dist_y * scale);            
            
            JLevel -= 1;
            var ctr2 = lonLatToPixel(JCenterLonLat);
            ctr2.x -= (dist_x - dx);
            ctr2.y -= (dist_y - dy);
            JCenterPt.xy(ctr2.x, ctr2.y);
        } else {            
            JLevel -= 1;
            JCenterPt = lonLatToPixel(JCenterLonLat);
        }
        // end new code

        // event fire for firsttime set zoom level
        me.EventEx.fireEvent(null,me,'zoomend', [oldLevel, oldLevel-1]);
            
        clearTimeout(zoomTimeoutCtrl);
        zoomTimeoutCtrl = setTimeout(zo, zoomResponse);

        function zo() {                    
            // define temporary MapType array
            var arrMapType = [];
            // store current show map to temporary MapType array
            for (var i in tileContainer.items) 
                arrMapType[i] = tileContainer.items[i].maptype;			
            // remove current show map		
            for (var i=tileContainer.items.length;i>=1;i--) 
                me.removeOverlay(tileContainer.items[i-1]);			
            // redraw again current show map from temporary MapType array with new JLeve and JCenterPt
            for (var i=0; i < arrMapType.length; i++) 
                me.addOverlay(new maps.TileMap(arrMapType[i]));	                    
            // reposition marker with redraw Marker to current JLevel
            for (var i=0; i < olayMarker.items.length; i++)
                olayMarker.items[i].obj.redraw(true);
            // reposition / resize Vector with redraw to current JLevel
            for (var i=0; i < olayVector.items.length; i++) 
                olayVector.items[i].obj.redraw(true);
            // reposition / resize Polygon with redraw Polygon to current JLevel
            for (var i=0; i < olayPolygon.items.length; i++) 
                olayPolygon.items[i].obj.redraw(true);
            // reposition / resize Polyline with redraw Polyline to current JLevel
            for (var i=0; i < olayPolyline.items.length; i++) 
                olayPolyline.items[i].obj.redraw(true);
            // redraw Layer if available
            for (var i=0; i < olayLayer.items.length; i++)
                olayLayer.items[i].obj.redraw();
                
            // adjust infoWindow maybe is on show need reposition
            me.infoWindow.adjust();
                                
            return true;
        }
	}
    this.savePosition = function() {}
    this.returnToSavePosition = function() {}
    this.checkResize = function() {}
    
    // Overlays
    this.addOverlay = function(overlay) {
		if (!overlay.name) return false;		
		overlay.initialize(this);		
		if (overlay.name == "TileMap") { tileContainer.items.push(overlay); }
		if (overlay.name == "Marker") { olayMarker.items.push({id:markerCounter++,obj:overlay}); }
        if (overlay.name == "Vector") { olayVector.items.push({id:vectorCounter++,obj:overlay}); }
		if (overlay.name == "Polygon") { olayPolygon.items.push({id:polygonCounter++,obj:overlay}); }
		if (overlay.name == "Polyline") { olayPolyline.items.push({id:polylineCounter++,obj:overlay}); }
		if (overlay.name == "Layer") { olayLayer.items.push({id:layerCounter++,obj:overlay}); }
	}
    this.removeOverlay = function(overlay) {
		if (!overlay) return;
		if (overlay.name == "TileMap") { 
			// IMPORTANT!!: everytime splice Array the length of array will be recalculate, and index array will be sequences
			for (var i=0; i < tileContainer.items.length; i++) {				
				if (tileContainer.items[i].maptype == overlay.maptype) {
					tileContainer.items.splice(i, 1);									
					i--;
				}
			}
		}
		if (overlay.name == "Marker") {
			// remove olayMarker items
			for (var i=0; i < olayMarker.items.length; i++) {
				if (olayMarker.items[i].obj.id_ == overlay.id_) {
					olayMarker.items.splice(i,1);
					i--;
				}
			}								
		}
        if (overlay.name == "Vector") {
			// remove olay Vector items			
			for (var i=0; i < olayVector.items.length; i++) {
				if (olayVector.items[i].obj.id_ == overlay.id_) {
					olayVector.items.splice(i,1);
					i--;
				}
			}	
		}
		if (overlay.name == "Polygon") {
			// remove olay Polygon items			
			for (var i=0; i < olayPolygon.items.length; i++) {
				if (olayPolygon.items[i].obj.id_ == overlay.id_) {
					olayPolygon.items.splice(i,1);
					i--;
				}
			}	
		}
		if (overlay.name == "Polyline") {
			// remove olay Polyline items			
			for (var i=0; i < olayPolyline.items.length; i++) {
				if (olayPolyline.items[i].obj.id_ == overlay.id_) {
					olayPolyline.items.splice(i,1);
					i--;
				}
			}	
		}
		if (overlay.name == "Layer") {
			// remove olay Layer items
			for (var i=0; i < olayLayer.items.length; i++) {
				if (olayLayer.items[i].obj.id_ == overlay.id_) {
					olayLayer.items.splice(i,1);
					i--;
				}
			}				
		}
		// execute overlay remove inherince function
		overlay.remove();		
	}
    this.clearOverlays = function() {
		// remove every TileMap layer
		for (var i in tileContainer.items)
			tileContainer.items[i].remove();
		// remove every overlay Marker item
		for (var i in olayMarker.items)
			olayMarker.items[i].obj.remove();
        // remove every overlay Vector item
		for (var i in olayVector.items)
			olayVector.items[i].obj.remove();
		// remove every overlay Polygon item
		for (var i in olayPolygon.items)
			olayPolygon.items[i].obj.remove();
		// remove every overlay Polyline item
		for (var i in olayPolyline.items)
			olayPolyline.items[i].obj.remove();
		for (var i in olayLayer.items)
			olayLayer.items[i].obj.remove();
		
		// empty list item
		tileContainer.items = [];
		olayMarker.items = [];
		olayPolygon.items = [];
		olayPolyline.items = [];
		olayLayer.items = [];		
	}
	this.getAllOverlays = function() {  // ONLY FOR DEBUG
		var all = [];
		for (var i in tileContainer.items)
			all.push(tileContainer.items[i]);
		for (var i in olayMarker.items)
			all.push(olayMarker.items[i].obj);
        for (var i in olayVector.items)
			all.push(olayVector.items[i].obj);
		for (var i in olayPolygon.items)
			all.push(olayPolygon.items[i].obj);
		for (var i in olayPolyline.items)
			all.push(olayPolyline.items[i].obj);
		for (var i in olayLayer.items)
			all.push(olayLayer.items[i].obj);
	}
	
	// Don't use , don't know what to do
    this.getPane = function(mappane) {}
        
    // Info Window
    this.openInfoWindow = function(ll, node, opts) {
		var bounds = this.getBounds();
		
		if (((ll.lon < bounds.tl.lon) && (ll.lat > bounds.tl.lat)) ||
		   ((ll.lon > bounds.br.lon) || (ll.lat < bounds.br.lat)))
			this.panTo(ll);	

		this.infoWindow.setPoint(ll);
		this.infoWindow.puts(node,false);
		this.infoWindow.setOptions(opts);		
		this.disableDragging();
		this.infoWindow.show();
							
		// auto pan to view top infowindow		
		
		var map = this;	
		function fn() {
			var p = map.infoWindow.getPoint();
		    var q = map.fromLonLatToContainerPixel(p);			    
		    var w = map.infoWindow.width_;
			var h = map.infoWindow.height_;			
			var x = q.x - (w + 20);  // real width from left 35
			var y = q.y - (h + 108); // real height from top 45	
			if ((x <= 0) || (y <= 0)) {
				x += 20;
				y += 20;
				var a = x < 0? 20 : 0;
				var b = y < 0? 20 : 0;
				map.panBy(new maps.Point(a,b));
			}
			//console.log(x + ',' + y);	
			if ((x >= 0) && (y >= 0)) { clearInterval(tm); map.enableDragging(); }
		}
		var tm = setInterval(fn,100);
		
		// end of auto pan to view top infowindow
		
		
		//Effects.fadeIn(this.infoWindow.div_, '1');		
	}
    this.openInfoWindowHtml = function(ll, html, opts) {
		this.infoWindow.setPoint(ll);
		this.infoWindow.puts(html,false);
		this.infoWindow.show();
		Effects.fadeIn(this.infoWindow.div_, '1');
	}
    this.openInfoWindowTabs = function(ll, tabs, opts) {
		this.infoWindow.setPoint(ll);
		this.infoWindow.puts(tabs,false);
		this.infoWindow.show();
		Effects.fadeIn(this.infoWindow.div_, '1');
	}
    this.openInfoWindowTabsHtml = function(ll, tabs, opts) {
		this.infoWindow.setPoint(ll);
		this.infoWindow.puts(tabs,false);
		this.infoWindow.show();
		Effects.fadeIn(this.infoWindow.div_, '1');
	}
    this.showMapBlowup = function(ll, opts) {
		//NOTE: DIV will not auto resize if DIV Child have Absolute Position Style
		var bmap = dom.ce("div");
		bmap.style.width = "250px";
		bmap.style.height = "250px";		
		bmap.style.backgroundColor = "#E5E3DF"; // rgb(229,227,223)
		// create map object			
		var obj_bmap = new maps.Map(bmap);
		obj_bmap.setCenter(ll,12,J_PSMA_MAP);
        
		this.infoWindow.setPoint(ll);
		this.infoWindow.puts(bmap,false);		
		this.infoWindow.show();
		Effects.fadeIn(this.infoWindow.div_, '1');
	}
    this.updateInfoWindow = function(tabs, onupdate) {}
    this.updateCurrentTab = function(modifier, onupdate) {}
    this.closeInfoWindow = function() {}
    this.getInfoWindow = function() {}
    
    // Coordinate Transformations
    this.fromContainerPixelToLonLat = function(pt) {  // Container means canvas pixel that absolute from 0,0 to MapSize
		var centerPt = new maps.Point(JCenterPt.x, JCenterPt.y);
		var tlPt = new maps.Point(centerPt.x - (JMapSize.w/2), centerPt.y - (JMapSize.h/2)); // from total MapWidth on current active Level		
		// calculate topleft point + pt
		var calcPt = new maps.Point(tlPt.x + pt.x, tlPt.y + pt.y);		
		return pixelToLonLat(calcPt);						
	}
    this.fromLonLatToContainerPixel = function(ll) {
		// calculate into total map pixel position
		var pt = lonLatToPixel(ll); 
		// current Center pixel Position
		var centerPt = new maps.Point(JCenterPt.x, JCenterPt.y);	
		var tlPt = new maps.Point(centerPt.x - (JMapSize.w/2), centerPt.y - (JMapSize.h/2));
	    // calculate current x, y distance from center
	    var x = pt.x - tlPt.x;
	    var y = pt.y - tlPt.y;
	    	    
	   	return new maps.Point(x,y);
	}
    this.fromLonLatToDivPixel = function(ll) {  // calculte from LonLat to TileContainer Coordinate
		var pt = this.fromLonLatToContainerPixel(ll);		
		var l = parseInt(tileContainer.style.left);
		var t = parseInt(tileContainer.style.top);
		return new maps.Point(pt.x - l, pt.y - t);		
	}
    this.fromDivPixelToLonLat = function(pt) {  // calculate from TileContainer Coordinate into LonLat		        
        var mapSize = this.getMapSize();
        var centerPt = new maps.Point(JCenterPt.x, JCenterPt.y);        
        var x = pt.x - Math.round(mapSize.w / 2);
        var y = pt.y - Math.round(mapSize.h / 2);        
        x = centerPt.x + x;
        y = centerPt.y + y;               
        return pixelToLonLat(new maps.Point(x,y));
	}
	this.getDivBounds = function() {
		var mapSize = this.getMapSize();
		var tileSize = this.getTileSize();
		var level = this.getLevel();
		var buffer = this.getTileBuffer();
		var centerPt = this.getCenterPt();
				
		var c = Math.ceil(centerPt.x / tileSize);
		var r = Math.ceil(centerPt.y / tileSize);
		
		var tileRows = Math.ceil(mapSize.h / tileSize) + buffer;
		var tileCols = Math.ceil(mapSize.w / tileSize) + buffer;
		var tileSquares = (tileRows > tileCols) ? tileRows : tileCols;
		
	    var c1 = c - Math.floor(tileSquares / 2);
	    var r1 = r - Math.floor(tileSquares / 2);
	    var c2 = c + Math.floor(tileSquares / 2) - 1;
	    var r2 = r + Math.floor(tileSquares / 2) - 1; 
	    	    
		//return {c1:c1, r1:r1, c2:c2, r2:r2}
		//return 'minRow: ' + r1 + ', maxRow:' + r2 + ', minCol:' + c1 + ', maxCol:' + c2;		
		return new maps.LonLatBounds(pixelToLonLat(new maps.Point(c1 * tileSize, r1 * tileSize)), pixelToLonLat(new maps.Point(c2 * tileSize, r2 * tileSize)));
	}
    
    // Initialize Viewport Size and Position form Browser Document WorkArea -- See IE7 offsetHeight command above Stupid Bug
    viewPortSize = new maps.Size(JMapSize.w,JMapSize.h);
    viewPortTLPos = new maps.Point(0,0);
    viewPortBRPos = new maps.Point(JMapSize.w,JMapSize.h);
    viewPortCtrPos= new maps.Point(viewPortTLPos.x + Math.round(viewPortSize.w / 2), viewPortTLPos.y + Math.round(viewPortSize.h/2));    
    
    // Anchor position function
    this.getTopLeftPos = function() { return new maps.Point(0,0); }
    this.getTopRightPos = function() { return new maps.Point(viewPortSize.w, 0); }
    this.getTopPos = function() { return new maps.Point(Math.round(viewPortSize.w/2), 0); }
    this.getLeftPos = function() { return new maps.Point(0, Math.round(viewPortSize.h/2)); }
    this.getRightPos = function() { return new maps.Point(viewPortSize.w,Math.round(viewPortSize.h/2)); }
    this.getCenterPos = function() { return new maps.Point(Math.round(viewPortSize.w/2), Math.round(viewPortSize.h/2)); }
    this.getBottomLeftPos = function() { return new maps.Point(0, viewPortSize.h); }
    this.getBottomRightPos = function() { return new maps.Point(viewPortSize.w, viewPortSize.h); }
    this.getBottomPos = function() { new maps.Point(Math.round(viewPortSize.w/2), viewPortSize.h); }
        
    // Initialize mapContainer
    mapContainer = new maps.Container(canvas, "mapContainer", {overflow:"hidden",position:"absolute",left:"0px",top:"0px",width:"100%",height:"100%"});    
    // Initialize tileContainer
    tileContainer= new maps.Container(mapContainer, "tileContainer", {position:"absolute",left:"0px",top:"0px",zIndex:0});
    // Initialize empty Array of TileMap / TileLayer
    tileContainer.items = [];    
    // Initialize reserve Overlay Container 1
    olayLayer = new maps.Container(tileContainer, "Layer", {position:"absolute",left:"0px",top:"0px",zIndex:100});
    // Initialize empty Array of olayReserve1
    olayLayer.items = [];

    // Initialize Vector Overlay Container
    olayVector = new maps.Container(tileContainer, "OverlayVector", {position:"absolute",left:"0px",top:"0px",zIndex:101});
    // Initialize empty Array of olayVector
    olayVector.items = [];
    
    // Initialize SVG Overlay Container for Polyline
    olayPolyline = new maps.Container(tileContainer, "OverlayPolyline", {position:"absolute",left:"0px",top:"0px",zIndex:101});
    // Initialize empty Array of olayPolyline
    olayPolyline.items = [];
    // Initialize SVG Overlay Container for Polygon
    olayPolygon  = new maps.Container(tileContainer, "OverlayPolygon", {position:"absolute",left:"0px",top:"0px",zIndex:102});
    // Initialize empty Array of olayPolygon
    olayPolygon.items = [];
    // Initialize reserve Overlay Container 2 
    olayMarkerShadow = new maps.Container(tileContainer, "Reserve - Marker Shadow", {position:"absolute",left:"0px",top:"0px",zIndex:103});
    // Initialize empty Array of olayReserve2
    olayMarkerShadow.items = [];
    // Initialize reserve Overlay Container 3 
    olayReserve3 = new maps.Container(tileContainer, "Reserve - Marker Cross", {position:"absolute",left:"0px",top:"0px",zIndex:104});
    // Initialize empty Array of olayReserve3
    olayReserve3.items = [];
    // Initialize marker Overlay Container
    olayMarker   = new maps.Container(tileContainer, "OverlayMarker", {position:"absolute",left:"0px",top:"0px",zIndex:105,cursor:"default"});
    // Initialize empty Array of Marker
    olayMarker.items = [];    
    // Initialize reverse Overlay Container 4
    olayReserve4 = new maps.Container(tileContainer, "Reserve - IW Shadow", {position:"absolute",left:"0px",top:"0px",zIndex:106});
    // Initialize empty Array of olayReserve4
    olayReserve4.items = [];
    // Initialize reserve Overlay Container 5
    olayReserve5 = new maps.Container(tileContainer, "Reserve - IW???", {position:"absolute",left:"0px",top:"0px",zIndex:107});    
    // Initialize empty Array of olayReserve5
    olayReserve5.items = [];
    // Initialize InfoWindow Overlay Container
    olayInfoWindow  = new maps.Container(tileContainer, "OverlayInfoWindow", {position:"absolute",left:"0px",top:"0px",zIndex:108,cursor:"default"});    
            
    // Initialize drag start, drag finsih, and drag distance variable for dragging calculation (moving map)
    var dragStartPoint = new maps.Point(0,0);
    var dragFinishPoint = new maps.Point(0,0);
    var dragDistance = new maps.Point(0,0);
       
    // Initialize dragging for tileContainer using DOM Drag Library  
    Drag.init(tileContainer);    
    // Callback function from DOM Drag Library for tileContainer
    tileContainer.onDragStart = function(x,y,e) {
        e.style.cursor = 'url(' + J_CLOSEHAND_CUR + '), move';
        dragStartPoint.xy(x,y);
               
        //if (!e) e = window.event;
        //console.log(e.type);
        //console.log(e.button);
        //me.EventEx.fireEvent(null,this,'singlerightclick');
    }
    tileContainer.onDrag = function(x,y) {
		// Do nothing yet
    }
    tileContainer.onDragEnd = function(x,y,e) {
        e.style.cursor = 'url(' + J_OPENHAND_CUR + '), default';
        dragFinishPoint.xy(x,y);
        dragDistance.xy(dragFinishPoint.x - dragStartPoint.x, dragFinishPoint.y - dragStartPoint.y);
        
        if ((dragDistance.x == 0) && (dragDistance.y == 0)) return;
        
        // Update JCenterPt because move by user dragging (calculate by screen pixel moving)
        JCenterPt.x -= dragDistance.x;
        JCenterPt.y -= dragDistance.y;   
        // Update current JCenterLonLat base on current JCenterPt Update
        JCenterLonLat = pixelToLonLat(JCenterPt); 
        
        // Call redraw function for each TileMap that listed on tileContainer using inherited redraw function
        for (var i in tileContainer.items)
			tileContainer.items[i].redraw(dragDistance);
			
		// Call redraw function for Layer
		for (var i in olayLayer.items)
			olayLayer.items[i].obj.redraw();
			        
        // Testing JSONP using tileContainer onDragEnd event fire
        me.EventEx.fireEvent(null,this,'onDragEnd');
    }

	// InfoWindow
	this.infoWindow = new maps.InfoWindow();
	this.infoWindow.initialize(this);	
	
	// DOM Event
	this.Event = new maps.Event();
	
	// Extended Event
	this.EventEx = new maps.EventEx();
	
	// Custom Event 
	this.CustomEvent = new maps.CustomEvent();
	
	/**  Map Custom Events
    this.addmaptype = function(maptype) {}
    this.removemaptype = function(maptype) {}
    this.click = function(overlay, ll, overlayll) {}
    this.dblclick = function(overlay, ll) {}
    this.singlerightclick = function(point, src, overlay) {}
    this.movestart = function() {}
    this.move = function() {}
    this.moveend = function() {}
    this.zoomend = function(oldlevel, newlevel) {}
    this.maptypechanged = function() {}
    this.infowindowbeforeclose = function() {}
    this.infowindowclose = function() {}
    this.addoverlay = function(overlay) {}
    this.removeoverlay = function(overlay) {}
    this.clearoverlays = function() {}
    this.mouseover = function(ll) {}
    this.mouseout = function(ll) {}
    this.mousemove = function(ll) {}
    this.dragstart = function() {}
    this.drag = function() {}
    this.dragend = function() {}
    this.load = function() {}
    this.tilesloaded = function() {}
    this.headingchanged = function() {}
    **/ 
	
	
	// disable default contextmenu on browser when user click on map area
    me.div_.oncontextmenu = function() { return false; }
	//document.body.oncontextmenu = function () {
    //    return false;
    //}
	
	// alert people with message 
	var message = "Sorry, that function is disabled.\n\n";
	message += "This page is copyrighted, and ";
	message += "all content is protected."; 
/*
	function warning(e) {
		if (document.layers){
			document.captureEvents(Event.MOUSEDOWN);
			document.onmousedown= function(e) {
				if (document.layers||document.getElementById&&!document.all) {
					if (e.which==2||e.which==3) {
						alert(message); // FF
						return false;
					}
				}
			}			
		} else if (document.all && !document.getElementById) {
			document.onmousedown = function() {
				if (event.button==2) {
					alert(message); // IE
					return false;
				}
			}
		}
	}
	
	me.div_.onmousedown = warning;
	*/
	
	/*me.div_.onmousedown = function (e) {		
		console.log('event type:' + e.type);
		console.log('event button:' + e.button);
		var pt = dom.getMousePos(e);
		if (e.button == 2) {
				console.log(pt);
		}
		// added code to prevent on mousedown element bubbled
		//cancelBubble = true;
		//if (e.stopPropagation) e.stopPropagation();
	}*/

    // DOUBLE CLICK ON MAP FEATURE
    me.div_.ondblclick = function(e) {
        if (!defaultUI.zoom.doubleclick) return;
        var pt = dom.getMousePos(e);
        var x1 = parseInt(canvas.style.left) || parseInt(canvas.offsetLeft);
		var y1 = parseInt(canvas.style.top) || parseInt(canvas.offsetTop);
		// now add offsetParent : offsetTop and offsetLeft, because our canvas maybe relative from other div / frame container
		var op = canvas.offsetParent;
		while (op) {
			x1 = x1 + op.offsetLeft;
			y1 = y1 + op.offsetTop;
			op = op.offsetParent;
		}
        var ptx = pt.x - x1;
        var pty = pt.y - y1;
        var ll = me.fromContainerPixelToLonLat(new maps.Point(ptx,pty));
        me.zoomIn(ll, true);        
    }

    // add MagnifyingControl for mousewheel zoom in/zoom out effect
    var magnifyCtrl = new joaokho.maps.MagnifyingControl();
    this.addControl(magnifyCtrl);
		
	// MOUSEWHEEL SUPPORT
	/** This is high-level function.
	 * It must react to delta being more/less than zero.
	 */
	function handle(delta, ll, pt) {				
		if (!defaultUI.zoom.scrollwheel) return true;
        //console.log('handle delta:' + delta);
		if (delta < 0) {
            magnifyCtrl.animate(pt,1);
			me.zoomOut(ll); // your code here			
			//var zoom_decrease = Math.floor(Math.abs(delta) / 2);
			//var level = JLevel - zoom_decrease;
			//me.setZoom(level);
		} else {            
            magnifyCtrl.animate(pt,0);
			me.zoomIn(ll); // your code here
			//var zoom_increase = Math.floor(delta / 2);
			//var level = JLevel + zoom_increase;
			//me.setZoom(level);
		}
	}

	/** Event handler for mouse wheel event.
	 */
	function wheel(event){			    		
		var delta = 0;
		if (!event) /* For IE. */
			event = window.event;
            
		if (event.wheelDelta) { /* IE/Opera/Chrome */            
			delta = event.wheelDelta/120;            
            //console.log('masuk IE/Opera, delta:' + delta);
			/** In Opera 9, delta differs in sign as compared to IE.
			 */
			if (window.opera)   // special Opera case             
				delta = -delta;
		} else if (event.detail) { /* Mozilla case. */
			/** In Mozilla, sign of delta is different than in IE.
			 * Also, delta is multiple of 3.
			 */            
			delta = -event.detail/3;            
            //console.log('masuk FF, delta: ' + delta);
		}
                        
		/**checking mouse position inside our map_canvas boundary**/
		var mouse_xy = dom.getMousePos(event);
		var x1 = parseInt(canvas.style.left) || parseInt(canvas.offsetLeft);
		var y1 = parseInt(canvas.style.top) || parseInt(canvas.offsetTop);
		// now add offsetParent : offsetTop and offsetLeft, because our canvas maybe relative from other div / frame container
		var op = canvas.offsetParent;
		while (op) {
			x1 = x1 + op.offsetLeft;
			y1 = y1 + op.offsetTop;
			op = op.offsetParent;
		}
		var x2 = x1 + JMapSize.w;
		var y2 = y1 + JMapSize.h;		
		
		if (((mouse_xy.x > x1) && (mouse_xy.x < x2)) && ((mouse_xy.y > y1) && (mouse_xy.y < y2)))
		{
            var ptx = mouse_xy.x - x1;
            var pty = mouse_xy.y - y1;
            var ll = me.fromContainerPixelToLonLat(new maps.Point(ptx,pty));
            
			/** If delta is nonzero, handle it.
			 * Basically, delta is now positive if wheel was scrolled up,
			 * and negative, if wheel was scrolled down.
			 */
			if (delta)
                handle(delta, ll, {x:ptx,y:pty});

		} else return true;
		
		/** Prevent default actions caused by mouse wheel.
		 * That might be ugly, but we handle scrolls somehow
		 * anyway, so don't bother here..
		 */
        if (defaultUI.zoom.scrollwheel) {
            if (event.preventDefault)
                event.preventDefault();
            else
                event.returnValue = false;
            return false;
        } else {
            event.returnValue = true;
            return true;
        }
	}

	/** Initialization code. 
	 * If you use your own event management code, change it as required.
	 */
	if (window.addEventListener) {
		/** DOMMouseScroll is for mozilla. */
		window.addEventListener('DOMMouseScroll', wheel, false);
        //window.addEventListener('mousewheel', wheel, false);
    }
    /************
    * IE/Opera/Chrome
    * Can't use below code, because on Chrome & IE9, the mouse wheel scroll will fire twice, one for window another for document
    * window.onmousewheel = document.onmousewheel = wheel
    ****/
    document.onmousewheel = wheel;

    // function for re assign mouse scroll wheel, when it's overwritten by other.
    //this.reEnableWheelListener = function() {
    //    if (window.addEventListener)
	//		window.addEventListener('DOMMouseScroll', wheel, false);
    //    window.onmousewheel = document.onmousewheel = wheel;
    //}
						
    // Add Internal CopyrightControl that can't remove by user
    var CopyrightCtrl = new joaokho.maps.CopyrightControl();
    this.addControl(CopyrightCtrl);		
    
    // onDrag MapReference Event and internal mapRef variable and getMapRef function
    var mapRef = {};
    function mapReference(map) {
	    var ctr = me.getCenter();
		var lon = ctr.lon;
		var lat = ctr.lat;
        //console.log('mp');	
		JSONP.request(J_WSGI_URL + 'sdmap/bookref', {
			callbackKey: 'jsoncallback',
			params: { lon: lon, lat: lat },
			callback: function(obj) {
				mapRef = obj;
				me.EventEx.fireEvent(null,mapRef,'onMapRef');
			}
		}); 	
	}
	// Register mapReference on TileContainer onDragEnd Event & moveend Event 	
	this.EventEx.addListener(this.getTileContainer(),'onDragEnd', mapReference);
    this.EventEx.addListener(me,'moveend', mapReference);
	// function to get mapRef information
	this.getMapRef = function() { return mapRef; }
}
JMap = maps.Map;

maps.Icon = function(jicon, image, label, shadow) {    
    if (typeof jicon != "undefined") {
        this.iconSize = new maps.Size(32,32);
        this.image = J_DEFAULT_ICON_IMAGE[jicon];
        this.shadow = J_SHADOW_IMAGE;
        this.shadowSize = new maps.Size(59,32);
        this.iconAnchor = new maps.Point(16,32);
        this.infoWindowAnchor = new maps.Point(0, 32);
        this.label = label || null;
        this.transparent = null;
        this.imageMap = [15,32,13,21,7,13,7,6,12,1, 20,1,25,6,25,13,19,21,15,32];
        this.imageMapType = "poly";
        this.dragCrossAnchor = null;
        this.dragCrossSize = null;
        this.maxHeight = 13; // for dragCrossOver image distance with image icon
        this.sprite = null;       
    }
    
    if (typeof image != "undefined") this.image = image;    
    if (typeof label != "undefined") this.label = label;
}
JIcon = maps.Icon;

/** Marker with parameter p = Point , opt = object {} that can set any setting available **/
maps.Marker = function(p,opt) { 	
	var pointLL = new maps.LonLat(p.lon, p.lat);
	
	if (!opt) opt = {};
	var autoPan = opt.autoPan || false;
	var bouncy = opt.bouncy || false;
	var bounceGravity = opt.bounceGravity || 2.2;
	var bounceTimeout = opt.bounceTimeout || 2;
	var clickable = opt.clickable || true;
	var description = opt.description || null;
	var draggable = opt.draggable || false;
	var dragCrossMove = opt.dragCrossMove || false;
	var hide = opt.hide || false;
	var icon = opt.icon || new maps.Icon(J_DEFAULT_ICON);
	var id = opt.id || null;
	var title = opt.title || null; // tooltip string
	
	this.map_ = null;
	this.div_ = new maps.Container(null, id, {position:"absolute"});
	this.id_  = null;
	this.shadow_ = null;
	this.dragCross_ = null;	
	
	this.disableDragging = function() { draggable = false; }
	this.draggable = function() { return draggable; }
	this.draggingEnabled = function() { return draggable; }
	this.enableDragging = function() { draggable = true; }
	this.getIcon = function() { return icon; }	
	this.getLonLat = function() { return pointLL; }
	this.setLonLat = function(pt) { pointLL.ll(pt.lon, pt.lat); this.redraw(true); }
	this.isHidden = function() {}
	this.setImage = function(url) { icon.image = url; this.redraw(true); }
}
var F = function() {};
F.prototype = maps.Overlay.prototype;
maps.Marker.prototype = new F();
maps.Marker.constructor = maps.Marker;
maps.Marker.prototype.name = "Marker";
maps.Marker.prototype.hide = function() { this.div_.style.visibility = "hidden"; }
maps.Marker.prototype.show = function() { this.div_.style.visibility = "visible"; }
maps.Marker.prototype.initialize = function(map) {
	this.map_ = map;	
	this.id_ = map.getMarkerCounter();
	
	var p = map.getMarkerContainer();	
	var tc = map.getTileContainer();
	var tx = parseInt(tc.style.left);
	var ty = parseInt(tc.style.top);	
	var idx = p.items.length;	
	var conPt = map.fromLonLatToContainerPixel(this.getLonLat());
	var l = conPt.x - this.getIcon().iconAnchor.x; //drawX
	var t = conPt.y - this.getIcon().iconAnchor.y; //drawY	
	l = l - tx;
	t = t - ty;
	 
	var iconAnchor = this.getIcon().iconAnchor;  
	 
	function imageMap(parent, imObj, areaObj, event) {
		var imap = dom.ce("map");  // name (required attribute), id, class, title, style, mouse event
		var area = dom.ce("area"); // alt (required attribute), shape, coords, href, nohref, target
		
		imap.name = imObj.name;
		imap.id = imObj.name;
		dom.sss(imap, imObj.style);
		imap.title = imObj.title || null;
		imap.alt = imObj.title || null;
		
		dom.ppp(area, areaObj);
		dom.sss(area, areaObj.style);
		
		dom.ac(parent, imap);
		dom.ac(imap, area);                
	}        
	
	//div of each Marker Point
	//var d = new maps.Container(p, "marker", {position:"absolute", left:l+"px", top:t+"px"});
	var d = this.div_;
	if (!d.id)  d.id = "marker" + this.id_;
	//d.style.position = "absolute";
	d.style.left = l + "px";
	d.style.top = t + "px";
	dom.ac(p,d);
	//div handle for draging
	//var d_handle = new maps.Container(d, "handle", {});
	// marker icon	
	var icon_d = new maps.Image(d, 'image' + d.id, {border:"0px none", margin:"0px", padding:"0px", position:"absolute", width:this.getIcon().iconSize.w+"px", height:this.getIcon().iconSize.h+"px", left:"0px", top:"0px", zIndex:-1000000000+idx}, {useMap:"#m"+(idx)});
	icon_d.src = this.getIcon().image;
	// marker icon imageMap
	var shape = this.getIcon().imageMapType;
	var coords = this.getIcon().imageMap;
	var icon_map = new imageMap(d, 
		{name:"m"+(idx), style:{}, title:this.title, alt:this.title}, 
		{alt:"area test", href:"javascript:void(0)", shape:shape, coords:coords.join(','), style:{position:"absolute",left:"0px",top:"0px"}}, null);
	
	
	// marker shadow image
	var sc = map.getMarkerShadowContainer();	
	var icon_shadow = new maps.Image(sc, d.id + "_shadow", {left:l+"px", top:t+"px", border:"0px none", margin:"0px", padding:"0px",position:"absolute",width:this.getIcon().shadowSize.w+"px", height:this.getIcon().shadowSize.h+"px", zIndex:-2000000000+idx});
	icon_shadow.src = this.getIcon().shadow;
		
	// marker default dragCross sign	
	var icon_dragsign = new maps.Image(sc, d.id + "_dragCross", {left:l+8+"px", top:t+24+"px", border:"0px none", margin:"0px", padding:"0px",position:"absolute",width:"16px", height:"16px", zIndex:-3000000000+idx, visibility:"hidden"});
	icon_dragsign.src = J_DRAGCROSS_IMAGE;
	
	if (this.getIcon().label) {
		var div_label = dom.ce("div");
		div_label.className = "label_icon";
		div_label.style.width = this.getIcon().iconSize.w + "px";
		//div_label.style.backgroundColor = "red";
		div_label.style.textAlign = "center";
		div_label.style.fontSize = "12px";
		dom.ac(d,div_label);
				
		var icon_label = dom.ct(this.getIcon().label);
		dom.ac(div_label, icon_label);			
		
		//var span_label = dom.ce("span");
		//span_label.style.textAlign = "center";
		//span_label.style.verticalAlign = "baseline";
		//span_label.style.width = "32px";
		//span_label.style.float
		//dom.ac(d, span_label);		
		//var icon_label = dom.ct(this.getIcon().label);
		//dom.ac(span_label, icon_label);	
	}
		
	// draggable feature?			
	if (this.draggable()) {
		Drag.init(d);
		var me = this;
		var ds = null;		
		d.onDragStart = function() {
			var x = parseInt(this.style.left);
			var y = parseInt(this.style.top);
			ds = {x:x, y:y};
		}
		d.onDrag = function() {
			icon_shadow.style.left = d.style.left;
			icon_shadow.style.top = d.style.top;
			
			icon_dragsign.style.left = parseInt(d.style.left) + 8 + "px";
			icon_dragsign.style.top = parseInt(d.style.top) + 24 + "px";	
		}
		d.onDragEnd = function() {
			var x = parseInt(this.style.left);
			var y = parseInt(this.style.top);
			if ((ds.x == x) && (ds.y == y)) return;
			
			x += iconAnchor.x;
			y += iconAnchor.y;
			var ll = map.fromDivPixelToLonLat(new maps.Point(x,y));
			me.setLonLat(ll);				
		}
	} 
	      
	// keep reference of icon shadow and dragcross sing to object property   
	this.shadow_ = icon_shadow;
	this.dragCross_ = icon_dragsign;
}
maps.Marker.prototype.redraw = function(force) {
	if (!force) return;
	var tc = this.map_.getTileContainer();
	var tx = parseInt(tc.style.left);
	var ty = parseInt(tc.style.top);
	var conPt = this.map_.fromLonLatToContainerPixel(this.getLonLat());
	var l = conPt.x - this.getIcon().iconAnchor.x; //drawX
	var t = conPt.y - this.getIcon().iconAnchor.y; //drawY	
	l = l - tx;
	t = t - ty;
	this.div_.style.left = l + "px";
	this.div_.style.top = t + "px";
	
	this.shadow_.style.left = l + "px";
	this.shadow_.style.top = t + "px";
	
	this.dragCross_.style.left = l + 8 + "px";
	this.dragCross_.style.top = t + 24 + "px";
	
	// don't restore image
	//var imgNode = this.div_.firstChild;
	//imgNode.src = this.getIcon().image;
}
maps.Marker.prototype.remove = function() {
	var d = this.div_;
	var childs = d.childNodes;
	for (var i=0; i < childs.length; i++)
		d.removeChild(childs[i]);	
	var p = d.parentNode;
	p.removeChild(d);
	
	var s = this.shadow_;
	var dc = this.dragCross_;
	var p = s.parentNode;
	p.removeChild(s);
	p.removeChild(dc);
		
	this.div_ = null;
	this.map_ = null;
	delete this.div_;
	delete this.map_;	
}
maps.Marker.prototype.openInfoWindowHtml = function(content, opts) {
    this.map_.openInfoWindow(this.getLonLat(), node, options);
}
maps.Marker.prototype.openInfoWindow = function(node,options) {	
	this.map_.openInfoWindow(this.getLonLat(), node, options);
}
maps.Marker.prototype.openInfoWindowTabs = function(tab,options) {
	this.map_.openInfoWindowTabs(this.getLonLat(), tabs, options);
}
maps.Marker.prototype.openInfoWindowTabsHtml = function(tab,options) {
	this.map_openInfoWindowTabsHtml(this.getLonLat(), tab, options);
}
maps.Marker.prototype.showMapBlowup = function(options) {

}
maps.Marker.prototype.getTitle = function() {}
maps.Marker.prototype.closeInfoWindow = function() {}
maps.Marker.prototype.bindInfoWindow = function(node, options) {}
maps.Marker.prototype.bindInfoWindowHtml = function(text, options) {}
maps.Marker.prototype.bindInfoWindowTabs = function(tabElemArray, options) {}
maps.Marker.prototype.bindInfoWindowTabsHtml = function(tabStrArray, options) {}
JMarker = maps.Marker;

maps.Polygon = function(pts,s,opts) {
	if (!pts) pts = [];
	if (!s) s = {};
	if (!opts) opts = {};
	
	this.map_ = null;
	this.div_ = new maps.Container(null, "", {position:"absolute"});
	this.id_  = null;
	this.paper_ = null;	
	this.svg_ = null;
	var points = pts;
	var styles = s;	
	this.getPoints = function() { return points; }
	this.setPoints = function(pts) { points = pts; }
	this.setStyles = function(s) { styles = s; }
	this.getStyles = function() { return styles; }
}
var F = function() {};
F.prototype = maps.Overlay.prototype;
maps.Polygon.prototype = new F();
maps.Polygon.constructor = maps.Polygon;
maps.Polygon.prototype.name = "Polygon";
maps.Polygon.prototype.hide = function() { this.div_.style.visibility = "hidden"; }
maps.Polygon.prototype.show = function() { this.div_.style.visibility = "visible"; }
maps.Polygon.prototype.initialize = function(map) {
	this.map_ = map;
	var w = this.map_.getSize().w;
	var h = this.map_.getSize().h;
	var p = this.map_.getPolygonContainer();	
	var d = this.div_;	
	var tc = this.map_.getTileContainer();
	var l = parseInt(tc.style.left);
	var t = parseInt(tc.style.top);
	this.id_ = this.map_.getPolylineCounter();
	d.id = this.map_.getPolygonCounter();
	d.style.zIndex = -6000 - this.map_.getPolygonCounter();
	dom.ac(p,d);
	
	var styles = this.getStyles() ;
	var strokeWidth = parseInt(styles["stroke-width"],10) ;
	
	var x1,x2,y1,y2;
	var pointLL = null;
	var pointXY = [];	
	var pts = this.getPoints();
	var len = pts.length;
	pointXY[0] = this.map_.fromLonLatToContainerPixel(pts[0]);		
	pointXY[0].x -= l;
	pointXY[0].y -= t;
	
	x1 = pointXY[0].x;
	x2 = pointXY[0].x;
	y1 = pointXY[0].y;
	y2 = pointXY[0].y;
	
	for (var i=1; i < len; i++) {
		pointLL = this.getPoints()[i];
		pointXY[i] = this.map_.fromLonLatToContainerPixel(pointLL);
		pointXY[i].x -= l;
		pointXY[i].y -= t;
		
		if (pointXY[i].x < x1) x1 = pointXY[i].x;
		if (pointXY[i].x > x2) x2 = pointXY[i].x;
		if (pointXY[i].y < y1) y1 = pointXY[i].y;
		if (pointXY[i].y > y2) y2 = pointXY[i].y;	
	}
	d.style.left = (x1 - strokeWidth) + "px";
	d.style.top = (y1 - strokeWidth) + "px";	
	
	this.paper_ = Raphael(d,x2-x1+strokeWidth*2,y2-y1+strokeWidth*2);		
	
	pointXY[0].x = pointXY[0].x - x1 + strokeWidth;
	pointXY[0].y = pointXY[0].y - y1 + strokeWidth;
	
	polygon = 'M' + pointXY[0].toShortStr(' ') + ' L';
	for (var i=1; i<len; i++) {
		pointXY[i].x = pointXY[i].x - x1 + strokeWidth;
		pointXY[i].y = pointXY[i].y - y1 + strokeWidth;
		polygon += pointXY[i].toShortStr(' ') + ' ';		
	}
	this.svg_ = this.paper_.path(polygon).attr(this.getStyles());				
}
maps.Polygon.prototype.redraw = function(force) {
	if (!force) return;
	
	// clear all paper child object
	this.paper_.clear();
	// remove paper (svg tag) it self
	this.paper_.remove();
	// really..really make sure to clear from memory by assigning null :D
	this.svg_ = null;
	this.paper_ = null;	
		
	var d = this.div_;
	var t = this.map_.getTileContainer();
	var l = parseInt(t.style.left);
	var t = parseInt(t.style.top);
	var x1,x2,y1,y2;
	var pointLL = null;
	var pointXY = [];		
	var pts = this.getPoints();
	var len = pts.length;
	pointXY[0] = this.map_.fromLonLatToContainerPixel(pts[0]);	
	
	var styles = this.getStyles() ;
	var strokeWidth = parseInt(styles["stroke-width"],10) ;
	
	pointXY[0].x -= l;
	pointXY[0].y -= t;
	
	x1 = pointXY[0].x;
	x2 = pointXY[0].x;
	y1 = pointXY[0].y;
	y2 = pointXY[0].y;
	
	for (var i=1; i < len; i++) {
		pointLL = pts[i];
		pointXY[i] = this.map_.fromLonLatToContainerPixel(pointLL);	
		pointXY[i].x -= l;
		pointXY[i].y -= t;

		if (pointXY[i].x < x1) x1 = pointXY[i].x;
		if (pointXY[i].x > x2) x2 = pointXY[i].x;
		if (pointXY[i].y < y1) y1 = pointXY[i].y;
		if (pointXY[i].y > y2) y2 = pointXY[i].y;	
	}
		
	d.style.left = (x1 - strokeWidth) + "px";
	d.style.top = (y1 - strokeWidth) + "px";	
				
	this.paper_ = Raphael(d,x2-x1+strokeWidth*2,y2-y1+strokeWidth*2);
		
	pointXY[0].x = pointXY[0].x - x1 + strokeWidth;
	pointXY[0].y = pointXY[0].y - y1 + strokeWidth;
	
	polygon = 'M' + pointXY[0].toShortStr(' ') + ' L';
	for (var i=1; i<len; i++) {
		pointXY[i].x = pointXY[i].x - x1 + strokeWidth;
		pointXY[i].y = pointXY[i].y - y1 + strokeWidth;
		polygon += pointXY[i].toShortStr(' ') + ' ';		
	}
	this.svg_ = this.paper_.path(polygon).attr(this.getStyles());
}
maps.Polygon.prototype.remove = function() {	
	this.paper_.clear();
	this.paper_.remove();
	this.svg_ = null;
	this.paper_ = null;
	
	var d = this.div_;
	var childs = d.childNodes;
	for (var i=0; i < childs.length; i++)
		d.removeChild(childs[i]);	
	var p = d.parentNode;
	p.removeChild(d);	
	this.div_ = null;
	this.map_ = null;
	delete this.div_;
	delete this.map_;		
}
JPolygon = maps.Polygon;

// polyline ya
maps.Polyline = function(pts,s,opts) {
	if (!pts) pts = [];
	if (!s) s = {};
	if (!opts) opts = {};
	
	this.map_ = null;
	this.div_ = new maps.Container(null, "", {position:"absolute"});
	this.id_  = null;
	this.paper_ = null;	
	this.svg_ = null;
	var points = pts;
	var styles = s;	
	this.getPoints = function() { return points; }
	this.setPoints = function(pts) { points = pts; }
	this.setStyles = function(s) { styles = s; }
	this.getStyles = function() { return styles; }
}
var F = function() {};
F.prototype = maps.Overlay.prototype;
maps.Polyline.prototype = new F();
maps.Polyline.constructor = maps.Polyline;
maps.Polyline.prototype.name = "Polyline";
maps.Polyline.prototype.hide = function() { this.div_.style.visibility = "hidden"; }
maps.Polyline.prototype.show = function() { this.div_.style.visibility = "visible"; }
maps.Polyline.prototype.initialize = function(map) {
	this.map_ = map;
	var w = this.map_.getSize().w;
	var h = this.map_.getSize().h;
	var p = this.map_.getPolylineContainer();	
	var d = this.div_;	
	var tc = this.map_.getTileContainer();
	var l = parseInt(tc.style.left);
	var t = parseInt(tc.style.top);
	this.id_ = this.map_.getPolylineCounter();
	d.id = this.map_.getPolylineCounter();	
	d.style.zIndex = -6000 - this.map_.getPolylineCounter();
	dom.ac(p,d);
	
	var styles = this.getStyles() ;
	var strokeWidth = parseInt(styles["stroke-width"],10) ;
	
	var x1,x2,y1,y2;
	var pointLL = null;
	var pointXY = [];	
	var pts = this.getPoints();
	var len = pts.length;
	pointXY[0] = this.map_.fromLonLatToContainerPixel(pts[0]);	
	pointXY[0].x -= l;
	pointXY[0].y -= t;
	
	x1 = pointXY[0].x;
	x2 = pointXY[0].x;
	y1 = pointXY[0].y;
	y2 = pointXY[0].y;
	
	for (var i=1; i < len; i++) {
		pointLL = this.getPoints()[i];
		pointXY[i] = this.map_.fromLonLatToContainerPixel(pointLL);	
		pointXY[i].x -= l;
		pointXY[i].y -= t;
		
		if (pointXY[i].x < x1) x1 = pointXY[i].x;
		if (pointXY[i].x > x2) x2 = pointXY[i].x;
		if (pointXY[i].y < y1) y1 = pointXY[i].y;
		if (pointXY[i].y > y2) y2 = pointXY[i].y;	
	}	
	d.style.left = (x1 - strokeWidth) + "px";
	d.style.top = (y1 - strokeWidth) + "px";	
	
	this.paper_ = Raphael(d,x2-x1+strokeWidth*2,y2-y1+strokeWidth*2);		
	
	pointXY[0].x = pointXY[0].x - x1 + strokeWidth;
	pointXY[0].y = pointXY[0].y - y1 + strokeWidth;
	
	polyline = 'M' + pointXY[0].toShortStr(' ') + ' L';
	for (var i=1; i<len; i++) {
		pointXY[i].x = pointXY[i].x - x1 + strokeWidth;
		pointXY[i].y = pointXY[i].y - y1 + strokeWidth;
		polyline += pointXY[i].toShortStr(' ') + ' ';		
	}
	this.svg_ = this.paper_.path(polyline).attr(this.getStyles());				
}
maps.Polyline.prototype.redraw = function(force) {
	if (!force) return;	
	
	// clear all paper child object
	this.paper_.clear();
	// remove paper (svg tag) it self
	this.paper_.remove();
	// really..really make sure to clear from memory by assigning null :D
	this.svg_ = null;
	this.paper_ = null;	
		
	var d = this.div_;
	var tc = this.map_.getTileContainer();
	var l = parseInt(tc.style.left);
	var t = parseInt(tc.style.top);
	var x1,x2,y1,y2;
	var pointLL = null;
	var pointXY = [];		
	var pts = this.getPoints();
	var len = pts.length;
	pointXY[0] = this.map_.fromLonLatToContainerPixel(pts[0]);	
	
	var styles = this.getStyles() ;
	var strokeWidth = parseInt(styles["stroke-width"],10) ;
	
	pointXY[0].x -= l;
	pointXY[0].y -= t;
	
	x1 = pointXY[0].x;
	x2 = pointXY[0].x;
	y1 = pointXY[0].y;
	y2 = pointXY[0].y;
	
	for (var i=1; i < len; i++) {
		pointLL = pts[i];
		pointXY[i] = this.map_.fromLonLatToContainerPixel(pointLL);	
		pointXY[i].x -= l;
		pointXY[i].y -= t;

		if (pointXY[i].x < x1) x1 = pointXY[i].x;
		if (pointXY[i].x > x2) x2 = pointXY[i].x;
		if (pointXY[i].y < y1) y1 = pointXY[i].y;
		if (pointXY[i].y > y2) y2 = pointXY[i].y;	
	}
		
	d.style.left = (x1 - strokeWidth) + "px";
	d.style.top = (y1 - strokeWidth) + "px";	
				
	this.paper_ = Raphael(d,x2-x1+strokeWidth*2,y2-y1+strokeWidth*2);
		
	pointXY[0].x = pointXY[0].x - x1 + strokeWidth;
	pointXY[0].y = pointXY[0].y - y1 + strokeWidth;
	
	polyline = 'M' + pointXY[0].toShortStr(' ') + ' L';
	for (var i=1; i<len; i++) {
		pointXY[i].x = pointXY[i].x - x1 + strokeWidth;
		pointXY[i].y = pointXY[i].y - y1 + strokeWidth;
		polyline += pointXY[i].toShortStr(' ') + ' ';		
	}
	this.svg_ = this.paper_.path(polyline).attr(this.getStyles());
}
maps.Polyline.prototype.remove = function() {	
	this.paper_.clear();
	this.paper_.remove();
	this.svg_ = null;
	this.paper_ = null;
	
	var d = this.div_;
	var childs = d.childNodes;
	for (var i=0; i < childs.length; i++)
		d.removeChild(childs[i]);	
	var p = d.parentNode;
	p.removeChild(d);	
	this.div_ = null;
	this.map_ = null;
	delete this.div_;
	delete this.map_;		
}
JPolyline = maps.Polyline;

// Default CircleOptions Object
maps.CircleOptions = {
    center : new JLonLat(0.0,0.0),
    clickable: true,
    fillColor: "#00AAFF", 
    fillOpacity: 0.3,  // value between 0.0 and 1.0
    //map : null, // MapObject 
    radius: 1000, // radius in meter
    strokeColor: "#FFAA00",
    strokeOpacity: 1.0, // value between 0.0 and 1.0
    strokeWeight : 1,   // stroke width in pixel
    zIndex       : 0    // zIndex compared to others polys.
}
JCircleOptions = maps.CircleOptions;

maps.Circle = function(opts) {
	if (!opts) 
        this.Options = JCircleOptions;
    else
        this.Options = opts;
	
	this.map_ = null;
	this.div_ = new maps.Container(null, "", {position:"absolute"});
	this.id_  = null;
	this.paper_ = null;	
	this.svg_ = null;
}
var F = function() {};
F.prototype = maps.Overlay.prototype;
maps.Circle.prototype = new F();
maps.Circle.constructor = maps.Circle;
maps.Circle.prototype.name = "Vector";
maps.Circle.prototype.hide = function() { this.div_.style.visibility = "hidden"; }
maps.Circle.prototype.show = function() { this.div_.style.visibility = "visible"; }
maps.Circle.prototype.initialize = function(map) {
    var d = this.div_;    
    this.map_ = map;
    var v = map.getVectorContainer();
    this.id_ = map.getVectorCounter();
	d.id = map.getVectorCounter();
	d.style.zIndex = -6000 - map.getVectorCounter();
    dom.ac(v,d);
    var ctr = this.Options.center;
    var r   = this.Options.radius;    
    var tc = map.getTileContainer();
    var l = parseInt(tc.style.left);
    var t = parseInt(tc.style.top);
    var lvl = map.getLevel();
    var scale = J_PRECALC_SCALE_DEF[lvl];
    var radius_meter = this.Options.radius;
    var au_coordsys_dist = geo.getCoordSysDistance(ctr.lat) * 1000;  // in meter 
    var radius_pixel = au_coordsys_dist / J_MAP_WIDTH_DEF[lvl];
    var radius = Math.round(radius_meter / radius_pixel);
    
	var halfStrokeWidth = Math.ceil(parseInt(this.Options.strokeWeight,10)/2) ;
	
    var point = map.fromLonLatToContainerPixel(ctr);
    point.x -= l;
    point.y -= t;
    x1 = point.x - (radius+halfStrokeWidth) ;
    y1 = point.y - (radius+halfStrokeWidth) ;
    x2 = point.x + (radius+halfStrokeWidth) ;
    y2 = point.y + (radius+halfStrokeWidth) ;
    d.style.left = x1 + "px";
    d.style.top = y1 + "px";

    this.paper_ = Raphael(d,x2-x1,y2-y1);

    point.x -= x1;
    point.y -= y1;        
    this.svg_ = this.paper_.circle(point.x,point.y,radius);
    this.svg_.attr({"fill":this.Options.fillColor,
                   "fill-opacity":this.Options.fillOpacity,
                   "stroke":this.Options.strokeColor,
                   "stroke-opacity":this.Options.strokeOpacity,
                   "stroke-width":this.Options.strokeWeight});
    
}
maps.Circle.prototype.redraw = function(force) {
    if (!force) return;	
	
	// clear all paper child object
	this.paper_.clear();
	// remove paper (svg tag) it self
	this.paper_.remove();
	// really..really make sure to clear from memory by assigning null :D
	this.svg_ = null;
	this.paper_ = null;	

    var d = this.div_;    
    var map = this.map_;
    var ctr = this.Options.center;
    var r   = this.Options.radius;    
    var tc = map.getTileContainer();
    var l = parseInt(tc.style.left);
    var t = parseInt(tc.style.top);
    var lvl = map.getLevel();
    var scale = J_PRECALC_SCALE_DEF[lvl];
    var radius_meter = this.Options.radius;
    var au_coordsys_dist = geo.getCoordSysDistance(ctr.lat) * 1000;  // in meter 
    var radius_pixel = au_coordsys_dist / J_MAP_WIDTH_DEF[lvl];
    var radius = Math.round(radius_meter / radius_pixel);
    
    var point = map.fromLonLatToContainerPixel(ctr);
    point.x -= l;
    point.y -= t;
    x1 = point.x - radius;
    y1 = point.y - radius;
    x2 = point.x + radius;
    y2 = point.y + radius;
    d.style.left = x1 + "px";
    d.style.top = y1 + "px";

    this.paper_ = Raphael(d,x2-x1,y2-y1);

    point.x -= x1;
    point.y -= y1;        
    this.svg_ = this.paper_.circle(point.x,point.y,radius);
    this.svg_.attr({"fill":this.Options.fillColor,
                   "fill-opacity":this.Options.fillOpacity,
                   "stroke":this.Options.strokeColor,
                   "stroke-opacity":this.Options.strokeOpacity,
                   "stroke-width":this.Options.strokeWeight});

}
maps.Circle.prototype.remove = function() {
	this.paper_.clear();
	this.paper_.remove();
	this.svg_ = null;
	this.paper_ = null;
	
	var d = this.div_;
	var childs = d.childNodes;
	for (var i=0; i < childs.length; i++)
		d.removeChild(childs[i]);	
	var p = d.parentNode;
	p.removeChild(d);	
	this.div_ = null;
	this.map_ = null;
	delete this.div_;
	delete this.map_;		
}
maps.Circle.prototype.getBounds = function() {  } // not implemented yet
maps.Circle.prototype.getCenter = function() { return this.Options.center; }
maps.Circle.prototype.getRadius = function() { return this.Options.radius; }
maps.Circle.prototype.setCenter = function(ll) {
    if (ll && (ll instanceof JLonLat)) {
        this.Options.center = ll;
    this.redraw(true);
    }    
}
maps.Circle.prototype.setOptions = function(options) {
    for (var optionName in options) {
        if (optionName in this.Options) {
            this.Options[optionName] = options[optionName];
        }
        this.redraw(true);
    }
}
maps.Circle.prototype.setRadius = function(radius) {
    if (radius) {
        this.Options.radius = radius;
        this.redraw(true);
    }
}
JCircle = maps.Circle;

maps.Event = function() {
	this.eventList = []; // sample eventList item {elemen, event, function}
	// implement PPK simple event with some modify	
	this.addListener = function(obj,evt,fn) {
		var idx = this.eventList.length;
		this.eventList[idx] = {obj:obj,evt:evt,fn:fn};				
		if (typeof obj == "object") {
			if (obj.name == "Map") {
				obj = obj.div_;
			}
			if (obj.name in {'Marker':1,'TileMap':1,'Layer':1}) {
				obj = obj.div_;
			}
		}
				
		if (obj.addEventListener)
			obj.addEventListener(evt,fn,false);
		else if (obj.attachEvent)
			obj.attachEvent('on'+evt,fn);
	}
	this.removeListener = function(obj,evt,fn) {
		for (var i=0; i < this.eventList.length;i++)
			if ((obj === this.eventList[i].obj) && (evt === this.eventList[i].obj)) this.eventList.splice(i,1);
		if (obj.removeEventListener)
			obj.removeEventListener(evt,fn,false);
		else if (obj.detachEvent)
			obj.detachEvent('on'+evt,fn);
	}
}

maps.CustomEvent = function() {
	//name of the event
	this.eventName = arguments[0];
	var mEventName = this.eventName;

	//function to call on event fire
	var eventAction = null;

	//subscribe a function to the event
	this.subscribe = function(fn) {
		eventAction = fn;
	}

	//fire the event
	this.fire = function(sender, eventArgs) {
		this.eventName = eventName2;
		if(eventAction != null) {
			eventAction(sender, eventArgs);
		}
		else {
			alert('There was no function subscribed to the ' + mEventName + ' event!');
		}
	}
}
/** Sample to using Custom Event
 *  var myEvent = new CustomEvent("my event");
 *  myEvent.subscribe(function(sender, eventArgs) {
 * 		alert(eventArgs.message);
 *  });
 * 
 * 	myEvent.fire(null, {
 * 		message: 'you just witnessed the firing of a custom event called ' + this.eventName + '!'
 *	});
 * 
**/


maps.EventEx =  function () {	
	/**Function.prototype.bind = function (object)
	{
		var method = this;
		return function () {
			return method.apply(object, arguments);
		}
	}**/
	this.binding = function(obj,fn) {
		return function () { fn.apply(obj, arguments); }
	}
	
	this.events = [];      //custom events
	this.builtinEvts = []; //builtin events	
	this.getActionIdx = function(obj,evt,action,binding) {
		if (obj && evt) {
			var curel =  this.events[obj][evt];
			if (curel) {
				var len = curel.length;
				for (var i=len-1; i >= 0; i--) {
					if (curel[i].action == action && curel[i].binding == binding) {
						return i;
					}
				}
			} else {
				return -1;
			}				
		} 
		return -1;		
	}
	this.addListener = function(obj,evt,action,binding) {
		if (this.events[obj]) {
			if (this.events[obj][evt]) {
				if (this.getActionIdx(obj,evt,action,binding) == -1) {
					var curevt = this.events[obj][evt];
					curevt[curevt.length] = {action:action,binding:binding};
				}
			} else {
				this.events[obj][evt] = [];
				this.events[obj][evt][0] = {action:action,binding:binding};
			}
		} else {
			this.events[obj] =[];
			this.events[obj][evt] = [];
			this.events[obj][evt][0] = {action:action,binding:binding};
		}	
	}
	this.removeListener = function(obj,evt,action,binding) {
		if (this.events[obj]) {
			if (this.events[obj][evt]) {
				var idx = this.getActionIdx(obj,evt,action,binding);				
				if (idx >= 0) {
					this.events[obj][evt].splice(idx,1);
				}
			}
		}
	}
	this.fireEvent = function(e,obj,evt,args) {
		if (!e) { e = window.event; }
		if (obj && this.events) {
			var evtel = this.events[obj];
			if (evtel) {
				var curel = evtel[evt];
				if (curel) {
					for (var act in curel) {
						var action = curel[act].action;
						if (curel[act].binding) {
							//action = action.bind(curel[act].binding);
							this.bind(action, curel[act].binding);
						}                        
						action(e,args);
					}
				}
			}
		}	
	}
}

maps.ToolTip = {
	initialize : function() { alert('tooltip'); }
}

maps.InfoWindow = function() {			
	var shadow = false;	
	var closebtn = true;
	
	this.point_ = new maps.LonLat(0.0,0.0);
	this.map_ = null;
	this.div_ = null;
	this.width_ = null;
	this.height_ = null;
	
	this.tailImg_ = J_TAIL_IMAGE;
	this.iwImg_   = J_INFOWINDOW_IMAGE;
	this.content_ = null;
	
	this.tlDiv_ = null;
	this.tlImg_ = null;
	this.trDiv_ = null;
	this.trImg_ = null;
	this.tcDiv_ = null;
	this.tcImg_ = null;
	this.mlDiv_ = null;
	this.mlImg_ = null;
	this.mrDiv_ = null;
	this.mrImg_ = null;
	this.blDiv_ = null;
	this.blImg_ = null;
	this.brDiv_ = null;
	this.brImg_ = null;
	this.bcDiv_ = null;
	this.bcImg_ = null;
	this.tailDiv_= null;	
	this.iconClose_ = null;
	this.iconMaximize_ = null;
	this.iconRestore_ = null;
	this.bmap_  = null;
	
	this.initialize = function(map) {
		this.map_ = map;		
		var p = this.map_.getInfoWindowContainer();
		var d = new maps.Container(p, "infowindow", {position:"absolute",visibility:"hidden",zIndex:6000});
		var data = new maps.Container(d, "contents", {backgroundColor:"white",border:"0 none",overflow:"hidden",width:"1000px", display:"table-cell"});
		this.bmap_ = maps.Container(data, "blowupmap", {position:"absolute",visibility:"hidden"});
		
		data.innerHTML = "Hello World";	
		
		//this.bmap_ = maps.Container(p,"bmap",{position:"absolute",visibility:"hidden",width:"250px",height:"250px"})
		var w = data.offsetWidth || data.scrollWidth; //this.content_.clientWidth;
		var h = data.offsetHeight || data.scrollHeight; //this.content_.clientHeight;		
		
		var t = parseInt(data.style.top);
		var l = parseInt(data.style.left);
		
		// NOTE: some IE version did not recognize rgb, rgba function, so rgb(171,171,171) so need to change to #ABABAB
		
		this.tlDiv_ = new maps.Container(d, "topleftDiv", {position:"absolute",overflow:"hidden",left:"-20px",top:"-20px",width:"20px",height:"20px",filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src='"+J_TRANS_IMG+"';width:20px;height:20px:overflow:hidden;top:0px;left:0px"});
		this.tlImg_ = new maps.Image(this.tlDiv_, "topleftImg", {position:"absolute",border:"0 none",margin:"0px",padding:"0px",width:"1000px",height:"1000px",left:"0px",top:"0px",MozUserSelect:"none"}, {src:this.iwImg_});
		this.trDiv_ = new maps.Container(d, "toprightDiv", {position:"absolute",overflow:"hidden",left:w+"px",top:"-20px",width:"20px",height:"20px",filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src='"+J_TRANS_IMG+"';width:20px;height:20px:overflow:hidden;top:0px;left:0px"});
		this.trImg_ = new maps.Image(this.trDiv_, "toprightImg", {position:"absolute",border:"0 none",margin:"0px",padding:"0px",width:"1000px",height:"1000px",left:"-980px",top:"0px",MozUserSelect:"none"}, {src:this.iwImg_});
		//this.tcDiv_ = new maps.Container(d, "topcenterDiv", {position:"absolute",overflow:"hidden",left:"0px",top:"-20px",width:w+"px",height:"20px"});
		//this.tcImg_ = new maps.Image(this.tcDiv_, "topcenterImg", {position:"absolute",border:"0 none",margin:"0px",padding:"0px",width:"1000px",height:"1000px",left:"-20px",top:"0px",MozUserSelect:"none"}, {src:this.iwImg_});
		this.tcDiv_  = new maps.Container(d,"topcenterDiv", {position:"absolute",left:"0px",top:"-20px",width:w+"px",height:"20px",borderTop:"1px solid #ABABAB",backgroundColor:"white"});
				
		//this.mlDiv_ = new maps.Container(d, "middleleftDiv", {position:"absolute",overflow:"hidden",left:"-20px",top:"0px",width:"20px",height:h+"px"});
		//this.mlImg_ = new maps.Image(this.mlDiv_, "middleleftImg", {position:"absolute",border:"0 none",margin:"0px",padding:"0px",width:"1000px",height:"1000px",left:"0px",top:"-20px",MozUserSelect:"none"}, {src:this.iwImg_}); 
		this.mlDiv_ = new maps.Container(d, "middleleftDiv", {position:"absolute",left:"-20px",top:"0px",width:"20px",height:h+"px",borderLeft:"1px solid #ABABAB",backgroundColor:"white"});
		
		//this.mrDiv_ = new maps.Container(d, "middlerighttDiv", {position:"absolute",overflow:"hidden",left:w+"px",top:"0px",width:"20px",height:h+"px"});
		//this.mrImg_ = new maps.Image(this.mrDiv_, "middlerightImg", {position:"absolute",border:"0 none",margin:"0px",padding:"0px",width:"1000px",height:"1000px",left:"-980px",top:"-20px",MozUserSelect:"none"}, {src:this.iwImg_}); 
		this.mrDiv_ = new maps.Container(d, "middlerighttDiv", {position:"absolute",left:w+"px",top:"0px",width:"20px",height:h+"px",borderRight:"1px solid #ABABAB",backgroundColor:"white"});
		
		this.blDiv_ = new maps.Container(d, "bottomleftDiv", {position:"absolute",overflow:"hidden",left:"-20px",top:h+"px",width:"20px",height:"20px",filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src='"+J_TRANS_IMG+"';width:20px;height:20px:overflow:hidden;top:0px;left:0px"});
		this.blImg_ = new maps.Image(this.blDiv_, "bootomleftImg", {position:"absolute",border:"0 none",margin:"0px",padding:"0px",width:"1000px",height:"1000px",left:"0px",top:"-980px",MozUserSelect:"none"}, {src:this.iwImg_});
		this.brDiv_ = new maps.Container(d, "bottomrightDiv", {position:"absolute",overflow:"hidden",left:w+"px",top:h+"px",width:"20px",height:"20px",filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src='"+J_TRANS_IMG+"';width:20px;height:20px:overflow:hidden;top:0px;left:0px"});
		this.brImg_ = new maps.Image(this.brDiv_, "bottomrightImg", {position:"absolute",border:"0 none",margin:"0px",padding:"0px",width:"1000px",height:"1000px",left:"-980px",top:"-980px",MozUserSelect:"none"}, {src:this.iwImg_});
		//this.bcDiv_ = new maps.Container(d, "bottomcenterDiv", {position:"absolute",overflow:"hidden",left:"0px",top:h+"px",width:w+"px",height:"20px"});
		//this.bcImg_ = new maps.Image(this.bcDiv_, "bottomcenterImg", {position:"absolute",border:"0 none",margin:"0px",padding:"0px",width:"1000px",height:"1000px",left:"-20px",top:"-980px",MozUserSelect:"none"}, {src:this.iwImg_});
		this.bcDiv_ = new maps.Container(d, "bottomcenterDiv", {position:"absolute",left:"0px",top:h+"px",width:w+"px",height:"20px",borderBottom:"1px solid #ABABAB",backgroundColor:"white"});
		
		this.tailDiv_ = new maps.Container(d, "tailDiv", {position:"absolute",overflow:"hidden",left:w-56+"px",top:h+20-5+"px",width:"56px",height:"38px",filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src='"+J_TRANS_IMG+"';width:56px;height:38px:overflow:hidden;top:0px;left:0px"});
		this.tailImg_ = new maps.Image(this.tailDiv_, "tailImg", {position:"absolute",border:"0 none",margin:"0px",padding:"0px",width:"56px",height:"38px",left:"0px",top:"0px",MozUserSelect:"none"}, {src:this.tailImg_});

		this.iconClose_ = new maps.Image(d,"close_icon",{border:"0px none", margin:"0px", padding:"0px", position:"absolute", width:"12px", height:"12px", right:"-10px", top:"-10px"}, {src:J_STATIC_IMG_URL+"iw_close.gif"});
		//this.iconRestore_ = new maps.Image(d,"minus_icon",{border:"0px none", margin:"0px", padding:"0px", position:"absolute", width:"12px", height:"12px", right:"4px", top:"-10px"}, {src:J_STATIC_IMG_URL+"iw_minus.gif"});
		//this.iconMaximize_ = new maps.Image(d,"plus_icon",{border:"0px none", margin:"0px", padding:"0px", position:"absolute", width:"12px", height:"12px", right:"18px", top:"-10px"}, {src:J_STATIC_IMG_URL+"iw_plus.gif"});

		this.iconClose_.onclick = function() { 
			function hideIW() { d.style.visibility = "hidden"; }			
			//Effects.fadeOut(d,hideIW);		
			hideIW();
            // FireEvent
            map.EventEx.fireEvent(null,this, 'iwclose');            
		}
		
		var totalHeight = h + 20 + 20 + 33; // atas (20), bawah (20), tail (38-5)
		var totalWidth  = w + 20 + 20; // kiri
		var tail_location = new maps.Point(totalWidth-25-20,totalHeight-20);	

		var posMarker = this.map_.fromLonLatToContainerPixel(this.point_);
		posMarker.xy(posMarker.x + 32, posMarker.y - 32);
		var tx = parseInt(this.map_.getTileContainer().style.left);
		var ty = parseInt(this.map_.getTileContainer().style.top);
		
		d.style.left = posMarker.x - tail_location.x - tx + "px";
		d.style.top = posMarker.y - tail_location.y - ty + "px";	
	
		this.width_ = w;
		this.height_ = h;
		this.content_ = data;
		this.div_ = d;
		
	}
	this.remove = function() {
		window.stop;
		dom.empty(this.div_.parentNode);
	}
	this.hide = function() {
		this.div_.style.visibility = "hidden";
	}
	this.show = function() {
		this.div_.style.visibility = "visible";
	}
	this.isHidden = function() {
		return this.div_.style.visibility == "hidden" ? true : false;
	}
	this.reset = function() {  // means clear contents
		dom.empty(this.content_);
	}
	this.getPoint = function() {
		return this.point_;
	}
	this.setPoint = function(ll) {
		this.point_.ll(ll.lon,ll.lat);
	}
	this.setOptions = function(opts) {
	}
	this.adjust = function() {		
		// fixed this for IE7 Width/Height Problem
		var w = this.width_ = this.content_.offsetWidth || this.content_.scrollWidth; //this.content_.clientWidth;
		var h = this.height_ = this.content_.offsetHeight || this.content_.scrollHeight; //this.content_.clientHeight;		
		
		this.trDiv_.style.left = w + "px";
		this.tcDiv_.style.width = w + "px";
		this.mlDiv_.style.height = h + "px";
		this.mrDiv_.style.height = h + "px";		
		this.mrDiv_.style.left = (w-1) + "px";
		
		this.blDiv_.style.top = h + "px";
		this.brDiv_.style.left = w + "px";
		this.brDiv_.style.top = h + "px";
		this.bcDiv_.style.width = w + "px";
		this.bcDiv_.style.top = (h-1) + "px";
		
		this.tailDiv_.style.left = w - 56 + "px";
		this.tailDiv_.style.top = h + 20 - 5 + "px"; 
		
		var d = this.div_;				
				
		var totalHeight = h + 20 + 20 + 33; // atas (20), bawah (20), tail (38-5)
		var totalWidth  = w + 20 + 20; // kiri (20), kanan(20)
		var tail_location = new maps.Point(totalWidth-25-20,totalHeight-20); // right corner img width (-20), from right tail location(-25), bottom height(20)		
				
		var posMarker = this.map_.fromLonLatToContainerPixel(this.getPoint());
		posMarker.xy(posMarker.x, posMarker.y - 32); // y minus high icon, 
		var tx = parseInt(this.map_.getTileContainer().style.left);
		var ty = parseInt(this.map_.getTileContainer().style.top);		
				
		d.style.left = posMarker.x - tail_location.x - tx + "px";
		d.style.top = posMarker.y - tail_location.y - ty + "px";	
		
		// fixed this for IE7 Width/Height Problem
		this.content_.style.width = this.content_.offsetWidth || this.content_.scrollWidth + "px";
		this.content_.style.height = this.content_.offsetHeight || this.content_.scrollHeight + "px";
	} 
	this.puts = function(data, append) {		
		var content = this.content_;		
		var timeout = 10000;
		var counter = 100;		
		var iw = this;		
		this.adjust();
		this.hide();
		
		content.style.width = "auto";
		content.style.height = "auto";
		if (typeof data  == "string") {	
					
			if (append) 
				content.innerHTML += data; 
			else
				content.innerHTML = data; 
				
			function update() {						
				counter += 1000;                
				// fixed this for IE7 Width/Height Problem
				if ((iw.width_ != (iw.content_.offsetWidth || iw.content_.scrollWidth)) || (iw.height_ != (iw.content_.offsetHeight || iw.content_.scrollHeight)))				
					iw.adjust();					
				if ((iw.width_ == (iw.content_.offsetWidth || iw.content_.scrollWidth)) && (iw.height_ == (iw.content_.offsetHeight || iw.content_.scrollHeight))) {
					iw.show();
					//clearInterval(interval);			
				}
				if (counter >= timeout) { clearInterval(interval); iw.adjust(); }						
			}			
			var interval = setInterval(update, counter);
			
		}
		else {
			iw.reset();			
			content.appendChild(data);
			this.adjust();
		}									
		//content.onresize = function() { upd; } // for IE		
	}
	this.getContentContainer = function() {
		return this.content_;
	}
}

})();


// Third Party Library/Function
/**************************************************
 * dom-drag.js
 * 09.25.2001
 * www.youngpup.net
 * Script featured on Dynamic Drive (http://www.dynamicdrive.com) 12.08.2005
 **************************************************
 * 10.28.2001 - fixed minor bug where events
 * sometimes fired off the handle, not the root.
 **************************************************/

var Drag = {

	obj : null,

	init : function(o, oRoot, minX, maxX, minY, maxY, bSwapHorzRef, bSwapVertRef, fXMapper, fYMapper)
	{
		o.onmousedown	= Drag.start;

		o.hmode			= bSwapHorzRef ? false : true ;
		o.vmode			= bSwapVertRef ? false : true ;

		o.root = oRoot && oRoot != null ? oRoot : o ;

		if (o.hmode  && isNaN(parseInt(o.root.style.left  ))) o.root.style.left   = "0px";
		if (o.vmode  && isNaN(parseInt(o.root.style.top   ))) o.root.style.top    = "0px";
		if (!o.hmode && isNaN(parseInt(o.root.style.right ))) o.root.style.right  = "0px";
		if (!o.vmode && isNaN(parseInt(o.root.style.bottom))) o.root.style.bottom = "0px";

		o.minX	= typeof minX != 'undefined' ? minX : null;
		o.minY	= typeof minY != 'undefined' ? minY : null;
		o.maxX	= typeof maxX != 'undefined' ? maxX : null;
		o.maxY	= typeof maxY != 'undefined' ? maxY : null;

		o.xMapper = fXMapper ? fXMapper : null;
		o.yMapper = fYMapper ? fYMapper : null;

		o.root.onDragStart	= new Function();
		o.root.onDragEnd	= new Function();
		o.root.onDrag		= new Function();
	},

	start : function(e)
	{		
		var o = Drag.obj = this;		
		e = Drag.fixE(e);
		var y = parseInt(o.vmode ? o.root.style.top  : o.root.style.bottom);
		var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );
			    
		// added code to prevent on mousedown element bubbled
		//cancelBubble = true;
		//if (e.stopPropagation) e.stopPropagation();

        //if (e.preventDefault)
		//	e.preventDefault();
		//else
		//	e.returnValue= false;
				
	    // added code	    	    	    
	    //if (o.id == "marker") { 
	    //	o.lastChild.style.visibility = "visible";
	    //	o.firstChild.style.top = (parseInt(o.firstChild.style.top) - 3) + "px";	  
	    //	o.firstChild.nextSibling.nextSibling.style.top = (parseInt(o.firstChild.nextSibling.nextSibling.style.top) - 3) + "px";
	    //	o.firstChild.nextSibling.nextSibling.style.left = (parseInt(o.firstChild.nextSibling.nextSibling.style.left) + 3) + "px";	   				
	    //}
	       
		//o.root.onDragStart(x, y);
        // above default callback function parameter added object/element into below code 
        o.root.onDragStart(x, y, o);
        
		o.lastMouseX	= e.clientX;
		o.lastMouseY	= e.clientY;
		
		if (o.hmode) {
			if (o.minX != null)	o.minMouseX	= e.clientX - x + o.minX;
			if (o.maxX != null)	o.maxMouseX	= o.minMouseX + o.maxX - o.minX;
		} else {
			if (o.minX != null) o.maxMouseX = -o.minX + e.clientX + x;
			if (o.maxX != null) o.minMouseX = -o.maxX + e.clientX + x;
		}

		if (o.vmode) {
			if (o.minY != null)	o.minMouseY	= e.clientY - y + o.minY;
			if (o.maxY != null)	o.maxMouseY	= o.minMouseY + o.maxY - o.minY;
		} else {
			if (o.minY != null) o.maxMouseY = -o.minY + e.clientY + y;
			if (o.maxY != null) o.minMouseY = -o.maxY + e.clientY + y;
		}

		document.onmousemove	= Drag.drag;
		document.onmouseup		= Drag.end;		
		
		return false;
	},

	drag : function(e)
	{
		e = Drag.fixE(e);
		var o = Drag.obj;

		var ey	= e.clientY;
		var ex	= e.clientX;
		var y = parseInt(o.vmode ? o.root.style.top  : o.root.style.bottom);
		var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );
		var nx, ny;

		if (o.minX != null) ex = o.hmode ? Math.max(ex, o.minMouseX) : Math.min(ex, o.maxMouseX);
		if (o.maxX != null) ex = o.hmode ? Math.min(ex, o.maxMouseX) : Math.max(ex, o.minMouseX);
		if (o.minY != null) ey = o.vmode ? Math.max(ey, o.minMouseY) : Math.min(ey, o.maxMouseY);
		if (o.maxY != null) ey = o.vmode ? Math.min(ey, o.maxMouseY) : Math.max(ey, o.minMouseY);

		nx = x + ((ex - o.lastMouseX) * (o.hmode ? 1 : -1));
		ny = y + ((ey - o.lastMouseY) * (o.vmode ? 1 : -1));

		if (o.xMapper)		nx = o.xMapper(y);
		else if (o.yMapper)	ny = o.yMapper(x);

		Drag.obj.root.style[o.hmode ? "left" : "right"] = nx + "px";
		Drag.obj.root.style[o.vmode ? "top" : "bottom"] = ny + "px";
		Drag.obj.lastMouseX	= ex;
		Drag.obj.lastMouseY	= ey;
		Drag.obj.root.onDrag(nx, ny);
		return false;
	},

	end : function()
	{
		document.onmousemove = null;
		document.onmouseup   = null;
		
		//Drag.obj.root.onDragEnd(	parseInt(Drag.obj.root.style[Drag.obj.hmode ? "left" : "right"]), 
		//							parseInt(Drag.obj.root.style[Drag.obj.vmode ? "top" : "bottom"]));
		// Change above code into below
		var o = Drag.obj;
		Drag.obj.root.onDragEnd(parseInt(Drag.obj.root.style[Drag.obj.hmode ? "left" : "right"]), 
								parseInt(Drag.obj.root.style[Drag.obj.vmode ? "top" : "bottom"]),
								o);
									
		// added code							
		//if (o.id == "marker") { 
		//  	o.firstChild.style.top = (parseInt(o.firstChild.style.top) + 3) + "px";
		//  	o.firstChild.nextSibling.nextSibling.style.top = (parseInt(o.firstChild.nextSibling.nextSibling.style.top) + 3) + "px";
	    //	o.firstChild.nextSibling.nextSibling.style.left = (parseInt(o.firstChild.nextSibling.nextSibling.style.left) - 3) + "px";
    	//	o.lastChild.style.visibility = "hidden"; 
    	//}
									
		Drag.obj = null;
	},

	fixE : function(e)
	{
		if (typeof e == 'undefined') e = window.event;
		if (typeof e.layerX == 'undefined') e.layerX = e.offsetX;
		if (typeof e.layerY == 'undefined') e.layerY = e.offsetY;
		return e;
	}
};

// Code from : http://willcode4beer.com/tips.jsp?set=bubbleTooltips
// also use on Bayu MapJS 
var Effects = {
  fadeIn : function(elem, maxOpac) {
    elem.fadeIn = Effects._fadeIn;
    elem.maxOpac = maxOpac;
    elem.curOpac = 0;
    this.cancelCurrent();
    elem.fadeIn();
  },
  fadeOut : function(elem, fadeDoneF) {
    elem.fadeOut = Effects._fadeOut;
    elem.fadeOutDone = fadeDoneF;
    this.cancelCurrent();
    elem.fadeOut();
  },
  cancelCurrent : function() {
    clearTimeout(window.evtId);
  },
  _fadeIn : function() {
    if((+this.curOpac) < (+this.maxOpac)) {
      this.curOpac = (+this.curOpac) + (0.05);
      Effects.setOpacity(this, this.curOpac);
      window.fadeInElem = this;      
      window.evtId = setTimeout(function() { this.fadeInElem.fadeIn(); }, 30);
    }
    else {
      Effects.setOpacity(this, this.maxOpac);
      window.fadeInElem = null;
    }
  },
  _fadeOut : function() {
    if((+this.curOpac) > 0) {
      this.curOpac = Math.max(0, (+this.curOpac) - (0.20));
      Effects.setOpacity(this, this.curOpac);
      window.fadeOutElem = this;
      window.evtId = setTimeout(function() { this.fadeOutElem.fadeOut(); }, 30);
    }
    else if(this.fadeOutDone) {
      this.fadeOutDone();
      window.fadeOutElem = null;
    }
  },
  setOpacity : function(elem, opac) {
    elem.style.filter = "alpha(opacity:"+((+opac)*100)+")";
    elem.style.KHTMLOpacity = opac;
    elem.style.MozOpacity = opac;
    elem.style.opacity = opac;
  }
};

/*
    http://www.JSON.org/json2.js
    2010-03-20

    Public Domain.

    NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.

    See http://www.JSON.org/js.html


    This code should be minified before deployment.
    See http://javascript.crockford.com/jsmin.html

    USE YOUR OWN COPY. IT IS EXTREMELY UNWISE TO LOAD CODE FROM SERVERS YOU DO
    NOT CONTROL.
*/
// Create a JSON object only if one does not already exist. We create the
// methods in a closure to avoid creating global variables.
if(!this.JSON){this.JSON={}}(function(){function f(n){return n<10?"0"+n:n}if(typeof Date.prototype.toJSON!=="function"){Date.prototype.toJSON=function(key){return isFinite(this.valueOf())?this.getUTCFullYear()+"-"+f(this.getUTCMonth()+1)+"-"+f(this.getUTCDate())+"T"+f(this.getUTCHours())+":"+f(this.getUTCMinutes())+":"+f(this.getUTCSeconds())+"Z":null};String.prototype.toJSON=Number.prototype.toJSON=Boolean.prototype.toJSON=function(key){return this.valueOf()}}var cx=/[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,escapable=/[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,gap,indent,meta={"\b":"\\b","\t":"\\t","\n":"\\n","\f":"\\f","\r":"\\r",'"':'\\"',"\\":"\\\\"},rep;function quote(string){escapable.lastIndex=0;return escapable.test(string)?'"'+string.replace(escapable,function(a){var c=meta[a];return typeof c==="string"?c:"\\u"+("0000"+a.charCodeAt(0).toString(16)).slice(-4)})+'"':'"'+string+'"'}function str(key,holder){var i,k,v,length,mind=gap,partial,value=holder[key];if(value&&typeof value==="object"&&typeof value.toJSON==="function"){value=value.toJSON(key)}if(typeof rep==="function"){value=rep.call(holder,key,value)}switch(typeof value){case"string":return quote(value);case"number":return isFinite(value)?String(value):"null";case"boolean":case"null":return String(value);case"object":if(!value){return"null"}gap+=indent;partial=[];if(Object.prototype.toString.apply(value)==="[object Array]"){length=value.length;for(i=0;i<length;i+=1){partial[i]=str(i,value)||"null"}v=partial.length===0?"[]":gap?"[\n"+gap+partial.join(",\n"+gap)+"\n"+mind+"]":"["+partial.join(",")+"]";gap=mind;return v}if(rep&&typeof rep==="object"){length=rep.length;for(i=0;i<length;i+=1){k=rep[i];if(typeof k==="string"){v=str(k,value);if(v){partial.push(quote(k)+(gap?": ":":")+v)}}}}else{for(k in value){if(Object.hasOwnProperty.call(value,k)){v=str(k,value);if(v){partial.push(quote(k)+(gap?": ":":")+v)}}}}v=partial.length===0?"{}":gap?"{\n"+gap+partial.join(",\n"+gap)+"\n"+mind+"}":"{"+partial.join(",")+"}";gap=mind;return v}}if(typeof JSON.stringify!=="function"){JSON.stringify=function(value,replacer,space){var i;gap="";indent="";if(typeof space==="number"){for(i=0;i<space;i+=1){indent+=" "}}else{if(typeof space==="string"){indent=space}}rep=replacer;if(replacer&&typeof replacer!=="function"&&(typeof replacer!=="object"||typeof replacer.length!=="number")){throw new Error("JSON.stringify")}return str("",{"":value})}}if(typeof JSON.parse!=="function"){JSON.parse=function(text,reviver){var j;function walk(holder,key){var k,v,value=holder[key];if(value&&typeof value==="object"){for(k in value){if(Object.hasOwnProperty.call(value,k)){v=walk(value,k);if(v!==undefined){value[k]=v}else{delete value[k]}}}}return reviver.call(holder,key,value)}text=String(text);cx.lastIndex=0;if(cx.test(text)){text=text.replace(cx,function(a){return"\\u"+("0000"+a.charCodeAt(0).toString(16)).slice(-4)})}if(/^[\],:{}\s]*$/.test(text.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g,"@").replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g,"]").replace(/(?:^|:|,)(?:\s*\[)+/g,""))){j=eval("("+text+")");return typeof reviver==="function"?walk({"":j},""):j}throw new SyntaxError("JSON.parse")}}}());

/*
 * Raphael 1.4.3 - JavaScript Vector Library
 *
 * Copyright (c) 2010 Dmitry Baranovskiy (http://raphaeljs.com)
 * Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license.
 */
Raphael=function(){function m(){if(m.is(arguments[0],U)){for(var a=arguments[0],b=Aa[K](m,a.splice(0,3+m.is(a[0],O))),c=b.set(),d=0,f=a[o];d<f;d++){var e=a[d]||{};nb.test(e.type)&&c[E](b[e.type]().attr(e))}return c}return Aa[K](m,arguments)}m.version="1.4.3";var V=/[, ]+/,nb=/^(circle|rect|path|ellipse|text|image)$/,p="prototype",z="hasOwnProperty",C=document,X=window,La={was:Object[p][z].call(X,"Raphael"),is:X.Raphael};function G(){}var y="appendChild",K="apply",M="concat",Ba="createTouch"in C,s=
"",P=" ",H="split",Ma="click dblclick mousedown mousemove mouseout mouseover mouseup touchstart touchmove touchend orientationchange touchcancel gesturestart gesturechange gestureend"[H](P),Ca={mousedown:"touchstart",mousemove:"touchmove",mouseup:"touchend"},Q="join",o="length",ca=String[p].toLowerCase,w=Math,Y=w.max,$=w.min,O="number",ea="string",U="array",N="toString",aa="fill",ob=Object[p][N],D=w.pow,E="push",ga=/^(?=[\da-f]$)/,Na=/^url\(['"]?([^\)]+?)['"]?\)$/i,pb=/^\s*((#[a-f\d]{6})|(#[a-f\d]{3})|rgba?\(\s*([\d\.]+\s*,\s*[\d\.]+\s*,\s*[\d\.]+(?:\s*,\s*[\d\.]+)?)\s*\)|rgba?\(\s*([\d\.]+%\s*,\s*[\d\.]+%\s*,\s*[\d\.]+%(?:\s*,\s*[\d\.]+%))\s*\)|hs[bl]\(\s*([\d\.]+\s*,\s*[\d\.]+\s*,\s*[\d\.]+)\s*\)|hs[bl]\(\s*([\d\.]+%\s*,\s*[\d\.]+%\s*,\s*[\d\.]+%)\s*\))\s*$/i,
F=w.round,W="setAttribute",A=parseFloat,da=parseInt,Da=" progid:DXImageTransform.Microsoft",pa=String[p].toUpperCase,qa={blur:0,"clip-rect":"0 0 1e9 1e9",cursor:"default",cx:0,cy:0,fill:"#fff","fill-opacity":1,font:'10px "Arial"',"font-family":'"Arial"',"font-size":"10","font-style":"normal","font-weight":400,gradient:0,height:0,href:"http://raphaeljs.com/",opacity:1,path:"M0,0",r:0,rotation:0,rx:0,ry:0,scale:"1 1",src:"",stroke:"#000","stroke-dasharray":"","stroke-linecap":"butt","stroke-linejoin":"butt",
"stroke-miterlimit":0,"stroke-opacity":1,"stroke-width":1,target:"_blank","text-anchor":"middle",title:"Raphael",translation:"0 0",width:0,x:0,y:0},Ea={along:"along",blur:O,"clip-rect":"csv",cx:O,cy:O,fill:"colour","fill-opacity":O,"font-size":O,height:O,opacity:O,path:"path",r:O,rotation:"csv",rx:O,ry:O,scale:"csv",stroke:"colour","stroke-opacity":O,"stroke-width":O,translation:"csv",width:O,x:O,y:O},I="replace";m.type=X.SVGAngle||C.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure",
"1.1")?"SVG":"VML";if(m.type=="VML"){var ha=C.createElement("div");ha.innerHTML="<!--[if vml]><br><br><![endif]--\>";if(ha.childNodes[o]!=2)return m.type=null;ha=null}m.svg=!(m.vml=m.type=="VML");G[p]=m[p];m._id=0;m._oid=0;m.fn={};m.is=function(a,b){b=ca.call(b);return b=="object"&&a===Object(a)||b=="undefined"&&typeof a==b||b=="null"&&a==null||ca.call(ob.call(a).slice(8,-1))==b};m.setWindow=function(a){X=a;C=X.document};function ra(a){if(m.vml){var b=/^\s+|\s+$/g;ra=T(function(d){var f;d=(d+s)[I](b,
s);try{var e=new X.ActiveXObject("htmlfile");e.write("<body>");e.close();f=e.body}catch(g){f=X.createPopup().document.body}e=f.createTextRange();try{f.style.color=d;var h=e.queryCommandValue("ForeColor");h=(h&255)<<16|h&65280|(h&16711680)>>>16;return"#"+("000000"+h[N](16)).slice(-6)}catch(i){return"none"}})}else{var c=C.createElement("i");c.title="Rapha\u00ebl Colour Picker";c.style.display="none";C.body[y](c);ra=T(function(d){c.style.color=d;return C.defaultView.getComputedStyle(c,s).getPropertyValue("color")})}return ra(a)}
function qb(){return"hsb("+[this.h,this.s,this.b]+")"}function rb(){return this.hex}m.hsb2rgb=T(function(a,b,c){if(m.is(a,"object")&&"h"in a&&"s"in a&&"b"in a){c=a.b;b=a.s;a=a.h}var d;if(c==0)return{r:0,g:0,b:0,hex:"#000"};if(a>1||b>1||c>1){a/=255;b/=255;c/=255}d=~~(a*6);a=a*6-d;var f=c*(1-b),e=c*(1-b*a),g=c*(1-b*(1-a));a=[c,e,f,f,g,c,c][d];b=[g,c,c,e,f,f,g][d];d=[f,f,g,c,c,e,f][d];a*=255;b*=255;d*=255;c={r:a,g:b,b:d,toString:rb};a=(~~a)[N](16);b=(~~b)[N](16);d=(~~d)[N](16);a=a[I](ga,"0");b=b[I](ga,
"0");d=d[I](ga,"0");c.hex="#"+a+b+d;return c},m);m.rgb2hsb=T(function(a,b,c){if(m.is(a,"object")&&"r"in a&&"g"in a&&"b"in a){c=a.b;b=a.g;a=a.r}if(m.is(a,ea)){var d=m.getRGB(a);a=d.r;b=d.g;c=d.b}if(a>1||b>1||c>1){a/=255;b/=255;c/=255}var f=Y(a,b,c),e=$(a,b,c);d=f;if(e==f)return{h:0,s:0,b:f};else{var g=f-e;e=g/f;a=a==f?(b-c)/g:b==f?2+(c-a)/g:4+(a-b)/g;a/=6;a<0&&a++;a>1&&a--}return{h:a,s:e,b:d,toString:qb}},m);var sb=/,?([achlmqrstvxz]),?/gi,sa=/\s*,\s*/,tb={hs:1,rg:1};m._path2string=function(){return this.join(",")[I](sb,
"$1")};function T(a,b,c){function d(){var f=Array[p].slice.call(arguments,0),e=f[Q]("\u25ba"),g=d.cache=d.cache||{},h=d.count=d.count||[];if(g[z](e))return c?c(g[e]):g[e];h[o]>=1000&&delete g[h.shift()];h[E](e);g[e]=a[K](b,f);return c?c(g[e]):g[e]}return d}m.getRGB=T(function(a){if(!a||(a+=s).indexOf("-")+1)return{r:-1,g:-1,b:-1,hex:"none",error:1};if(a=="none")return{r:-1,g:-1,b:-1,hex:"none"};!(tb[z](a.substring(0,2))||a.charAt()=="#")&&(a=ra(a));var b,c,d,f,e;if(a=a.match(pb)){if(a[2]){d=da(a[2].substring(5),
16);c=da(a[2].substring(3,5),16);b=da(a[2].substring(1,3),16)}if(a[3]){d=da((e=a[3].charAt(3))+e,16);c=da((e=a[3].charAt(2))+e,16);b=da((e=a[3].charAt(1))+e,16)}if(a[4]){a=a[4][H](sa);b=A(a[0]);c=A(a[1]);d=A(a[2]);f=A(a[3])}if(a[5]){a=a[5][H](sa);b=A(a[0])*2.55;c=A(a[1])*2.55;d=A(a[2])*2.55;f=A(a[3])}if(a[6]){a=a[6][H](sa);b=A(a[0]);c=A(a[1]);d=A(a[2]);return m.hsb2rgb(b,c,d)}if(a[7]){a=a[7][H](sa);b=A(a[0])*2.55;c=A(a[1])*2.55;d=A(a[2])*2.55;return m.hsb2rgb(b,c,d)}a={r:b,g:c,b:d};b=(~~b)[N](16);
c=(~~c)[N](16);d=(~~d)[N](16);b=b[I](ga,"0");c=c[I](ga,"0");d=d[I](ga,"0");a.hex="#"+b+c+d;isFinite(A(f))&&(a.o=f);return a}return{r:-1,g:-1,b:-1,hex:"none",error:1}},m);m.getColor=function(a){a=this.getColor.start=this.getColor.start||{h:0,s:1,b:a||0.75};var b=this.hsb2rgb(a.h,a.s,a.b);a.h+=0.075;if(a.h>1){a.h=0;a.s-=0.2;a.s<=0&&(this.getColor.start={h:0,s:1,b:a.b})}return b.hex};m.getColor.reset=function(){delete this.start};var ub=/([achlmqstvz])[\s,]*((-?\d*\.?\d*(?:e[-+]?\d+)?\s*,?\s*)+)/ig,
vb=/(-?\d*\.?\d*(?:e[-+]?\d+)?)\s*,?\s*/ig;m.parsePathString=T(function(a){if(!a)return null;var b={a:7,c:6,h:1,l:2,m:2,q:4,s:4,t:2,v:1,z:0},c=[];if(m.is(a,U)&&m.is(a[0],U))c=ta(a);c[o]||(a+s)[I](ub,function(d,f,e){var g=[];d=ca.call(f);e[I](vb,function(h,i){i&&g[E](+i)});if(d=="m"&&g[o]>2){c[E]([f][M](g.splice(0,2)));d="l";f=f=="m"?"l":"L"}for(;g[o]>=b[d];){c[E]([f][M](g.splice(0,b[d])));if(!b[d])break}});c[N]=m._path2string;return c});m.findDotsAtSegment=function(a,b,c,d,f,e,g,h,i){var j=1-i,l=
D(j,3)*a+D(j,2)*3*i*c+j*3*i*i*f+D(i,3)*g;j=D(j,3)*b+D(j,2)*3*i*d+j*3*i*i*e+D(i,3)*h;var n=a+2*i*(c-a)+i*i*(f-2*c+a),r=b+2*i*(d-b)+i*i*(e-2*d+b),q=c+2*i*(f-c)+i*i*(g-2*f+c),k=d+2*i*(e-d)+i*i*(h-2*e+d);a=(1-i)*a+i*c;b=(1-i)*b+i*d;f=(1-i)*f+i*g;e=(1-i)*e+i*h;h=90-w.atan((n-q)/(r-k))*180/w.PI;(n>q||r<k)&&(h+=180);return{x:l,y:j,m:{x:n,y:r},n:{x:q,y:k},start:{x:a,y:b},end:{x:f,y:e},alpha:h}};var va=T(function(a){if(!a)return{x:0,y:0,width:0,height:0};a=ua(a);for(var b=0,c=0,d=[],f=[],e,g=0,h=a[o];g<h;g++){e=
a[g];if(e[0]=="M"){b=e[1];c=e[2];d[E](b);f[E](c)}else{b=wb(b,c,e[1],e[2],e[3],e[4],e[5],e[6]);d=d[M](b.min.x,b.max.x);f=f[M](b.min.y,b.max.y);b=e[5];c=e[6]}}a=$[K](0,d);e=$[K](0,f);return{x:a,y:e,width:Y[K](0,d)-a,height:Y[K](0,f)-e}});function ta(a){var b=[];if(!m.is(a,U)||!m.is(a&&a[0],U))a=m.parsePathString(a);for(var c=0,d=a[o];c<d;c++){b[c]=[];for(var f=0,e=a[c][o];f<e;f++)b[c][f]=a[c][f]}b[N]=m._path2string;return b}var Oa=T(function(a){if(!m.is(a,U)||!m.is(a&&a[0],U))a=m.parsePathString(a);
var b=[],c=0,d=0,f=0,e=0,g=0;if(a[0][0]=="M"){c=a[0][1];d=a[0][2];f=c;e=d;g++;b[E](["M",c,d])}g=g;for(var h=a[o];g<h;g++){var i=b[g]=[],j=a[g];if(j[0]!=ca.call(j[0])){i[0]=ca.call(j[0]);switch(i[0]){case "a":i[1]=j[1];i[2]=j[2];i[3]=j[3];i[4]=j[4];i[5]=j[5];i[6]=+(j[6]-c).toFixed(3);i[7]=+(j[7]-d).toFixed(3);break;case "v":i[1]=+(j[1]-d).toFixed(3);break;case "m":f=j[1];e=j[2];default:for(var l=1,n=j[o];l<n;l++)i[l]=+(j[l]-(l%2?c:d)).toFixed(3)}}else{b[g]=[];if(j[0]=="m"){f=j[1]+c;e=j[2]+d}i=0;for(l=
j[o];i<l;i++)b[g][i]=j[i]}j=b[g][o];switch(b[g][0]){case "z":c=f;d=e;break;case "h":c+=+b[g][j-1];break;case "v":d+=+b[g][j-1];break;default:c+=+b[g][j-2];d+=+b[g][j-1]}}b[N]=m._path2string;return b},0,ta),ka=T(function(a){if(!m.is(a,U)||!m.is(a&&a[0],U))a=m.parsePathString(a);var b=[],c=0,d=0,f=0,e=0,g=0;if(a[0][0]=="M"){c=+a[0][1];d=+a[0][2];f=c;e=d;g++;b[0]=["M",c,d]}g=g;for(var h=a[o];g<h;g++){var i=b[g]=[],j=a[g];if(j[0]!=pa.call(j[0])){i[0]=pa.call(j[0]);switch(i[0]){case "A":i[1]=j[1];i[2]=
j[2];i[3]=j[3];i[4]=j[4];i[5]=j[5];i[6]=+(j[6]+c);i[7]=+(j[7]+d);break;case "V":i[1]=+j[1]+d;break;case "H":i[1]=+j[1]+c;break;case "M":f=+j[1]+c;e=+j[2]+d;default:for(var l=1,n=j[o];l<n;l++)i[l]=+j[l]+(l%2?c:d)}}else{l=0;for(n=j[o];l<n;l++)b[g][l]=j[l]}switch(i[0]){case "Z":c=f;d=e;break;case "H":c=i[1];break;case "V":d=i[1];break;default:c=b[g][b[g][o]-2];d=b[g][b[g][o]-1]}}b[N]=m._path2string;return b},null,ta);function wa(a,b,c,d){return[a,b,c,d,c,d]}function Pa(a,b,c,d,f,e){var g=1/3,h=2/3;return[g*
a+h*c,g*b+h*d,g*f+h*c,g*e+h*d,f,e]}function Qa(a,b,c,d,f,e,g,h,i,j){var l=w.PI,n=l*120/180,r=l/180*(+f||0),q=[],k,t=T(function(J,fa,xa){var xb=J*w.cos(xa)-fa*w.sin(xa);J=J*w.sin(xa)+fa*w.cos(xa);return{x:xb,y:J}});if(j){x=j[0];k=j[1];e=j[2];B=j[3]}else{k=t(a,b,-r);a=k.x;b=k.y;k=t(h,i,-r);h=k.x;i=k.y;w.cos(l/180*f);w.sin(l/180*f);k=(a-h)/2;x=(b-i)/2;B=k*k/(c*c)+x*x/(d*d);if(B>1){B=w.sqrt(B);c=B*c;d=B*d}B=c*c;var L=d*d;B=(e==g?-1:1)*w.sqrt(w.abs((B*L-B*x*x-L*k*k)/(B*x*x+L*k*k)));e=B*c*x/d+(a+h)/2;var B=
B*-d*k/c+(b+i)/2,x=w.asin(((b-B)/d).toFixed(7));k=w.asin(((i-B)/d).toFixed(7));x=a<e?l-x:x;k=h<e?l-k:k;x<0&&(x=l*2+x);k<0&&(k=l*2+k);if(g&&x>k)x-=l*2;if(!g&&k>x)k-=l*2}l=k-x;if(w.abs(l)>n){q=k;l=h;L=i;k=x+n*(g&&k>x?1:-1);h=e+c*w.cos(k);i=B+d*w.sin(k);q=Qa(h,i,c,d,f,0,g,l,L,[k,q,e,B])}l=k-x;f=w.cos(x);e=w.sin(x);g=w.cos(k);k=w.sin(k);l=w.tan(l/4);c=4/3*c*l;l=4/3*d*l;d=[a,b];a=[a+c*e,b-l*f];b=[h+c*k,i-l*g];h=[h,i];a[0]=2*d[0]-a[0];a[1]=2*d[1]-a[1];if(j)return[a,b,h][M](q);else{q=[a,b,h][M](q)[Q]()[H](",");
j=[];h=0;for(i=q[o];h<i;h++)j[h]=h%2?t(q[h-1],q[h],r).y:t(q[h],q[h+1],r).x;return j}}function la(a,b,c,d,f,e,g,h,i){var j=1-i;return{x:D(j,3)*a+D(j,2)*3*i*c+j*3*i*i*f+D(i,3)*g,y:D(j,3)*b+D(j,2)*3*i*d+j*3*i*i*e+D(i,3)*h}}var wb=T(function(a,b,c,d,f,e,g,h){var i=f-2*c+a-(g-2*f+c),j=2*(c-a)-2*(f-c),l=a-c,n=(-j+w.sqrt(j*j-4*i*l))/2/i;i=(-j-w.sqrt(j*j-4*i*l))/2/i;var r=[b,h],q=[a,g];w.abs(n)>1000000000000&&(n=0.5);w.abs(i)>1000000000000&&(i=0.5);if(n>0&&n<1){n=la(a,b,c,d,f,e,g,h,n);q[E](n.x);r[E](n.y)}if(i>
0&&i<1){n=la(a,b,c,d,f,e,g,h,i);q[E](n.x);r[E](n.y)}i=e-2*d+b-(h-2*e+d);j=2*(d-b)-2*(e-d);l=b-d;n=(-j+w.sqrt(j*j-4*i*l))/2/i;i=(-j-w.sqrt(j*j-4*i*l))/2/i;w.abs(n)>1000000000000&&(n=0.5);w.abs(i)>1000000000000&&(i=0.5);if(n>0&&n<1){n=la(a,b,c,d,f,e,g,h,n);q[E](n.x);r[E](n.y)}if(i>0&&i<1){n=la(a,b,c,d,f,e,g,h,i);q[E](n.x);r[E](n.y)}return{min:{x:$[K](0,q),y:$[K](0,r)},max:{x:Y[K](0,q),y:Y[K](0,r)}}}),ua=T(function(a,b){var c=ka(a),d=b&&ka(b);a={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null};b={x:0,y:0,
bx:0,by:0,X:0,Y:0,qx:null,qy:null};function f(q,k){var t;if(!q)return["C",k.x,k.y,k.x,k.y,k.x,k.y];!(q[0]in{T:1,Q:1})&&(k.qx=k.qy=null);switch(q[0]){case "M":k.X=q[1];k.Y=q[2];break;case "A":q=["C"][M](Qa[K](0,[k.x,k.y][M](q.slice(1))));break;case "S":t=k.x+(k.x-(k.bx||k.x));k=k.y+(k.y-(k.by||k.y));q=["C",t,k][M](q.slice(1));break;case "T":k.qx=k.x+(k.x-(k.qx||k.x));k.qy=k.y+(k.y-(k.qy||k.y));q=["C"][M](Pa(k.x,k.y,k.qx,k.qy,q[1],q[2]));break;case "Q":k.qx=q[1];k.qy=q[2];q=["C"][M](Pa(k.x,k.y,q[1],
q[2],q[3],q[4]));break;case "L":q=["C"][M](wa(k.x,k.y,q[1],q[2]));break;case "H":q=["C"][M](wa(k.x,k.y,q[1],k.y));break;case "V":q=["C"][M](wa(k.x,k.y,k.x,q[1]));break;case "Z":q=["C"][M](wa(k.x,k.y,k.X,k.Y));break}return q}function e(q,k){if(q[k][o]>7){q[k].shift();for(var t=q[k];t[o];)q.splice(k++,0,["C"][M](t.splice(0,6)));q.splice(k,1);i=Y(c[o],d&&d[o]||0)}}function g(q,k,t,L,B){if(q&&k&&q[B][0]=="M"&&k[B][0]!="M"){k.splice(B,0,["M",L.x,L.y]);t.bx=0;t.by=0;t.x=q[B][1];t.y=q[B][2];i=Y(c[o],d&&
d[o]||0)}}for(var h=0,i=Y(c[o],d&&d[o]||0);h<i;h++){c[h]=f(c[h],a);e(c,h);d&&(d[h]=f(d[h],b));d&&e(d,h);g(c,d,a,b,h);g(d,c,b,a,h);var j=c[h],l=d&&d[h],n=j[o],r=d&&l[o];a.x=j[n-2];a.y=j[n-1];a.bx=A(j[n-4])||a.x;a.by=A(j[n-3])||a.y;b.bx=d&&(A(l[r-4])||b.x);b.by=d&&(A(l[r-3])||b.y);b.x=d&&l[r-2];b.y=d&&l[r-1]}return d?[c,d]:c},null,ta),Ra=T(function(a){for(var b=[],c=0,d=a[o];c<d;c++){var f={},e=a[c].match(/^([^:]*):?([\d\.]*)/);f.color=m.getRGB(e[1]);if(f.color.error)return null;f.color=f.color.hex;
e[2]&&(f.offset=e[2]+"%");b[E](f)}c=1;for(d=b[o]-1;c<d;c++)if(!b[c].offset){a=A(b[c-1].offset||0);e=0;for(f=c+1;f<d;f++)if(b[f].offset){e=b[f].offset;break}if(!e){e=100;f=d}e=A(e);for(e=(e-a)/(f-c+1);c<f;c++){a+=e;b[c].offset=a+"%"}}return b});function Sa(a,b,c,d){if(m.is(a,ea)||m.is(a,"object")){a=m.is(a,ea)?C.getElementById(a):a;if(a.tagName)return b==null?{container:a,width:a.style.pixelWidth||a.offsetWidth,height:a.style.pixelHeight||a.offsetHeight}:{container:a,width:b,height:c}}else return{container:1,
x:a,y:b,width:c,height:d}}function Fa(a,b){var c=this;for(var d in b)if(b[z](d)&&!(d in a))switch(typeof b[d]){case "function":(function(f){a[d]=a===c?f:function(){return f[K](c,arguments)}})(b[d]);break;case "object":a[d]=a[d]||{};Fa.call(this,a[d],b[d]);break;default:a[d]=b[d];break}}function ia(a,b){a==b.top&&(b.top=a.prev);a==b.bottom&&(b.bottom=a.next);a.next&&(a.next.prev=a.prev);a.prev&&(a.prev.next=a.next)}function Ta(a,b){if(b.top!==a){ia(a,b);a.next=null;a.prev=b.top;b.top.next=a;b.top=
a}}function Ua(a,b){if(b.bottom!==a){ia(a,b);a.next=b.bottom;a.prev=null;b.bottom.prev=a;b.bottom=a}}function Va(a,b,c){ia(a,c);b==c.top&&(c.top=a);b.next&&(b.next.prev=a);a.next=b.next;a.prev=b;b.next=a}function Wa(a,b,c){ia(a,c);b==c.bottom&&(c.bottom=a);b.prev&&(b.prev.next=a);a.prev=b.prev;b.prev=a;a.next=b}function Xa(a){return function(){throw new Error("Rapha\u00ebl: you are calling to method \u201c"+a+"\u201d of removed object");}}var Ya=/^r(?:\(([^,]+?)\s*,\s*([^\)]+?)\))?/;if(m.svg){G[p].svgns=
"http://www.w3.org/2000/svg";G[p].xlink="http://www.w3.org/1999/xlink";F=function(a){return+a+(~~a===a)*0.5};var v=function(a,b){if(b)for(var c in b)b[z](c)&&a[W](c,b[c]+s);else{a=C.createElementNS(G[p].svgns,a);a.style.webkitTapHighlightColor="rgba(0,0,0,0)";return a}};m[N]=function(){return"Your browser supports SVG.\nYou are running Rapha\u00ebl "+this.version};var Za=function(a,b){var c=v("path");b.canvas&&b.canvas[y](c);b=new u(c,b);b.type="path";ba(b,{fill:"none",stroke:"#000",path:a});return b},
ma=function(a,b,c){var d="linear",f=0.5,e=0.5,g=a.style;b=(b+s)[I](Ya,function(l,n,r){d="radial";if(n&&r){f=A(n);e=A(r);l=(e>0.5)*2-1;D(f-0.5,2)+D(e-0.5,2)>0.25&&(e=w.sqrt(0.25-D(f-0.5,2))*l+0.5)&&e!=0.5&&(e=e.toFixed(5)-1.0E-5*l)}return s});b=b[H](/\s*\-\s*/);if(d=="linear"){var h=b.shift();h=-A(h);if(isNaN(h))return null;h=[0,0,w.cos(h*w.PI/180),w.sin(h*w.PI/180)];var i=1/(Y(w.abs(h[2]),w.abs(h[3]))||1);h[2]*=i;h[3]*=i;if(h[2]<0){h[0]=-h[2];h[2]=0}if(h[3]<0){h[1]=-h[3];h[3]=0}}b=Ra(b);if(!b)return null;
i=a.getAttribute(aa);(i=i.match(/^url\(#(.*)\)$/))&&c.defs.removeChild(C.getElementById(i[1]));i=v(d+"Gradient");i.id="r"+(m._id++)[N](36);v(i,d=="radial"?{fx:f,fy:e}:{x1:h[0],y1:h[1],x2:h[2],y2:h[3]});c.defs[y](i);c=0;for(h=b[o];c<h;c++){var j=v("stop");v(j,{offset:b[c].offset?b[c].offset:!c?"0%":"100%","stop-color":b[c].color||"#fff"});i[y](j)}v(a,{fill:"url(#"+i.id+")",opacity:1,"fill-opacity":1});g.fill=s;g.opacity=1;return g.fillOpacity=1},Ga=function(a){var b=a.getBBox();v(a.pattern,{patternTransform:m.format("translate({0},{1})",
b.x,b.y)})},ba=function(a,b){var c={"":[0],none:[0],"-":[3,1],".":[1,1],"-.":[3,1,1,1],"-..":[3,1,1,1,1,1],". ":[1,3],"- ":[4,3],"--":[8,3],"- .":[4,3,1,3],"--.":[8,3,1,3],"--..":[8,3,1,3,1,3]},d=a.node,f=a.attrs,e=a.rotate();function g(k,t){if(t=c[ca.call(t)]){var L=k.attrs["stroke-width"]||"1";k={round:L,square:L,butt:0}[k.attrs["stroke-linecap"]||b["stroke-linecap"]]||0;for(var B=[],x=t[o];x--;)B[x]=t[x]*L+(x%2?1:-1)*k;v(d,{"stroke-dasharray":B[Q](",")})}}b[z]("rotation")&&(e=b.rotation);var h=
(e+s)[H](V);if(h.length-1){h[1]=+h[1];h[2]=+h[2]}else h=null;A(e)&&a.rotate(0,true);for(var i in b)if(b[z](i))if(qa[z](i)){var j=b[i];f[i]=j;switch(i){case "blur":a.blur(j);break;case "rotation":a.rotate(j,true);break;case "href":case "title":case "target":var l=d.parentNode;if(ca.call(l.tagName)!="a"){var n=v("a");l.insertBefore(n,d);n[y](d);l=n}l.setAttributeNS(a.paper.xlink,i,j);break;case "cursor":d.style.cursor=j;break;case "clip-rect":l=(j+s)[H](V);if(l[o]==4){a.clip&&a.clip.parentNode.parentNode.removeChild(a.clip.parentNode);
var r=v("clipPath");n=v("rect");r.id="r"+(m._id++)[N](36);v(n,{x:l[0],y:l[1],width:l[2],height:l[3]});r[y](n);a.paper.defs[y](r);v(d,{"clip-path":"url(#"+r.id+")"});a.clip=n}if(!j){(j=C.getElementById(d.getAttribute("clip-path")[I](/(^url\(#|\)$)/g,s)))&&j.parentNode.removeChild(j);v(d,{"clip-path":s});delete a.clip}break;case "path":if(a.type=="path")v(d,{d:j?(f.path=ka(j)):"M0,0"});break;case "width":d[W](i,j);if(f.fx){i="x";j=f.x}else break;case "x":if(f.fx)j=-f.x-(f.width||0);case "rx":if(i==
"rx"&&a.type=="rect")break;case "cx":h&&(i=="x"||i=="cx")&&(h[1]+=j-f[i]);d[W](i,F(j));a.pattern&&Ga(a);break;case "height":d[W](i,j);if(f.fy){i="y";j=f.y}else break;case "y":if(f.fy)j=-f.y-(f.height||0);case "ry":if(i=="ry"&&a.type=="rect")break;case "cy":h&&(i=="y"||i=="cy")&&(h[2]+=j-f[i]);d[W](i,F(j));a.pattern&&Ga(a);break;case "r":a.type=="rect"?v(d,{rx:j,ry:j}):d[W](i,j);break;case "src":a.type=="image"&&d.setAttributeNS(a.paper.xlink,"href",j);break;case "stroke-width":d.style.strokeWidth=
j;d[W](i,j);f["stroke-dasharray"]&&g(a,f["stroke-dasharray"]);break;case "stroke-dasharray":g(a,j);break;case "translation":j=(j+s)[H](V);j[0]=+j[0]||0;j[1]=+j[1]||0;if(h){h[1]+=j[0];h[2]+=j[1]}ya.call(a,j[0],j[1]);break;case "scale":j=(j+s)[H](V);a.scale(+j[0]||1,+j[1]||+j[0]||1,isNaN(A(j[2]))?null:+j[2],isNaN(A(j[3]))?null:+j[3]);break;case aa:if(l=(j+s).match(Na)){r=v("pattern");var q=v("image");r.id="r"+(m._id++)[N](36);v(r,{x:0,y:0,patternUnits:"userSpaceOnUse",height:1,width:1});v(q,{x:0,y:0});
q.setAttributeNS(a.paper.xlink,"href",l[1]);r[y](q);j=C.createElement("img");j.style.cssText="position:absolute;left:-9999em;top-9999em";j.onload=function(){v(r,{width:this.offsetWidth,height:this.offsetHeight});v(q,{width:this.offsetWidth,height:this.offsetHeight});C.body.removeChild(this);a.paper.safari()};C.body[y](j);j.src=l[1];a.paper.defs[y](r);d.style.fill="url(#"+r.id+")";v(d,{fill:"url(#"+r.id+")"});a.pattern=r;a.pattern&&Ga(a);break}l=m.getRGB(j);if(l.error){if(({circle:1,ellipse:1}[z](a.type)||
(j+s).charAt()!="r")&&ma(d,j,a.paper)){f.gradient=j;f.fill="none";break}}else{delete b.gradient;delete f.gradient;!m.is(f.opacity,"undefined")&&m.is(b.opacity,"undefined")&&v(d,{opacity:f.opacity});!m.is(f["fill-opacity"],"undefined")&&m.is(b["fill-opacity"],"undefined")&&v(d,{"fill-opacity":f["fill-opacity"]})}l[z]("o")&&v(d,{"fill-opacity":l.o/100});case "stroke":l=m.getRGB(j);d[W](i,l.hex);i=="stroke"&&l[z]("o")&&v(d,{"stroke-opacity":l.o/100});break;case "gradient":(({circle:1,ellipse:1})[z](a.type)||
(j+s).charAt()!="r")&&ma(d,j,a.paper);break;case "opacity":case "fill-opacity":if(f.gradient){if(l=C.getElementById(d.getAttribute(aa)[I](/^url\(#|\)$/g,s))){l=l.getElementsByTagName("stop");l[l[o]-1][W]("stop-opacity",j)}break}default:i=="font-size"&&(j=da(j,10)+"px");l=i[I](/(\-.)/g,function(k){return pa.call(k.substring(1))});d.style[l]=j;d[W](i,j);break}}yb(a,b);if(h)a.rotate(h.join(P));else A(e)&&a.rotate(e,true)},$a=1.2,yb=function(a,b){if(!(a.type!="text"||!(b[z]("text")||b[z]("font")||b[z]("font-size")||
b[z]("x")||b[z]("y")))){var c=a.attrs,d=a.node,f=d.firstChild?da(C.defaultView.getComputedStyle(d.firstChild,s).getPropertyValue("font-size"),10):10;if(b[z]("text")){for(c.text=b.text;d.firstChild;)d.removeChild(d.firstChild);b=(b.text+s)[H]("\n");for(var e=0,g=b[o];e<g;e++)if(b[e]){var h=v("tspan");e&&v(h,{dy:f*$a,x:c.x});h[y](C.createTextNode(b[e]));d[y](h)}}else{b=d.getElementsByTagName("tspan");e=0;for(g=b[o];e<g;e++)e&&v(b[e],{dy:f*$a,x:c.x})}v(d,{y:c.y});a=a.getBBox();(a=c.y-(a.y+a.height/2))&&
isFinite(a)&&v(d,{y:c.y+a})}},u=function(a,b){this[0]=a;this.id=m._oid++;this.node=a;a.raphael=this;this.paper=b;this.attrs=this.attrs||{};this.transformations=[];this._={tx:0,ty:0,rt:{deg:0,cx:0,cy:0},sx:1,sy:1};!b.bottom&&(b.bottom=this);(this.prev=b.top)&&(b.top.next=this);b.top=this;this.next=null};u[p].rotate=function(a,b,c){if(this.removed)return this;if(a==null){if(this._.rt.cx)return[this._.rt.deg,this._.rt.cx,this._.rt.cy][Q](P);return this._.rt.deg}var d=this.getBBox();a=(a+s)[H](V);if(a[o]-
1){b=A(a[1]);c=A(a[2])}a=A(a[0]);if(b!=null)this._.rt.deg=a;else this._.rt.deg+=a;c==null&&(b=null);this._.rt.cx=b;this._.rt.cy=c;b=b==null?d.x+d.width/2:b;c=c==null?d.y+d.height/2:c;if(this._.rt.deg){this.transformations[0]=m.format("rotate({0} {1} {2})",this._.rt.deg,b,c);this.clip&&v(this.clip,{transform:m.format("rotate({0} {1} {2})",-this._.rt.deg,b,c)})}else{this.transformations[0]=s;this.clip&&v(this.clip,{transform:s})}v(this.node,{transform:this.transformations[Q](P)});return this};u[p].hide=
function(){!this.removed&&(this.node.style.display="none");return this};u[p].show=function(){!this.removed&&(this.node.style.display="");return this};u[p].remove=function(){if(!this.removed){ia(this,this.paper);this.node.parentNode.removeChild(this.node);for(var a in this)delete this[a];this.removed=true}};u[p].getBBox=function(){if(this.removed)return this;if(this.type=="path")return va(this.attrs.path);if(this.node.style.display=="none"){this.show();var a=true}var b={};try{b=this.node.getBBox()}catch(c){}finally{b=
b||{}}if(this.type=="text"){b={x:b.x,y:Infinity,width:0,height:0};for(var d=0,f=this.node.getNumberOfChars();d<f;d++){var e=this.node.getExtentOfChar(d);e.y<b.y&&(b.y=e.y);e.y+e.height-b.y>b.height&&(b.height=e.y+e.height-b.y);e.x+e.width-b.x>b.width&&(b.width=e.x+e.width-b.x)}}a&&this.hide();return b};u[p].attr=function(a,b){if(this.removed)return this;if(a==null){a={};for(var c in this.attrs)if(this.attrs[z](c))a[c]=this.attrs[c];this._.rt.deg&&(a.rotation=this.rotate());(this._.sx!=1||this._.sy!=
1)&&(a.scale=this.scale());a.gradient&&a.fill=="none"&&(a.fill=a.gradient)&&delete a.gradient;return a}if(b==null&&m.is(a,ea)){if(a=="translation")return ya.call(this);if(a=="rotation")return this.rotate();if(a=="scale")return this.scale();if(a==aa&&this.attrs.fill=="none"&&this.attrs.gradient)return this.attrs.gradient;return this.attrs[a]}if(b==null&&m.is(a,U)){b={};c=0;for(var d=a.length;c<d;c++)b[a[c]]=this.attr(a[c]);return b}if(b!=null){c={};c[a]=b;ba(this,c)}else a!=null&&m.is(a,"object")&&
ba(this,a);return this};u[p].toFront=function(){if(this.removed)return this;this.node.parentNode[y](this.node);var a=this.paper;a.top!=this&&Ta(this,a);return this};u[p].toBack=function(){if(this.removed)return this;if(this.node.parentNode.firstChild!=this.node){this.node.parentNode.insertBefore(this.node,this.node.parentNode.firstChild);Ua(this,this.paper)}return this};u[p].insertAfter=function(a){if(this.removed)return this;var b=a.node;b.nextSibling?b.parentNode.insertBefore(this.node,b.nextSibling):
b.parentNode[y](this.node);Va(this,a,this.paper);return this};u[p].insertBefore=function(a){if(this.removed)return this;var b=a.node;b.parentNode.insertBefore(this.node,b);Wa(this,a,this.paper);return this};u[p].blur=function(a){var b=this;if(+a!==0){var c=v("filter"),d=v("feGaussianBlur");b.attrs.blur=a;c.id="r"+(m._id++)[N](36);v(d,{stdDeviation:+a||1.5});c.appendChild(d);b.paper.defs.appendChild(c);b._blur=c;v(b.node,{filter:"url(#"+c.id+")"})}else{if(b._blur){b._blur.parentNode.removeChild(b._blur);
delete b._blur;delete b.attrs.blur}b.node.removeAttribute("filter")}};var ab=function(a,b,c,d){b=F(b);c=F(c);var f=v("circle");a.canvas&&a.canvas[y](f);a=new u(f,a);a.attrs={cx:b,cy:c,r:d,fill:"none",stroke:"#000"};a.type="circle";v(f,a.attrs);return a},bb=function(a,b,c,d,f,e){b=F(b);c=F(c);var g=v("rect");a.canvas&&a.canvas[y](g);a=new u(g,a);a.attrs={x:b,y:c,width:d,height:f,r:e||0,rx:e||0,ry:e||0,fill:"none",stroke:"#000"};a.type="rect";v(g,a.attrs);return a},cb=function(a,b,c,d,f){b=F(b);c=F(c);
var e=v("ellipse");a.canvas&&a.canvas[y](e);a=new u(e,a);a.attrs={cx:b,cy:c,rx:d,ry:f,fill:"none",stroke:"#000"};a.type="ellipse";v(e,a.attrs);return a},db=function(a,b,c,d,f,e){var g=v("image");v(g,{x:c,y:d,width:f,height:e,preserveAspectRatio:"none"});g.setAttributeNS(a.xlink,"href",b);a.canvas&&a.canvas[y](g);a=new u(g,a);a.attrs={x:c,y:d,width:f,height:e,src:b};a.type="image";return a},eb=function(a,b,c,d){var f=v("text");v(f,{x:b,y:c,"text-anchor":"middle"});a.canvas&&a.canvas[y](f);a=new u(f,
a);a.attrs={x:b,y:c,"text-anchor":"middle",text:d,font:qa.font,stroke:"none",fill:"#000"};a.type="text";ba(a,a.attrs);return a},fb=function(a,b){this.width=a||this.width;this.height=b||this.height;this.canvas[W]("width",this.width);this.canvas[W]("height",this.height);return this},Aa=function(){var a=Sa[K](0,arguments),b=a&&a.container,c=a.x,d=a.y,f=a.width;a=a.height;if(!b)throw new Error("SVG container not found.");var e=v("svg");c=c||0;d=d||0;f=f||512;a=a||342;v(e,{xmlns:"http://www.w3.org/2000/svg",
version:1.1,width:f,height:a});if(b==1){e.style.cssText="position:absolute;left:"+c+"px;top:"+d+"px";C.body[y](e)}else b.firstChild?b.insertBefore(e,b.firstChild):b[y](e);b=new G;b.width=f;b.height=a;b.canvas=e;Fa.call(b,b,m.fn);b.clear();return b};G[p].clear=function(){for(var a=this.canvas;a.firstChild;)a.removeChild(a.firstChild);this.bottom=this.top=null;(this.desc=v("desc"))[y](C.createTextNode("Created with Rapha\u00ebl"));a[y](this.desc);a[y](this.defs=v("defs"))};G[p].remove=function(){this.canvas.parentNode&&
this.canvas.parentNode.removeChild(this.canvas);for(var a in this)this[a]=Xa(a)}}if(m.vml){var gb={M:"m",L:"l",C:"c",Z:"x",m:"t",l:"r",c:"v",z:"x"},zb=/([clmz]),?([^clmz]*)/gi,Ab=/-?[^,\s-]+/g,na=1000+P+1000,ja=10,oa={path:1,rect:1},Bb=function(a){var b=/[ahqstv]/ig,c=ka;(a+s).match(b)&&(c=ua);b=/[clmz]/g;if(c==ka&&!(a+s).match(b))return a=(a+s)[I](zb,function(i,j,l){var n=[],r=ca.call(j)=="m",q=gb[j];l[I](Ab,function(k){if(r&&n[o]==2){q+=n+gb[j=="m"?"l":"L"];n=[]}n[E](F(k*ja))});return q+n});b=c(a);
var d;a=[];for(var f=0,e=b[o];f<e;f++){c=b[f];d=ca.call(b[f][0]);d=="z"&&(d="x");for(var g=1,h=c[o];g<h;g++)d+=F(c[g]*ja)+(g!=h-1?",":s);a[E](d)}return a[Q](P)};m[N]=function(){return"Your browser doesn\u2019t support SVG. Falling down to VML.\nYou are running Rapha\u00ebl "+this.version};Za=function(a,b){var c=R("group");c.style.cssText="position:absolute;left:0;top:0;width:"+b.width+"px;height:"+b.height+"px";c.coordsize=b.coordsize;c.coordorigin=b.coordorigin;var d=R("shape"),f=d.style;f.width=
b.width+"px";f.height=b.height+"px";d.coordsize=na;d.coordorigin=b.coordorigin;c[y](d);d=new u(d,c,b);f={fill:"none",stroke:"#000"};a&&(f.path=a);d.isAbsolute=true;d.type="path";d.path=[];d.Path=s;ba(d,f);b.canvas[y](c);return d};ba=function(a,b){a.attrs=a.attrs||{};var c=a.node,d=a.attrs,f=c.style,e;e=(b.x!=d.x||b.y!=d.y||b.width!=d.width||b.height!=d.height||b.r!=d.r)&&a.type=="rect";var g=a;for(var h in b)if(b[z](h))d[h]=b[h];if(e){d.path=hb(d.x,d.y,d.width,d.height,d.r);a.X=d.x;a.Y=d.y;a.W=d.width;
a.H=d.height}b.href&&(c.href=b.href);b.title&&(c.title=b.title);b.target&&(c.target=b.target);b.cursor&&(f.cursor=b.cursor);"blur"in b&&a.blur(b.blur);if(b.path&&a.type=="path"||e)c.path=Bb(d.path);b.rotation!=null&&a.rotate(b.rotation,true);if(b.translation){e=(b.translation+s)[H](V);ya.call(a,e[0],e[1]);if(a._.rt.cx!=null){a._.rt.cx+=+e[0];a._.rt.cy+=+e[1];a.setBox(a.attrs,e[0],e[1])}}if(b.scale){e=(b.scale+s)[H](V);a.scale(+e[0]||1,+e[1]||+e[0]||1,+e[2]||null,+e[3]||null)}if("clip-rect"in b){e=
(b["clip-rect"]+s)[H](V);if(e[o]==4){e[2]=+e[2]+ +e[0];e[3]=+e[3]+ +e[1];h=c.clipRect||C.createElement("div");var i=h.style,j=c.parentNode;i.clip=m.format("rect({1}px {2}px {3}px {0}px)",e);if(!c.clipRect){i.position="absolute";i.top=0;i.left=0;i.width=a.paper.width+"px";i.height=a.paper.height+"px";j.parentNode.insertBefore(h,j);h[y](j);c.clipRect=h}}if(!b["clip-rect"])c.clipRect&&(c.clipRect.style.clip=s)}if(a.type=="image"&&b.src)c.src=b.src;if(a.type=="image"&&b.opacity){c.filterOpacity=Da+".Alpha(opacity="+
b.opacity*100+")";f.filter=(c.filterMatrix||s)+(c.filterOpacity||s)}b.font&&(f.font=b.font);b["font-family"]&&(f.fontFamily='"'+b["font-family"][H](",")[0][I](/^['"]+|['"]+$/g,s)+'"');b["font-size"]&&(f.fontSize=b["font-size"]);b["font-weight"]&&(f.fontWeight=b["font-weight"]);b["font-style"]&&(f.fontStyle=b["font-style"]);if(b.opacity!=null||b["stroke-width"]!=null||b.fill!=null||b.stroke!=null||b["stroke-width"]!=null||b["stroke-opacity"]!=null||b["fill-opacity"]!=null||b["stroke-dasharray"]!=null||
b["stroke-miterlimit"]!=null||b["stroke-linejoin"]!=null||b["stroke-linecap"]!=null){c=a.shape||c;f=c.getElementsByTagName(aa)&&c.getElementsByTagName(aa)[0];e=false;!f&&(e=f=R(aa));if("fill-opacity"in b||"opacity"in b){a=((+d["fill-opacity"]+1||2)-1)*((+d.opacity+1||2)-1)*((+m.getRGB(b.fill).o+1||2)-1);a<0&&(a=0);a>1&&(a=1);f.opacity=a}b.fill&&(f.on=true);if(f.on==null||b.fill=="none")f.on=false;if(f.on&&b.fill)if(a=b.fill.match(Na)){f.src=a[1];f.type="tile"}else{f.color=m.getRGB(b.fill).hex;f.src=
s;f.type="solid";if(m.getRGB(b.fill).error&&(g.type in{circle:1,ellipse:1}||(b.fill+s).charAt()!="r")&&ma(g,b.fill)){d.fill="none";d.gradient=b.fill}}e&&c[y](f);f=c.getElementsByTagName("stroke")&&c.getElementsByTagName("stroke")[0];e=false;!f&&(e=f=R("stroke"));if(b.stroke&&b.stroke!="none"||b["stroke-width"]||b["stroke-opacity"]!=null||b["stroke-dasharray"]||b["stroke-miterlimit"]||b["stroke-linejoin"]||b["stroke-linecap"])f.on=true;(b.stroke=="none"||f.on==null||b.stroke==0||b["stroke-width"]==
0)&&(f.on=false);a=m.getRGB(b.stroke);f.on&&b.stroke&&(f.color=a.hex);a=((+d["stroke-opacity"]+1||2)-1)*((+d.opacity+1||2)-1)*((+a.o+1||2)-1);h=(A(b["stroke-width"])||1)*0.75;a<0&&(a=0);a>1&&(a=1);b["stroke-width"]==null&&(h=d["stroke-width"]);b["stroke-width"]&&(f.weight=h);h&&h<1&&(a*=h)&&(f.weight=1);f.opacity=a;b["stroke-linejoin"]&&(f.joinstyle=b["stroke-linejoin"]||"miter");f.miterlimit=b["stroke-miterlimit"]||8;b["stroke-linecap"]&&(f.endcap=b["stroke-linecap"]=="butt"?"flat":b["stroke-linecap"]==
"square"?"square":"round");if(b["stroke-dasharray"]){a={"-":"shortdash",".":"shortdot","-.":"shortdashdot","-..":"shortdashdotdot",". ":"dot","- ":"dash","--":"longdash","- .":"dashdot","--.":"longdashdot","--..":"longdashdotdot"};f.dashstyle=a[z](b["stroke-dasharray"])?a[b["stroke-dasharray"]]:s}e&&c[y](f)}if(g.type=="text"){f=g.paper.span.style;d.font&&(f.font=d.font);d["font-family"]&&(f.fontFamily=d["font-family"]);d["font-size"]&&(f.fontSize=d["font-size"]);d["font-weight"]&&(f.fontWeight=d["font-weight"]);
d["font-style"]&&(f.fontStyle=d["font-style"]);g.node.string&&(g.paper.span.innerHTML=(g.node.string+s)[I](/</g,"&#60;")[I](/&/g,"&#38;")[I](/\n/g,"<br>"));g.W=d.w=g.paper.span.offsetWidth;g.H=d.h=g.paper.span.offsetHeight;g.X=d.x;g.Y=d.y+F(g.H/2);switch(d["text-anchor"]){case "start":g.node.style["v-text-align"]="left";g.bbx=F(g.W/2);break;case "end":g.node.style["v-text-align"]="right";g.bbx=-F(g.W/2);break;default:g.node.style["v-text-align"]="center";break}}};ma=function(a,b){a.attrs=a.attrs||
{};var c="linear",d=".5 .5";a.attrs.gradient=b;b=(b+s)[I](Ya,function(i,j,l){c="radial";if(j&&l){j=A(j);l=A(l);D(j-0.5,2)+D(l-0.5,2)>0.25&&(l=w.sqrt(0.25-D(j-0.5,2))*((l>0.5)*2-1)+0.5);d=j+P+l}return s});b=b[H](/\s*\-\s*/);if(c=="linear"){var f=b.shift();f=-A(f);if(isNaN(f))return null}var e=Ra(b);if(!e)return null;a=a.shape||a.node;b=a.getElementsByTagName(aa)[0]||R(aa);!b.parentNode&&a.appendChild(b);if(e[o]){b.on=true;b.method="none";b.color=e[0].color;b.color2=e[e[o]-1].color;a=[];for(var g=0,
h=e[o];g<h;g++)e[g].offset&&a[E](e[g].offset+P+e[g].color);b.colors&&(b.colors.value=a[o]?a[Q]():"0% "+b.color);if(c=="radial"){b.type="gradientradial";b.focus="100%";b.focussize=d;b.focusposition=d}else{b.type="gradient";b.angle=(270-f)%360}}return 1};u=function(a,b,c){this[0]=a;this.id=m._oid++;this.node=a;a.raphael=this;this.Y=this.X=0;this.attrs={};this.Group=b;this.paper=c;this._={tx:0,ty:0,rt:{deg:0},sx:1,sy:1};!c.bottom&&(c.bottom=this);(this.prev=c.top)&&(c.top.next=this);c.top=this;this.next=
null};u[p].rotate=function(a,b,c){if(this.removed)return this;if(a==null){if(this._.rt.cx)return[this._.rt.deg,this._.rt.cx,this._.rt.cy][Q](P);return this._.rt.deg}a=(a+s)[H](V);if(a[o]-1){b=A(a[1]);c=A(a[2])}a=A(a[0]);if(b!=null)this._.rt.deg=a;else this._.rt.deg+=a;c==null&&(b=null);this._.rt.cx=b;this._.rt.cy=c;this.setBox(this.attrs,b,c);this.Group.style.rotation=this._.rt.deg;return this};u[p].setBox=function(a,b,c){if(this.removed)return this;var d=this.Group.style,f=this.shape&&this.shape.style||
this.node.style;a=a||{};for(var e in a)if(a[z](e))this.attrs[e]=a[e];b=b||this._.rt.cx;c=c||this._.rt.cy;var g=this.attrs,h;switch(this.type){case "circle":a=g.cx-g.r;e=g.cy-g.r;h=g=g.r*2;break;case "ellipse":a=g.cx-g.rx;e=g.cy-g.ry;h=g.rx*2;g=g.ry*2;break;case "image":a=+g.x;e=+g.y;h=g.width||0;g=g.height||0;break;case "text":this.textpath.v=["m",F(g.x),", ",F(g.y-2),"l",F(g.x)+1,", ",F(g.y-2)][Q](s);a=g.x-F(this.W/2);e=g.y-this.H/2;h=this.W;g=this.H;break;case "rect":case "path":if(this.attrs.path){g=
va(this.attrs.path);a=g.x;e=g.y;h=g.width;g=g.height}else{e=a=0;h=this.paper.width;g=this.paper.height}break;default:e=a=0;h=this.paper.width;g=this.paper.height;break}b=b==null?a+h/2:b;c=c==null?e+g/2:c;b=b-this.paper.width/2;c=c-this.paper.height/2;var i;d.left!=(i=b+"px")&&(d.left=i);d.top!=(i=c+"px")&&(d.top=i);this.X=oa[z](this.type)?-b:a;this.Y=oa[z](this.type)?-c:e;this.W=h;this.H=g;if(oa[z](this.type)){f.left!=(i=-b*ja+"px")&&(f.left=i);f.top!=(i=-c*ja+"px")&&(f.top=i)}else if(this.type==
"text"){f.left!=(i=-b+"px")&&(f.left=i);f.top!=(i=-c+"px")&&(f.top=i)}else{d.width!=(i=this.paper.width+"px")&&(d.width=i);d.height!=(i=this.paper.height+"px")&&(d.height=i);f.left!=(i=a-b+"px")&&(f.left=i);f.top!=(i=e-c+"px")&&(f.top=i);f.width!=(i=h+"px")&&(f.width=i);f.height!=(i=g+"px")&&(f.height=i)}};u[p].hide=function(){!this.removed&&(this.Group.style.display="none");return this};u[p].show=function(){!this.removed&&(this.Group.style.display="block");return this};u[p].getBBox=function(){if(this.removed)return this;
if(oa[z](this.type))return va(this.attrs.path);return{x:this.X+(this.bbx||0),y:this.Y,width:this.W,height:this.H}};u[p].remove=function(){if(!this.removed){ia(this,this.paper);this.node.parentNode.removeChild(this.node);this.Group.parentNode.removeChild(this.Group);this.shape&&this.shape.parentNode.removeChild(this.shape);for(var a in this)delete this[a];this.removed=true}};u[p].attr=function(a,b){if(this.removed)return this;if(a==null){a={};for(var c in this.attrs)if(this.attrs[z](c))a[c]=this.attrs[c];
this._.rt.deg&&(a.rotation=this.rotate());(this._.sx!=1||this._.sy!=1)&&(a.scale=this.scale());a.gradient&&a.fill=="none"&&(a.fill=a.gradient)&&delete a.gradient;return a}if(b==null&&m.is(a,ea)){if(a=="translation")return ya.call(this);if(a=="rotation")return this.rotate();if(a=="scale")return this.scale();if(a==aa&&this.attrs.fill=="none"&&this.attrs.gradient)return this.attrs.gradient;return this.attrs[a]}if(this.attrs&&b==null&&m.is(a,U)){var d={};c=0;for(b=a[o];c<b;c++)d[a[c]]=this.attr(a[c]);
return d}if(b!=null){d={};d[a]=b}b==null&&m.is(a,"object")&&(d=a);if(d){if(d.text&&this.type=="text")this.node.string=d.text;ba(this,d);if(d.gradient&&({circle:1,ellipse:1}[z](this.type)||(d.gradient+s).charAt()!="r"))ma(this,d.gradient);(!oa[z](this.type)||this._.rt.deg)&&this.setBox(this.attrs)}return this};u[p].toFront=function(){!this.removed&&this.Group.parentNode[y](this.Group);this.paper.top!=this&&Ta(this,this.paper);return this};u[p].toBack=function(){if(this.removed)return this;if(this.Group.parentNode.firstChild!=
this.Group){this.Group.parentNode.insertBefore(this.Group,this.Group.parentNode.firstChild);Ua(this,this.paper)}return this};u[p].insertAfter=function(a){if(this.removed)return this;a.Group.nextSibling?a.Group.parentNode.insertBefore(this.Group,a.Group.nextSibling):a.Group.parentNode[y](this.Group);Va(this,a,this.paper);return this};u[p].insertBefore=function(a){if(this.removed)return this;a.Group.parentNode.insertBefore(this.Group,a.Group);Wa(this,a,this.paper);return this};var Cb=/ progid:\S+Blur\([^\)]+\)/g;
u[p].blur=function(a){var b=this.node.style,c=b.filter;c=c.replace(Cb,"");if(+a!==0){this.attrs.blur=a;b.filter=c+Da+".Blur(pixelradius="+(+a||1.5)+")";b.margin=Raphael.format("-{0}px 0 0 -{0}px",Math.round(+a||1.5))}else{b.filter=c;b.margin=0;delete this.attrs.blur}};ab=function(a,b,c,d){var f=R("group"),e=R("oval");f.style.cssText="position:absolute;left:0;top:0;width:"+a.width+"px;height:"+a.height+"px";f.coordsize=na;f.coordorigin=a.coordorigin;f[y](e);e=new u(e,f,a);e.type="circle";ba(e,{stroke:"#000",
fill:"none"});e.attrs.cx=b;e.attrs.cy=c;e.attrs.r=d;e.setBox({x:b-d,y:c-d,width:d*2,height:d*2});a.canvas[y](f);return e};function hb(a,b,c,d,f){return f?m.format("M{0},{1}l{2},0a{3},{3},0,0,1,{3},{3}l0,{5}a{3},{3},0,0,1,{4},{3}l{6},0a{3},{3},0,0,1,{4},{4}l0,{7}a{3},{3},0,0,1,{3},{4}z",a+f,b,c-f*2,f,-f,d-f*2,f*2-c,f*2-d):m.format("M{0},{1}l{2},0,0,{3},{4},0z",a,b,c,d,-c)}bb=function(a,b,c,d,f,e){var g=hb(b,c,d,f,e);a=a.path(g);var h=a.attrs;a.X=h.x=b;a.Y=h.y=c;a.W=h.width=d;a.H=h.height=f;h.r=e;h.path=
g;a.type="rect";return a};cb=function(a,b,c,d,f){var e=R("group"),g=R("oval");e.style.cssText="position:absolute;left:0;top:0;width:"+a.width+"px;height:"+a.height+"px";e.coordsize=na;e.coordorigin=a.coordorigin;e[y](g);g=new u(g,e,a);g.type="ellipse";ba(g,{stroke:"#000"});g.attrs.cx=b;g.attrs.cy=c;g.attrs.rx=d;g.attrs.ry=f;g.setBox({x:b-d,y:c-f,width:d*2,height:f*2});a.canvas[y](e);return g};db=function(a,b,c,d,f,e){var g=R("group"),h=R("image");g.style.cssText="position:absolute;left:0;top:0;width:"+
a.width+"px;height:"+a.height+"px";g.coordsize=na;g.coordorigin=a.coordorigin;h.src=b;g[y](h);h=new u(h,g,a);h.type="image";h.attrs.src=b;h.attrs.x=c;h.attrs.y=d;h.attrs.w=f;h.attrs.h=e;h.setBox({x:c,y:d,width:f,height:e});a.canvas[y](g);return h};eb=function(a,b,c,d){var f=R("group"),e=R("shape"),g=e.style,h=R("path"),i=R("textpath");f.style.cssText="position:absolute;left:0;top:0;width:"+a.width+"px;height:"+a.height+"px";f.coordsize=na;f.coordorigin=a.coordorigin;h.v=m.format("m{0},{1}l{2},{1}",
F(b*10),F(c*10),F(b*10)+1);h.textpathok=true;g.width=a.width;g.height=a.height;i.string=d+s;i.on=true;e[y](i);e[y](h);f[y](e);g=new u(i,f,a);g.shape=e;g.textpath=h;g.type="text";g.attrs.text=d;g.attrs.x=b;g.attrs.y=c;g.attrs.w=1;g.attrs.h=1;ba(g,{font:qa.font,stroke:"none",fill:"#000"});g.setBox();a.canvas[y](f);return g};fb=function(a,b){var c=this.canvas.style;a==+a&&(a+="px");b==+b&&(b+="px");c.width=a;c.height=b;c.clip="rect(0 "+a+" "+b+" 0)";return this};var R;C.createStyleSheet().addRule(".rvml",
"behavior:url(#default#VML)");try{!C.namespaces.rvml&&C.namespaces.add("rvml","urn:schemas-microsoft-com:vml");R=function(a){return C.createElement("<rvml:"+a+' class="rvml">')}}catch(Kb){R=function(a){return C.createElement("<"+a+' xmlns="urn:schemas-microsoft.com:vml" class="rvml">')}}Aa=function(){var a=Sa[K](0,arguments),b=a.container,c=a.height,d=a.width,f=a.x;a=a.y;if(!b)throw new Error("VML container not found.");var e=new G,g=e.canvas=C.createElement("div"),h=g.style;f=f||0;a=a||0;d=d||512;
c=c||342;d==+d&&(d+="px");c==+c&&(c+="px");e.width=1000;e.height=1000;e.coordsize=ja*1000+P+ja*1000;e.coordorigin="0 0";e.span=C.createElement("span");e.span.style.cssText="position:absolute;left:-9999em;top:-9999em;padding:0;margin:0;line-height:1;display:inline;";g[y](e.span);h.cssText=m.format("width:{0};height:{1};display:inline-block;position:relative;clip:rect(0 {0} {1} 0);overflow:hidden",d,c);if(b==1){C.body[y](g);h.left=f+"px";h.top=a+"px";h.position="absolute"}else b.firstChild?b.insertBefore(g,
b.firstChild):b[y](g);Fa.call(e,e,m.fn);return e};G[p].clear=function(){this.canvas.innerHTML=s;this.span=C.createElement("span");this.span.style.cssText="position:absolute;left:-9999em;top:-9999em;padding:0;margin:0;line-height:1;display:inline;";this.canvas[y](this.span);this.bottom=this.top=null};G[p].remove=function(){this.canvas.parentNode.removeChild(this.canvas);for(var a in this)this[a]=Xa(a);return true}}G[p].safari=/^Apple|^Google/.test(X.navigator.vendor)&&(!(X.navigator.userAgent.indexOf("Version/4.0")+
1)||X.navigator.platform.slice(0,2)=="iP")?function(){var a=this.rect(-99,-99,this.width+99,this.height+99);X.setTimeout(function(){a.remove()})}:function(){};function Db(){this.returnValue=false}function Eb(){return this.originalEvent.preventDefault()}function Fb(){this.cancelBubble=true}function Gb(){return this.originalEvent.stopPropagation()}var Hb=function(){if(C.addEventListener)return function(a,b,c,d){var f=Ba&&Ca[b]?Ca[b]:b;function e(g){if(Ba&&Ca[z](b))for(var h=0,i=g.targetTouches&&g.targetTouches.length;h<
i;h++)if(g.targetTouches[h].target==a){i=g;g=g.targetTouches[h];g.originalEvent=i;g.preventDefault=Eb;g.stopPropagation=Gb;break}return c.call(d,g)}a.addEventListener(f,e,false);return function(){a.removeEventListener(f,e,false);return true}};else if(C.attachEvent)return function(a,b,c,d){function f(g){g=g||X.event;g.preventDefault=g.preventDefault||Db;g.stopPropagation=g.stopPropagation||Fb;return c.call(d,g)}a.attachEvent("on"+b,f);function e(){a.detachEvent("on"+b,f);return true}return e}}();for(ha=
Ma[o];ha--;)(function(a){m[a]=u[p][a]=function(b){if(m.is(b,"function")){this.events=this.events||[];this.events.push({name:a,f:b,unbind:Hb(this.shape||this.node||C,a,b,this)})}return this};m["un"+a]=u[p]["un"+a]=function(b){for(var c=this.events,d=c[o];d--;)if(c[d].name==a&&c[d].f==b){c[d].unbind();c.splice(d,1);!c.length&&delete this.events;return this}return this}})(Ma[ha]);u[p].hover=function(a,b){return this.mouseover(a).mouseout(b)};u[p].unhover=function(a,b){return this.unmouseover(a).unmouseout(b)};
u[p].drag=function(a,b,c){this._drag={};var d=this.mousedown(function(g){(g.originalEvent?g.originalEvent:g).preventDefault();this._drag.x=g.clientX;this._drag.y=g.clientY;this._drag.id=g.identifier;b&&b.call(this,g.clientX,g.clientY);Raphael.mousemove(f).mouseup(e)});function f(g){var h=g.clientX,i=g.clientY;if(Ba)for(var j=g.touches.length,l;j--;){l=g.touches[j];if(l.identifier==d._drag.id){h=l.clientX;i=l.clientY;(g.originalEvent?g.originalEvent:g).preventDefault();break}}else g.preventDefault();
a&&a.call(d,h-d._drag.x,i-d._drag.y,h,i)}function e(){d._drag={};Raphael.unmousemove(f).unmouseup(e);c&&c.call(d)}return this};G[p].circle=function(a,b,c){return ab(this,a||0,b||0,c||0)};G[p].rect=function(a,b,c,d,f){return bb(this,a||0,b||0,c||0,d||0,f||0)};G[p].ellipse=function(a,b,c,d){return cb(this,a||0,b||0,c||0,d||0)};G[p].path=function(a){a&&!m.is(a,ea)&&!m.is(a[0],U)&&(a+=s);return Za(m.format[K](m,arguments),this)};G[p].image=function(a,b,c,d,f){return db(this,a||"about:blank",b||0,c||0,
d||0,f||0)};G[p].text=function(a,b,c){return eb(this,a||0,b||0,c||s)};G[p].set=function(a){arguments[o]>1&&(a=Array[p].splice.call(arguments,0,arguments[o]));return new Z(a)};G[p].setSize=fb;G[p].top=G[p].bottom=null;G[p].raphael=m;function ib(){return this.x+P+this.y}u[p].resetScale=function(){if(this.removed)return this;this._.sx=1;this._.sy=1;this.attrs.scale="1 1"};u[p].scale=function(a,b,c,d){if(this.removed)return this;if(a==null&&b==null)return{x:this._.sx,y:this._.sy,toString:ib};b=b||a;!+b&&
(b=a);var f,e,g=this.attrs;if(a!=0){var h=this.getBBox(),i=h.x+h.width/2,j=h.y+h.height/2;f=a/this._.sx;e=b/this._.sy;c=+c||c==0?c:i;d=+d||d==0?d:j;h=~~(a/w.abs(a));var l=~~(b/w.abs(b)),n=this.node.style,r=c+(i-c)*f;j=d+(j-d)*e;switch(this.type){case "rect":case "image":var q=g.width*h*f,k=g.height*l*e;this.attr({height:k,r:g.r*$(h*f,l*e),width:q,x:r-q/2,y:j-k/2});break;case "circle":case "ellipse":this.attr({rx:g.rx*h*f,ry:g.ry*l*e,r:g.r*$(h*f,l*e),cx:r,cy:j});break;case "text":this.attr({x:r,y:j});
break;case "path":i=Oa(g.path);for(var t=true,L=0,B=i[o];L<B;L++){var x=i[L],J=pa.call(x[0]);if(!(J=="M"&&t)){t=false;if(J=="A"){x[i[L][o]-2]*=f;x[i[L][o]-1]*=e;x[1]*=h*f;x[2]*=l*e;x[5]=+!(h+l?!+x[5]:+x[5])}else if(J=="H"){J=1;for(var fa=x[o];J<fa;J++)x[J]*=f}else if(J=="V"){J=1;for(fa=x[o];J<fa;J++)x[J]*=e}else{J=1;for(fa=x[o];J<fa;J++)x[J]*=J%2?f:e}}}e=va(i);f=r-e.x-e.width/2;e=j-e.y-e.height/2;i[0][1]+=f;i[0][2]+=e;this.attr({path:i});break}if(this.type in{text:1,image:1}&&(h!=1||l!=1))if(this.transformations){this.transformations[2]=
"scale("[M](h,",",l,")");this.node[W]("transform",this.transformations[Q](P));f=h==-1?-g.x-(q||0):g.x;e=l==-1?-g.y-(k||0):g.y;this.attr({x:f,y:e});g.fx=h-1;g.fy=l-1}else{this.node.filterMatrix=Da+".Matrix(M11="[M](h,", M12=0, M21=0, M22=",l,", Dx=0, Dy=0, sizingmethod='auto expand', filtertype='bilinear')");n.filter=(this.node.filterMatrix||s)+(this.node.filterOpacity||s)}else if(this.transformations){this.transformations[2]=s;this.node[W]("transform",this.transformations[Q](P));g.fx=0;g.fy=0}else{this.node.filterMatrix=
s;n.filter=(this.node.filterMatrix||s)+(this.node.filterOpacity||s)}g.scale=[a,b,c,d][Q](P);this._.sx=a;this._.sy=b}return this};u[p].clone=function(){if(this.removed)return null;var a=this.attr();delete a.scale;delete a.translation;return this.paper[this.type]().attr(a)};var jb=T(function(a,b,c,d,f,e,g,h,i){for(var j=0,l,n=0;n<1.001;n+=0.0010){var r=m.findDotsAtSegment(a,b,c,d,f,e,g,h,n);n&&(j+=D(D(l.x-r.x,2)+D(l.y-r.y,2),0.5));if(j>=i)return r;l=r}});function Ha(a,b){return function(c,d,f){c=ua(c);
for(var e,g,h,i,j="",l={},n=0,r=0,q=c.length;r<q;r++){h=c[r];if(h[0]=="M"){e=+h[1];g=+h[2]}else{i=Ib(e,g,h[1],h[2],h[3],h[4],h[5],h[6]);if(n+i>d){if(b&&!l.start){e=jb(e,g,h[1],h[2],h[3],h[4],h[5],h[6],d-n);j+=["C",e.start.x,e.start.y,e.m.x,e.m.y,e.x,e.y];if(f)return j;l.start=j;j=["M",e.x,e.y+"C",e.n.x,e.n.y,e.end.x,e.end.y,h[5],h[6]][Q]();n+=i;e=+h[5];g=+h[6];continue}if(!a&&!b){e=jb(e,g,h[1],h[2],h[3],h[4],h[5],h[6],d-n);return{x:e.x,y:e.y,alpha:e.alpha}}}n+=i;e=+h[5];g=+h[6]}j+=h}l.end=j;e=a?n:
b?l:m.findDotsAtSegment(e,g,h[1],h[2],h[3],h[4],h[5],h[6],1);e.alpha&&(e={x:e.x,y:e.y,alpha:e.alpha});return e}}var Ib=T(function(a,b,c,d,f,e,g,h){for(var i={x:0,y:0},j=0,l=0;l<1.01;l+=0.01){var n=la(a,b,c,d,f,e,g,h,l);l&&(j+=D(D(i.x-n.x,2)+D(i.y-n.y,2),0.5));i=n}return j}),kb=Ha(1),za=Ha(),Ia=Ha(0,1);u[p].getTotalLength=function(){if(this.type=="path"){if(this.node.getTotalLength)return this.node.getTotalLength();return kb(this.attrs.path)}};u[p].getPointAtLength=function(a){if(this.type=="path")return za(this.attrs.path,
a)};u[p].getSubpath=function(a,b){if(this.type=="path"){if(w.abs(this.getTotalLength()-b)<1.0E-6)return Ia(this.attrs.path,a).end;b=Ia(this.attrs.path,b,1);return a?Ia(b,a).end:b}};m.easing_formulas={linear:function(a){return a},"<":function(a){return D(a,3)},">":function(a){return D(a-1,3)+1},"<>":function(a){a*=2;if(a<1)return D(a,3)/2;a-=2;return(D(a,3)+2)/2},backIn:function(a){var b=1.70158;return a*a*((b+1)*a-b)},backOut:function(a){a-=1;var b=1.70158;return a*a*((b+1)*a+b)+1},elastic:function(a){if(a==
0||a==1)return a;var b=0.3,c=b/4;return D(2,-10*a)*w.sin((a-c)*2*w.PI/b)+1},bounce:function(a){var b=7.5625,c=2.75;if(a<1/c)a=b*a*a;else if(a<2/c){a-=1.5/c;a=b*a*a+0.75}else if(a<2.5/c){a-=2.25/c;a=b*a*a+0.9375}else{a-=2.625/c;a=b*a*a+0.984375}return a}};var S={length:0};function lb(){var a=+new Date;for(var b in S)if(b!="length"&&S[z](b)){var c=S[b];if(c.stop||c.el.removed){delete S[b];S[o]--}else{var d=a-c.start,f=c.ms,e=c.easing,g=c.from,h=c.diff,i=c.to,j=c.t,l=c.prev||0,n=c.el,r=c.callback,q=
{},k;if(d<f){r=m.easing_formulas[e]?m.easing_formulas[e](d/f):d/f;for(var t in g)if(g[z](t)){switch(Ea[t]){case "along":k=r*f*h[t];i.back&&(k=i.len-k);e=za(i[t],k);n.translate(h.sx-h.x||0,h.sy-h.y||0);h.x=e.x;h.y=e.y;n.translate(e.x-h.sx,e.y-h.sy);i.rot&&n.rotate(h.r+e.alpha,e.x,e.y);break;case O:k=+g[t]+r*f*h[t];break;case "colour":k="rgb("+[Ja(F(g[t].r+r*f*h[t].r)),Ja(F(g[t].g+r*f*h[t].g)),Ja(F(g[t].b+r*f*h[t].b))][Q](",")+")";break;case "path":k=[];e=0;for(var L=g[t][o];e<L;e++){k[e]=[g[t][e][0]];
for(var B=1,x=g[t][e][o];B<x;B++)k[e][B]=+g[t][e][B]+r*f*h[t][e][B];k[e]=k[e][Q](P)}k=k[Q](P);break;case "csv":switch(t){case "translation":k=h[t][0]*(d-l);e=h[t][1]*(d-l);j.x+=k;j.y+=e;k=k+P+e;break;case "rotation":k=+g[t][0]+r*f*h[t][0];g[t][1]&&(k+=","+g[t][1]+","+g[t][2]);break;case "scale":k=[+g[t][0]+r*f*h[t][0],+g[t][1]+r*f*h[t][1],2 in i[t]?i[t][2]:s,3 in i[t]?i[t][3]:s][Q](P);break;case "clip-rect":k=[];for(e=4;e--;)k[e]=+g[t][e]+r*f*h[t][e];break}break}q[t]=k}n.attr(q);n._run&&n._run.call(n)}else{if(i.along){e=
za(i.along,i.len*!i.back);n.translate(h.sx-(h.x||0)+e.x-h.sx,h.sy-(h.y||0)+e.y-h.sy);i.rot&&n.rotate(h.r+e.alpha,e.x,e.y)}(j.x||j.y)&&n.translate(-j.x,-j.y);i.scale&&(i.scale+=s);n.attr(i);delete S[b];S[o]--;n.in_animation=null;m.is(r,"function")&&r.call(n)}c.prev=d}}m.svg&&n&&n.paper&&n.paper.safari();S[o]&&X.setTimeout(lb)}function Ja(a){return Y($(a,255),0)}function ya(a,b){if(a==null)return{x:this._.tx,y:this._.ty,toString:ib};this._.tx+=+a;this._.ty+=+b;switch(this.type){case "circle":case "ellipse":this.attr({cx:+a+
this.attrs.cx,cy:+b+this.attrs.cy});break;case "rect":case "image":case "text":this.attr({x:+a+this.attrs.x,y:+b+this.attrs.y});break;case "path":var c=Oa(this.attrs.path);c[0][1]+=+a;c[0][2]+=+b;this.attr({path:c});break}return this}u[p].animateWith=function(a,b,c,d,f){S[a.id]&&(b.start=S[a.id].start);return this.animate(b,c,d,f)};u[p].animateAlong=mb();u[p].animateAlongBack=mb(1);function mb(a){return function(b,c,d,f){var e={back:a};m.is(d,"function")?(f=d):(e.rot=d);b&&b.constructor==u&&(b=b.attrs.path);
b&&(e.along=b);return this.animate(e,c,f)}}u[p].onAnimation=function(a){this._run=a||0;return this};u[p].animate=function(a,b,c,d){if(m.is(c,"function")||!c)d=c||null;var f={},e={},g={};for(var h in a)if(a[z](h))if(Ea[z](h)){f[h]=this.attr(h);f[h]==null&&(f[h]=qa[h]);e[h]=a[h];switch(Ea[h]){case "along":var i=kb(a[h]),j=za(a[h],i*!!a.back),l=this.getBBox();g[h]=i/b;g.tx=l.x;g.ty=l.y;g.sx=j.x;g.sy=j.y;e.rot=a.rot;e.back=a.back;e.len=i;a.rot&&(g.r=A(this.rotate())||0);break;case O:g[h]=(e[h]-f[h])/
b;break;case "colour":f[h]=m.getRGB(f[h]);i=m.getRGB(e[h]);g[h]={r:(i.r-f[h].r)/b,g:(i.g-f[h].g)/b,b:(i.b-f[h].b)/b};break;case "path":i=ua(f[h],e[h]);f[h]=i[0];j=i[1];g[h]=[];i=0;for(l=f[h][o];i<l;i++){g[h][i]=[0];for(var n=1,r=f[h][i][o];n<r;n++)g[h][i][n]=(j[i][n]-f[h][i][n])/b}break;case "csv":j=(a[h]+s)[H](V);i=(f[h]+s)[H](V);switch(h){case "translation":f[h]=[0,0];g[h]=[j[0]/b,j[1]/b];break;case "rotation":f[h]=i[1]==j[1]&&i[2]==j[2]?i:[0,j[1],j[2]];g[h]=[(j[0]-f[h][0])/b,0,0];break;case "scale":a[h]=
j;f[h]=(f[h]+s)[H](V);g[h]=[(j[0]-f[h][0])/b,(j[1]-f[h][1])/b,0,0];break;case "clip-rect":f[h]=(f[h]+s)[H](V);g[h]=[];for(i=4;i--;)g[h][i]=(j[i]-f[h][i])/b;break}e[h]=j}}this.stop();this.in_animation=1;S[this.id]={start:a.start||+new Date,ms:b,easing:c,from:f,diff:g,to:e,el:this,callback:d,t:{x:0,y:0}};++S[o]==1&&lb();return this};u[p].stop=function(){S[this.id]&&S[o]--;delete S[this.id];return this};u[p].translate=function(a,b){return this.attr({translation:a+" "+b})};u[p][N]=function(){return"Rapha\u00ebl\u2019s object"};
m.ae=S;function Z(a){this.items=[];this[o]=0;this.type="set";if(a)for(var b=0,c=a[o];b<c;b++)if(a[b]&&(a[b].constructor==u||a[b].constructor==Z)){this[this.items[o]]=this.items[this.items[o]]=a[b];this[o]++}}Z[p][E]=function(){for(var a,b,c=0,d=arguments[o];c<d;c++)if((a=arguments[c])&&(a.constructor==u||a.constructor==Z)){b=this.items[o];this[b]=this.items[b]=a;this[o]++}return this};Z[p].pop=function(){delete this[this[o]--];return this.items.pop()};for(var Ka in u[p])if(u[p][z](Ka))Z[p][Ka]=function(a){return function(){for(var b=
0,c=this.items[o];b<c;b++)this.items[b][a][K](this.items[b],arguments);return this}}(Ka);Z[p].attr=function(a,b){if(a&&m.is(a,U)&&m.is(a[0],"object")){b=0;for(var c=a[o];b<c;b++)this.items[b].attr(a[b])}else{c=0;for(var d=this.items[o];c<d;c++)this.items[c].attr(a,b)}return this};Z[p].animate=function(a,b,c,d){(m.is(c,"function")||!c)&&(d=c||null);var f=this.items[o],e=f,g,h=this,i;d&&(i=function(){!--f&&d.call(h)});c=m.is(c,ea)?c:i;for(g=this.items[--e].animate(a,b,c,i);e--;)this.items[e].animateWith(g,
a,b,c,i);return this};Z[p].insertAfter=function(a){for(var b=this.items[o];b--;)this.items[b].insertAfter(a);return this};Z[p].getBBox=function(){for(var a=[],b=[],c=[],d=[],f=this.items[o];f--;){var e=this.items[f].getBBox();a[E](e.x);b[E](e.y);c[E](e.x+e.width);d[E](e.y+e.height)}a=$[K](0,a);b=$[K](0,b);return{x:a,y:b,width:Y[K](0,c)-a,height:Y[K](0,d)-b}};Z[p].clone=function(a){a=new Z;for(var b=0,c=this.items[o];b<c;b++)a[E](this.items[b].clone());return a};m.registerFont=function(a){if(!a.face)return a;
this.fonts=this.fonts||{};var b={w:a.w,face:{},glyphs:{}},c=a.face["font-family"];for(var d in a.face)if(a.face[z](d))b.face[d]=a.face[d];if(this.fonts[c])this.fonts[c][E](b);else this.fonts[c]=[b];if(!a.svg){b.face["units-per-em"]=da(a.face["units-per-em"],10);for(var f in a.glyphs)if(a.glyphs[z](f)){c=a.glyphs[f];b.glyphs[f]={w:c.w,k:{},d:c.d&&"M"+c.d[I](/[mlcxtrv]/g,function(g){return{l:"L",c:"C",x:"z",t:"m",r:"l",v:"c"}[g]||"M"})+"z"};if(c.k)for(var e in c.k)if(c[z](e))b.glyphs[f].k[e]=c.k[e]}}return a};
G[p].getFont=function(a,b,c,d){d=d||"normal";c=c||"normal";b=+b||{normal:400,bold:700,lighter:300,bolder:800}[b]||400;if(m.fonts){var f=m.fonts[a];if(!f){a=new RegExp("(^|\\s)"+a[I](/[^\w\d\s+!~.:_-]/g,s)+"(\\s|$)","i");for(var e in m.fonts)if(m.fonts[z](e))if(a.test(e)){f=m.fonts[e];break}}var g;if(f){e=0;for(a=f[o];e<a;e++){g=f[e];if(g.face["font-weight"]==b&&(g.face["font-style"]==c||!g.face["font-style"])&&g.face["font-stretch"]==d)break}}return g}};G[p].print=function(a,b,c,d,f,e){e=e||"middle";
var g=this.set(),h=(c+s)[H](s),i=0;m.is(d,c)&&(d=this.getFont(d));if(d){c=(f||16)/d.face["units-per-em"];var j=d.face.bbox.split(V);f=+j[0];e=+j[1]+(e=="baseline"?j[3]-j[1]+ +d.face.descent:(j[3]-j[1])/2);j=0;for(var l=h[o];j<l;j++){var n=j&&d.glyphs[h[j-1]]||{},r=d.glyphs[h[j]];i+=j?(n.w||d.w)+(n.k&&n.k[h[j]]||0):0;r&&r.d&&g[E](this.path(r.d).attr({fill:"#000",stroke:"none",translation:[i,0]}))}g.scale(c,c,f,e).translate(a-f,b-e)}return g};var Jb=/\{(\d+)\}/g;m.format=function(a,b){var c=m.is(b,
U)?[0][M](b):arguments;a&&m.is(a,ea)&&c[o]-1&&(a=a[I](Jb,function(d,f){return c[++f]==null?s:c[f]}));return a||s};m.ninja=function(){La.was?(Raphael=La.is):delete Raphael;return m};m.el=u[p];return m}();