//============================================================================
// JScript File
// <summary>
// Javascript file that manages the GeoExplorere GUI using EXT-JS
// </summary>
// <history>
// Aralola Akinmade – Woolpert, Inc. (Created) 7/2/2007
// </history>
//============================================================================
var parcelTabs;
var layout;
var innerLayout;
var MenuImagesURL = 'App_Themes/Green_GeoExplorer/images/';
var firstLoad = true;   
//Dynamic Dialog Variable Container
var dialogsContainer = {};
                       
SandGIS = function(){

            var showBtn;      
            var closeBtn;
            //Dynamic Dialog Variable Container            
            var dialogPanels = new Array();
            var dialogNames = new Array();
            var numberOfDialogs = 0;
            var dialog;
            
	        return {
	            init : function(){
	               layout = new Ext.BorderLayout(document.body, {
	                    north: {
	                        split:false,
	                        initialSize: 75
	                    },
	                    south: {
	                        split:false,
	                        initialSize: 30
	                    },
	                    west: {
	                        split:true,
	                        initialSize: 250,
	                        collapsible: true,
	                        titlebar:true
	                    },
	                    center: {
	                        autoScroll: false
	                    }
	                });
	                	                
	                layout.beginUpdate();
	                layout.add('north', new Ext.ContentPanel('NorthPanel', {fitToFrame:true}));
	                layout.add('south', new Ext.ContentPanel('SouthPanel', {fitToFrame:true}));
	                //layout.add('east', new Ext.ContentPanel('EastPanel', {fitToFrame:true}));
	                layout.add('west', new Ext.ContentPanel('WestPanel', {title: 'Search Tools', fitToFrame:true}));
	                
	                //Create the inner layout
	                 innerLayout = new Ext.BorderLayout('CenterPanel', {
	                    north: {
	                        split:false,
	                        initialSize: 60,
	                        minSize: 60,
	                        maxSize: 60,
	                        autoScroll:false,
	                        collapsible:false,
	                        titlebar: false
	                    },
	                    south:
	                    {
	                        split:false,
	                        initialSize: 30	                    
	                    },
	                    center: {
	                        autoScroll:false
	                    }
	                });
	                
	                innerLayout.add('north', new Ext.ContentPanel('ToolbarPanel'));
	                innerLayout.add('center', new Ext.ContentPanel('Map_Panel'));
	                innerLayout.add('south', new Ext.ContentPanel('Scalebar_Panel'));
	                	                
	                //layout.add('center', new Ext.ContentPanel('CenterPanel'));
	                layout.add('center', new Ext.NestedLayoutPanel(innerLayout));	                
	                layout.endUpdate();
	                
	                //load the tabs
	                parcelTabs = new Ext.TabPanel('parcelTabs');
	                var propertyTab = parcelTabs.addTab('PropertyTab', "Property Information");
	                var salesHistoryTab = parcelTabs.addTab('SalesHistoryTab', "Sales History");
	                var photosTab = parcelTabs.addTab('PhotosTab', "Photos");
                    parcelTabs.activate('PropertyTab');
                    parcelTabs.syncHeight();
	                
                    parcelTabs.activate('PropertyTab');
                    
                    //hide loading geoexplorer image
                    Ext.get('loading').hide();                                   
                                    
                    //start the map
                    startUp();
                                        
	           },
                //----------------------------------------------
                //shows an item - hide or show
                //----------------------------------------------
                showItem : function(itemName, isVisible)
                {
                    var theItem = Ext.get(itemName);
                    if (theItem)
                    {
                        if (isVisible) 
                        {
                            theItem.show();
                        }else{
                            theItem.hide();
                        }    
                    }            
                },
                //----------------------------------------------
                //shows the dialog
                //----------------------------------------------
                showDialog : function(dialogName, animateSource, dlgWidth, dlgHeight, isModal){   
                    if (getSessionLapse() < maximumLapseTime) {
                        lastResponseReceivedTime=new Date();
                        
                        var isNew = false;
                          
                        dialog = null;
                        var defaultWidth = Ext.get(dialogName).getWidth();
                        var defaultHeight = Ext.get(dialogName).getHeight();
                                                   
                        //find the dialog if it already exists
                        for (var i = 0; i<dialogPanels.length;i++)
                        {
                            if (dialogName == dialogNames[i])
                            {
                                dialog = dialogPanels[i];                
                                break;
                            }
                        }

                        //if the dialog is modal
                        if (!isModal) isModal = false;   

                        //use the specified dimensions
                        if ((dlgWidth != null) && (dlgHeight != null))
                        {
                            defaultWidth = dlgWidth;
                            defaultHeight = dlgHeight;
                        }             
                                       
                        if(!dialog){ // lazy initialize the dialog and only create it once
                        
                            isNew = true;
                            
                            dialog = new Ext.BasicDialog(dialogName, { 
                                    autoTabs:true,
                                    width:defaultWidth,
                                    height:defaultHeight,
                                    shadow:true,
                                    shim:true,  
                                    resizable:true, 
                                    modal:isModal,                 
                                    //minWidth:defaultWidth,
                                    //minHeight:defaultHeight,
                                    minWidth:80,
                                    minHeight:80,
                                    proxyDrag: true
                            });
                            
                            dialog.addKeyListener(27, dialog.hide, dialog);
                            
                            dialogsContainer[dialogName] = dialog;
                                            
                            //move the dialog
                            var mapPanel = Ext.get("Map1");
                            if (mapPanel)
                            {
                                var y = mapPanel.getY();                    
                                var x = Ext.get("Map_Panel").getX() + 50;
                                if (dialogName == "DlgResultsContainer") y += 190;
                                //move the dialog
                                dialog.moveTo(x,y);      
                            }    
                                                                
                            //add the dialog to the collection
                            dialogNames[numberOfDialogs] = dialogName;
                            dialogPanels[numberOfDialogs] = dialog;          
                                            
                            //store the number of dialogs
                            numberOfDialogs = dialogNames.length;
                        }

                        //set the width and height and the mode              
                       if ((dlgWidth != null) && (dlgHeight != null))
                       {
                         dialog.setContentSize(defaultWidth,defaultHeight);
                          
                          if (isNew)
                          {
                          //move the dialog
                          var mapPanel = Ext.get("Map1");
                            if (mapPanel)
                            {
                                var y = mapPanel.getY();                    
                                var x = Ext.get("WestPanel").getX() - dialog.getEl().getWidth() - 3;
                                if (dialogName == "DlgResultsContainer") y += 190;
                                //move the dialog
                                dialog.moveTo(x,y);      
                            }
                          }      
                        }
                        
                        //set the dialog mode
                        dialog.isModal = isModal;           
                        dialog.show(Ext.get(animateSource).dom);           
                    } 
                    else
                        showLapseAlert();
                            
                },
                
                //###############################################    
			    // Hide dialog function 
			    //###############################################    
                hideDialog : function(toolName){
                    if (getSessionLapse() < maximumLapseTime) {
                        lastResponseReceivedTime=new Date();

                        //Does the Dialog Container Exists     
                        var dlgName = "Dlg" + toolName + "Container";
                        if (dialogsContainer[dlgName] != null)
                        {
                            //Hide Dialog
                            dialogsContainer[dlgName].hide();
                        }
                    } 
                    else
                        showLapseAlert();
                },//end hideDialog
                
        	           
	            //#######################################
			    // Calculate the map size and resize it
			    //#######################################
			    resizeMap : function()
			    {			 
                    if (getSessionLapse() < maximumLapseTime) {
			            //Maintain Session Alive
	                    lastResponseReceivedTime=new Date();

                        if (innerLayout)
                        {
                            //Set Map Size
                            var cWidth, cHeight, mWidth, mHeight;
                             cWidth = innerLayout.getRegion("center").el.getWidth();
                            cHeight = innerLayout.getRegion("center").el.getHeight();                                       
                            //setMapSize
                            SetMapSize(cWidth, cHeight);
			            }		      
                    } 
                    else
                        showLapseAlert();
			    }
	                           
	     };//end return
	       
	}();
	
	Ext.EventManager.on(window, 'load', SandGIS.init, SandGIS, true); 
	      
    // functions to display feedback
    function onButtonClick(btn){

        if (getSessionLapse() < maximumLapseTime) {
            //Maintain Session Alive
            lastResponseReceivedTime=new Date();

            switch(btn.id)
            {
                //display help
                case 'helpIcon':
                    SandGIS.showDialog('DlgHelpContainer','TitleMenu');
                    break;
                default:
                    Ext.MessageBox.alert(btn.id, 'You clicked the ' + btn.id + ' button.', null);
                    break;    
            }        
        } 
        else
            showLapseAlert();
    }
   
    function onItemToggle(item, pressed){
        Ext.MessageBox.alert(item.text, 'Button "{0}" was toggled to {1}.', null);
    }