/* 
 This file was generated by Dashcode.  
 Modifications were made by Brian J Gibson
      anythingbinary.com 3/03/2009
 */
 
////////////////////////////////////////////
//  GLOLBAL VARIABLES
////////////////////////////////////////////
var req = null;
var items;                       // retrieved XML charts
var loadCounter = 0;             // processing counters
var goodCount = 0;          
var badCount = 0; 
var k=0;         

//
// On devices that doesn't have the local database feature, the settings will not be remembered.
//
var database = null;                      // The client-side SQLite database
var DB_tableName1 = "Charts";             // database table names
var DB_tableName2 = "Settings";       

//
// Function: load()
// Called by HTML body element's onload event when the web application is ready to start
//
function load()
{
    	dashcode.setupParts();
		var indicator = document.getElementById('activityIndicator');
		indicator.style.display = 'block';
		indicator.object.startAnimation();	
		initDB();   // initialize and build local CSC database if needed
		//setTimeout("hideURLbar()",3500);  // allow page to load and then scroll up the URL bar for adsense
} 

//
// Function: flipToFront(event)
// Flip to the front view to show the normal utility view
//
function flipToFront(event)
{
    var views = document.getElementById('views');
    var front = document.getElementById('front');
    if (views && views.object && front) {
        views.object.setCurrentView(front, true);
    }
}

//
// Function: flipToSettings(event)
// Flip to the back view to present user customizable settings
//
function flipToSettings(event)
{
    var views = document.getElementById('views');
    var settings = document.getElementById('settings');
    if (views && views.object && settings) {
        views.object.setCurrentView(settings);
    }
}

//
// Function: initDB()
// Init and create the local settings database, if possible
//
function initDB()
{
    try
	{
        if (window.openDatabase)
		{
            database = openDatabase("CSCdata", "1.0", "CSC Database");  // create database
            if (database)
			{
                database.transaction(function(tx)
				{
				    console.log("selecting count on CSC");
                    tx.executeSql("SELECT COUNT(*) FROM " + DB_tableName1, [],
					function(tx, result)
					{
						showMessage("Loading Charts...");
						loadSettings();
                    },
                    function(tx, error)
					{
					    console.log("creating CSC table");
                        // Database doesn't exist. Let's create one.
                        tx.executeSql("CREATE TABLE IF NOT EXISTS " + DB_tableName1 +
                        " (key TEXT PRIMARY KEY," +
                        "  country TEXT," +
						"  provstate TEXT," +
						"  name TEXT," +
						"  latitude TEXT," +
                        "  longitude TEXT)", [],
						function(tx, result) 
						{
							loadXML();   // need to load CSC database
						},
						function(tx, error)
						{
							console.log("error creating table " + DB_tableName1 + ": "  + error.message);
						});

                    });
                });
            }
        }
    }
	catch(e)
	{
	    alert("Requires an iPhone/iPod with Database support!");
        database = null;
    }
}

//
// Function: pauseMiliSecs(x)
// Pause for x miliseconds
//

function pauseMiliSecs(x) 
{
var date = new Date();
var curDate = null;

do { curDate = new Date(); } 
while(curDate-date < x);
} 

//
// Function: clearMessage()
// Utility to clear message area and stop activity indicator
//
function clearMessage()
{
    showMessage('');
	var indicator = document.getElementById('activityIndicator');
	indicator.style.display = 'none';
	indicator.object.stopAnimation();	

}

//
// Function: showMessage(msgString)
// Show a message at bottom of page
//
// msgString: string to be displayed
//
function showMessage(msgString)
{
    var element = document.getElementById('message');
    element.innerHTML = msgString;
}

