]> git.openstreetmap.org Git - rails.git/blob - app/assets/javascripts/leaflet.key.js
Merge remote-tracking branch 'openstreetmap/pull/1508'
[rails.git] / app / assets / javascripts / leaflet.key.js
1 L.OSM.key = function (options) {
2   var control = L.control(options);
3
4   control.onAdd = function (map) {
5     var $container = $('<div>')
6       .attr('class', 'control-key');
7
8     var button = $('<a>')
9       .attr('class', 'control-button')
10       .attr('href', '#')
11       .html('<span class="icon key"></span>')
12       .on('click', toggle)
13       .appendTo($container);
14
15     var $ui = $('<div>')
16       .attr('class', 'key-ui');
17
18     $('<div>')
19       .attr('class', 'sidebar_heading')
20       .appendTo($ui)
21       .append(
22         $('<span>')
23           .text(I18n.t('javascripts.close'))
24           .attr('class', 'icon close')
25           .bind('click', toggle))
26       .append(
27         $('<h4>')
28           .text(I18n.t('javascripts.key.title')));
29
30     var $section = $('<div>')
31       .attr('class', 'section')
32       .appendTo($ui);
33
34     options.sidebar.addPane($ui);
35
36     $ui
37       .on('show', shown)
38       .on('hide', hidden);
39
40     map.on('baselayerchange', updateButton);
41
42     updateButton();
43
44     function shown() {
45       map.on('zoomend baselayerchange', update);
46       $section.load('/key', update);
47     }
48
49     function hidden() {
50       map.off('zoomend baselayerchange', update);
51     }
52
53     function toggle(e) {
54       e.stopPropagation();
55       e.preventDefault();
56       if (!button.hasClass('disabled')) {
57         options.sidebar.togglePane($ui, button);
58       }
59       $('.leaflet-control .control-button').tooltip('hide');
60     }
61
62     function updateButton() {
63       var disabled = ['mapnik', 'cyclemap'].indexOf(map.getMapBaseLayerId()) === -1;
64       button
65         .toggleClass('disabled', disabled)
66         .attr('data-original-title',
67               I18n.t(disabled ?
68                      'javascripts.key.tooltip_disabled' :
69                      'javascripts.key.tooltip'));
70     }
71
72     function update() {
73       var layer = map.getMapBaseLayerId(),
74         zoom = map.getZoom();
75
76       $('.mapkey-table-entry').each(function () {
77         var data = $(this).data();
78         if (layer === data.layer && zoom >= data.zoomMin && zoom <= data.zoomMax) {
79           $(this).show();
80         } else {
81           $(this).hide();
82         }
83       });
84     }
85
86     return $container[0];
87   };
88
89   return control;
90 };