2
\$\begingroup\$

I have added the full code of my current Gmap component, which is a convenience object to abstract Google Maps functionality:

define(["jquery", "gmaps"], 
    function( $, Gmaps ){ 

        var CompGmap = function(){}; 

        CompGmap.prototype.makeGmap = function( el, params ){ 
            return new google.maps.Map( el, params ); 
        }; 

        CompGmap.prototype.resizeGmap = function(gmap, selector, leftPos){ 
            var mapCenter = this.getCenter(gmap); 
            $(selector).animate( 
                {left: leftPos}, {duration: 200, complete: _.bind(function(){ 
                    google.maps.event.trigger(gmap, 'resize'); 
                    gmap.setCenter(mapCenter); 
                }, this)}); 
        }; 

        CompGmap.prototype.makeControl = function(gmap, Btn, UIplace){
            //Create and render refresh button 
            var objMapButton = this.makeButton(Btn); 
            gmap.controls[google.maps.ControlPosition[UIplace]].push(objMapButton.div); 
            return objMapButton.button.controlUI; 
        }; 

        CompGmap.prototype.makeButton = function(Btn){ 
            var div = document.createElement('DIV'); 
            var btn = new Btn(div); 
            div.index = 1; 
            return {"div": div, "button": btn}; 
        }, 

        CompGmap.prototype.rotateButtonImg = function($selector){
            $selector.animateRotate(360, 700); 
        }; 

        //Returns the center of the map 
        CompGmap.prototype.getCenter = function(gmap){ 
            return gmap.getCenter(); 
        }; 

        CompGmap.prototype.getBounds = function(gmap){ 
            var map_bounds = gmap.getBounds(); 
            return map_bounds; 
        }; 

        CompGmap.prototype.getZoom = function(gmap){
            var map_zoom = gmap.getZoom(); 
            return map_zoom; 
        }

        CompGmap.prototype.setLocation = function(gmap, location, mode){ 
            var geocoder = new google.maps.Geocoder(); 
               geocoder.geocode( { 'address': location}, function(results, status) { 
                    if (status == google.maps.GeocoderStatus.OK) { 
                        gmap.setCenter(results[0].geometry.location); 
                        if(mode == "country") //FitBounds set based on radius on city level 
                            gmap.fitBounds(results[0].geometry.viewport); 
                    } else { 
                        gmap.setZoom(8); 
                    }
                }); 
        };         
        return CompGmap; 
    }); 

I'd like to abstract more methods into this object that are currently implemented in "presenter objects" as custom methods. This is just one of them:

var Presenter = function(){
    var self = this; 
    this.reqGeolocate = function(){ 
        this.view_where.setLoadingSpinner(); 
        // Try HTML5 geolocation 
        if(navigator.geolocation) { 
            //Returns coordinates 
            navigator.geolocation.getCurrentPosition(function(position) { 
            var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 
            //Get the city based on LatLng coordinates 
            self.getCityFromLatLng(pos).then(function(objNearby){ 
                self.view_where.setCityName(objNearby.city); 
                //Update submit object 
                compFormData.update({ 
                    "zip": objNearby.zip, 
                    "city": objNearby.city, 
                    "country": objNearby.country 
                }); 
                self.view_where.removeLoadingSpinner(); 
            }); 

            }, function() { 
                self.handleNoGeolocation(true); 
                self.view_where.removeLoadingSpinner(); 
          }); 
        } else { 
            // Browser doesn't support Geolocation
            this.handleNoGeolocation(false); 
        }
    }; 

    this.handleNoGeolocation = function(flag){ 
        console.log("no geolocation:" + flag); 
        this.clearFormDataWhere(); 
        this.view_where.removeLoadingSpinner(); 
    }; 
}

Others involve convenience methods related to Google Places to retrieve city, zip, etc.

I wonder if this is going to make the object too heavy. I wonder if it is useful to create subclasses of the CompGmap object, or if this will add unnecessary complexity. For some presenters, I require most of the methods, but for some I only require a subset.

\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.