//
// Function: cleanTable()
// Utility function to clean table. It can be used to test table re-creation
//
function cleanTable()
{
	var answer = confirm("Erase CSC Database Tables?");
	if(answer)
	{
		try {
			if (window.openDatabase) {
				console.log("clearing databse tables");
				database = openDatabase("CSCdata", "1.0", "CSC Database");
				if (database) {
					database.transaction(function(tx) {
						tx.executeSql("DROP TABLE IF EXISTS " + DB_tableName1, []);
						tx.executeSql("DROP TABLE IF EXISTS " + DB_tableName2, []);
					});
				}
			}
		} catch(e) { 
			alert("Unable to delete database tables");
		}
	}
}

//
// Function: clearSettings()
// Reset settings to default
//
function saveSettings(event)
{
	if (database)
	{
		var radioButton1 = document.getElementById("radiobutton1");	
		var radioButton2 = document.getElementById("radiobutton2");	
		var radioButton3 = document.getElementById("radiobutton3");	
		        
		if(radioButton1.checked == true)
		{
			var site = 1;
		}
		else
		{
			if(radioButton2.checked == true)
			{
				var site = 2;
			}
			else
			{
				var site = 3;
			}
		}
		var key = document.getElementById('chartName').value;
        console.log("Save settings for site " + site + " key= " + key);

		database.transaction(function(tx)
		{
			tx.executeSql("SELECT COUNT(*) FROM " + DB_tableName2, [],
			function(tx, result)
			{
				storeSettings(site,key);
			},
			function(tx, error)
			{
				console.log("create settings table");
				// Settings table doesn't exist. Let's create one.
				tx.executeSql("CREATE TABLE IF NOT EXISTS " + DB_tableName2 +
				" (site INTEGER PRIMARY KEY," +
				"  country TEXT," +
				"  provstate TEXT," +
				"  name TEXT," +
				"  key TEXT," +
				"  latitude TEXT," +
				"  longitude TEXT)", [],
				function(tx, result) 
				{
				    console.log("Settings table created");
					storeSettings(site,key);
				},
				function(tx, error)
				{
					console.log("error creating table " + DB_tableName2 + ": "  + error.message);
				});

			});
		});
	}
    else
	{
		showMessage("Database not available!");
    }
}


//
// Function: insertChart()
// Inserts individual chart records into the database.
//
function insertChart(key,country,provstate,name,latitude,longitude)
{
    
    if (database)
    {
        database.transaction(function (tx) {
            tx.executeSql("INSERT INTO " + DB_tableName1 + 
			" (key, country, provstate, name, latitude, longitude) VALUES (?, ?, ?, ?, ?, ?)",
			 [key, country, provstate, name, latitude, longitude],
			function(tx, result) 
			{
				   goodCount++;
				   setTimeout("showChartCount()",0);
			},
			function(tx, error)
			{
					badCount++;
			});

        });
    }
	else
	{
		alert("Error inserting chart into database");
	}
}

//
// Function: storeSettings()
// Inserts site settings into the database.
//
function storeSettings(site,key)
{
    console.log("storeSettings called");
    if (database)
	{
		var saveButton = document.getElementById("save").object;
		saveButton._textElement.innerText = "Settings Saved";
	    database.transaction(function(tx)
		{
			 console.log("selecting record from charts table");
			 tx.executeSql("SELECT * FROM " + DB_tableName1 + " WHERE key ='" + key + "'", [],
				function(tx, result)
				{
					console.log("rows returned = " + result.rows.length);
					if(result.rows.length > 0)
					{
						for (var i = 0; i < result.rows.length; ++i)
						{
							var row = result.rows.item(i);
							var country = row['country'];
							var provstate = row['provstate'];
							var name = row['name']; 
							var latitude = row['latitude'];
							var longitude = row['longitude']; 
						}
						
						console.log("storing record in settings table");
						tx.executeSql("INSERT OR REPLACE INTO " + DB_tableName2 + 
						" (site, country, provstate, name, key, latitude, longitude) VALUES (?, ?, ?, ?, ?, ?, ?)",
						 [site, country, provstate, name, key, latitude, longitude]);
						 
						// change the displayed chart to the new setting 
						displayChart(site,name,provstate,key,latitude,longitude);
						
						// put original label back on save button after a small delay
						pauseMiliSecs(1000);
						saveButton._textElement.innerText = "Save Site " + site + " Settings";
					}
					else
					{
						alert("Please make a selections in each field before saving!");
					}
				},
				function(tx, error)
				{
					console.log("error retrieving record " + key + ": " + error.message);
				});

		});

    }
	else
	{
		alert("Error inserting settings for site " + site + " into database");
	}
}


