Add changing the data source.

index.html

@@ -67,9 +67,15 @@
 
     (function(){
 
+        var dataDownloaded = false;
+        var data;
+
         var defaultStation = "00000000-0000-0000-0000-000000000001";
         var defaultPollution = "00000000-0000-0000-0000-000000000001";
 
+        var selectedStation = defaultStation;
+        var selectedPollution = defaultPollution;
+
         var possibleCities = ['bialystok', 'kielce', 'krakow', 'kujawskopomorskie', 'lublin', 'lubuskie', 'lodz', 'olsztyn', 'opole', 'poznan', 'rzeszow', 'szczecin', 'slask', 'trojmiasto', 'warszawa', 'wielka_brytania_i_irlandia', 'wroclaw'];
 
         var getParams = function(){
@@ -84,20 +90,22 @@
             return vars;
         };
 
-        var getPollution = function(station, pollution){
+        var getPollution = function(){
             var xhr = new XMLHttpRequest();
             xhr.onreadystatechange = function() {
                 if (xhr.readyState == XMLHttpRequest.DONE) {
-                    updateView(filterValues(JSON.parse(xhr.response), station, pollution));
+                    dataDownloaded = true;
+                    data = JSON.parse(xhr.response);
+                    updateView();
                 }
             }
             xhr.open('GET', 'view', true);
             xhr.send(null);
         };
 
-        var filterValues = function(data, station, pollution){
+        var filterValues = function(){
             var measurement = data.measurements[Object.keys(data.measurements).find(function(key){
-               return data.measurements[key].station == station && data.measurements[key].type == pollution;
+               return data.measurements[key].station == selectedStation && data.measurements[key].type == selectedPollution;
             })];
             if (measurement){
                 return measurement.value;
@@ -107,14 +115,20 @@
         };
 
         var updateView = function(value){
-            document.getElementById("pollution-value").textContent = value;
+            document.getElementById("pollution-value").textContent = filterValues();
         };
 
         var parameters = getParams();
+        document.getElementById('select-station').value = parameters["local_id"] || defaultStation;
+        document.getElementById('select-station').addEventListener("change", function(){
+            selectedStation = document.getElementById('select-station').value;
+            updateView();
+        });
         if (parameters["local_id"]){
-            getPollution(parameters["local_id"], defaultPollution);
+            selectedStation = parameters["local_id"];
+            getPollution();
         } else if (parameters["locals"] && parameters["locals"] === 'krakow'){
-            getPollution(defaultStation, defaultPollution);
+            getPollution();
         }
 
     })();