Salesforce Mashup with google maps

This app helps user to plot  sales on the google map.The sales to be plotted can be filtered based on various criteria like location,size,type,date etc.Clicking on a sale on the map redirects to the corresponding account.

you can install the unmanaged apex package from  here :
https://login.salesforce.com/packaging/installPackage.apexp?p0=04t90000000Pyoa

Use the following doc for deployment instructions :
https://docs.google.com/viewer?a=v&pid=sites&srcid=ZGVmYXVsdGRvbWFpbnxteWZpbGVzOTF8Z3g6NTJkN2U5YWU4ZTA3ZDZlMA

Demo video:
https://sites.google.com/site/myfiles91/home/files/salesmap.swf?attredirects=0

The app uses only one visual force page and one controller

Visual Force page :

<apex:page sidebar="false" Controller="salesData" id="page">

    <apex:includeScript value="{!URLFOR($Resource.jquery, 'jquery-1.3.2.min.js')}"/>
    <apex:includeScript value="{!URLFOR($Resource.jquery, 'jquery-ui-1.7.2.custom.min.js')}"/>
    <apex:stylesheet value="{!URLFOR($Resource.jquery,'jquery-ui-1.7.2.custom.css')}"/>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
    
    <script type="text/javascript">    
        //This will load as soon as the page is ready and will setup slider
        $(document).ready(function(){
               
                //to setup slider
                $("#slider-range").slider({ //This line creates a slider on the DIV specified, options are passed arguments,comma separated below
                range: true,
                min: 0, //Min value for slider
                max: 400, //Max value for slider
                values: [0,250], //initial values of slider
                slide: function(event, ui){ //function to execute on slide event
                
                  document.getElementById('{!$Component.page.form.block.values.size_low}').value = ui.values[0]; //hidden fields to pass slider values to controller 
                  document.getElementById('{!$Component.page.form.block.values.size_high}').value = ui.values[1];
                  $("#amountValue").html(ui.values[0] + ' - ' + ui.values[1]); //display slider value as text
                  
                }
                });
                
                //to display initial values of slider
                $("#amountValue").html($("#slider-range").slider("values", 0) + ' - ' + $("#slider-range").slider("values", 1));
                
        
        });
        
    </script>
    <style>
        #map_canvas {
        font-family: Arial;
        font-size:12px;
        line-height:normal !important;
        height:500px;
        width:1000px;
        background:transparent;
        }
    </style>
                
                
     <apex:form id="form">
         <apex:pageBlock mode="edit" id="block">
               <apex:pageMessages />
               
               <apex:pageBlockSection columns="7" id="values" >
                
                  <apex:pageBlockSectionItem >
                    <apex:outputlabel value="* Country"/>
                    <apex:selectList value="{!country}" multiselect="false" required="true" size="1">
                       <apex:selectOptions value="{!countries}"/>
                    </apex:selectList>
                 </apex:pageBlockSectionItem>
                  
                 <apex:pageBlockSectionItem >
                   <apex:outputlabel value="State"/>
                   <apex:inputtext value="{!state}"/> 
                 </apex:pageBlockSectionItem>
                  
                 <apex:pageBlockSectionItem >  
                   <apex:outputlabel value="City"/>
                   <apex:inputtext value="{!city}"/> 
                 </apex:pageBlockSectionItem>
                  
                 <apex:commandButton action="{! search}" value="Search" reRender="mymap" />  
                  
                 <!-- pass slider values -->
                 <apex:inputhidden value="{!size_low}" id="size_low" /> 
                 <apex:inputhidden value="{!size_high}" id="size_high" />
                 <!-- pass address of clicked marker -->
                 <apex:inputhidden value="{!addressParameter}" id="addressParameter" /> 
                  
               </apex:pageBlockSection>
               
               <apex:pageBlockSection title="Filter Results" columns="3">
                     
                     <apex:pageBlockSectionItem >
                        <apex:outputLabel value="Size"/>
                        <!-- This is where our slider will be -->
                        <div id="slider-range" style="font-size: 90%; margin-top: 0.5em;"></div>
                        <div id="amountValue" style="text-align: center;"></div>
                     </apex:pageBlockSectionItem>
                     
                     <apex:pageBlockSectionItem >
                        <apex:outputlabel value="Begining Year"/>
                        <apex:selectList value="{!b_year}" multiselect="false" required="true" size="1">
                           <apex:selectOptions value="{!years}"/>
                        </apex:selectList>
                     </apex:pageBlockSectionItem>
                     
                     <apex:pageBlockSectionItem >
                        <apex:outputlabel value="End Year"/>
                        <apex:selectList value="{!e_year}" multiselect="false" required="true" size="1">
                           <apex:selectOptions value="{!years}"/>
                        </apex:selectList>
                     </apex:pageBlockSectionItem>
                     
                     <apex:pageBlockSectionItem >
                        <apex:outputlabel value="Type"/>
                        <apex:selectCheckboxes value="{!type}">
                           <apex:selectOptions value="{!items}"/>
                        </apex:selectCheckboxes>
                     </apex:pageBlockSectionItem>
                     
               </apex:pageBlockSection>
               
          <apex:pageBlockSection columns="2">
                <apex:outputpanel id="mymap">
                  <div id="map_canvas"></div>
 
                  <script type="text/javascript">
                     
                     var myOptions = {
                            zoom:15,
                            mapTypeControl: false,
                            mapTypeId: google.maps.MapTypeId.ROADMAP
                         };
                     var geocoder = new google.maps.Geocoder();
                     
                    //create map
                     var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
                 
                    function putmarker(map,address,geocoder){
                       geocoder.geocode( { address: address}, function(results, status) {
                        if (status == google.maps.GeocoderStatus.OK && results.length) {
                          if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
      
                              //center map
                                map.setCenter(results[0].geometry.location);
        
                             //create marker
                                var marker = new google.maps.Marker({
                                  position: results[0].geometry.location,
                                  map: map,
                                  title:address
                                });
                  
                             //add click listener on marker
                               google.maps.event.addListener(marker, 'click', function() {
                                  //change addressParameter on click
                                    document.getElementById('{!$Component.page.form.block.values.addressParameter}')
.value=marker.title;
                                    refreshData(); //to rerender rightpane containing sales data of a location(invokes action function)
                         
                               });
                           }
                        }
                       })
                     }
                  </script>
                
                  <apex:repeat value="{! salesAddress}" var="address">
                      <script> putmarker(map,"{!address}",geocoder);</script>
                  </apex:repeat>
               
                </apex:outputpanel>
                
                <apex:dataList value="{! Sales}" var="sale" id="dataView">
                    <!-- extract Record Id(15 character long from begining) to make link and Text to display(from 20th character to end of string) --> 
                    <!-- Instance is auto corrected by force.com if it is not ap1 -->
                        <apex:outputLink value="{!'https://ap1.salesforce.com/'+left(sale,15)}" target="_blank">
                            {!MID(sale,20,len(sale)-19)}
                        </apex:outputLink>
                 </apex:dataList>
                
          </apex:pageBlockSection>
          
         </apex:pageBlock>
               <!-- Rerender Right pane on marker click -->
               <apex:actionFunction name="refreshData" action="{!refreshData}" rerender="dataView"/>
          
     </apex:form>
                 
