did some changes to includes, still have an error because the API is out of date

www/app.js

-//<debug>
 Ext.Loader.setPath({
     'Ext': 'sdk/src'
 });
-//</debug>
+
+Ext.Loader.setConfig({enabled:true});
+
 
 Ext.application({
     controllers: ["Main", "ChartController"],
     models: ["SimulationModel", "SimulationDetails"],
-    stores: ['SimulationStore', 'FloodDetailStore', 'SimulationsSummary', 'LsmStore', 'chartStore'],    
+    stores: ['SimulationStore', 'FloodDetailStore', 'SimulationsSummary', 'LsmStore', 'chartStore'],
 
     name: 'app',
 
@@ -15,7 +16,7 @@ Ext.application({
         'Ext.MessageBox',
     ],
 
-    views: ['Main', "Simulation", "List", 'Map', 'StepsOverlay', 'OptionsPanel', 
+    views: ['Main', "Simulation", "List", 'Map', 'StepsOverlay', 'OptionsPanel',
             'SimulationList', 'LsmSimulationList', 'Chart'],
 
     icon: {
@@ -24,7 +25,7 @@ Ext.application({
         114: 'resources/icons/Icon@2x.png',
         144: 'resources/icons/Icon~ipad@2x.png'
     },
-    
+
     phoneStartupScreen: 'resources/loading/Homescreen.jpg',
     tabletStartupScreen: 'resources/loading/Homescreen~ipad.jpg',
 

www/app/controller/ChartController.js

@@ -75,7 +75,7 @@ Ext.define('app.controller.ChartController', {
 				console.log(event);
 				lat = event.latLng.lat();
 				lng = event.latLng.lng();
-				app.Api.getIzid(lat, lng, map.areaId);		
+				app.Api.getIzid(lat, lng, map.areaId);
 			}
 		});
 	},
@@ -97,9 +97,7 @@ Ext.define('app.controller.ChartController', {
 				volume : parseInt(line_clmns[2]),
 			});
 		}
-		console.log(data);
 	 	store.setData(data);
-	 	console.log(store);
 	 	this.openChart();
 	},
 
@@ -112,9 +110,9 @@ Ext.define('app.controller.ChartController', {
 		this.getFloodchart().hide();
 	},
 
-	expandChart: function(){
-		
-		
-	}
+    //TODO:
+	//expandChart: function(){
+
+	//}
 
-});
+});
\ No newline at end of file