//
// Function: loadSettings()
// Load saved settings from the database. 
//
//
function loadSettings()
{
    if (database)
	{
        database.transaction(function(tx)
		{
            tx.executeSql("SELECT * FROM " + DB_tableName2 + " ORDER BY site", [],
            function(tx, result)
			{
                for (var i = 0; i < result.rows.length; ++i)
				{
                    var row = result.rows.item(i);
					var site = row['site'];
					var country = row['country'];
					var provstate = row['provstate'];
					var name = row['name'];
                    var key = row['key'];
                    var value = row['name']; 
					var latitude = row['latitude'];
					var longitude = row['longitude'];
					displayChart(site,name,provstate,key,latitude,longitude); 
					
				}
				var sites = result.rows.length;
				console.log("Site settings in database: "+ sites);
				setTimeout("clearMessage()",1000); // clear message
            },
            function(tx, error)
			{
                alert("Use info button to setup your three Chart locations!");	
                setTimeout("clearMessage()",1000); // clear message			
            });
        });
    }
    else
	{
		alert('No database available');
	}
}

//
// Function: loadStateProv()
// Load State or Province names from the database based on the Country selection.
//
//
function loadStateProv(country)
{
	var chartProvince = document.getElementById('chartProvince');
	chartProvince.options.length = 0;   // clear options list 
	chartProvince.options[0] = new Option("Choose a State or Province",""); 
    if (database)
    {
         database.transaction(function(tx)
        {
            tx.executeSql("SELECT DISTINCT provstate FROM " + DB_tableName1 + " WHERE country = '" + country + "' ORDER BY provstate", [],
            function(tx, result) {
               for (var i = 0; i < result.rows.length; i++)
                {
                    var row = result.rows.item(i);
                    var value = row['provstate'];
					chartProvince.options[i+1] = new Option(value,value);  // offset by one to allow for selection prompt
				}
            },
            function(tx, error)
            {
                alert('Failed to retrieve province from database - ' + error.message);
            });
        });
    }
    else
    {
		alert('No database available');
	}
}


function countryChanged(event)
{
    var country = document.getElementById('chartCountry').value;
	loadStateProv(country);      // populate State Province option list

}


function chartNameChanged(event)
{
    // Insert Code Here
}

function provClicked(event)
{
	var countryPicker = document.getElementById('chartCountry')
	var country = countryPicker.value;
	if(country=="")
	{
		alert("Please select a Country first");
		countryPicker.focus();  // set focus to Country list
	}
}

function chartNameClicked(event)
{
	var countryPicker = document.getElementById('chartCountry')
	var provPicker = document.getElementById('chartProvince')
	var country = countryPicker.value;
	var province = provPicker.value;
	if(country=="" || province=="")
	{
		alert("Please select a Country and State or Province first");
		if(country=="")
		{
			countryPicker.focus();  // set focus to Country list

		}
		else
		{
			provPicker.focus();  // set focus to State or Province list
		}
		
	}

}

function provChanged(event)
{
	var province = document.getElementById('chartProvince').value;
	loadChartName(province);      // populate Chart Names option list
}

