Adding a new menu type

This is a simple checkbox menu example. You have to define two methods to make it work: activateCurrent and getHtml
and this variable will be scoped to the current Maplace instance.

var html_checks = {
        //required: called by Maplace.js to activate the current voice on menu
        activateCurrent: function(index) {
                this.html_element.find("input[value='" + index + "']").attr('checked', true);
        },
        //required: called by Maplace.js to get the html of the menu
        getHtml: function() {
                var self = this,
                        html = '';

                //if more than one location
                if(this.ln > 1) {
                        html += '<div class="checkbox controls ' + this.o.controls_cssclass + '">';

                        //check "view all" link
                        //use ShowOnMenu(index) to know if a location has to appear on menu
                        if(this.ShowOnMenu(this.view_all_key)) {
                                html += '<label><input type="radio" name="gmap" value="'
                                         + this.view_all_key + '"/>' + this.o.view_all_text + '</label>';
                        }

                        //iterate the locations
                        for (var a = 0; a < this.ln; a++) {
                                if(this.ShowOnMenu(a))
                                    html += '<label><input type="radio" name="gmap" value="' + (a+1) + '"/>'
                                             + (this.o.locations[a].title || ('#' + (a+1))) + '</label>';
                        }
                        html += '</div>';
                }

                this.html_element = $('<div class="wrap_controls"></div>').append(html);

                //event on change
                //use ViewOnMap(index) to trigger the marker on map
                this.html_element.find('input[type=radio]').bind('change', function() {
                        self.ViewOnMap(this.value);
                });

                return this.html_element;
        }
};
//new Maplace object
var maplace = new Maplace();

//add the new menu with the method AddControl(name, function)
maplace.AddControl('checks', html_checks);

//load the map
maplace.Load({
    controls_type: 'checks',
    locations: [{...}, {...}]
});