</apex:page>

Controller:

public with sharing class salesData {

    public PageReference refreshData() {
        return null;
    }

   public String country{get; set;}
   public String state{get; set;}
   public String city{get; set;}
   public integer b_year{get; set;}
   public integer e_year{get; set;}
   public String[] type= new String[]{};
   public integer size_low{get;set;}
   public integer size_high{get;set;}
   public string addressParameter{get;set;}
   
   public String[] gettype() { 
        return type;
   }

   public void settype(String[] type) {
        this.type = type;
   }
  
   public List<SelectOption> getcountries() {  //this function gives list of countries from country__c object
         
            List<SelectOption> options = new List<SelectOption>();
            
            for(country__c country :[SELECT name FROM country__c])
              options.add(new selectOption(country.name,country.Name));
              
            return options;
        }
    
    public List<SelectOption> getYears() {
        List<SelectOption> options = new List<SelectOption>();
        for(integer i=2012;i>1974;i--)
         options.add(new selectOption(string.valueof(i),string.valueof(i)));
        return options;
    }

    public List<SelectOption> getItems() {
        List<SelectOption> options = new List<SelectOption>();
        options.add(new SelectOption('residential','Residential'));
        options.add(new SelectOption('commercial','Commercial'));
        options.add(new SelectOption('utility','Utility'));

        return options;
    }

  
    public List<String> getSales() { //this function returns sales data for a particilar location,called on marker click
        string[] sales= new String[]{};
        country__c Search_opportunity;
        string myquery,flag;
        string streetName,cityName,stateName,countryName;
        if(addressParameter==null || addressParameter=='')
          return null;
        else
        {
          List<String> parts = addressParameter.split(',');
      
          streetName=parts[0];
          cityName=parts[1];
          stateName=parts[2];
          countryName=parts[4]; //parts[3] is zipcode
       
          try{
          Search_opportunity=[SELECT search_opportunities__c from country__c where name=:countryName];
          flag=Search_opportunity.search_opportunities__c; //to determine which object to search
          } catch (Exception e) {
        
           Apexpages.addMessage( new ApexPages.Message (ApexPages.Severity.ERROR, 'No Data Found for default display,Please Enter some Data. '));
           return null;}
      
          //create query
          if(flag.equals('True'))
            myquery='SELECT Id,Account.Name,closeDate,size__c,type from opportunity where account.Billingstreet=:streetName AND account.Billingcity=:cityName AND account.Billingstate=:stateName AND account.Billingcountry=:countryName';
          else
            myquery='Select Id,account_name__c,Delivery_Date__c,size__c,type__c from salesOrder__c where street__c=:streetName AND city__c=:cityName AND state__c=:stateName AND country__c=:countryName';
      
            //evaluate query
            if(flag.equals('True'))
            { 
              for(Opportunity o:database.query(myquery))
                sales.add(o.Id+'-'+o.account.name+'-'+String.valueOf(o.CloseDate.year())+'-'+o.size__c+'-'+o.type);
            }
            else
            {
              for(salesOrder__c s:database.query(myquery))
                sales.add(s.Id+'-'+s.account_name__c+'-'+String.valueOf(s.Delivery_Date__c.year())+'-'+s.size__c+'-'+s.type__c);
            }
        
        return sales;
        }
    }
 
    public set<String> getSalesAddress() { //this function returns sddresses to put markers on
        string myquery,flag;
        country__c Search_opportunity; 
        set<string> salesAddress= new set<String>{}; //set is used to return Distinct addresses
        
        //initialize
        if(country==null)
          this.country='USA'; //for default display
        if(state==null)
          this.state='';
        if(city==null)
          this.city='';
        if(b_year==null)
          this.b_year=1975;
        if(e_year==null)
          this.e_year=2012;
        if(size_low==null)
          this.size_low=0;
        if(size_high==null)
          this.size_high=250;
        
        //If no type is checked type filter is not applied i.e. all types are added   
        if(type.size()==0)
          {
          this.type.add('Residential');
          this.type.add('Commercial');
          this.type.add('Utility');
          }
        
        try {

        Search_opportunity=[SELECT search_opportunities__c from country__c where name=:country];
        flag=Search_opportunity.search_opportunities__c; //to determine which object to search
        
        } catch (Exception e) {
        
        Apexpages.addMessage( new ApexPages.Message (ApexPages.Severity.ERROR, 'No Data Found for default display,Please Enter some Data. '));
        return null;}
        
        if(flag.equals('True'))
          {myquery='SELECT Account.BillingStreet,Account.BillingCity,Account.BillingState,Account.BillingPostalcode,Account.BillingCountry from opportunity where Account.BillingCountry=:country';
           if(state!='')
               myquery=myquery+' AND Account.BillingState=:state';
           if(city!='')
               myquery=myquery+' AND Account.BillingCity=:city';
           //apply filters    
               myquery=myquery+' AND size__c>=:size_low AND size__c<=:size_high AND CALENDAR_YEAR(CloseDate)>=:b_year AND CALENDAR_YEAR(CloseDate)<=:e_year AND type in(';
         }
        else
          {myquery='SELECT street__c,city__c,state__c,zipcode__c,country__c from SalesOrder__c where country__c=:country';
           if(state!='')
               myquery=myquery+' AND state__c=:state';
           if(city!='')
               myquery=myquery+' AND city__c=:city';
           //apply filters    
               myquery=myquery+' AND size__c>=:size_low AND size__c<=:size_high AND CALENDAR_YEAR(Delivery_Date__c)>=:b_year AND CALENDAR_YEAR(Delivery_Date__c)<=:e_year AND type__c in(';
          }
         
         
          //apply type filter
          for(integer i=0;i<type.size();i++)
            { 
              if(i!=type.size()-1)
               myquery=myquery+'\''+type[i]+'\',';
              else
               myquery=myquery+'\''+type[i]+'\')';
             }
        
        //evaluating query 
        
        if(flag.equals('True'))
         { 
          for(Opportunity o:database.query(myquery))
               salesAddress.add(o.account.BillingStreet+','+o.account.BillingCity+','+
o.account.BillingState+','+o.account.BillingPostalcode+','+o.account.BillingCountry); } else { for(salesOrder__c s:database.query(myquery)) salesAddress.add(s.Street__c+','+s.City__c+','+s.State__c+','+s.ZipCode__c+','+s.Country__c); } return salesAddress; } Public void Search(){ } } //controller ends