function toggleUnits() {
  if (g_temperatureUnits == "C") {
    selectUnits("F");
  } else {
    selectUnits("C");
  };
}

function selectUnits(units) {
  g_temperatureUnits = units;
  document.getElementById('map-image').src = "index.php?_a=map&mode="+g_mode+"&unit="+units;
  selectCity(document.getElementById('forecast-city-select').value);
}

function clearForecastList() {
  var tBody = document.getElementById('forecast-list').tBodies[0];
  while (tBody.rows.length > 0) {
    tBody.deleteRow(0);
  };
}

function setForecastListTitle(title) {
  document.getElementById('forecast-list-title').innerHTML = title;
}

function c2f(c) {
  return Math.round(c*1.8 + 32);
}

function formatHumidity(humidity) {
  return humidity + "%";
}

function formatTemperatureRange(low, high) {
  if (g_temperatureUnits == "C") {
    return high + "/" + low + " C";
  } else {
    return c2f(high) + "/" + c2f(low) + " F";
  };
}

function formatTemperature(t) {
  if (g_temperatureUnits == "C") {
    return t + " C";
  } else {
    return c2f(t) + " F";
  };
}

function setForecastList(forecasts) {
  var tBody = document.getElementById('forecast-list').tBodies[0];
  for (var i=0; i<forecasts.length; i++) {
    var forecast = forecasts[i];
      
    var row = tBody.insertRow(tBody.rows.length);

    var iconCell = row.insertCell(0);
    var temperatureCell = row.insertCell(1);
    var phraseCell = row.insertCell(2);

    iconCell.className = 'icon';
    iconCell.innerHTML =
      forecast.getAttribute('name').substr(0,3)+"<br/><img src='images/forecast_icon/"+forecast.getAttribute('icon_id')+".gif'/>";

    temperatureCell.className = 'temperature';
    var conditions = formatTemperatureRange(forecast.getAttribute('low_temperature_c'), forecast.getAttribute('high_temperature_c'));
    conditions    += "<br/>";
    temperatureCell.innerHTML = conditions; // +  formatHumidity(forecast.getAttribute('humidity'));

    phraseCell.className = 'phrase';
    phraseCell.innerHTML = forecast.getAttribute('phrase');
  };
}

function selectCity(city_id) {
  document.getElementById('forecast-city-select').value = city_id;
    
  var request = createXMLHttpRequest();
  request.onsuccess = function() {
    clearForecastList();
    setForecastListTitle(request.xmlhttp.responseXML.documentElement.getAttribute('name'));
    setForecastList(request.xmlhttp.responseXML.getElementsByTagName('forecast'));
  };
  request.open("GET","index.php?_a=forecast&city_id="+city_id,1);
  request.send("");
};

function selectCoolest() {
  var request = createXMLHttpRequest();
  request.onsuccess = function() {
    clearForecastList();
    setForecastListTitle("10 Coolest");
    setForecastCityList(request.xmlhttp.responseXML.getElementsByTagName('city'));
  };
  request.open("GET","index.php?_a=coolest",1);
  request.send("");
}

function selectHottest() {
  var request = createXMLHttpRequest();
  request.onsuccess = function() {
    clearForecastList();
    setForecastListTitle("10 Hottest");
    setForecastCityList(request.xmlhttp.responseXML.getElementsByTagName('city'));
  };
  request.open("GET","index.php?_a=hottest",1);
  request.send("");
}

function setForecastCityList(cities) {
  var tBody = document.getElementById('forecast-list').tBodies[0];
  for (var i=0; i<cities.length; i++) {      
    var city = cities[i];
     
    var row1 = tBody.insertRow(tBody.rows.length);
    var row2 = tBody.insertRow(tBody.rows.length);

    var iconCell = row1.insertCell(0);

    iconCell.className = 'icon';
    iconCell.innerHTML =
      "<img src='images/forecast_icon/"+city.getAttribute('icon_id')+".gif'/>";
    iconCell.rowSpan = 2;
   
    var cityCell = row1.insertCell(1);
    cityCell.colSpan = 2;
    cityCell.className = 'city';
    cityCell.innerHTML = "<a href='#' onclick='javascript: selectCity("+city.getAttribute('id')+")'>"+city.getAttribute('name')+"</a>"

    var temperatureCell = row2.insertCell(0);
    temperatureCell.colSpan = 2;
    temperatureCell.className = 'temperature2';
    temperatureCell.innerHTML = formatTemperature(city.getAttribute('temperature_c'));
  }
}