var dirn; 
var eol;
var points;
var map;
var route;
var total=0;     	     
      
function printpreis() {
	if (total==0) return;
	var pause = $F('pause');
	var preis = $F('preis');
	pause =  (pause>10) ? Math.ceil((pause-10)/5)*2 : 0;        
	$('out').innerHTML =  Math.round(total* preis) + pause + ',— € ' ;
}
      

var rules = {
	'input' : function(el) {
		el.setAttribute("autocomplete", "off"); 
	},
	'select' : function(el) {
		el.setAttribute("autocomplete", "off"); 
	},
	'.go' : function(el) {
		el.onclick = function() {
			$('path').className='showpath';
			$('path').innerHTML='';
			Element.hide('ferdigal');			
			var req = 'from: ' + $F('from') + ' to: ' + $F('to');
			var startpoint = $F("from");
        	var endpoint   = $F("to");
			dirn.loadFromWaypoints([startpoint,endpoint],{
          			locale:'DE',
          			getPolyline:true,
          			getSteps:true
          		});
		}
	},
	'.input' : function(el) {
		el.onfocus = function() {
			Element.hide('path');
			Element.hide('out');
			Effect.Appear('ferdigal');
		
		}
	},
	'#preis' : function(el) {
		el.onchange = function() {
			printpreis();
		}		
	},
	'#pause' : function(el) {
		el.onkeyup = function() {
			printpreis();
		}		
	},

	'#ferdigal' : function() {
		var slider = new Ferdinand.Slider('ferdigal',{url:'./carina.gal.js',background:'./img/background.png',loader: './img/ajax-loader.gif'});
	},
	'#out' : function(el) {
		
		el.onclick = function() {

     	//setTimeout(function(){$('iframe').src='./out/getGPX.php';},400);
   			var params = 'to=' 
   				+ encodeURIComponent($F('to')) 
   				+ '&copy='
   				+ encodeURIComponent(dirn.getCopyrightsHtml()) 
   				+ '&descr='+ encodeURIComponent('Route from: ' + $F('from') + ' to: ' + $F('to'));
			for (var j=0; j<route.getNumSteps(); j++) {
            	var step = route.getStep(j);
                var point = step.getLatLng();
                params += '&n[]='+j+'&&x[]=' +  point.x + '&y[]=' + point.y + '&name[]=' + encodeURIComponent(step.getDescriptionHtml());
         }
       
			}
	}
 };


Event.observe(window, 'load', init_app);
Event.observe(window, 'unload', GUnload);


function init_app(event) {
  Behaviour.register(rules);
  Behaviour.apply(rules);
  if (GBrowserIsCompatible()) {
      map = new GMap2($("map"));
      var lat = 54.15;//$F('lat');
      var lng = 9.74390;//$F('lng');
      var pt = new GPoint(lat,lng);
      map.setCenter(new GLatLng(lat,lng),8);
      dirn = new GDirections(map);
      GEvent.addListener(dirn,"error", function() {
        Element.hide('path');
        Element.hide('out');
        map.clearOverlays();
        alert("Das geht nicht.");
      });
		var startpoint = $F("from");
        	 var endpoint   = $F("to");
      GEvent.addListener(dirn,"load", function() {
      	Effect.BlindDown('path');
        setTimeout('customPanel(map,"map",dirn,"path")', 100);
      });

    }
}
 
 
  // ============ custom direction panel ===============
      function customPanel(map,mapname,dirn,plan) {
        function waypoint(point, type, address) {
        }
        function routeDistance(dist) {
        }      
        function detail(point, num, description, dist) {
          var html =  '<div style="clear:left">';
 	       html += '<div class="lf" style="width:2.2em">' + num +'</div>';
           html += '<div style="width:16.2em" class="lf">' + description+ '</div>';
           html += '<div class="lf" style="margin-left:10px;width:4em; text-align:right">'  +   dist +'</div>';
           html += '</div>';
           Try.these(function() {$(plan).innerHTML += html});	
        }
        function copyright(text) {
        //  $(plan).innerHTML += '<div style="font-size:7pt;">' + text + "</div>";
        }
        for (var i=0; i<dirn.getNumRoutes(); i++) {
          if (i==0) {
            var type="play";
          } else {
            var type="pause";
          }
          route = dirn.getRoute(i);
          var geocode = route.getStartGeocode();
          var point = route.getStep(0).getLatLng();
          // === Waypoint at the start of each GRoute
          waypoint(point, type, geocode.address);
          routeDistance(route.getDistance().html+" (about "+route.getDuration().html+")");
          total = 0;
          for (var j=0; j<route.getNumSteps(); j++) {
            var step = route.getStep(j);
            if (step.getDistance().meters != undefined) {
            	total = total + Number(step.getDistance().meters);
            }
            detail(step.getLatLng(), j+1, step.getDescriptionHtml(), step.getDistance().html);
          }
        }
        var pause = Number($F('pause'));
		if (pause>10) pause= Math.ceil((pause-10)/5)*2;        
        $('out').innerHTML =  Math.round(total* $F('preis')) + pause + ',&mdash; &euro;&nbsp;' ;
        Element.show('out');
        var geocode = route.getEndGeocode();
        var point = route.getEndLatLng();
        waypoint(point, "stop", geocode.address);
        copyright(dirn.getCopyrightsHtml());
       // alert(html)
        // = html;

      }