Ext.namespace('Ext.mainPage.chooseStreetForm');

Ext.mainPage.chooseStreetForm.renderChooseStreetForm = function(){

  var displayedSegments;

  function ensureLayout(elm, func, scope) {
      var r,
          e = Ext.get(elm),
          elmStyle = elm.style,
          oldDisp = elmStyle.display,
          wasXHidden = e.hasClass('x-hide-display');
  
      if (wasXHidden) {
          e.removeClass('x-hide-display');
      }
      elmStyle.display = "block";
      if (!elm.offsetWidth) {
          r = ensureLayout(elm.parentNode, func, scope);
      } else {
          r = func.call(scope || window);
      }
      elmStyle.display = oldDisp;
      if (wasXHidden) {
          e.addClass('x-hide-display');
      }
      return r;
  }

  Ext.override(Ext.form.TriggerField, {
      onResize : function(w, h){
          ensureLayout(this.wrap.dom, function() {
              Ext.form.TriggerField.superclass.onResize.call(this, w, h);
              var tw = this.trigger.getWidth();
              if(typeof w == 'number'){
                  this.el.setWidth(this.adjustWidth('input', w - tw));
              }
              this.wrap.setWidth(w);
          }, this);
      }
  });

    var streetsStore= new Ext.data.Store({
        	proxy: new Ext.data.HttpProxy({url: 'mainPage/ajax/getStreets.html'}),
        	reader: new Ext.data.ArrayReader({}, ['value','label'])
    	     });

    streetsStore.load();

    var streetCoordsStore = new Ext.data.Store({
        	proxy: new Ext.data.HttpProxy({url: 'mainPage/ajax/getStreetCoords.html'}),
        	reader: new Ext.data.ArrayReader({}, ['segId','lon','lat'])
    	     });	

    streetCoordsStore.on('load',function(){
      if(displayedSegments) {
        vectorLayer.removeFeatures(displayedSegments);
      }
      displayedSegments = [];
  	  streetCoords = new Array(0);	  
      var i=0;
      var r;
      var segId="";
      while(r = streetCoordsStore.getAt(i)) {
      
        if(segId != r.get('segId')){
          if(segId == "") {
            segId=r.get('segId');
          }
          else { 
            polylineFeature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(streetCoords),null,dispStreetLine);
            displayedSegments.push(polylineFeature);
            streetCoords = [];
            segId=r.get('segId');
          }        
        }
        streetCoords.push(new OpenLayers.Geometry.Point(r.get('lon'),r.get('lat')));  
        ++i;
      }
      polylineFeature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(streetCoords),null,dispStreetLine);
      displayedSegments.push(polylineFeature);
      vectorLayer.addFeatures(displayedSegments);
      map.setCenter(new OpenLayers.LonLat(streetCoords[0].x,streetCoords[0].y));
    });

    var streetInfoStore= new Ext.data.Store({
        	proxy: new Ext.data.HttpProxy({url: 'mainPage/ajax/getStreetInfo.html'}),
        	reader: new Ext.data.ArrayReader({}, ['name','lon','lat'])
    	     });	

    var label;
    var lon;
    var lat;
    var newPoint;
    var icon;

    streetInfoStore.on('load',function(){
	   if(polylineFeature) {
		  vectorLayer.removeFeatures([polylineFeature]);
	   }
		
	   if(streetInfoStore.getAt(0).get('label') == "") {
	   Ext.MessageBox.show({
          	title: 'Chyba',
              msg: 'Zadana ulica neexistuje',
              buttons: Ext.MessageBox.OK,
	       animEl: 'searchButton'
          });

 	   return;
	   }

	   //lon = streetInfoStore.getAt(0).get('lon');
	   //lat	= streetInfoStore.getAt(0).get('lat');
	   //newPoint = new OpenLayers.LonLat(lon,lat);
	   //icon = iconI.clone();
	   //marker = new OpenLayers.Marker(newPoint,icon);
	   //markers.addMarker(marker);
	   //popup = new OpenLayers.Popup.FramedCloud(label,newPoint,new OpenLayers.Size(200,200),Ext.miceTemplates.bubbleStreetInfo.applyTemplate(streetInfoStore.getAt(0).data),icon);
	   //map.addPopup(popup);
//	   map.setCenter(newPoint, 2); 
	   streetCoordsStore.load({params:{id:search_box.getValue()}});
    });	

    var search_box=new Ext.form.ComboBox({
      hiddenName: 'street_name',
      store: streetsStore,
      displayField:'label',
      valueField: 'value',
      typeAhead: true,
      mode: 'local',
      triggerAction: 'all',
      emptyText:'Názov ulice...',
      editable: true,
      selectOnFocus:true,
      allowBlank:true,
      width: 590
    });

	search_box.on('select',	function(){
		if(search_box.getValue() != null) {
//   	  for(var i=0;i<markersList.length;++i){
//         markers.removeMarker(markersList[i]);
//       }
//       markersList = [];
// 			if(popup!=null) {
// 				popup.destroy();
// 				popup=null;
// 			}
			streetInfoStore.load({params:{id:search_box.getValue()}});
		}
    });
		
    fsf = new Ext.FormPanel({
		labelWidth: 1,
		labelSeparator: ' ',
        frame:true,
      hideMode: 'offsets',

        title: '&nbsp;&nbsp;&nbsp;Vyhľadávanie ulíc',
 
        width: 647,

        items :[search_box]

    });

//    fsf.on('render',function(){
//        controlPanel.getItem('streets_tab').hide();
// 
//    });
	
   fsf.render("streets_form");
}