webpack-bootstrap-ui-kit/src/js_old/_components/_ui.search.js

'use strict';

import $ from 'jquery';

$(() => {
  const $searchLat = $('[name="search-lat"]');
  const $searchLng = $('[name="search-lng"]');
  const $nearbyLat = $('#nearby-lat');
  const $nearbyLng = $('#nearby-lng');
  const $radius = $('#distance-radius');
  const $category = $('#distance-category');
  const $newLocation = $('[name="newlocation"]');
  const $setnewlocation = $('#setnewlocation');
  const $newlocationholder = $('.set-newlocation-holder');

  const updatePosition = (lat, lng) => {
    $searchLat.val(lat);
    $searchLng.val(lng);
    $nearbyLat.val(lat);
    $nearbyLng.val(lng);

    $searchLat.change();
    $nearbyLat.change();
  };

  const getGeoPosition = () => {
    const newLocation = $newLocation.val();
    if (!newLocation.length) {
      return;
    }

    $('.search-location .current-val').text(newLocation);
    const geoUrl = `https://maps.googleapis.com/maps/api/geocode/json?address=${newLocation}&key=AIzaSyC00L0023LPBhzj12uTCL-4EwJ_6zgwcTU&sensor=true`;

    $.getJSON(geoUrl).done((data) => {
      if (data.status === 'OK') {
        updatePosition(
          data.results[0].geometry.location.lat,
          data.results[0].geometry.location.lng,
        );
        //getCategories();
      }
    });
  };

  const getCurrentPosition = () => {
    $('.search-location .current-val').text('Current Location');

    navigator.geolocation.getCurrentPosition(
      (position) => {
        updatePosition(position.coords.latitude, position.coords.longitude);
        //hideDistancesThatDontMatter();
      },
      () => {
        $('.search-location .current-val').text('Unable to get your location');
        updatePosition('', '');
      },
    );
  };

  if ($newLocation.length && $newLocation.val().length) {
    getGeoPosition();
  } else {
    getCurrentPosition();
  }

  $('#Form_SearchForm').on('keyup keypress', (e) => {
    var keyCode = e.keyCode || e.which;
    if (keyCode === 13) {
      e.preventDefault();
      return false;
    }
  });

  $('.get-current-location').on('click', (e) => {
    e.preventDefault();

    getCurrentPosition();
    $newlocationholder.toggle();
    $newLocation.val('');
  });

  $setnewlocation.on('click', (e) => {
    e.preventDefault();

    $newlocationholder.toggle();
  });

  $newLocation.blur(() => {
    getGeoPosition();
  });

  $('.new-search').on('click', (e) => {
    e.preventDefault();

    $('.section-search-secondary').animate(
      {
        'max-height': 300,
      },
      'slow',
    );
  });

  /*$radius.on('change', () => {
        getCategories();
    });
    function getCategories() {
        $.getJSON(`/api/categoriesnearby/${$searchLat.val()}/${$searchLng.val()}/${$radius.val()}`)
            .done((data) => {
                $category.empty(); // remove old options
                $category.append($('<option></option>').attr('value', 'all').text('All Categories'));

                $.each(data.categories, (i, cat) => {
                    $category.append($('<option></option>').attr('value', cat.id).text(cat.name));
                });
            });
    }

    function hideDistancesThatDontMatter() {
        $.getJSON(`/api/nearestevent/${ $searchLat.val()}/${$searchLat.val()}`)
            .done((data) => {
                const nearest = parseFloat(data);

                $radius.find('option').each(function() {
                    if (this.value !== 'all' && parseFloat(this.value) < nearest) {
                        $(this).hide();
                    }
                });
            });
    }*/

  const $map = $('#Map');
  if (typeof google !== 'undefined' && $map.length) {
    const $directions = $('#DirectionsPanel'),
      $fromAddress = $('#FromAddress'),
      $getDirections = $('#GetDirections'),
      $directionContainer = $('#DirectionContainer'),
      directionsDisplay = new google.maps.DirectionsRenderer(),
      directionsService = new google.maps.DirectionsService(),
      currentPosition = {
        lat: $map.data('lat'),
        lng: $map.data('lng'),
      },
      map = new google.maps.Map($map[0], {
        zoom: 15,
        mapTypeControl: true,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
      });

    directionsDisplay.setMap(map);
    directionsDisplay.setPanel($directions[0]);

    map.setCenter(currentPosition);
    new google.maps.Marker({
      map,
      position: currentPosition,
    });

    $getDirections.click((e) => {
      e.preventDefault();

      const fromLocation = $fromAddress.val();

      if (fromLocation.length) {
        directionsService.route(
          {
            origin: fromLocation,
            destination: currentPosition,
            travelMode: google.maps.DirectionsTravelMode.DRIVING,
          },
          (response, status) => {
            if (status === google.maps.DirectionsStatus.OK) {
              directionsDisplay.setDirections(response);
            }
          },
        );

        $directionContainer.slideDown();
      }
    });
  }
});