app/assets/javascripts/index/map_ui.js

   1 //= require templates/map/layers
   2
   3 OSM.MapUI = L.Control.extend({
   4     onAdd: function(map) {
   5         this._initLayout(map);
   6         return this._container;
   7     },
   8
   9     _initLayout: function(map) {
  10         var className = 'leaflet-control-map-ui',
  11             container = this._container = L.DomUtil.create('div', className);
  12
  13         var link = this._layersLink = L.DomUtil.create('a', 'leaflet-map-ui-layers', container);
  14         link.href = '#';
  15         link.title = 'Layers';
  16
  17         this._uiPane = L.DomUtil.create('div', 'leaflet-map-ui', map._container);
  18
  19         $(link).on('click', $.proxy(this.toggleLayers, this));
  20     },
  21
  22     toggleLayers: function(e) {
  23         e.stopPropagation();
  24         e.preventDefault();
  25
  26         if ($(this._uiPane).is(':visible')) {
  27             $(this._uiPane).hide();
  28             $(this._container).css({paddingRight: '0'})
  29         } else {
  30             $(this._uiPane)
  31                 .show()
  32                 .html(JST["templates/map/layers"]());
  33             $(this._container).css({paddingRight: '200px'})
  34         }
  35     }
  36 });
  37
  38 OSM.mapUI = function() {
  39     return new OSM.MapUI();
  40 };