Advertisement
chughgaurav

weatherApp

Mar 17th, 2013
110
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 3.70 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html>
  4. <head>
  5.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6.     <title>sWeather App</title>
  7.     <link href="s40-theme/css/s40-theme.css" rel="stylesheet" type="text/css" />
  8.     <link href="s40-theme/css/basic.css" rel="stylesheet" type="text/css" />
  9.     <link rel="stylesheet" type="text/css" href="s40-theme/css/s40-theme_labeled_title.css" />
  10.     <script language="javascript" type="text/javascript" src="s40-theme/js/screensize.js"></script>
  11.     <script language="javascript" type="text/javascript" src="js/main.js"></script>
  12.     <script language="javascript" type="text/javascript" src="js/processJson.js"></script>
  13.  
  14. <script language="javascript" type="text/javascript">
  15. function initialiseApp(){
  16.     //clear forecast screen
  17.     var containers=new Array("selectedCityWeather","forecastContainer");
  18.     for (var i = 0; i < containers.length; i++) {
  19.         container = document.getElementById(containers[i]);
  20.         container.innerHTML ="";    
  21.     }      
  22.     findUserCity();
  23. }
  24. function findUserCity(){
  25.     $.ajax({
  26.       url : "http://api.wunderground.com/api/c5b35d49009935ad/geolookup/q/autoip.json",
  27.       dataType : "jsonp",
  28.       success : function(parsed_json) {  
  29.       var j=0;
  30.         var city = parsed_json['response']['results'][0]['name'];
  31.         var cityId = parsed_json['response']['results'][0]['l'];       
  32.         document.getElementById("userCityId").value=cityId;          
  33.         document.getElementById("userCity").value=city;
  34.         findUserLocationWeather(cityId);       
  35.       }
  36.     });
  37. }
  38. </script>
  39. <script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
  40. </head>
  41. <body onload="initialiseApp();jsonDataSource.init();">
  42. <div class="container" >
  43.     <div class="strip view0" id="views">
  44.         <div id="homeview">
  45.             <div class="titlebar">
  46.                 <img src="img/titlebar.png" alt="TitleBar"/>
  47.                 <span onclick="window.location.reload();">
  48.                     <img src="img/reload.png" alt="Reload"/>
  49.                 </span>
  50.             </div>
  51.             <br/>
  52.             <div id="currentWeatherContainer" >
  53.             </div>
  54.             <br/><br/>
  55.             <div class="inputContainer">                                                           
  56.                 <span id="userCityForecast" onclick="showForecast();mwl.switchClass('#views','view0','view1');">Show forecast</span>
  57.                 <br/><br/>
  58.                 <span> select city:</span>                 
  59.                 <select id="citySelector" >
  60.                         <option value="/q/zmw:00000.8.42182" selected="selected">Delhi</option>
  61.                         <option value="/q/zmw:20619.1.99999">California</option>
  62.                         <option value="/q/zmw:00000.3.43279">Chennai</option>
  63.                         <option value="/q/zmw:83601.1.99999">Atlanta</option>                                            
  64.                 </select>
  65.                 <span onclick="findSelectedCityWeather();mwl.switchClass('#views','view0','view2');">Submit</span>             
  66.                
  67.                 <input type="hidden" id="userCityId" value=""/>
  68.                 <input type="hidden" id="userCity" value=""/>
  69.                                
  70.             </div>                                                 
  71.         </div>
  72.         <div id="verticleview">
  73.             <div class="titlebar">
  74.                 <span onclick="mwl.switchClass('#views','view1', 'view0')">
  75.                     <img src="img/titlebar.png" alt="TitleBar"/>
  76.                     <img src="img/back_arrow.png" alt="Back"/>
  77.                 </span>
  78.              </div>
  79.             <div id="forecastContainer">
  80.             </div>                 
  81.         </div>
  82.         <div id="horizontalview">
  83.             <div class="titlebar">
  84.                 <span onclick="mwl.switchClass('#views','view2', 'view0')">
  85.                     <img src="img/titlebar.png" alt="TitleBar"/>
  86.                     <img src="img/back_arrow.png" alt="Back"/>
  87.                 </span>
  88.             </div>
  89.             <div id="selectedCityWeather">
  90.             </div>     
  91.         </div>
  92.     </div>
  93. </div>
  94. </body>
  95. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement