Widget:MapLegend/sandbox

RLQ.push(['jquery', function {  var isFandomDesktop = document.body.classList.contains('skin-fandomdesktop');  var id = '';  function setVisibility(type, on) {    if (on) {      $('#map-' + id).removeClass('hide-' + type);    } else {      $('#map-' + id).addClass('hide-' + type);    }  }  $('#map-legend-' + id).on('change', 'input.toggle-one', function  { setVisibility(this.value, this.checked); }); $('#map-toggle-all-' + id).on('click', function  { $('#map-legend-' + id).find('input.toggle-one').prop('checked', this.checked).each(function {      setVisibility(this.value, this.checked);    }); }); $('#map-toggle-cave-' + id).on('click', function  { setVisibility('cave', this.checked); });

// shows coords near cursor var tooltipCoords = $(' ').css({   textAlign: 'center',    backgroundColor: 'rgba(255, 255, 255, 0.7)',    textShadow: '1px 1px white',    color: 'black',    padding: '3px',    minWidth: '60px',    position: 'fixed',    display: 'none',    whiteSpace: 'nowrap',    border: '1px solid black',    zIndex: 6,  }).appendTo(isFandomDesktop ? '#content' : '#bodyContent');

$('.map-container'). each(function {      var $this = $(this),        widthCoords = parseFloat($this.data('borderright')) - parseFloat($this.data('borderleft')),        heightCoords = parseFloat($this.data('borderbottom')) - parseFloat($this.data('bordertop')),        borderT = parseFloat($this.data('bordertop')),        borderL = parseFloat($this.data('borderleft'));

$this. mousemove(function (e) {         var pos = $this.offset,            top = pos.top,            left = pos.left,            lon = ((e.clientX + $(document).scrollLeft - left) * widthCoords / $this.width + borderL).toFixed(1),            lat = ((e.clientY + $(document).scrollTop - top) * heightCoords / $this.height + borderT).toFixed(1);

$(tooltipCoords).text(lat + ', ' + lon).css({           left: e.clientX + 20,            top: e.clientY          }).show; }).       mouseleave(function  { $(tooltipCoords).hide; });   }); }]);