How to Change icons in world weather online

Question

I implemented a weather widget using world weather online with Classic asp and XML and everything seems to be working fine, but I would like to know if anybody know how to change the icons at all?

Thanks

    <%
Function getweather(city)
    Dim tempC, wDesc, wIcon, currentWeather
    Dim wDate, wHigh, wLow, extWeather

    url = "http://free.worldweatheronline.com/feed/weather.ashx?q=" & city & ",Canada&format=xml&num_of_days=4&key=********" 
  set xmlhttp = CreateObject("MSXML2.ServerXMLHTTP") 
  xmlhttp.open "GET", url, false 
  xmlhttp.send "" 

    set objXML = Server.CreateObject("MSXML2.DOMDocument")
    objXML.async = false    
    objXML.loadxml xmlhttp.responseText

    set x = objXML.getElementsByTagName("current_condition")
    if x.length = 0 then
        retStr = "Error"
    else        
        for i = 0 to x.item(0).childNodes.length - 1
            if x.item(0).childNodes(i).nodeName = "temp_C" then
                tempC = x.item(0).childNodes(i).text & "&deg;C"
            end if
            if x.item(0).childNodes(i).nodeName = "weatherDesc" then
                wDesc = x.item(0).childNodes(i).text
            end if
            if x.item(0).childNodes(i).nodeName = "weatherIconUrl" then
                wIcon = "<img class='wIcon' src=" & x.item(0).childNodes(i).text & " height=45 width=45>"
            end if
        next            
        currentWeather = "<div id='curWeather'><span class='city'>" & city & "</span>" & wIcon & "<div class='tempC'>" & tempC & "<br />" & wDesc & "</div>"  & "<a href='#' class='clrWeather' title='Clear weather information'><img src='images/clrweather.gif' alt='Clear weather information' /></a><div style='clear: both;'> </div></div>"
        'Extended weather
        extWeather = "<div class='extWeather'>"
        set y = objXML.getElementsByTagName("weather")
        for i = 0 to y.length - 1
            for j = 0 to y.item(i).childNodes.length - 1
                select case y.item(i).childNodes(j).nodeName
                    Case "date"
                        wDate = y.item(i).childNodes(j).text 
                        wDate = "<div class='ewDate'>" & WeekdayName(Weekday(wDate), true) & "</div>"
                    Case "weatherDesc"
                        wDesc = "<div class='ewDesc'>" & y.item(i).childNodes(j).text & "</div>"
                    Case "weatherIconUrl"
                        wIcon = "<img class='ewIcon' src=" & y.item(i).childNodes(j).text & " height=20 width=20>"
                    Case "tempMaxC"
                        wHigh = y.item(i).childNodes(j).text & "&deg;"
                    Case "tempMinC"
                        wLow = y.item(i).childNodes(j).text & "&deg;"                   
                end select
            next    
            extWeather = extWeather & "<div class='extCol'>" & wDate & wIcon & "<div class='wHigh'>" & wHigh & " / " & wLow & "</div>" & wDesc & "</div>"
        next
        extWeather = extWeather & "<div style='clear: both;'></div></div>"
        retStr = currentWeather & extWeather
    end if  

    set objXML = nothing    
  set xmlhttp = nothing 

    getweather = retStr

End function

Function getCities 
    getCities = "<option value=-1>Select city for weather info</option>" & _
                            "<optgroup label='ONTARIO'><option value='BARRIE'>BARRIE</option>" & _
                            "<option value='BRAMPTON'>BRAMPTON</option>" & _
                            "<option value='CAMBRIDGE'>CAMBRIDGE</option><option value='HAMILTON'>HAMILTON</option><option value='KINGSTON'>KINGSTON</option><option value='LONDON'>LONDON</option><option value='ORILLIA'>ORILLIA</option><option value='OTTAWA'>OTTAWA</option><option value='OWEN SOUND'>OWEN SOUND</option><option value='PETERBOROUGH'>PETERBOROUGH</option><option value='SOUTH PORCUPINE'>SOUTH PORCUPINE</option><option value='SAINT CATHARINES'>ST. CATHARINES</option><option value='SUDBURY'>SUDBURY</option><option value='THUNDER BAY'>THUNDER BAY</option><option value='TIMMINS'>TIMMINS</option><option value='WINDSOR'>WINDSOR</option><optgroup label='NEWFOUNDLAND & LABRADOR'><option value='CORNER BROOK'>CORNER BROOK</option>"

End Function


%>

Answer 1

You have two options: either get the weather data as XML, parse it yourself and construct your own design, or manipulate the raw HTML string itself, replacing desired images according to the image name with your own images.

I will give code sample for the second option. First of all, check the names of all possible icons (e.g. get weather for different cities with different weather until you got it all) and keep it. Then for each icon, get your own and save it in your server with the same name.

Having this, the following code should do the trick:

Sub ReplaceIcons(ByRef rawHTML)
    Const imagesFolder = "images/"
    Dim arrImageNames, arrTemp, x
    Dim curSrc, y, curImageName
    arrImageNames = Array("black_low_cloud.png", "cloudy_with_light_snow.png")
    arrTemp = GetBetween(rawHTML, "src=", " ")
    For x=0 To UBound(arrTemp)
        curSrc = LCase(arrTemp(x))
        If Right(curSrc, 3)="png" Then
            For y=0 To UBound(arrImageNames)
                curImageName = arrImageNames(y)
                If InStr(curSrc, curImageName)>0 Then
                    rawHTML = Replace(rawHTML, "src=" & curSrc & " ", "src=""" & imagesFolder & curImageName & """ ")
                End If
            Next
        End If
    Next
    Erase arrTemp
End Sub

Function GetBetween(str, leftDelimeter, rightDelimeter)
      Dim tmpArr, result(), x
      tmpArr=Split(str, leftDelimeter)
      If UBound(tmpArr) < 1 Then
          GetBetween=Array() : Exit Function
      End If
      ReDim result(UBound(tmpArr)-1)
      For x=1 To UBound(tmpArr)
          result(x-1)=(Split(tmpArr(x), rightDelimeter))(0)
      Next
      Erase tmpArr
      GetBetween=result
End Function

This is just an example replacing two of the icons. In case the images on your server sit in a sub folder put that in imagesFolder constant otherwise leave it empty. In arrImageNames put all possible icons.

To use the above, just call it before returning the HTML:

'...
set objXML = nothing    
set xmlhttp = nothing 

Call ReplaceIcons(retStr)

getweather = retStr