//
// Function: loadChartNames(province)
// Load Chart names from the database based on the Province or State selection.
//
//
function loadChartName(province)
{
	var chartName = document.getElementById('chartName');
	chartName.options.length = 0;   // clear options list
	chartName.options[0] = new Option("Choose a Chart Location","");       
    if (database) {
        database.transaction(function(tx) {
            tx.executeSql("SELECT name, key FROM " + DB_tableName1 + " WHERE provstate = '" + province + "' ORDER BY name", [],
            function(tx, result) {
                for (var i = 0; i < result.rows.length; ++i) {
                    var row = result.rows.item(i);
					var text = row['name'];
                    var value = row['key'];
					chartName.options[i+1] = new Option(text,value);  // offset by one for selection prompt
					}
            },
            function(tx, error) {
                alert('Failed to retrieve province from database - ' + error.message);
            });
        });
    }
    else {
			alert('No database available');
		 }
}

function radioButton1Clicked(event)
{
    var radioButton1 = document.getElementById("radiobutton1");	
	var radioButton2 = document.getElementById("radiobutton2");	
	var radioButton3 = document.getElementById("radiobutton3");	
	var radioButtonOn = true;	// True for on, false for off
	var radioButtonOff = false;	 

	radioButton1.checked = radioButtonOn;
	radioButton2.checked = radioButtonOff;
	radioButton3.checked = radioButtonOff;
	
	var saveButton = document.getElementById("save").object;
	saveButton._textElement.innerText = "Save Chart 1 Settings";	
}

function radioButton2Clicked(event)
{
    var radioButton1 = document.getElementById("radiobutton1");	
	var radioButton2 = document.getElementById("radiobutton2");	
	var radioButton3 = document.getElementById("radiobutton3");	
	var radioButtonOn = true;	// True for on, false for off
	var radioButtonOff = false;	 

	radioButton1.checked = radioButtonOff;
	radioButton2.checked = radioButtonOn;
	radioButton3.checked = radioButtonOff;
	
	var saveButton = document.getElementById("save").object;
	var innerText = saveButton.innerText;
	saveButton._textElement.innerText = "Save Chart 2 Settings";	
}

function radioButton3Clicked(event)
{
    var radioButton1 = document.getElementById("radiobutton1");	
	var radioButton2 = document.getElementById("radiobutton2");	
	var radioButton3 = document.getElementById("radiobutton3");	
	var radioButtonOn = true;	// True for on, false for off
	var radioButtonOff = false;	 

	radioButton1.checked = radioButtonOff;
	radioButton2.checked = radioButtonOff;
	radioButton3.checked = radioButtonOn;
	
	var saveButton = document.getElementById("save").object;
	saveButton._textElement.innerText = "Save Chart 3 Settings";
}

////////////////////////////////////////////////
//  loadXML()
//
//  Summary: request XML data from web site
//       
/////////////////////////////////////////////////
function loadXML()
{
    showMessage("Retrieving data...");
	//check to see if we have a ref to the Xml document
    if(req == null)
    {
	    console.log("preparing httpXml request");
        //get the path to the Xml document
		//var url = "http://anythingbinary.com/iphone/csc/CSCtable.xml";  // for testing with iPhone simulator
		var url = "CSCtable.xml";   // production url
        
        //load the Xml doc from remote web site
		try
		{
           req = new XMLHttpRequest();
		   req.onreadystatechange = processReqChange;
		   req.open("GET", url, true);
		   req.send("");
		}
		catch(e)
		{
		   alert("There was a problem retrieving XML data.");
		   setTimeout("clearMessage()",100); // clear message
		   cleanTable();
		}
        
    }
	
}

////////////////////////////////////////////////
//  loadCharts()
//
//  Summary: loads chart records from an Xml
//      file to local SQLite3 database
/////////////////////////////////////////////////

function loadCharts() 
{   
    // loop through <Clock> elements and get TAG values

    for (var i=loadCounter; i < items.length; i++)
	{
        var country = getElementTextNS("Country", items[i], 0);
		var provstate = getElementTextNS("ProvState", items[i], 0);
		var name = getElementTextNS("Name", items[i], 0);
		var key = getElementTextNS("Key", items[i], 0);
		var latitude = getElementTextNS("Latitude", items[i], 0);
		var longitude = getElementTextNS("Longitude", items[i], 0);
		loadCounter = i;
		
		//insert chart data into SQLite3 database
		insertChart(key,country,provstate,name,latitude,longitude);
		
	}  // end of load charts for loop
		
} // end of function