www/app/controller/Main.js

 /**
 * Main controller object
-* 
+*
 *
 */
 Ext.define('app.controller.Main', {
@@ -34,7 +34,7 @@ Ext.define('app.controller.Main', {
                 autoCreate: true,
             },
 
-            simOptionsButton: { 
+            simOptionsButton: {
                 selector: '#simulationOptions',
                 autoCreate: true,
             },
@@ -121,7 +121,7 @@ Ext.define('app.controller.Main', {
     initiateCities: function() {
         this.getSimOptionsButton().show();
     },
-    
+
     /* first function to call */
     setMap: function(extmap, map) {
         this.globalMap = map;
@@ -187,24 +187,24 @@ Ext.define('app.controller.Main', {
         this.getPause().hide();
         this.getPlayBackw().show()
         this.getPauseBackw().hide();
-        
+
         /*clear interval, even if there wasn't any*/
         clearInterval(this.interval);
         this.getMapView().removeImages();
         this.getOverlay().hide();
     },
 
-    /* Initialize simulation, responds when tapped on a list item 
+    /* Initialize simulation, responds when tapped on a list item
      * of the simulation panel
      */
     simulate: function(list, index, element, record) {
         var me = this;
         /*first, remove all images, even if there werent any*/
-        this.getMapView().removeImages();       
+        this.getMapView().removeImages();
         /*create reference, cb looses scope of this.*/
         var map = this.getMapView(),
             /*The simulationDetailStore has the details of the get test_id*/
-            test_id = record.get('test_id'), 
+            test_id = record.get('test_id'),
             /*bounds variable used later on*/
             bounds;
 
@@ -235,11 +235,11 @@ Ext.define('app.controller.Main', {
          * steps available, crucial data for the displaying the images.
          */
         var url = '';
-        if (this.SimulType == 'Flood')
-        {
+        if (this.SimulType == 'Flood') {
             url = 'http://sangkil.science.uva.nl:8003/drfsm/'+ test_id +'/info.json';
+        } else {
+            url = 'http://sangkil.science.uva.nl:8003/lsm/'+ test_id +'/visualization/paru/info.json';
         }
-        else url = 'http://sangkil.science.uva.nl:8003/lsm/'+ test_id +'/visualization/paru/info.json';
         this.requestInfo(test_id, cb, url);
 
         /*show overlay*/
@@ -258,11 +258,11 @@ Ext.define('app.controller.Main', {
         /*store center*/
         var center = record.get('center');
         var area_id = record.get('area_id');
-        
+
         /* This is used because this function may only be
          *  executed onece. */
         var selected = false;
-        
+
         for (i in this.selectedIndex)
             if (this.selectedIndex[i] == index)
                 selected = true;
@@ -288,7 +288,7 @@ Ext.define('app.controller.Main', {
         }
         else if(this.SimulType == 'Lsm')
             this.getSidepanel().push(this.getLsmSimulation());
-        
+
 
         /*the store with details of the simulation*/
         var store = Ext.getStore('FloodDetailStore');
@@ -308,7 +308,7 @@ Ext.define('app.controller.Main', {
             store.each(function(r) {
                 dikes = r.get('dikes');
             });
-            
+
             if (dikes.length != 0)
                 this.getMapView().createOverlayPolygon(dikes);
             this.getMapView().createMarker(center);
@@ -328,12 +328,10 @@ Ext.define('app.controller.Main', {
         var me = this;
         var summary_store = Ext.getStore('SimulationsSummary');
 
-       // var mapImage ='http://maps.googleapis.com/maps/api/staticmap?center='+ center[0] +','+ center[1] + '&zoom=13&size=300x180&maptype=roadmap&sensor=false';
         summary_store.each(function(record){
             var test_id = record.get('test_id');
 
             var setImages = function(result){
-         //       document.getElementById(test_id + "_map").src = mapImage;//me.getMapView().getFloodImage(test_id, result['timesteps'][result['timesteps'].length - 1]); 
                 var image = me.getMapView().getFloodImage(test_id, result['timesteps'][result['timesteps'].length - 1]) || 'resources/images/noimage.png';
                 document.getElementById(test_id + "_flood").src = image;
             }
@@ -345,8 +343,8 @@ Ext.define('app.controller.Main', {
             var url = url || 'http://sangkil.science.uva.nl:8003/drfsm/'+ test_id +'/info.json';
             var request = Ext.Ajax.request({
                 method: 'GET',
-                url: url,//'http://sangkil.science.uva.nl:8003/drfsm/'+ test_id +'/info.json',
-    
+                url: url,
+
             success: function(response, opts){
                 var result = Ext.decode(response.responseText);
                 callback(result);
@@ -371,6 +369,6 @@ Ext.define('app.controller.Main', {
             this.SimulType = 'Lsm'
         else if (record.get('type') == 'Flood' && this.SimulType != 'Flood')
             this.SimulType = 'Flood'
-        this.getSimulationOptions().hide();  
+        this.getSimulationOptions().hide();
     },
 });

www/app/model/SimulationDetails.js

 Ext.define('app.model.SimulationDetails', {
 	extend: 'Ext.data.Model',
-	
+
 	config: {
 		fields: ['name', 'center', 'corners', 'size', 'extents', 'visbounds', 'vissize', 'projection', 'dikes'],
 	},
-});
+});
\ No newline at end of file

www/app/model/SimulationModel.js

 Ext.define('app.model.SimulationModel', {
 	extend: 'Ext.data.Model',
-	
+
 	config: {
 		fields: ['name', 'corners', 'visbounds', 'area_id', 'center', 'size'],
 	},
-});
+});
\ No newline at end of file

www/app/store/FloodDetailStore.js

@@ -18,9 +18,9 @@ Ext.define('app.store.FloodDetailStore', {
 
 		}
 	},
-	
+
 	setUrl: function(area_id) {
 		var store = Ext.getStore('FloodDetailStore').getProxy();
 		store._url = 'http://sangkil.science.uva.nl:8003/area/' + area_id + '/info.json';
 	},
-});
+});
\ No newline at end of file

www/index.html

-<!DOCTYPE HTML>
+<pDOCTYPE HTML>
 <html manifest="" lang="en-US">
 <head>
     <meta charset="UTF-8">
+
     <title>Floodsimulation Browser</title>
     <style type="text/css">
         /**
@@ -76,7 +77,7 @@
         .map_thumb {
             position: relative;
             left: 0px;
-            top: 0px;  
+            top: 0px;
         }
 
         #overlay {
@@ -99,11 +100,11 @@
         }
 
         #controls_title {
-            
+
         }
 
         .x-back-button {
-            
+
         }
 
         #controls_title h2 {
@@ -120,10 +121,12 @@
         }
 
     </style>
+
     <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
-    <script id="microloader" type="text/javascript" src="sdk/microloader/development.js"></script>
-    <script type="text/javascript" src="sdk/touch-charts.js"></script>
-    
+    <script id="microloader" type="text/javascript"
+        src="sdk/microloader/development.js"></script>
+    <script type="text/javascript"
+        src="sdk/touch-charts.js"></script>
 </head>
 <body>
     <div id="appLoadingIndicator">