﻿//============================================================================
// JScript File
// <summary>
// Javascript file that manages the Property Assessment GUI using EXT-JS
// </summary>
// <history>
// Aralola Akinmade – Woolpert, Inc. (Created) 7/2/2007
// Joel Overpeck -- Woolpert, Inc. (Updated) 3-31-08
// </history>
//============================================================================
var parcelTabs;
var layout;
var innerLayout;
var MenuImagesURL = 'App_Themes/Green_GeoExplorer/images/';
var firstLoad = true;   
var westContentPanel;
//Dynamic Dialog Variable Container
var dialogsContainer = {};
                       
IndyPropertyViewer = function(){

            var showBtn;      
            var closeBtn;
            //Dynamic Dialog Variable Container            
            var dialogPanels = new Array();
            var dialogNames = new Array();
            var numberOfDialogs = 0;
            var dialog;            
           var helpDialog, helpButton, doShowHelp = true;
           var dialogCloseLinkText = "Close";

            
	        return {
	            init : function(){
	               layout = new Ext.BorderLayout(document.body, {
	                    north: {
	                        split:false,
	                        initialSize: 60
	                    },
	                    south: {
	                        split:false,
	                        initialSize: 30
	                    },
	                    west: {
	                        split:true,
	                        initialSize: 250,
	                        collapsible: true,
	                        titlebar:true
	                    },
	                        east: {
	                        split:false,
	                        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', {title: 'Legend', fitToFrame:true}));
	                westContentPanel = new Ext.ContentPanel('WestPanel', {title: 'Search Tools', fitToFrame:true});
	                layout.add('west', westContentPanel);
	                
	                
	                //Create the inner layout
	                 innerLayout = new Ext.BorderLayout('CenterPanel', {
	                    north: {
	                        split:false,
	                        initialSize: 40,
	                        minSize: 40,
	                        maxSize: 40,
	                        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();
	                
	                westContentPanel.on('resize', function(){
//	                                                var mapHeight = dojo.byId("ext-gen99").style.height;
//                                                    dojo.byId("mapDiv").style.height = mapHeight;
	                                                clearTimeout(resizeTimer);
                                                    resizeTimer = setTimeout(function(){
                                                        myMap.resize();
                                                        myMap.reposition();
                                                    }, 500);});

	                layout.on('regionexpanded', function(){
//	                                                var mapHeight = dojo.byId("ext-gen99").style.height;
//                                                    dojo.byId("mapDiv").style.height = mapHeight;
	                                                clearTimeout(resizeTimer);
                                                    resizeTimer = setTimeout(function(){
                                                        myMap.resize();
                                                        myMap.reposition();
                                                    }, 500);});
                                                    
                                                    
	                layout.on('regioncollapsed', function(){
//	                                                var mapHeight = dojo.byId("ext-gen99").style.height;
//                                                    dojo.byId("mapDiv").style.height = mapHeight;
	                                                clearTimeout(resizeTimer);
                                                    resizeTimer = setTimeout(function(){
                                                        myMap.resize();
                                                        myMap.reposition();
                                                    }, 500);});                              
	                
	                //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.activate('PropertyTab');
                    
                    //hide loading geoexplorer image
                    Ext.get('loading').hide();                                   
                                    
                                                                                                          
                                        
                    //start the map
                    
                    this.createHelpDialog(); 
                    
                    // help dialog is on by default
                    if (doShowHelp) {
                    helpDialog.show();
                    doShowHelp = false;
                    }
                    
                    if (navigatorIE6 == -1 && navigatorIE7 == -1 && navigatorIE8 == -1){
                        Indy.PropertyAssessmentViewer.Layout.LayoutGenerator.init();
                    }
                    //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){   
                  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);           
                    
                },
                
                //###############################################    
			    // Hide dialog function 
			    //###############################################    
                hideDialog : function(toolName){

                    //Does the Dialog Container Exists     
                    var dlgName = "Dlg" + toolName + "Container";
                    if (dialogsContainer[dlgName] != null)
                    {
                        //Hide Dialog
                        dialogsContainer[dlgName].hide();
                    }
                },//end hideDialog
               
               
//                  //###############################################    
//			    // Show help dialog function 
//			    //###############################################    
               showHelpDialog : function(){//(toolName){

     
     
                        //Hide Dialog
                        helpDialog.show();
          
                },//end hideDialog 
                
               
                //#######################################
			    // Create the Help Dialog
			    //####################################### 
                createHelpDialog: function()
			    {
	            if (!helpDialog) 
                {   
                   var offSet = 30;              
                   helpDialog = new Ext.BasicDialog("dlgStartupHelpContainer", 
                   { 
    	                autoTabs: true, modal:false, width: 750, height: 485,
                        shadow:false, constraintoviewport: true, viewport: document.body,
                        proxyDrag: true, resizable: true, closable: true,
                        draggable: true, shim: true,
                        animateTarget: new Ext.Element('TitleMenu')
                        });
                    }
                    helpDialog.addListener("hide", function() {
                    layout.layout();
                });
                this.createDialogCloseLink(helpDialog, dialogCloseLinkText);    
                },

                //#######################################
			    // Close the Help Dialog
			    //#######################################
	            createDialogCloseLink : function(dialog, html) {
		            var dh = Ext.DomHelper;
                        dialog.el.addClass('ydlg-closable');
                        dialog.close = dh.append(dialog.el.dom, {tag: 'div', cls: 'ydlg-close2', html: html}, true);
                        dialog.close.mon('click', function(){
                           dialog.hide();
                        }, dialog, true);
                  }, 
        	           
	            //#######################################
			    // Calculate the map size and resize it
			    //#######################################
			    resizeMap : function()
			    {			 
			    
			       //alert(innerLayout);   				     
                    if (innerLayout)
                    {
                        //Set Map Size
                        var cWidth, cHeight, mWidth, mHeight;
                        cWidth = innerLayout.getRegion("center").el.getWidth();
                        cHeight = innerLayout.getRegion("center").el.getHeight();                                       
//                        cWidth = Ext.get('CenterPanel').getWidth()+50;
//                        cHeight = innerLayout.getRegion("center").el.getHeight()+80;                                       
                        //setMapSize
                        SetMapSize(cWidth, cHeight);
			        }		      
			    }//, //end resizeMap
			    
			    //----------------------------------------------
			    // Loads Menu
			    //----------------------------------------------
//			    loadMenu: function()
//			    {			
//			            Ext.QuickTips.init();                       
//			            
//			            //-----------------------------------------------
//                        //Search Tools
//                        var SearchToolsMenu = new Ext.menu.Menu({
//                            id: 'SearchTools',
//                            items: [
//                                new Ext.menu.CheckItem({
//                                    icon: MenuImagesURL + 'menu/searchbyaddress.gif',
//                                    text: 'Search by Address',
//                                    handler: onItemClick
//                                }),
//                                new Ext.menu.CheckItem({
//                                    icon: MenuImagesURL + 'menu/searchbyparcel.gif',
//                                    text: 'Search by Parcel',
//                                    handler: onItemClick
//                                }),
//                                new Ext.menu.CheckItem({
//                                    icon: MenuImagesURL + 'menu/searchbyschool.gif',
//                                    text: 'Search by School District',
//                                    handler: onItemClick
//                                }),
//                                new Ext.menu.CheckItem({
//                                    icon: MenuImagesURL + 'menu/searchbysubdivision.gif',
//                                    text: 'Search by Subdivision',
//                                    handler: onItemClick
//                                })                                                                
//                                ]
//                        });
//                         //SearchToolsMenu.on('onMouseOver', "alert('hello')");
//   			            //-----------------------------------------------
//                        //Selection Tools
//                        var SelectionToolsMenu = new Ext.menu.Menu({
//                            id: 'SelectionTools',
//                            items: [
//                                new Ext.menu.CheckItem({
//                                    icon: MenuImagesURL + 'menu/findwithin.gif',
//                                    text: 'Find Within',
//                                    handler: onItemClick
//                                }),
//                                new Ext.menu.CheckItem({
//                                    icon: MenuImagesURL + 'menu/selectbyrectangle.gif',
//                                    text: 'Select Features',
//                                    handler: onItemClick
//                                }),
//                                new Ext.menu.CheckItem({
//                                    icon: MenuImagesURL + 'menu/clearselection.gif',
//                                    text: 'Clear Selection',
//                                    handler: onItemClick
//                                })                                                                
//                                ]
//                        });                                                
//                        //-----------------------------------------------
//                        //Printing tools   
//                        var PrintingToolsMenu = new Ext.menu.Menu({
//                            id: 'PrintingTools',
//                            items: [
//                                new Ext.menu.CheckItem({
//                                    icon: MenuImagesURL + 'menu/exportmap.gif',
//                                    text: 'Export Map',
//                                    handler: onItemClick
//                                }),
//                                new Ext.menu.CheckItem({
//                                    icon: MenuImagesURL + 'menu/printmap.gif',
//                                    text: 'Print Map',
//                                    handler: onItemClick
//                                })                                                             
//                                ]
//                        });                            
//                        //-----------------------------------------------
//                        //Reporting tools   
//                        var ReportingToolsMenu = new Ext.menu.Menu({
//                            id: 'ReportingTools',
//                            items: [
//                                new Ext.menu.CheckItem({
//                                    icon: MenuImagesURL + 'menu/createreport.gif',
//                                    text: 'Create Parcel Report',
//                                    handler: onItemClick
//                                })                                                     
//                                ]
//                        });
//			            //-----------------------------------------------
//                        //Purchase Data
//                        
//                        
//			            //-----------------------------------------------                        
//                        
////                        //Build the toolbar and add the items
////                        var tb = new Ext.Toolbar('Menubar');
////                        
////                        //add search tools
////                        tb.add({
////                                icon: MenuImagesURL + 'searchtools.gif',
////                                cls: 'x-btn-text-icon bmenu', // icon and text class
////                                text:'Search Tools',
////                                menu: SearchToolsMenu  // assign menu by instance
////                            }); 
////                            
////                        //add separator    
////                        tb.addSeparator();
////                        
////                        //add selection tools
////                        tb.add({
////                                icon: MenuImagesURL + 'selectiontools.gif',
////                                cls: 'x-btn-text-icon bmenu', // icon and text class
////                                text:'Selection Tools',
////                                menu: SelectionToolsMenu  // assign menu by instance
////                            }); 
////                            
////                        //add separator    
////                        tb.addSeparator();                    

////                        //add printing tools
////                        tb.add({
////                                icon: MenuImagesURL + 'printingtools.gif',
////                                cls: 'x-btn-text-icon bmenu', // icon and text class
////                                text:'Printing Tools',
////                                menu: PrintingToolsMenu  // assign menu by instance
////                            }); 
////                            
////                        //add separator    
////                        tb.addSeparator();
////                                       
////                        //add reporting tools
////                        tb.add({
////                                icon: MenuImagesURL + 'reportingtools.gif',
////                                cls: 'x-btn-text-icon bmenu', // icon and text class
////                                text:'Reporting Tools',
////                                menu: ReportingToolsMenu  // assign menu by instance
////                            }); 
////                                                             
////                        // They can also be referenced by id in or components                        
////                        tb.add({
////                            id: 'helpIcon',
////                            icon: MenuImagesURL + 'menu/help.gif', // icons can also be specified inline
////                            cls: 'x-btn-icon',
////                            handler: onButtonClick,
////                            tooltip: '<b>Help</b><br/>This button launches online help to assist you.'
////                        });

//			    } //end loadMenu
	                           
	     };//end return
	       
	}();
	
	Ext.onReady(IndyPropertyViewer.init, IndyPropertyViewer, true);
	//Ext.EventManager.onDocumentReady(IndyPropertyViewer.init, IndyPropertyViewer, true);	
	//Ext.EventManager.on(window, 'load', IndyPropertyViewer.init, IndyPropertyViewer, true); 
	      
    // functions to display feedback
    function onButtonClick(btn){
        switch(btn.id)
        {
            //display help
            case 'helpIcon':
                IndyPropertyViewer.showDialog('DlgHelpContainer','TitleMenu');
                break;
            default:
                Ext.MessageBox.alert(btn.id, 'You clicked the ' + btn.id + ' button.', null);
                break;    
        }        
    }
   
    function onItemToggle(item, pressed){
        Ext.MessageBox.alert(item.text, 'Button "{0}" was toggled to {1}.', null);
    }
   
   


 
