templates/Map/page.html.twig line 1

Open in your IDE?
  1. {% extends 'grid.html.twig' %}
  3. {% block title %}
  4.     {{ seo_title() }}
  5. {% endblock %}
  7. {% block metaDescription %}
  8.     <meta name="description" content="{{ seo_description() }}">
  9. {% endblock %}
  11. {% block stylesheet %}
  12.     {{ parent() }}
  13.     <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  14. {% endblock %}
  16. {% block name_page %}map{% endblock %}
  17. {% block bodyClasses %}map-page{% endblock %}
  18. {% block mainContainer %}
  19.     {% if city is defined and city.mapCoordinate.latitude %}
  20.         {% set coordss = 1 %}
  21.         {% set lat = city.mapCoordinate.latitude %}
  22.         {% set lon = city.mapCoordinate.longitude %}
  23.     {% else %}
  24.         {% set coordss = 0 %}
  25.         {% set lat = '55.75' %}
  26.         {% set lon = '37.61' %}
  27.     {% endif %}
  29.     <h1 class="border-line">{% if seo_heading() is empty %}%Интим карта{% else %}{{ seo_heading() }}{% endif %}</h1>
  30.     <p class="text-desc mb-lg-4">
  31.         На карте обозначено местоположение зарегистрированных анкет.<br>
  32.         Кликнув на маркер Вы узнаете краткую информацию о девушке.
  33.     </p>
  34.     <div class="map">
  35.         <div class="filter-line d-flex justify-content-center justify-content-md-between mb-2 mb-md-3 mb-lg-4">
  36.             <button class="btn btn-secondary btn-collapse-filter" type="button" id="filter-expand">
  37.                 <svg class="icon mr-1">
  38.                     <use xlink:href="#icon-dropdown"></use>
  39.                 </svg>
  40.                 Расширенный поиск
  41.             </button>
  42.             <div class="d-flex align-items-center collapse-reset ml-2">
  43.                 <span class="d-none" id="count-parameters">Выбрано <em>0</em> параметров</span>
  44.                 <button class="btn btn-secondary btn-collapse-reset ml-md-2" id="reset-form-2" data-reset="true">Сброс</button>
  45.             </div>
  46.         </div>
  47.         <div class="collapse" id="collapseFilter">
  49.         </div>
  50.         <div class="map-wrap loading" id="map-wrap" style="width: 100%; height: 700px;">
  51.         </div>
  52.     </div>
  53.     {# {{ include('components/big_footer.html.twig', { 'type': 'main' }) }} #}
  54.     {{ include('components/seo.partial.twig', {type: 'top'}) }}
  55.     {{ include('components/seo.partial.twig', {type: 'bottom'}) }}
  56. {% endblock %}
  59. {% block javascripts %}
  60.     {{ parent() }}
  62.     {% if city is defined and city.mapCoordinate.latitude %}
  63.         {% set lat = city.mapCoordinate.latitude %}
  64.         {% set lon = city.mapCoordinate.longitude %}
  65.     {% else %}
  66.         {% set lat = '55.753215' %}
  67.         {% set lon = '37.622504' %}
  68.     {% endif %}
  70.     <script src="{{ asset('bundles/fosjsrouting/js/router.min.js') }}" defer></script>
  71.     <script src="{{ path('fos_js_routing_js', { callback: 'fos.Router.setData' }) }}" defer></script>
  72.     <script src="https://api-maps.yandex.ru/2.1/?lang=ru_RU&onload=initMap&ns=ym" defer></script>
  74.     <script>
  75.         const mapConfig = {
  76.             id:"map-wrap",
  77.             multiple_cities:"{{ multipleCities }}",
  78.             routes_url: "{{ multipleCities == 0 ? '/js/fos_js_routes.json' : '/js/fos_js_routes_city_prefixed.json' }}",
  79.             city_uri_identity:"{{ cityUriIdentity }}",
  80.             city_latitude:"{{ lat }}",
  81.             city_longitude:"{{ lon }}",
  82.             locale:"{{ app.request.locale }}",
  83.             path:"{{ path('map.filter', {city:cityUriIdentity}) }}",
  85.             icon_profile:"{{ asset('assets/images/map/profile.svg') }}",
  86.             icon_profile_active:"{{ asset('assets/images/map/profile-active.svg') }}",
  87.             icon_profile_hover:"{{ asset('assets/images/map/profile-hover.svg') }}",
  89.             icon_saloon:"{{ asset('assets/images/map/saloon.svg') }}",
  90.             icon_saloon_active:"{{ asset('assets/images/map/saloon-active.svg') }}",
  91.             icon_saloon_hover:"{{ asset('assets/images/map/saloon-hover.svg') }}",
  93.             icon_masseur:"{{ asset('assets/images/map/masseur.svg') }}",
  94.             icon_masseur_active:"{{ asset('assets/images/map/masseur-active.svg') }}",
  95.             icon_masseur_hover:"{{ asset('assets/images/map/masseur-hover.svg') }}",
  97.             icon_cluster_small:"{{ asset('assets/images/map/cluster-small.svg') }}",
  98.             icon_cluster_medium:"{{ asset('assets/images/map/cluster-medium.svg') }}",
  99.             icon_cluster_big:"{{ asset('assets/images/map/cluster-big.svg') }}",
  101.             avatar_path : "{{ responsive_asset('replace_path', 'profile_media_avatar', "200x280", "jpg") }}",
  102.             photo_path : "{{ responsive_asset('replace_path', 'profile_media', "200x280", "jpg") }}",
  103.             thumb_path : "{{ responsive_asset('replace_path', 'saloon_media_thumb', "200x280", "jpg") }}",
  104.             process_profile_shows_url  : "{{ path('map.increment_profile_shows', multipleCities ? {city:cityUriIdentity} : {}) }}"
  105.         };
  107.         var isMapInitialized = false;
  108.         var yaMapLoaded = false;
  109.         function initMap() {
  110.             //console.log('initMap');
  111.             window.ymap = new ym.Map(document.getElementById('map-wrap'), {
  112.                 center: ["{{ lat }}", "{{ lon }}"],
  113.                 zoom: 8,
  114.                 controls: ['zoomControl', 'typeSelector',  'fullscreenControl']
  115.             });
  116.             yaMapLoaded = true;
  118.             //if (!isMapInitialized) {
  119.             //    console.log('new mapPage initMap');
  120.             //    isMapInitialized = true;
  121.             //    new MapPage(mapConfig);
  122.             //}
  123.         }
  124.         window.profileShowed = function ({id}) {
  125.             if (!id) return;
  127.             fetch('{{ path('profile_ctr.increase_shows') }}', {
  128.                 method: "POST",
  129.                 body: JSON.stringify({ profiles: [id], source: 'map' }),
  130.             });
  131.         }
  133.         window.stations = {
  134.             {%- for station in stations() -%}{{- station.id -}}:{icon:`{%- include 'components/metro/icon_generate.partial.twig' with {data: station|station_lines} -%}`,name:`{{- station.name -}}`},{%- endfor -%}
  135.         };
  137.         document.addEventListener('DOMContentLoaded', function () {
  138.             function loadForm() {
  139.                 fetch('{{ path('map.form', {city: cityUriIdentity}) }}', {
  140.                     mode: "cors",
  141.                     importance: "low",
  142.                     method: "POST",
  143.                     headers: {
  144.                         "Content-Type": "application/x-www-form-urlencoded",
  145.                         "X-Requested-With": "XMLHttpRequest"
  146.                     },
  147.                 }).then(response => {
  148.                     if (response.status < 300) {
  149.                         return response.text();
  150.                     } else {
  151.                         console.warn("🤔");
  152.                         return null;
  153.                     }
  154.                 }).then(response => {
  155.                     document.getElementById('collapseFilter').innerHTML = response;
  156.                     filterLoader()
  157.                 });
  158.             }
  159.             loadForm();
  161.             function filterLoader() {
  162.                 const stringifyData = `{"city_id":"${document.getElementById('filter_map_form_city_id').value}","_token":"${document.getElementById('filter_map_form__token').value}"}`;
  164.                 fetch("{{ path('map.filter', {city:cityUriIdentity}) }}", {
  165.                     method: "POST",
  166.                     headers: {
  167.                         'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
  168.                         'X-Requested-With': 'XMLHttpRequest',
  169.                     },
  170.                     body: new URLSearchParams({ form: stringifyData }).toString(),
  171.                 })
  172.                     .then(response => response.json())
  173.                     .then(data => {
  174.                         //console.log('map-data-loaded')
  175.                         const mapLoadedInterval = setInterval(()=>{
  176.                             if (yaMapLoaded) {
  177.                                 new MapPage(mapConfig);
  178.                                 document.dispatchEvent(new CustomEvent('map:data:loaded', { detail: { data, stringifyData } }));
  179.                                 clearInterval(mapLoadedInterval)
  180.                             }
  181.                         }, 200)
  183.                     })
  184.                     .catch(error => console.error(error));
  186.                 //if (!isMapInitialized) {
  187.                 //    console.log('new mapPage filterLoader');
  188.                 //    isMapInitialized = true;
  189.                 //    new MapPage(mapConfig);
  190.                 //}
  191.             }
  192.         })
  193.     </script>
  194. {% endblock %}