hacks_4_4.js

ajax学习教程,方便大家加快学习速度,希望大家喜欢

var defaultLocationId="USMA0279";
var partId="1012144868";
var licId="67f74aa9fd9cc0e2";
var _host="www.parkerriver.com" //www.parkerriver.com
//city and state of location user searched for
var _cit = "";
var _stat = "";
window.onload = function(){
    document.getElementById("getWeather").onclick=function(){
        getNewLocation();
    }
    getWeather(defaultLocationId);
}
/* sample URL:

http://www.parkerriver.com/s/weathxml/weatherSearch?
locId=30066&cc=*&dayf=2&prod=xoap&par=1012144868&licId=67f74aa9fd9cc0e2

real:
http://xoap.weather.com/weather/local/30066?cc=*&dayf=2&prod=xoap&par=1012144868&key=67f74aa9fd9cc0e2

search for location:

http://xoap.weather.com/search/search?where=atlanta 

*/

/* Get the weather XML data for a certain location */
function getWeather(locationId){
    if (locationId == null || locationId.length=="") { return; }

    var url = "http://"+_host+"/s/weathxml/weatherSearch?&locId="+
              locationId+"&cc=*&dayf=2&prod=xoap&par="+partId+"&key="+licId;
    httpRequest("GET",url,true,handleResponse);
}

function getNewLocation(){
    var val = document.forms[0]._city.value;
    //alert(val);
    if(val.length != 0){
        _cit = val;
    }  else {
        //we need at least a city to do a search
        return;
    }
    var sval = document.forms[0]._state.value;
   // alert(sval);
    if(sval.length != 0){
        _stat = sval;
        getLocation(_cit+","+_stat);
    }   else {
        getLocation(_cit);    //We can do a search with only a city name
    }
}
/* parameter can be city alone or city,state combo
as in Boston,MA*/
function getLocation(_lcity){
    if (_lcity == null || _lcity.length=="") {alert("returning"); return; }
    var url = "http://"+_host+"/s/weathxml/addressSearch?city="+_lcity;
    httpRequest("GET",url,true,handleResponse);

}

//event handler for XMLHttpRequest
function handleResponse(){
    try{
        if(request.readyState == 4){
            if(request.status == 200){
                var _xml = request.responseXML;
                if(_xml != null){
                    var _root = _xml.documentElement;
                    switch(_root.tagName){
                        case "weather":
                            displayWeather(_root); break;
                        case  "search":
                            handleSearchResult(_root); break;
                        case "error" :
                            alert(
                                    "Your weather or location search generated an error. Please try again."); break;
                        default: alert(
                                "Your search generated an unspecified problem. Please try again.");
                    }
                } else {
                    alert("The server returned a null value for the XML. Please try again in a few seconds.");
                }

            } else {
                //request.status is 503  if the application isn't available; 500 if the application has a bug
                alert(
                        "A problem occurred with communicating between the XMLHttpRequest object and the server program.");
            }
        }//end outer if
    } catch (err)   {
        alert("It does not appear that the server is available for this application. Please"+
              " try again very soon. \nError: "+err.message);

    }
}
/* Display the weather based on XML data derived from
weather.com API */
function displayWeather(rootElement){
    if(rootElement != null){
        var loc= rootElement.getElementsByTagName("loc")[0];
        setupToplevel(loc);
        var  dayf = rootElement.getElementsByTagName("dayf")[0];
        setupWeather(dayf);
    }
}

function handleSearchResult(rootEl){
    //call getWeather(locationId)
    var locArray = rootEl.getElementsByTagName("loc");
    var elVal = null;
    for(var i = 0; i < locArray.length; i++){
        elVal = locArray[i].firstChild.nodeValue;
        //if a state was specified in the search, include in
        //the search here
        if(_stat.length != 0){
            if (elVal == _cit+", "+_stat.toUpperCase()) { getWeather(locArray[i].getAttribute("id")); }
        }  else {
            alert("No state in search.");
            //Just return the first result if no state is provided
            getWeather(locArray[i].getAttribute("id"));
            break;
        }
    }

}

function setupToplevel(_element){
    if(_element != null){
        setupElement( _element.getElementsByTagName("dnam")[0],document.getElementById("city_state"),"Location");
        setupElement( _element.getElementsByTagName("tm")[0],document.getElementById("time"),"Time");
        setupElement( _element.getElementsByTagName("lat")[0],document.getElementById("lat"),"Lat");
        setupElement( _element.getElementsByTagName("lon")[0],document.getElementById("lng"),"Long");
        setupElement( _element.getElementsByTagName("sunr")[0],document.getElementById("sunrise"),"Sunrise");
        setupElement( _element.getElementsByTagName("suns")[0],document.getElementById("sunset"),"Sunset");
    }
}

function setupElement(_node,_span,txtMsg)  {
    if(arguments.length == 3){
        _span.innerHTML= txtMsg+": "+_node.firstChild.nodeValue;
    } else {
        _span.innerHTML= _node.firstChild.nodeValue;
    }
}

function setupImgElement(_node,_imgElement)  {
    _imgElement.src="http://"+_host+"/ajaxhacks/img/"+_node.firstChild.nodeValue+".png";
}

function setupWeather(_element){
    if(_element != null){
        var parts =  _element.getElementsByTagName("part");  /* cntains sub-elements describing day/night weather */
        var dpart = null;
        setupElement( _element.getElementsByTagName("lsup")[0],document.getElementById("date"));
        setupElement( _element.getElementsByTagName("hi")[0],document.getElementById("high"),"high temp");
        setupElement( _element.getElementsByTagName("low")[0],document.getElementById("low"),"low temp");
        for(var i = 0; i < parts.length; i++)   {
            if(parts[i].getAttribute("p") == "d") { dpart=parts[i];}
        }
        setupImgElement( dpart.getElementsByTagName("icon")[0],document.getElementById("w_icon"));
        setupElement(dpart.getElementsByTagName("ppcp")[0],document.getElementById("precip"),"precipitation (% chance)");
        setupElement( dpart.getElementsByTagName("hmid")[0],document.getElementById("humid"),"humidity (%)");
        setupElement(dpart.getElementsByTagName("t")[0],document.getElementById("desc"));
        var _wind = dpart.getElementsByTagName("wind")[0];
        setupElement( _wind.getElementsByTagName("s")[0],document.getElementById("spd_wind"),"wind speed");
        setupElement( _wind.getElementsByTagName("t")[0],document.getElementById("dir_wind"),"wind direction");
    }

}