    Geodatenportal.app = function() {  
        // private vars:
        var toolbar, viewport, vectorLayer;


       
        // public space:
        return {
            // for debug, we make this property public:
            vector: null,
            
            setStatus: function(text) {
                Ext.getCmp('statusBar').body.dom.innerHTML = text;
            },
            
            init: function() {

//////////////////////////////////////////////
//                   Map Initialisieren
///////////////////////////////////////////////////////

            var extent = new OpenLayers.Bounds(140000, 10000, 190000, 40000);
            var ovextent = new OpenLayers.Bounds(138000, 8000, 192000, 42000);

             map = new OpenLayers.Map({
                projection: "EPSG:21780",
                controls: [], 
                numZoomLevels: 40,
                maxResolution: 'auto',
                maxExtent: extent,
                theme: null,
                fractionalZoom: true,
                scales: [ 175000, 150000, 125000, 100000, 80000, 60000, 40000, 30000, 20000, 18500, 15000, 10000, 8000, 4000, 2500],
                units: 'm'
            });



         layerstore= new layerstore(map);

          vectorLayer = layerstore.getLayer('skizze');
          map.addLayer(vectorLayer);


          var layer = new OpenLayers.Layer.GeoShop( "Wanderwege", serverurl + "/webclient",  {'view' : 'warouten' , 'background_color' : 'transparent'   }, 
                                                    {attribution: '(c)Liechtensteinische Landesverwaltung', buffer: 0, isBaseLayer: false,  
                                                    ratio: 1, singleTile: true,  'displayInLayerSwitcher' : false });         
          var layer1 = new OpenLayers.Layer.WMS( "Landeskarte", "/geoservices/cgi-bin/mapserv.exe?map=/ms4w/apps/llv/service/landeskarte_tale.map&", 
                                                 {'layers' : 'GEOSHOP_RELIEF,pk100,pk50,pk25,pk10,TBLI' }, 
                                                 { opacity: 0.8 , attribution: 'PK100 © Swisstopo (DV043727)', buffer: 0, ratio: 1, isBaseLayer: true, singleTile: false, 
                                                  transitionEffect: 'none', visibility: false, tileSize: new OpenLayers.Size(512,512)} );
          var layer2 = layerstore.getLayer('luftbild2009') ;
          var layer3 = layerstore.getLayer('reliefkarte') ;
/*
          var layer3 = new OpenLayers.Layer.WMS( "Reliefkarte", "/geoservices/cgi-bin/mapserv.exe?map=/ms4w/apps/llv/service/relief_tale.map&", 
                                                 {layers: 'GEOSHOP_RELIEF,RELIEF2M,WALD,TBLI,GEBAEUDE' }, 
                                                 {  buffer: 0, ratio : 1 , isBaseLayer: true, singleTile: false, tileSize: new OpenLayers.Size(512,512), transitionEffect: 'none'} );
*/
          var layer4 = new OpenLayers.Layer.WMS( "Reliefkarte_Text", "/geoservices/cgi-bin/mapserv.exe?map=/ms4w/apps/llv/service/relief_tale.map&", 
                                                 {layers: 'LOCATIONS_TEXT,LOCATIONS' , transparent: 'true' }, 
                                                 {  buffer: 0, ratio : 1 , isBaseLayer: false, singleTile: true, transitionEffect: 'none', 'displayInLayerSwitcher' : false} );
          map.addLayer(layer);
          map.addLayer(layer1);
          map.addLayer(layer2);
          map.addLayer(layer3);
          map.addLayer(layer4);
          var oev = new OpenLayers.Layer.GeoShop( "Buslinien", serverurl + "/webclient", { view: 'OeVerkehr', layers:'OeVLinieLBA20,OeVHaltestelleLBA20', background_color: 'transparent'}, { visibility:false, displayInLayerSwitcher: false, isBaseLayer: false,  ratio: 1.5, singleTile: true} );
          map.addLayer(oev);



////////////////////////////////////////////////////////////////////////////////
//                      Toolbar       
/////////////////////////////////////////////////////////////////////////////////////////////////////////


    Ext.QuickTips.init();

    mytoolbar =new llvtoolsbar(map,vectorLayer);
    mytoolbar.addItem ('zoom');
    mytoolbar.addItem ('fi');
    mytoolbar.addItem ('redline');
    mytoolbar.addItem ('prwawe');
    mytoolbar.addItem ('scale');
    mytoolbar.addItem ('measure');
    mytoolbar.addItem ('mousepos');
    mytoolbar.addItem ('info');
    mytoolbar.featureinfo.addLayer("Wanderwege","WA_WanderRoute");
    mytoolbar.featureinfo.addLayer("Wanderwege","WA_Points");

    mytoolbar.featureinfo.proxy='/proxy.php?url='
    nav= new OpenLayers.Control.Navigation( {mouseWheelOptions: {interval: 100}} );
    map.addControl(nav);
    nav.handlers.wheel.cumulative = true;





 
//////////////////////////////////////////////////////////////////////
//                   Viewport initialisiereun
////////////////////////////////////////////////////////////////////////
        var acc_content ='<div style="height: 20px; font-size: 14px; font-weight:bold; padding-top: 10px; padding-left: 60px;"><h2>&Uuml;bersichtskarte</h2></div>';
            acc_content+='   <div id="overview"> </div>';
            acc_content+='   <br><br>';
            acc_content+='   <div style="padding-left:5px;">';
            acc_content+='        <span style="font-sze: 14px; font-weight:bold; padding-left: 2px; padding-bottom: 5px;"><h2>Legende</h2></span><br>';
            acc_content+='        <table border="0"  style="border-collapse: collapse; bordercolor=#000000 ; width=200 " >';
            acc_content+='              <tr>';
            acc_content+='               <td width="30px"  height="20"><IMG SRC="/wanderwege/legende/talweg.gif" alt="Wanderweg"> </td>';
            acc_content+='               <td width="10" height="20" >&nbsp;</td>';
            acc_content+='               <td class="text_legende" width="150" height="20" ><a target="_blank" href="http://www.llv.li/amtsstellen/llv-awnl-wanderwege/llv-awnl-wanderwege-wanderwegmarkierungen.htm">Wanderweg</a></td>';
            acc_content+='              </tr>';
            acc_content+='              <tr>';
            acc_content+='               <td width="30px" height="20"  ><IMG SRC="/wanderwege/legende/bergweg.gif" alt="Bergweg"></td>';
            acc_content+='               <td width="10" height="20" >&nbsp;</td>';
            acc_content+='               <td class="text_legende" width="150" height="20"> <a target="_blank" href="http://www.llv.li/amtsstellen/llv-awnl-wanderwege/llv-awnl-wanderwege-wanderwegmarkierungen.htm">Bergwanderweg</a></td>';
            acc_content+='              </tr>';
            acc_content+='              <tr>';
            acc_content+='               <td width="30px" height="20"> <IMG SRC="/wanderwege/legende/alpinweg.gif" alt="Bergweg"></td>';
            acc_content+='               <td width="10" height="20" >&nbsp;</td>';
            acc_content+='               <td class="text_legende" width="150" height="20">';
            acc_content+='               <a target="_blank" href="http://www.llv.li/amtsstellen/llv-awnl-wanderwege/llv-awnl-wanderwege-wanderwegmarkierungen.htm">Alpinwanderweg</a></td>';
            acc_content+='              </tr>';

            acc_content+='              <tr>';
            acc_content+='               <td width="30px" height="20"> <IMG SRC="/wanderwege/legende/roter_weg.gif" alt="VIA ALPINA rot"></td>';
            acc_content+='               <td width="10" height="20" >&nbsp;</td>';
            acc_content+='               <td class="text_legende" width="150" height="20">';
            acc_content+='               <a target="_blank" href="http://www.via-alpina.org/">VIA ALPINA - roter Weg</a></td>';
            acc_content+='              </tr>';

            acc_content+='              <tr>';
            acc_content+='               <td width="30px" height="20"> <IMG SRC="/wanderwege/legende/gruener_weg.gif" alt="VIA ALPINA rot"></td>';
            acc_content+='               <td width="10" height="20" >&nbsp;</td>';
            acc_content+='               <td class="text_legende" width="150" height="20">';
            acc_content+='               <a target="_blank" href="http://www.via-alpina.org/">VIA ALPINA - güner Weg</a></td>';
            acc_content+='              </tr>';



            acc_content+='       </table>';
            acc_content+='   </div>';
            acc_content+='   <br>';
            acc_content+='</div>';


       var acc_download='   <div style="padding-left: 6px" align=left ><br>';
           acc_download+= '    <p class="text_normal">Die Wanderrouten können Sie kostenfrei für Google Earth oder im Format GPX für Ihr GPS-Gerät herunterladen.</p>';
           acc_download+= '    <br>';
           acc_download+= '    <h2>Google Earth</h2>';
           acc_download+= '    <br>';
           acc_download+= '    <p class="text_normal">Endecken Sie die Wanderwege Liechtensteins mit Google Earth. Weitere Hinweise zu Google Earth ';
           acc_download+= '     finden Sie <a target="_blank" href="http://earth.google.de/faq.html">hier</a></p><br>';
           acc_download+= '     <span style="MARGIN-LEFT: 4px; padding: 6px;" align=left><A title="Download für Google-Earth"   href="http://geodaten.llv.li/wanderwege/kmldownload/wawe.kmz" ';
           acc_download+= '       target=_blank><IMG height=25 src="http://www.google.com/earth/images/download_earth.gif" alt="Download Google Earth" width=93  border=0></A></span>';
           acc_download+= '     <br><br>  ';
           acc_download+= '     <h2>Wandern mit GPS</h2>';
           acc_download+= '     <br>';
           acc_download+= '     <p class="text_normal">Verwenden Sie den ';
           acc_download+= '        GPX-Download in der Routenbeschreibung der jeweiligen Route. <br>Die Routenbeschreibung wird angezeigt, wenn Sie im Menu <b>Suchen</b> eine Route aus der Liste der Suchergebnisse ausw&auml;hlen. Weitere Hinweise ';
           acc_download+= '        zur Nutzung von GPS und dem Format GPX erhalten Sie <a target="_blank" href="faq_gps.pdf">';
           acc_download+= '        hier</a></p>';
           acc_download+= '</div>';



      var acc_amt='  <div style="padding-left: 6px" align="left"><br><h2>Zuständigkeit in der Landesverwaltung</h2><br>';
          acc_amt+='     <p class="text_normal">  Das Amt für Wald, Natur und Landeschaft ist für die Planung, den Bau und die Marklierung der Wanderwege zuständig.';
          acc_amt+='       <br><br>Für Fragen zu den Wanderwegen wenden Sie sich an das <a target="_blank" href="http://www.awnl.llv.li">';
          acc_amt+='       Amt für Wald, Natur und Landschaft</a> </p>';
          acc_amt+='       <br>';
          acc_amt+='       <p class="text_normal">';
          acc_amt+='       Beachten Sie auch die <a target="_blank" href="http://www.llv.li/amtsstellen/llv-awnl-wanderwege.htm">';
          acc_amt+='       Hinweise</a> des Amtes für Wald, Natur und Landschaft zu den Sperrungen einzelner Wanderwege.</p>';
          acc_amt+=' </div>';


          viewport = new Ext.Viewport({
                layout: 'border',
                items: [
                    new Ext.BoxComponent({
                        region: 'north',
                        el: 'north',
                        height: 116
                    }), 
                    {
                    region: 'west',
                    id: 'west-panel',
                    title: 'Menü',
                    split: true,
                    width: 280,
                    minSize: 175,
                    maxSize: 400,
                    collapsible: true,
                    margins: '7 0 0 5',
                    layout: 'accordion',
                    layoutConfig:{
                        animate: true
                    },
                    items: [

                        {
                        id  : 'suchaccordion',
                        title: 'Suchen',
                        html: '<div id="Search" ></div> <DIV id="SearchList"></DIV>',
                        border: false
                        }
                       ,
                        {
                        title: 'Themenauswahl',
                        html: '<div id="tree"></div>',
                        border: false
                        }
                        ,

                        {
                        title: '&Uuml;bersichtskarte/Legenden',
                         html: acc_content,
                         border: false
                         }
                        ,
                        {
                        title: 'Download',
                        html: acc_download,
                        border: false
                       }
                       ,
                        {
                        title: 'Zust&auml;ndige Amtsstelle',
                        html: acc_amt,
                        border: false
                       }
                     ]
                  }
                 ,
                  {
                        region: "center",
                        id: "mappanel",
                        border: false,
                        margins: '7 7 0 0 ', 
                        xtype: "gx_mappanel",
                        map: map,
                        tbar: mytoolbar.toolbarItems,
                        split: true,
                        items: [{
                             xtype: "gx_zoomslider",
                             vertical: true,
                             height: 120,
                             x: 10,
                             y: 20,
                             plugins: new GeoExt.ZoomSliderTip({ template: "Massstab ca. 1:{scale}<br>Zoomstufe: {zoom}"  })
                      }]
                  }
                  ,
                  {
                        region: 'south',
                        id: 'statusBar',
                        border: false,
                        bodyStyle: 'text-align:left;padding:0px;',
                        height: 25,
                        margins: '7 0 0 0',
                        frame: true,
                        html: 'a status bar'
                   }
                ]
        });

//////////////////////   Ende Vieport ////////////////////////

///////////////////////////////////////////////////
// Layer Tree erstellen und rendern
///////////////////////////////////////////////

       var base = new GeoExt.tree.BaseLayerContainer({
              text: 'Hintergrund',
              leaf: false,
              expanded: true
       });

       var over = new GeoExt.tree.LayerContainer({
           text: 'Themen',
           leaf: false,
           expanded: true,
           loader: {
             filter: function(record) {
               var  isOK = false;
               if ( (record.get("layer").name.indexOf("Wander") != -1 )) { isOK = true}
               if ( (record.get("layer").name.indexOf("Bus") != -1 )) { isOK = true}
               return isOK;
              }
           }
      });


       var layerRoot = new Ext.tree.TreeNode({
 	                expanded: true,
                        text: 'Geodatenportal'
       });

  var  layerTree = new GeoExt.ux.tree.LayerTreeBuilder({
        renderTo: document.getElementById('tree'),
        autoScroll: true,
        header: false,
        title: "Layerliste",
        root: layerRoot,
        rootVisible: true,
        enableDD: true,
        collapsible: true,
        lines: false,
        border: false,
        // widget custom properties
        wmsLegendNodes: false,
        vectorLegendNodes: false
    });


/*
      var tree = new Ext.tree.TreePanel({
        renderTo: document.getElementById('tree'),
        root: root,
        enableDD: true,
        x: 3,
        y: 3
      });

*/
      layerRoot.appendChild (base);
      layerRoot.appendChild (over);

////////////////////////////////////////////////////
// Map ergaenzen und initialisieren
////////////////////////////////////////////////////

     var ovlayer = new OpenLayers.Layer.GeoShop( "Reliefkarte", serverurl + "/webclient",  {'view': 'pixelk_10_100_farbig_tale'}, { projection: "EPSG:21780", ratio: 1, singleTile: true });         
     var overview = new OpenLayers.Control.OverviewMap({layers: [ovlayer], minRatio: '100', maxRatio: '200',   size: new OpenLayers.Size(260,225), 'div': document.getElementById('overview'), mapOptions: {maxExtent: ovextent, theme: null}});
     map.addControl(overview);

//      map.zoomToMaxExtent();
//      update_scaleform 
      map.addControl(new OpenLayers.Control.ScaleLine());
      map.addControl(new OpenLayers.Control.MousePosition(
                  {   
                  div: OpenLayers.Util.getElement('mousePos'),                       
                  separator: 'm ',
                  numDigits: 1,
                  suffix: 'm'
                  }
      ));

//      map.events.register('moveend', this, update_scaleform);
//      update_scaleform ;         
      this.setStatus('Status: ready');

//      update_scaleform();                  
      sBar = new searchBar (map, "Wanderroutenvorschl&auml;ge", serverurl + "/igs/wanderwege2.igs");
      sBar.writeDOM ("font-family:Areal; font-size:8px: align:left");
      if (get_url_param('ID') != "") {
        Get_Total_List(sBar,get_url_param('ID'));
      }
      
   }
  };
 }(); // end of app




