function in_array(needle, haystack, strict)
{
var found = false, key, strict = !!strict;
for (key in haystack) {if ((strict && haystack[key] === needle) || (!strict && haystack[key] == needle)) {found = true;break;}}
return found;
}
/**/
function metromapGroup(groupID)
{
$("#metromap-loader").stop().animate({opacity: "1"}, 500, function()
{
var iC = parseInt(metromap_stationgroups[groupID].length),
i = 0;
$.each(metromap_stationgroups[groupID], function(k,id)
{
i++;
if (!in_array(id, metromap_selected))
{
$("#metromap-map .station[data-id="+id+"]").addClass('selected');
metromap_selected.push(id);
}
if (iC==i)
{
metromapSync();
$("#metromap-loader").animate({opacity: "0"}, 500);
}
});
});
return false;
}
function metromapShow()
{
$('body').addClass('metromap-body')
$("#metromap").show();
return false;
}
function metromapHide()
{
$('body').removeClass('metromap-body')
$("#metromap").hide();
return false;
}
function metromapClear()
{
metromap_selected = [];
$("#metromap-cont").html('');
$("#metromap-clear").hide();
$("#metromap-map .station").removeClass('selected');
$("#metromap-count").text(0);
}
function metromapSync()
{
_metromapVisual();
if (parseInt(metromap_selected.length)>0)
{
$("#metromap-clear").show();
if (!$("#filter-btn-more").hasClass('hided')) $("#filter-btn-more").trigger('click');
}
else $("#metromap-clear").hide();
$("#metromap-count").text(parseInt(metromap_selected.length));
}
function metromapInit(url)
{
$.ajax({url: url, crossDomain:true, dataType:'html', cache: false}).done(function(html)
{
$("#metromap").html(html);
metromapSync();
$.each(metromap_stations,function(id,station)
{
var html_class = !in_array(id, metromap_selected) ? "station" : "station selected";
$('<div class="'+html_class+'" style="top:'+station.y+'px;left:'+station.x+'px" data-id="'+id+'">'+station.html+'</div>').appendTo("#metromap-map");
});
});
}
$(document).on('keydown', function(e) { if(e.keyCode==27) metromapHide(); });
$(document).on('click', '#metromap-bg', function() { return metromapHide(); });
$(document).on('click', '#metromap-map .station', function()
{
$(this).toggleClass('selected');
metromap_selected.push($(this).attr('data-id'));
metromapSync();
return false;
});
<div id="metromap-bg"></div>
<div id="metromap-links">
<p class="lines">
<a href="#" onclick="return metromapGroup('line-1');" class="line-1"><span>1</span>Сокольническая</a>
<a href="#" onclick="return metromapGroup('line-2');" class="line-2"><span>2</span>Замоскворецкая</a>
<a href="#" onclick="return metromapGroup('line-3');" class="line-3"><span>3</span>Арбатско-Покровская</a>
<a href="#" onclick="return metromapGroup('line-4');" class="line-4"><span>4</span>Филевская</a>
<a href="#" onclick="return metromapGroup('line-5');" class="line-5"><span>5</span>Кольцевая</a>
<a href="#" onclick="return metromapGroup('line-6');" class="line-6"><span>6</span>Калужско-Рижская</a>
<a href="#" onclick="return metromapGroup('line-7');" class="line-7"><span>7</span>Таганско-Краснопресненская</a>
<a href="#" onclick="return metromapGroup('line-8');" class="line-8"><span>8</span>Калининская</a>
<a href="#" onclick="return metromapGroup('line-8a');" class="line-8a"><span>8A</span>Солнцевская</a>
<a href="#" onclick="return metromapGroup('line-9');" class="line-9"><span>9</span>Серпуховско-Тимирязевская</a>
<a href="#" onclick="return metromapGroup('line-10');" class="line-10"><span>10</span>Люблинско-Дмитровская</a>
<a href="#" onclick="return metromapGroup('line-11');" class="line-11"><span>11</span>Третий пересадочный контур</a>
<a href="#" onclick="return metromapGroup('line-11a');" class="line-11a"><span>11A</span>Каховская</a>
<a href="#" onclick="return metromapGroup('line-12');" class="line-12"><span>12</span>Бутовская</a>
<a href="#" onclick="return metromapGroup('line-13');" class="line-13"><span>13</span>Монорельс</a>
<a href="#" onclick="return metromapGroup('line-14');" class="line-14"><span>14</span>МЦК</a>
</p>
<p class="group-sel"><a href="#" onclick="return metromapGroup('ring-inside');">внутри</a> <b><i>Садовое</i></b> <a href="#" onclick="return metromapGroup('ring-outside');">снаружи</a></p>
<p class="group-sel"><a href="#" onclick="return metromapGroup('ttk-inside');">внутри</a> <b><i>ТТК</i></b> <a href="#" onclick="return metromapGroup('ttk-outside');">снаружи</a></p>
<p class="group-sel"><a href="#" onclick="return metromapGroup('mkad-inside');">внутри</a> <b><i>МКАД</i></b> <a href="#" onclick="return metromapGroup('mkad-outside');">снаружи</a></p>
<div id="metromap-loader"></div>
<p class="group-cntrls">
<a href="#" onclick="return metromapHide();"><b>Закрыть</b></a>
<a href="#" onclick="return metromapClear();">Очистить</a>
<a href="#" onclick="return metromapHide();"><b>Готово</b></a>
<span>Выбрано: <b id="metromap-count">0</b></span>
</p>
</div>
<script type="text/javascript">
var metromap_selected = [];
metromapInit('/lib/metromap/inc.php');
function _metromapVisual()
{
$("#metromap-cont").html('');
$.each(metromap_selected, function(k,id)
{
$("<input type='hidden' name='object_metro[]' value='"+id+"' /><span>"+metromap_stations[id].name+"</span>").appendTo("#metromap-cont");
});
}
</script>
<div id="metromap"></div>
<p class="metromap-a-line">
<a href="#" onclick="return metromapShow();">Выбрать на карте метро</a>
<a href="#" onclick="return metromapClear();" id="metromap-clear">Очистить список</a>
</p>
<p id="metromap-cont"></p>
ждите телепатов или сделайте макет.
