gmaps.controls.js

  1. GMaps.prototype.createControl = function(options) {
  2. var control = document.createElement('div');
  3. control.style.cursor = 'pointer';
  4. if (options.disableDefaultStyles !== true) {
  5. control.style.fontFamily = 'Roboto, Arial, sans-serif';
  6. control.style.fontSize = '11px';
  7. control.style.boxShadow = 'rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px';
  8. }
  9. for (var option in options.style) {
  10. control.style[option] = options.style[option];
  11. }
  12. if (options.id) {
  13. control.id = options.id;
  14. }
  15. if (options.title) {
  16. control.title = options.title;
  17. }
  18. if (options.classes) {
  19. control.className = options.classes;
  20. }
  21. if (options.content) {
  22. if (typeof options.content === 'string') {
  23. control.innerHTML = options.content;
  24. }
  25. else if (options.content instanceof HTMLElement) {
  26. control.appendChild(options.content);
  27. }
  28. }
  29. if (options.position) {
  30. control.position = google.maps.ControlPosition[options.position.toUpperCase()];
  31. }
  32. for (var ev in options.events) {
  33. (function(object, name) {
  34. google.maps.event.addDomListener(object, name, function(){
  35. options.events[name].apply(this, [this]);
  36. });
  37. })(control, ev);
  38. }
  39. control.index = 1;
  40. return control;
  41. };
  42. /**
  43. * Add a custom control to the map UI.
  44. *
  45. * @param {object} options - The `options` object should contain:
  46. * * `style` (object): The keys and values of this object should be valid CSS properties and values.
  47. * * `id` (string): The HTML id for the custom control.
  48. * * `classes` (string): A string containing all the HTML classes for the custom control.
  49. * * `content` (string or HTML element): The content of the custom control.
  50. * * `position` (string): Any valid [`google.maps.ControlPosition`](https://developers.google.com/maps/documentation/javascript/controls#ControlPositioning) value, in lower or upper case.
  51. * * `events` (object): The keys of this object should be valid DOM events. The values should be functions.
  52. * * `disableDefaultStyles` (boolean): If false, removes the default styles for the controls like font (family and size), and box shadow.
  53. * @returns {HTMLElement}
  54. */
  55. GMaps.prototype.addControl = function(options) {
  56. var control = this.createControl(options);
  57. this.controls.push(control);
  58. this.map.controls[control.position].push(control);
  59. return control;
  60. };
  61. /**
  62. * Remove a control from the map. `control` should be a control returned by `addControl()`.
  63. *
  64. * @param {HTMLElement} control - One of the controls returned by `addControl()`.
  65. * @returns {HTMLElement} the removed control.
  66. */
  67. GMaps.prototype.removeControl = function(control) {
  68. var position = null,
  69. i;
  70. for (i = 0; i < this.controls.length; i++) {
  71. if (this.controls[i] == control) {
  72. position = this.controls[i].position;
  73. this.controls.splice(i, 1);
  74. }
  75. }
  76. if (position) {
  77. for (i = 0; i < this.map.controls.length; i++) {
  78. var controlsForPosition = this.map.controls[control.position];
  79. if (controlsForPosition.getAt(i) == control) {
  80. controlsForPosition.removeAt(i);
  81. break;
  82. }
  83. }
  84. }
  85. return control;
  86. };