// JavaScript Document

/**
 * LiveMap Class
 * Show Windows Live Maps in your webpage
 */
function LiveMap(container, debug)
{
	/**
	 * Debug methods
	 */
	
	var doDebug;
	var debugText = '';
	if( debug !== true ) {
		doDebug = false;
	} else {
		doDebug = debug;
	}
	
	this.logText = logText;
	function logText(t) {
		if( doDebug == true ) {
			debugText += t + "\n";
		}
	}
	
	function startLog() {
		logText('Log start.');
		logLine();
	}
	
	function finishLog(show) {
		logLine();
		logText('End of log.');
		
		if( show == true ) {
			showLog();
		}
	}
	
	function logLine(n) {
		var str = '';
		if( n > 0 ) {
			for( var i=0; i<n; i++ ) {
				str += "\n";
			}
		} else {
			str = "\n";
		}
		
		logText(str);
	}		
	
	function showLog() {
		if( debugText.length > 0 ) {
			alert( debugText );
		}
	}
	
	function clearLog() {
		debugText = '';
	}
	
	startLog();
	
	/**
	 * Private Variables
	 */
	 
	var dash;
	var glass;
	var livemap;
	var map;
	var refreshView;
	
	var dashBackground;
	var dashOpacity;
	var dashBorderStyle;
	var dashBorderWeight;
	var dashBorderColor;
	var dashMargin;
	var dashZOrder;
	
	var mapLon;
	var mapLat;
	var mapZoom;
	var mapStyle;
	var mapAllowControl;
	var mapPoints;
	
	// Initialize variables with default values
	if( !document.getElementById ) {
		logText('Error: getElementById() not supporter by this browser');
	}
	
	dash = document.getElementById(container);
	glass = document.getElementById('glass');
	livemap = document.getElementById('livemap');
	map = new VEMap('livemap');
	
	if( dash == null ) {
		logText('Error: Can\'t get "dash" element');
	}
	
	if( glass == null ) {
		logText('Error: Can\'t get "glass" element');
	}
	
	if( livemap == null ) {
		logText('Error: Can\'t get "livemap" element');
	}
	
	refreshView = false;
	
	dashBackground = '#000120'; // HEX code
	dashOpacity = 85; // 0-100
	dashBorderStyle = 'solid'; // Solid, Dashed, Dotted, etc
	dashBorderWeight = 1;
	dashBorderColor = '#000000'; // HEX code
	dashMargin = 20; // px
	dashZOrder = 100; // px
	
	mapLon = -27.137368; // Argentina
	mapLat = -62.314453; // Argentina
	mapZoom = 3; // South America
	mapStyle = 'r'; // r:Road, s:Satellite, h:Hybrid
	mapAllowControl = false; // True|False
	mapPoints = new Array(); // Empty
	
	/**
	 * Getters and Setters
	 */
	
	this.setBackgroundColor = function(c) {
		logText( 'User changed background color to ' + c );
		dashBackground = c;
	}
	
	this.setBackgroundOpacity = function(o) {
		logText( 'User changed background opacity to ' + o );
		dashOpacity = o;
	}
	
	this.setBorderStyle = function(s) {
		this.logText( 'User changed border style to ' + s );
		dashBorderStyle = s;
	}
	
	this.setBorderWeight = function(w) {
		this.logText( 'User changed border weight to ' + w );
		dashBorderWeight = w;
	}
	
	this.setBorderColor = function(c) {
		this.logText( 'User changed border color to ' + c );
		dashBorderColor = c;
	}
	
	this.setMargin = function(m) {
		this.logText( 'User changed margin to ' + m );
		dashMargin = m;
	}
	
	this.setDepth = function(d) {
		this.logText( 'User changed depth to ' + d );
		dashZOrder = d;
	}
	
	/**
	 * Map Control Setters
	 */
	
	this.setLon = function(l) {
		mapLon = l;
		refreshView = true;
	}
	
	this.setLat = function(l) {
		mapLat = l;
		refreshView = true;
	}
	
	this.setZoom = function(z) {
		mapZoom = z;
		refreshView = true;
	}
	
	this.setStyle = function(s) {
		mapStyle = s;
		refreshView = true;
	}
	
	/**
	 * Map methods
	 */
	
	this.AllowControl = function(c) {
		mapAllowControl = c;
	}
	
	this.addPoint = function(lat, lon, img, str, des, zom) {
		
		var pinId = mapPoints.length;
		
		/**
		 * Old code...
		 *
		var pinLt = p['lat'];
		var pinLn = p['lon'];
		var pinIm = p['img'];
		var pinNm = p['str'];
		var pinPh = p['pic'];
		var pinDs = p['des'];
		var pinZm = p['zom'];
		 */
		
		var PushPin = new VEPushpin( pinId,
									 new VELatLong( lat, lon ),
									 img,
									 str,
									 des
									);
		
		var mapPoint = new Array ();
		mapPoint['id'] = pinId;
		mapPoint['zl'] = zom; // Preferred zoom when showing this point
		mapPoint['dt'] = PushPin;
		
		// Add mapPoint to mapPoints
		mapPoints.push(mapPoint);
		
		// Add PushPin to map
		// map.AddPushpin(PushPin);
		
		// ----------------------------------
		
		/*
		var pin = new VEPushpin( 1, 
               new VELatLong(-34.5944, -58.406271), 
               null, 
               'Kathmandu', 
               '<img src="./img/Pict92.jpg"><br>'+
                  'One of the many rainy days we had in Kathmandu. '+
                  'I guess that\'s what you get for traveling during monsoon season.',
               'iconStyle',
               'titleSytle',
               'detailsStyle'
            );
            map.AddPushpin(pin);
		*/
		
	}
	
	this.addPushPins = addPushPins;
	function addPushPins() {
		
		var ppc = mapPoints.length;
		
		logLine();
		logText( 'Found ' + ppc + ' PushPins.' );		
		
		for( var i=0; i< ppc; i++ ) {
			
			map.AddPushpin( mapPoints[i]['dt'] );
			logText( '- PushPin added in map (id= ' + mapPoints[i]['id'] + ').' );
			
		}
		
	}
	
	/**
	 * Core methods
	 */
	
	this.show = function() {
		
		logLine();
		logText('Showing map (Locked: ' + mapAllowControl + ').');
		
		if( refreshView == true ) {
			logText( '- Using user defined view (Lat: '+mapLat+', Lon: '+mapLon+', Zoom: '+mapZoom+').' );
		} else {
			logText( '- Using default view (Lat: '+mapLat+', Lon: '+mapLon+', Zoom: '+mapZoom+').' );
		}
		
		// -----------------------------------------
		// Different ways to get width and height,
		// not all work well in all browsers.
		// I put this here for information.
		// -----------------------------------------
		/*
		
		var ww = window.width;
		var wh = window.height;
		var wiw = window.innerWidth;
		var wih = window.innerHeight;
		var dw = document.width;
		var dh = document.height;
		var cw = document.body.clientWidth;
		var ch = document.body.clientHeight;
		var domw = document.documentElement.clientWidth;
		var domh = document.documentElement.clientHeight;
		
		*/
		// -----------------------------------------
		
		// Get available space to build the dashboard
		var DOMw = document.documentElement.clientWidth;
		var DOMh = document.documentElement.clientHeight;
		
		// Log data
		logText("Available area: " + DOMw + 'x' + DOMh + '.' );
		
		// Import values
		var d = dash;
		var g = glass;
		var m = livemap;
		var dm = dashMargin;
		var op = dashOpacity;
		var bg = dashBackground;
		var bs = dashBorderStyle;
		var bw = dashBorderWeight;
		var bc = dashBorderColor;
		var dz = dashZOrder;
		
		// Calculate new values
		var gw = DOMw - (dm*2);
		var gh = DOMh - (dm*2);
		
		logText('Glass dimensions: ' + gw + 'x' + gh + '.' );
		
		var mw = DOMw - (dm*4);
		var mh = DOMh - (dm*4);
		
		logText('Map dimensions: ' + mw + 'x' + mh + '.' );
		
		// Apply dashboard styles
		d.style.display = 'block';
		d.style.position = 'fixed';
		d.style.top = '0px';
		d.style.left = '0px';
		d.style.width = DOMw;
		d.style.height = DOMh;
		d.style['z-order'] = dz;
		
		// Apply dashboard background styles
		g.style.display = 'block';
		g.style.position = 'absolute';
		g.style.top = dm+'px';
		g.style.left = dm+'px';
		g.style.width = gw+'px';
		g.style.height = gh+'px';
		g.style.filter = 'alpha(opacity='+op+')';
		g.style['-moz-opacity'] = op/100;
		g.style.opacity = op/100;
		g.style.backgroundColor = bg;
		g.style['z-order'] = dz+1;
		
		// Apply map styles
		m.style.display = 'block';
		m.style.position = 'absolute';
		m.style.top = dm*2+'px';
		m.style.left = dm*2+'px';
		m.style.width = mw+'px';
		m.style.height = mh+'px';
		m.style.backgroundColor = bg;
		m.style['z-order'] = dz+3;
		
		map.LoadMap(new VELatLong(mapLat, mapLon), mapZoom ,mapStyle , mapAllowControl, VEMapMode.Mode2D, false);
		
		//this.addPushPins();
		
		finishLog(true);
		
	}
	
	this.showLocation = function( lat, lon, zoom ) {
		
		this.setLat(lat);
		this.setLon(lon);
		if( zoom !== 'undefined' ) {
			this.setZoom(zoom);
		}
		
	}
	
	this.showMapPoint = function( id ) {
		
		var lat = mapPoints[id]['dt'].LatLong.Latitude;
		var lon = mapPoints[id]['dt'].LatLong.Longitude;
		var zom = mapPoints[id]['zl'];
		
		this.showLocation( lat, lon, zom );
		
	}
}