// retrieve text of an XML document element
function getElementTextNS(local, parentElem, index)
{
    var result = "";
	result = parentElem.getElementsByTagName(local)[index];
    if (result)
	{
        // get text, accounting for possible
        // whitespace (carriage return) text nodes 
        if (result.childNodes.length > 1)
		{
            return result.childNodes[1].nodeValue;
        }
		else
		{
            return result.firstChild.nodeValue;    		
        }
    }
	else
	{
        return "n/a";
    }
}

/////////////////////////////////////////////////////////////////////////
//  processReqChange()
//  Parameters: none
//              
//  Summary: processes Clock XML data file after it is received
/////////////////////////////////////////////////////////////////////////
function processReqChange()
{
    if(req.readyState == 4)
	{
	   // file loaded
       if (req.status == 200)
	   {
	      // status is OK
		  items = req.responseXML.getElementsByTagName("Clock");
		  var XMLcharts = (items.length);
		  showMessage("Building database...");
		  while (loadCounter < (XMLcharts-1))
		     {
			 	loadCharts()   // processing was stopped, still more to process
			 }
		  req = null;
	   }
       else
	   {
		  alert("There was a problem retrieving file:\n" + req.statusText);
		  setTimeout("clearMessage()",1000); // clear message
		  cleanTable();
       }
    }		
}
// hide URL bar
function hideURLbar()
{
	window.scrollTo(0,1);
}

// display counter during load
function showChartCount()
{
    k++;
    if(k>99)   // update counter every 100 charts loaded
    {
		showMessage("Charts loaded: "+ goodCount);
		k=0;  //reset counter
	}
	if(goodCount>=items.length)
	{
		showMessage("Charts loaded: "+ goodCount);  // final count
		setTimeout("clearMessage()",2000); // done clear message
	}
}

/////////////////////////////////////////////////////////////////////////
//  displayChart(site,name,provstate,key,latitude,longitude)
//              
//  Summary: populate title, map button and image for Chart selected
/////////////////////////////////////////////////////////////////////////
function displayChart(site,name,provstate,key,latitude,longitude)
{
	// get elements
	var titleElement = document.getElementById("chart" + site + "_title");
	var gifElement = document.getElementById("chart" + site + "_img");
	var mapElement = document.getElementById("mapButton" + site);
	var mapObject = mapElement.object;
	titleElement.innerHTML = '';
	gifElement.innerHTML = '';
	var gifDisplay = "";
	//add 'random' parameter to prevent caching
	var dt = new Date();
	
	// generate html for gif image with url link to real site
	gifDisplay += "<a href=http://cleardarksky.com/c/" + key + "key.html?1><img src=\"http://cleardarksky.com/c/";
	gifDisplay += key + "cs0.gif?1?t=" + dt.getTime() + "\" id=\"chart" + site + "_img\"/></a>";
	
	var chartTitle = name + ", " + provstate;
	var buttonID = 'mapButton' + site;
	console.log("lat=" + latitude + " long=" + longitude);
	if(latitude != "0" && longitude != "0") // store address coordinates
	{
		mapObject.setAddress(latitude + "," + longitude + "(" + chartTitle + ")");
		buttonID.disabled = false;
		mapElement.style.display = '';
	}
	else  // private site, hide map button
	{
		mapElement.style.display = 'none';
		buttonID.disabled = true;
		mapObject.setAddress("");
	}	
                    
	// set content on chartPanel 
	try
	{                                   
	   titleElement.innerHTML = chartTitle;
	   gifElement.innerHTML = gifDisplay;
	}
	catch(e)
	{
	   console.log("unable to set clock title and image");  // display message 
	}
    
}