// This file is generated, do not edit!

var createMainForm=function(map,toolbar,x,y,width,height){var window=new Ext.Window({title:'Routebrowser',width:width,height:height,x:x,y:y,layout:'fit',closable:false,draggable:true,resizable:true,items:[{xtype:'mapcomponent',tbar:toolbar,map:map}]});window.show();return window;};var createSideForm=function(map,x,y,width,height){var form=new Ext.form.FormPanel({baseCls:'x-plain',labelWidth:55,items:[{xtype:'label',html:'Legenda:<br/>',anchor:'100%'},{xtype:'panel',html:'<TABLE cellspacing=0 cellpadding=0 width="100%" style="font-size: 10pt;">'
+'<TR><TD align="center"><TABLE cellspacing=0 cellpadding=0><TR><TD bgcolor="#EA01FF" height="3" width="20"><IMG src="./img/blank.gif" alt="" height=0 width=0></TD></TR></TABLE></TD><TD>Dames etappe</TD></TR>'
+'<TR><TD align="center"><TABLE cellspacing=0 cellpadding=0><TR><TD bgcolor="#BB35E7" height="3" width="20"><IMG src="./img/blank.gif" alt="" height=0 width=0></TD></TR></TABLE></TD><TD>Heren etappe</TD></TR>'
+'<TR><TD align="center"><IMG src="./img/wisselpunt.png" alt="" ></TD><TD>Wisselpunt</TD></TR>'
+'<TR><TD align="center"><IMG src="./img/verzamelpunt.png" alt="" ></TD><TD>Verzamelpunt</TD></TR>'
+'</TABLE>',anchor:'100%'},{xtype:'label',html:'<br/>Achtergrond:',anchor:'100%'},{xtype:'radio',hideLabel:true,boxLabel:'Luchtfoto',name:'rb-achtergrond',inputValue:1,checked:true,id:'satelliet',handler:radioClicked},{xtype:'radio',hideLabel:true,boxLabel:'Wegenkaart',name:'rb-achtergrond',inputValue:2,id:'kaart',handler:radioClicked},{xtype:'radio',hideLabel:true,boxLabel:'Luchtfoto met wegen',name:'rb-achtergrond',inputValue:4,id:'hybride',handler:radioClicked},{xtype:'radio',hideLabel:true,boxLabel:'Hoogtekaart',name:'rb-achtergrond',inputValue:3,id:'hoogte',handler:radioClicked},{xtype:'label',html:'<br/>Tonen in de kaart:'},{xtype:'checkbox',boxLabel:'Route',checked:true,hideLabel:true,name:'chk_Route',id:'chk_Route',handler:chk_RouteClicked},{xtype:'label',html:'<br/>Zoom in op etappe:'},{xtype:'combo',hideLabel:true,id:'cb_etappe',readOnly:true,listeners:{'select':onSelectEtappe},anchor:'100%'}]});var window=new Ext.Window({title:'Instellingen',width:width,height:height,x:x,y:y,layout:'fit',bodyStyle:'padding:5px;',closable:false,draggable:true,resizable:false,collapsible:true,buttonAlign:'center',items:form});window.show();return window;};var createOverviewForm=function(map,x,y,width,height){var form=new Ext.form.FormPanel({baseCls:'x-plain',labelWidth:55,items:[{xtype:'panel',autoheight:true,autowidth:true,html:'<div id="overview"></div>'}]});var window=new Ext.Window({title:'Overzichtskaart',width:width,height:height,x:x,y:y,layout:'fit',bodyStyle:'padding:5px;',closable:false,collapsible:true,draggable:true,resizable:false,buttonAlign:'center',items:form});window.show();return window;};var createTitleForm=function(map,x,y,width,height){var form=new Ext.form.FormPanel({baseCls:'x-plain',labelWidth:55,items:[{xtype:'label',html:'<center><a href="http://www.veluweloop.nl" target="_new"><img src="./img/veluweloop_jaar.jpg" /></a></center>'},{xtype:'panel',autoheight:true,autowidth:true,html:'<div id="title"></div>'}]});var window=new Ext.Window({title:'',width:width,height:height,x:x,y:y,layout:'fit',bodyStyle:'padding:4px;background-color:#FFFFFF;',closable:false,draggable:false,resizable:false,buttonAlign:'center',items:form});window.show();return window;};var addSeparator=function(toolbar){toolbar.add(new Ext.Toolbar.Spacer());toolbar.add(new Ext.Toolbar.Separator());toolbar.add(new Ext.Toolbar.Spacer());};var createToolbar=function(map){var toolbar=new mapfish.widgets.toolbar.Toolbar({map:map,configurable:false});toolbar.autoHeight=false;toolbar.height=25;return toolbar;};var fillToolbar=function(map,toolbar){toolbar.addControl(new OpenLayers.Control.ZoomToMaxExtent({map:map,title:'Zoom naar volledige route'}),{iconCls:'zoomfull',toggleGroup:'map'});addSeparator(toolbar);toolbar.addControl(new OpenLayers.Control.ZoomBox({title:'Zoom in: klik in de kaart of gebruik de linkermuisknop en sleep de muis om een rechthoek te maken'}),{iconCls:'zoomin',toggleGroup:'map'});toolbar.addControl(new OpenLayers.Control.ZoomBox({out:true,title:'Zoom uit: klik in de kaart of gebruik de linkermuisknop en sleep de muis om een rechthoek te maken'}),{iconCls:'zoomout',toggleGroup:'map'});var nav=new OpenLayers.Control.NavigationHistory();map.addControl(nav);nav.activate();var buttonPrevious=new Ext.Toolbar.Button({iconCls:'back',tooltip:'Zoom naar vorige gebiedsuitsnede',disabled:true,handler:nav.previous.trigger});var buttonNext=new Ext.Toolbar.Button({iconCls:'next',tooltip:'Zoom naar volgende gebiedsuitsnede',disabled:true,handler:nav.next.trigger});toolbar.add(buttonPrevious);toolbar.add(buttonNext);nav.previous.events.register("activate",buttonPrevious,function(){this.setDisabled(false);});nav.previous.events.register("deactivate",buttonPrevious,function(){this.setDisabled(true);});nav.next.events.register("activate",buttonNext,function(){this.setDisabled(false);});nav.next.events.register("deactivate",buttonNext,function(){this.setDisabled(true);});addSeparator(toolbar);toolbar.addControl(new OpenLayers.Control.DragPan({isDefault:false,title:'Verschuif de kaart: houd de linkermuisknop ingedrukt en sleep de muis'}),{iconCls:'pan',toggleGroup:'map'});addSeparator(toolbar);selectTool=new OpenLayers.Control.SelectFeature(routelayer,{box:false,onSelect:onFeatureSelect,onUnselect:onFeatureUnselect,title:'Etappe informatie: klik op een etappe in kaart'})
selectTool.events.register("deactivate",selectTool,onSelectToolDeactivate);toolbar.addControl(selectTool,{iconCls:'info',toggleGroup:'map'});addSeparator(toolbar);toolbar.add({xtype:'tbfill'});var currentDate=new Date();var currentYear=currentDate.getFullYear();toolbar.add({xtype:'tbtext',text:'&copy; 2009-'+currentYear+' Ontwerp en bouw: <A HREF="http://www.aris.nl" target="blank">ARIS</A>'});toolbar.activate();return toolbar;};var onPopupClose=function(evt){selectTool.unselectAll();};var onFeatureSelect=function(feature){var selectedFeature=feature;infoWin=new Ext.Window({autoHeight:true,width:478,stateful:false,plain:true});etappe=selectedFeature.attributes.ETAPPE;if(etappe<10)
{etappeZNR="0"+etappe}
else
{etappeZNR=etappe}
lnk="'http://www.veluweloop.nl/content/etappes/etappe"+etappeZNR+".html'";infoWin.html='<A href="http://www.veluweloop.nl/content/etappes/etappe'+etappeZNR+'.html" target="blank">Routebeschrijving</A>'
+'<p><img src="./img/etappe'+etappe+'.gif"/></p>';infoWin.setTitle('Etappe '+etappe+': '+selectedFeature.attributes.VAN+' - '+selectedFeature.attributes.NAAR);infoWin.show(this);};var onFeatureUnselect=function(feature){if(infoWin){infoWin.close();}};var openroutebeschrijving=function(s){routebeschrijving=window.open(s,"Routebeschrijving","dependent=yes,directories=no,height=500,menubar=no,personalbar=no,scrollbars=yes,toolbar=no,resizable=yes,status=no,width=500");}
function addOverviewMap(map){var extent=new OpenLayers.Bounds(5.5,51.88,6.22,52.10).transform(displayProj,mapProj);var extent=new OpenLayers.Bounds(5.615,51.95,6.04,52.06).transform(displayProj,mapProj);var mapOptions={projection:mapProj,displayProjection:displayProj,units:"m",maxExtent:extent,numZoomLevels:1};var ovroutelayer=new OpenLayers.Layer.GML("KML","kml/route.kml",{projection:map.displayProjection,format:OpenLayers.Format.KML,formatOptions:{extractStyles:false,extractAttributes:false}});setOverviewStyle(ovroutelayer);var overviewmap=new OpenLayers.Control.OverviewMap({mapOptions:mapOptions,size:new OpenLayers.Size(194,79),autoPan:false,div:document.getElementById("overview"),layers:[new OpenLayers.Layer.WMS("OpenLayers WMS","http://labs.metacarta.com/wms/vmap0",{layers:'basic'}),ovroutelayer]});overviewmap.isSuitableOverview=function(){return true;};map.addControl(overviewmap);var ovmap=overviewmap.ovmap;ovmap.zoomToExtent(extent);};var setOverviewStyle=function(layer){var styleMap=new OpenLayers.StyleMap({'default':{strokeColor:"black",strokeOpacity:1,strokeWidth:1,fillColor:"#FF5500",fillOpacity:1,pointRadius:0,pointerEvents:"visiblePainted",label:"",fontColor:"#FF5500",fontSize:"10px",fontFamily:"Arial",fontWeight:"bold",labelAlign:"lb"}});layer.styleMap=styleMap;};var fillEtappesCombo=function(routelayer){if(!etappesCombo){etappesCombo=Ext.getCmp('cb_etappe');var data=[];data[0]=[0,"Hele route"]
var features=routelayer.features;features.sort(sortOnEtappe);for(var i=0;i<features.length;i++){var feature=features[i];data[i+1]=[feature.attributes.ETAPPE,feature.attributes.ETAPPE+". "+feature.attributes.VAN+" - "+feature.attributes.NAAR];};var store=new Ext.data.SimpleStore({fields:["etappenr","etappe"],data:data});etappesCombo.store=store;etappesCombo.displayField='etappe';etappesCombo.valueField='etappenr';etappesCombo.typeAhead=true;etappesCombo.mode='local',etappesCombo.triggerAction='all';etappesCombo.selectOnFocus=true;etappesCombo.setValue(0);}};var sortOnEtappe=function(a,b){return a.attributes.ETAPPE-b.attributes.ETAPPE;};var onSelectEtappe=function(){if(etappesCombo.getValue()==0){map.zoomToExtent(routelayer.getDataExtent());}
else{var feature=findFeature(etappesCombo.getValue());map.zoomToExtent(feature.geometry.getBounds());}};var findFeature=function(etappenr){var features=routelayer.features;features.sort(sortOnEtappe);for(var i=0;i<features.length;i++){if(features[i].attributes.ETAPPE==etappenr){return features[i];}}};var createWmsLayer=function(map,name,url,params,options){map.addLayer(new OpenLayers.Layer.WMS(name,url,params,options));};var createMap=function(div){mapProj=new OpenLayers.Projection("EPSG:900913");displayProj=new OpenLayers.Projection("EPSG:4326");maximumExtent=new OpenLayers.Bounds(5.63,51.96,6.02,52.06).transform(displayProj,mapProj);var mapOptions={controls:[],projection:mapProj,displayProjection:displayProj,units:"m",maxExtent:maximumExtent};var map=new OpenLayers.Map(div,mapOptions);satlayer=new OpenLayers.Layer.Google("Google Satellite",{sphericalMercator:true,type:G_SATELLITE_MAP,opacity:0.8,minZoomLevel:6,maxZoomLevel:17});maplayer=new OpenLayers.Layer.Google("Google Streets",{opacity:0.8,sphericalMercator:true,minZoomLevel:6,maxZoomLevel:17});phylayer=new OpenLayers.Layer.Google("Google Physical",{opacity:0.8,sphericalMercator:true,type:G_PHYSICAL_MAP,minZoomLevel:6,maxZoomLevel:17});hyblayer=new OpenLayers.Layer.Google("Google Hybrid",{opacity:0.8,sphericalMercator:true,type:G_HYBRID_MAP,minZoomLevel:6,maxZoomLevel:17});map.addLayers([satlayer,maplayer,phylayer,hyblayer]);satlayer.setOpacity(0.8)
maplayer.setOpacity(0.8)
phylayer.setOpacity(0.8)
hyblayer.setOpacity(0.8)
routelayer=new OpenLayers.Layer.GML("KML","kml/route.kml",{projection:map.displayProjection,format:OpenLayers.Format.KML,formatOptions:{extractStyles:true,extractAttributes:true}});routelayer.events.register("loadend",routelayer,onLoadend);map.addLayer(routelayer);routelabellayer=new OpenLayers.Layer.GML("KML","kml/route_etappenummers.kml",{projection:map.displayProjection,minScale:500000,format:OpenLayers.Format.KML,formatOptions:{extractStyles:false,extractAttributes:true}});setLabelStyle(routelabellayer,"${name}","white");map.addLayer(routelabellayer);wplayer=new OpenLayers.Layer.GML("KML","kml/wisselpunten.kml",{projection:map.displayProjection,minScale:500000,format:OpenLayers.Format.KML,formatOptions:{extractStyles:true,extractAttributes:true}});map.addLayer(wplayer);wplabellayer=new OpenLayers.Layer.GML("KML","kml/wisselpunten.kml",{projection:map.displayProjection,minScale:250000,format:OpenLayers.Format.KML,formatOptions:{extractStyles:false,extractAttributes:true}});setLabelStyle(wplabellayer,"${NAAM}","white");map.addLayer(wplabellayer);return map;};var setLabelStyle=function(layer,labelattribute,color){var styleMap=new OpenLayers.StyleMap({'default':{backgroundColor:"0000FF",strokeColor:"#00FF00",strokeOpacity:0,strokeWidth:0,fillColor:"#FF5500",fillOpacity:0,pointRadius:0,pointerEvents:"visiblePainted",label:labelattribute,fontColor:color,fontSize:"12px",fontFamily:"Arial",fontWeight:"bold",labelAlign:"lb"}});layer.styleMap=styleMap;};var map;var toolbar;var selectTool;var satlayer,maplayer,phylayer,hyblayer;var routelayer,routelabellayer,wplayer,wplabellayer;var mapProj,displayProj;var maximumExtent;var chkRoute,chkEtappeNummers,chkWisselpunten;var etappesCombo;var infoWin;var xClicked,yClicked;OpenLayers.IMAGE_RELOAD_ATTEMPTS=3;OpenLayers.Util.onImageLoadErrorColor="transparent";Ext.BLANK_IMAGE_URL='../../MapFish/client/mfbase/ext/resources/images/default/s.gif';function addMapControls(map){var navControl=new OpenLayers.Control.Navigation({type:OpenLayers.Control.TYPE_TOGGLE,zoomWheelEnabled:true});map.addControl(navControl);navControl.activate();};var radioClicked=function(){var radioSat=Ext.getCmp('satelliet');var radioMap=Ext.getCmp('kaart');var radioPhy=Ext.getCmp('hoogte');var radioHyb=Ext.getCmp('hybride');satlayer.setVisibility(radioSat.checked);maplayer.setVisibility(radioMap.checked);phylayer.setVisibility(radioPhy.checked);hyblayer.setVisibility(radioHyb.checked);if(radioSat.checked){map.setBaseLayer(satlayer);setLabelStyle(wplabellayer,"${NAAM}","white");setLabelStyle(routelabellayer,"${name}","white");}
else if(radioMap.checked){map.setBaseLayer(maplayer);setLabelStyle(wplabellayer,"${NAAM}","#004040");setLabelStyle(routelabellayer,"${name}","#004040");}
else if(radioPhy.checked){map.setBaseLayer(phylayer);setLabelStyle(wplabellayer,"${NAAM}","#004040");setLabelStyle(routelabellayer,"${name}","#004040");}
else if(radioHyb.checked){map.setBaseLayer(hyblayer);setLabelStyle(wplabellayer,"${NAAM}","white");setLabelStyle(routelabellayer,"${name}","white");}
wplabellayer.redraw();routelabellayer.redraw();};var chk_RouteClicked=function(){if(!chkRoute){chkRoute=Ext.getCmp('chk_Route');}
routelayer.setVisibility(chkRoute.checked);routelabellayer.setVisibility(chkRoute.checked);wplayer.setVisibility(chkRoute.checked);wplabellayer.setVisibility(chkRoute.checked);};var chk_EtappeNummersClicked=function(){if(!chkEtappeNummers){chkEtappeNummers=Ext.getCmp('chk_EtappeNummers');}
routelabellayer.setVisibility(chkEtappeNummers.checked);};var chk_WisselpuntenClicked=function(){if(!chkWisselpunten){chkWisselpunten=Ext.getCmp('chk_wisselpunten');}
wplayer.setVisibility(chkWisselpunten.checked);wplabellayer.setVisibility(chkWisselpunten.checked);};var onLoadend=function(){fillEtappesCombo(routelayer);};var onSelectToolDeactivate=function(){if(infoWin){infoWin.hide();};};var handleClickInMap=function(e,t){if(infoWin){xClicked=e.getPageX();yClicked=e.getPageY();infoWin.setPosition(xClicked,yClicked);};};Ext.onReady(function(){var titleWidth=860;var titleHeight=90;var titleX=5;var titleY=5;var mainWidth=635;var mainHeight=480;var mainX=5;var mainY=titleHeight+10;var sideWidth=220;var sideHeight=350;var sideX=mainX+mainWidth+5;var sideY=mainY;map=createMap('mainmap');toolbar=createToolbar(map);createMainForm(map,toolbar,mainX,mainY,mainWidth,mainHeight);createSideForm(map,sideX,sideY,sideWidth,sideHeight);createOverviewForm(map,sideX,sideY+sideHeight+5,sideWidth,125);createTitleForm(map,titleX,titleY,titleWidth,titleHeight);addMapControls(map);addOverviewMap(map);fillToolbar(map,toolbar);var mainMap=Ext.get("mainmap");mainMap.on("click",handleClickInMap);map.zoomToMaxExtent()
toolbar.activate();});